/* Live order lookup. Same data and controls, approved Apple presentation. */
.query-panel { padding:29px 32px 32px; border:1px solid var(--line); border-radius:20px; background:var(--paper); box-shadow:0 4px 24px #00000003; }
.query-panel h1 { margin:0 0 25px; font:650 29px/1.35 var(--font); letter-spacing:-.8px; }
.query-panel label { display:block; margin-bottom:11px; font-size:13px; font-weight:500; }
.query-row { display:flex; align-items:stretch; gap:12px; }
.query-row input { flex:1; min-width:0; width:100%; height:49px; padding:0 16px; border:1px solid var(--line); border-radius:12px; outline:none; background:var(--canvas); color:var(--ink); font-size:14px; transition:border-color 180ms ease,box-shadow 180ms ease; }
.query-row input::placeholder { color:var(--muted); opacity:1; }
.query-row input:focus { border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent); }
.query-row input[aria-invalid="true"] { border-color:var(--red); }
.query-row .primary { min-height:49px; min-width:130px; border-radius:12px; font-size:14px; }
.field-error { margin:12px 0 0; color:var(--red); font-size:12px; line-height:1.7; }
.results { margin-top:28px; }
.subtle-note { font-size:12px; color:var(--muted); line-height:1.8; }
.results-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px 20px; margin:0 4px 13px; }
.results-heading h2,.history-section h2 { margin:0; font-size:17px; font-weight:600; letter-spacing:-.3px; }
.results-heading p { margin:0; color:var(--muted); font-size:12px; line-height:1.6; text-align:right; }
.order-card {
  --lookup-tone:var(--accent);
  --lookup-tone-soft:var(--accent-soft);
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--paper);
  box-shadow:0 4px 24px #00000003;
}
.order-card[data-tone="success"],.status-tag[data-tone="success"] { --lookup-tone:var(--green); --lookup-tone-soft:var(--green-soft); }
.order-card[data-tone="failure"],.status-tag[data-tone="failure"] { --lookup-tone:var(--red); --lookup-tone-soft:var(--red-soft); }
.order-card[data-tone="review"],.status-tag[data-tone="review"] { --lookup-tone:#90640b; --lookup-tone-soft:#faf3e4; }
.order-card[data-tone="pending"],.status-tag[data-tone="pending"] { --lookup-tone:var(--muted); --lookup-tone-soft:var(--soft); }
html[data-theme="dark"] .order-card[data-tone="review"],html[data-theme="dark"] .status-tag[data-tone="review"] { --lookup-tone:#e5bd6c; --lookup-tone-soft:#352c1c; }
.order-status {
  display:flex;
  align-items:center;
  gap:16px;
  padding:27px 31px;
  border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--lookup-tone-soft) 64%,var(--paper));
}
.status-icon { display:grid; place-items:center; flex:0 0 46px; width:46px; height:46px; border-radius:14px; color:var(--lookup-tone); background:var(--lookup-tone-soft); }
.status-icon svg { display:block; width:23px; height:23px; stroke-width:1.7; }
.status-copy { flex:1; min-width:0; }
.status-copy h3 { margin:0; color:var(--ink); font-size:22px; font-weight:600; line-height:1.4; letter-spacing:-.5px; }
.status-copy p { margin:6px 0 0; color:var(--muted); font-size:13px; line-height:1.8; }
.latest-label { align-self:flex-start; flex-shrink:0; margin-top:4px; padding:5px 8px; border:1px solid color-mix(in srgb,var(--lookup-tone) 16%,transparent); border-radius:7px; color:var(--lookup-tone); font-size:12px; line-height:1.3; }
.order-info { padding:23px 31px 28px; }
.order-reference { display:flex; align-items:center; flex-wrap:wrap; gap:7px 13px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.order-reference>span { color:var(--muted); font-size:12px; }
.order-reference code { color:var(--ink); font:13px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; user-select:all; }
.text-button { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:32px; margin-left:auto; padding:4px 8px; border:0; border-radius:8px; background:transparent; color:var(--accent); font-size:12px; cursor:pointer; transition:background 180ms ease; }
.text-button svg { width:14px; height:14px; }
.order-fields { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:23px 26px; margin:22px 0 0; }
.order-fields>div { min-width:0; grid-column:span 3; }
.order-fields>.email-field { grid-column:1/-1; }
.order-fields>.date-field { grid-column:span 2; }
.order-fields dt { margin:0 0 7px; color:var(--muted); font-size:12px; line-height:1.5; }
.order-fields dd { margin:0; color:var(--ink); font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.date-field dd { font-size:13px; font-variant-numeric:tabular-nums; }
.history-section { margin-top:29px; }
.history-section h2 { margin:0 4px 13px; }
.history-item { margin-top:10px; border:1px solid var(--line); border-radius:16px; background:var(--paper); overflow:hidden; }
.history-item summary { display:grid; grid-template-columns:auto minmax(0,1fr) auto 20px; align-items:center; gap:12px 18px; min-height:65px; padding:17px 23px; border-radius:15px; list-style:none; cursor:pointer; transition:background 180ms ease; }
.history-item summary::-webkit-details-marker { display:none; }
.history-item summary::marker { content:''; }
.status-tag { --lookup-tone:var(--accent); --lookup-tone-soft:var(--accent-soft); justify-self:start; padding:5px 8px; border-radius:7px; color:var(--lookup-tone); background:var(--lookup-tone-soft); font-size:12px; font-weight:500; line-height:1.4; white-space:nowrap; }
.history-id { min-width:0; color:var(--ink); font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; }
.history-date { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; line-height:1.6; white-space:nowrap; }
.history-chevron { display:grid; place-items:center; width:20px; height:20px; color:var(--muted); }
.history-chevron { width:17px; height:17px; transition:transform 220ms var(--ease),color 180ms ease; }
.history-item[open] .history-chevron { transform:rotate(90deg); color:var(--accent); }
.history-item .order-info { padding:0 23px 25px; }
.history-message { margin:0 0 17px; padding-top:1px; color:var(--muted); font-size:12px; line-height:1.8; }
.history-item[open] .order-info { animation:lookup-detail-in 220ms var(--ease); }
.query-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:15px 4px 0; color:var(--muted); font-size:12px; line-height:1.7; }
.query-footer>span { min-width:0; }
.query-footer .secondary { flex-shrink:0; min-height:37px; padding:0 13px; font-size:12px; }
.query-footer .secondary svg { width:15px; height:15px; }
.empty-state { padding:49px 24px 60px; text-align:center; color:var(--muted); }
.empty-state>svg { display:block; width:42px; height:42px; margin:0 auto 18px; color:var(--muted); stroke-width:1.3; }
.empty-state h2 { margin:0 0 10px; color:var(--ink); font-size:18px; font-weight:550; letter-spacing:-.3px; }
.empty-state p { margin:0 auto; max-width:380px; font-size:13px; line-height:1.9; }
.empty-state a { margin-top:22px; }
@keyframes lookup-detail-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
@media(hover:hover) {
  .text-button:hover { background:var(--accent-soft); }
  .history-item summary:hover { background:color-mix(in srgb,var(--soft) 55%,transparent); }
}
@media(max-width:620px) {
  .query-panel { padding:24px 21px; border-radius:20px; }
  .query-panel h1 { margin-bottom:23px; font-size:26px; letter-spacing:-.6px; }
  .query-row { flex-direction:column; gap:12px; }
  .query-row input { flex:auto; font-size:13px; padding-inline:13px; }
  .query-row .primary { width:100%; min-height:46px; }
  .results-heading { flex-direction:column; align-items:flex-start; gap:7px; margin-bottom:13px; }
  .results-heading p { text-align:left; }
  .order-status { align-items:flex-start; gap:12px; padding:22px 20px; }
  .status-icon { flex-basis:40px; width:40px; height:40px; border-radius:12px; }
  .status-icon svg { width:21px; height:21px; }
  .status-copy h3 { margin-top:4px; font-size:19px; letter-spacing:-.4px; }
  .status-copy p { margin-top:7px; font-size:12px; line-height:1.85; }
  .latest-label { display:none; }
  .order-info { padding:19px 20px 24px; }
  .order-reference { gap:6px 10px; padding-bottom:16px; }
  .order-reference>span { flex-basis:100%; }
  .order-reference code { font-size:12px; }
  .text-button { padding:4px 5px; min-height:30px; }
  .order-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:21px 17px; margin-top:20px; }
  .order-fields>div,.order-fields>.date-field { grid-column:auto; }
  .order-fields>.email-field { grid-column:1/-1; }
  .order-fields dd { font-size:13px; }
  .date-field dd { font-size:12px; }
  .history-section { margin-top:26px; }
  .history-item summary { grid-template-columns:auto minmax(0,1fr) 18px; gap:9px 8px; padding:16px; }
  .history-item .status-tag { grid-column:1; grid-row:1; }
  .history-id { grid-column:1/3; grid-row:2; }
  .history-date { grid-column:2; grid-row:1; justify-self:end; }
  .history-chevron { grid-column:3; grid-row:1/3; }
  .history-item .order-info { padding:0 16px 22px; }
  .query-footer { align-items:flex-start; gap:12px; padding-top:14px; }
  .query-footer>span { padding-top:6px; }
  .empty-state { padding:41px 18px 48px; }
}
@media(max-width:360px) {
  .history-item summary { grid-template-columns:1fr 18px; }
  .history-item .status-tag { grid-column:1; }
  .history-id { grid-column:1; grid-row:2; }
  .history-date { grid-column:1; grid-row:3; justify-self:start; }
  .history-chevron { grid-column:2; grid-row:1/4; }
}
@media(prefers-reduced-motion:reduce) {
  .history-item[open] .order-info { animation:none; }
}
.orders-content { max-width:1000px; margin:auto; padding:30px 32px 8px; }
@media(max-width:620px) { .orders-content { padding:24px 20px 6px; } }
@media(max-width:360px) { .orders-content { padding-inline:14px; } }
