/* Pedido surfaces — faithful vanilla port of the pre-merge app's v2 visual
   system (rfq_engine globals.css + DESIGN_SYSTEM.md §2-4, extracted
   2026-08-26). Loaded AFTER console_shared.css on the pedido views only;
   the token names intentionally mirror the old app. */
:root {
  --background:#ffffff; --card:#ffffff;
  --foreground:#0a0a0a;
  --primary:#3d63d8; --primary-foreground:#ffffff;
  --accent-bright:#5e8bfc;            /* decorative only, never under text */
  --accent:#eef3fe; --accent-foreground:#0a0a0a;
  --accent-hover:#5076d6; --accent-line:#c7d7fe;
  --secondary:#f5f3ee; --muted:#efece4; --muted-foreground:#615f58;
  --faint:#6b6760; --cream:#f7f4ee;
  --border:rgba(0,0,0,.09); --line2:rgba(0,0,0,.16); --ring:#5076d6;
  --ok:#166534; --ok-soft:#e7f6ec;
  --warn:#c2410c; --warn-soft:#fdeee0;
  --destructive:#dc2626; --destructive-soft:#fbe9e9;
  --radius:10px;
}
body.pd { background:var(--background); color:var(--foreground);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-feature-settings:"tnum"; font-size:14px; line-height:1.45; margin:0; }
.pd main { max-width:1080px; margin:0 auto; padding:20px 24px 48px; }
.pd h1 { font-size:20px; font-weight:600; margin:0; }
.pd a { color:inherit; }
.pd .muted { color:var(--muted-foreground); }
.pd .faint { color:var(--faint); }
.pd .tnum { font-variant-numeric:tabular-nums; }

/* cards + rows */
.pd .card { border:1px solid var(--border); background:var(--card);
  border-radius:12px; }
.pd .row-card { display:grid; gap:8px; border:1px solid var(--border);
  background:var(--card); border-radius:12px; padding:12px 16px;
  text-decoration:none; transition:border-color .15s; }
.pd .row-card:hover { border-color:var(--ring); }

/* buttons */
.pd button { cursor:pointer; font:inherit; }
.pd .btn-primary { background:var(--primary); color:var(--primary-foreground);
  border:0; border-radius:999px; padding:6px 16px; font-size:14px;
  font-weight:500; }
.pd .btn-primary:hover { opacity:.9; }
.pd .btn-primary:disabled { opacity:.5; cursor:default; }
.pd .btn-quiet { background:var(--card); color:inherit;
  border:1px solid var(--border); border-radius:999px; padding:5px 14px;
  font-size:13px; }
.pd .btn-quiet:hover { border-color:var(--accent-line); }
.pd .btn-ghost { background:none; border:0; color:var(--primary);
  border-radius:999px; padding:5px 10px; font-size:13px; }
.pd .btn-ghost:hover { background:var(--accent); }

/* chips — soft background + strong text of the same family (§4) */
.pd .badge { display:inline-flex; align-items:center; gap:4px; height:20px;
  padding:2px 8px; border-radius:999px; border:1px solid transparent;
  font-size:12px; font-weight:500; white-space:nowrap; }
.pd .badge.ok   { background:var(--ok-soft); color:var(--ok); }
.pd .badge.warn { background:var(--warn-soft); color:var(--warn); }
.pd .badge.destructive { background:var(--destructive-soft); color:var(--destructive); }
.pd .badge.accent { background:var(--accent); color:var(--accent-foreground); }
.pd .badge.off  { background:var(--muted); color:var(--faint); }
.pd .fase-chip { display:inline-block; padding:2px 8px; border-radius:999px;
  font-size:11px; font-weight:500; }
.pd .tag { display:inline-block; margin-left:8px; border-radius:4px;
  background:var(--muted); color:var(--faint); font-size:10px;
  font-weight:500; padding:1px 6px; }

/* stage bar (6 public stages) + stage pill */
.pd .stage-bar { display:inline-flex; gap:2px; vertical-align:middle; }
.pd .stage-bar i { width:20px; height:6px; border-radius:2px;
  background:var(--border); }
.pd .stage-bar i.on { background:var(--accent-bright); }
.pd .stage-pill { display:inline-block; padding:2px 8px; border-radius:999px;
  font-size:12px; font-weight:500; }

/* journey stepper */
.pd .stepper { display:flex; align-items:center; overflow-x:auto;
  border:1px solid var(--border); background:var(--card); border-radius:12px;
  padding:12px 16px; margin:16px 0; }
.pd .stepper .conn { margin:0 8px; height:2px; width:24px; border-radius:2px;
  background:var(--border); flex:none; }
.pd .stepper .conn.on { background:var(--accent-bright); }
.pd .stepper a.step { display:flex; flex:none; align-items:center; gap:6px;
  border-radius:8px; padding:2px 4px; text-decoration:none; }
.pd .stepper a.step:hover { background:var(--secondary); }
.pd .stepper .dot { width:24px; height:24px; border-radius:50%; display:flex;
  align-items:center; justify-content:center; font-size:11px; font-weight:600;
  background:var(--muted); color:var(--faint); }
.pd .stepper .step.done .dot { background:var(--primary); color:#fff; }
.pd .stepper .step.cur .dot { background:var(--accent); color:var(--primary);
  box-shadow:inset 0 0 0 1.5px var(--primary); }
.pd .stepper .lbl { font-size:12px; font-weight:500; white-space:nowrap; }
.pd .stepper .step:not(.done):not(.cur) .lbl { color:var(--faint); }
.pd .stepper .previa { margin-left:4px; font-size:9px; color:var(--faint); }

/* tab bar */
.pd .tabbar { display:inline-flex; max-width:100%; flex-wrap:wrap; gap:4px;
  border-radius:10px; background:var(--muted); padding:4px; margin:4px 0 16px; }
.pd .tabbar a { border-radius:8px; padding:6px 12px; font-size:14px;
  white-space:nowrap; text-decoration:none; color:var(--muted-foreground); }
.pd .tabbar a:hover { color:var(--foreground); }
.pd .tabbar a.on { background:var(--card); font-weight:600;
  color:var(--primary); box-shadow:0 1px 2px rgba(0,0,0,.06); }
.pd .tabbar .cnt { margin-left:6px; border-radius:999px;
  background:var(--accent); color:var(--primary); font-size:10px;
  font-weight:600; padding:1px 6px; }

/* toolbar (search + filter) */
.pd .toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  margin-bottom:12px; }
.pd .toolbar input[type=search] { width:256px; border:1px solid var(--border);
  background:var(--card); border-radius:999px; padding:6px 14px;
  font:inherit; font-size:13px; }
.pd .toolbar input[type=search]:focus { outline:2px solid
  color-mix(in srgb, var(--ring) 50%, transparent); }
.pd .toolbar select { border:1px solid var(--border); background:var(--card);
  border-radius:999px; padding:6px 12px; font:inherit; font-size:13px; }
.pd .toolbar .count { margin-left:auto; font-size:12px; color:var(--faint);
  font-variant-numeric:tabular-nums; }

/* pedidos grid (8 → 7 cols, no kebab v1) */
.pd .grid-head { display:none; }
@media (min-width:768px) {
  .pd .grid-head, .pd .grid-row { display:grid; align-items:center; gap:12px;
    grid-template-columns:minmax(0,1.9fr) minmax(0,.9fr) minmax(0,1fr)
      minmax(0,1.35fr) minmax(0,.45fr) minmax(0,.85fr) minmax(0,1.25fr)
      minmax(0,.7fr); }
  .pd .grid-row .stage-bar i { width:11px; }
  .pd .grid-head { padding:0 16px; font-size:11px; font-weight:600;
    text-transform:uppercase; letter-spacing:.05em;
    color:var(--muted-foreground); margin-bottom:8px; }
  .pd .num { text-align:right; }
}
.pd .grid-row { margin-bottom:8px; }

/* tables (fornecedores / cotações) */
.pd table.tbl { width:100%; border-collapse:collapse; font-size:14px; }
.pd table.tbl th { height:40px; padding:0 8px; text-align:left;
  font-weight:500; white-space:nowrap; border-bottom:1px solid var(--border); }
.pd table.tbl td { padding:8px; white-space:nowrap; vertical-align:middle;
  border-bottom:1px solid var(--border); }
.pd table.tbl tr:last-child td { border-bottom:0; }
.pd table.tbl tr.best { background:var(--ok-soft); }
.pd .tbl-wrap { overflow-x:auto; border:1px solid var(--border);
  background:var(--card); border-radius:12px; }
.pd .empty { border:1px solid var(--border); background:var(--card);
  border-radius:12px; padding:40px; text-align:center; font-size:14px;
  color:var(--muted-foreground); }

/* envios draft cards */
.pd details.msg > summary { cursor:pointer; font-size:12px;
  color:var(--muted-foreground); }
.pd details.msg pre { white-space:pre-wrap; font:12.5px/1.55 ui-monospace,
  SFMono-Regular, Menlo, monospace; background:var(--secondary);
  border-radius:8px; padding:12px; margin:8px 0 0; }
.pd .sect-label { font-size:10.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; color:var(--primary); margin:20px 0 8px; }
#toast { position:fixed; bottom:18px; right:18px; background:#0a0a0a;
  color:#fff; border-radius:8px; padding:9px 14px; font-size:13px;
  display:none; z-index:60; }

/* stats row (port of the old Cotações header cards) */
.pd .stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr));
  gap:12px; margin-bottom:16px; }
.pd .stat-card { border:1px solid var(--border); background:var(--card);
  border-radius:12px; padding:14px 16px; transition:border-color .15s; }
.pd .stat-card:hover { border-color:var(--accent-line); }
.pd .stat-n { font-size:26px; font-weight:600; font-variant-numeric:tabular-nums; }
.pd .stat-cap { font-size:12.5px; color:var(--muted-foreground); margin-top:2px; }

/* stage-bar load animation (the old list's fill-in) */
@keyframes segfill { from { background:var(--border); } to { background:var(--accent-bright); } }
.pd .stage-bar.anim i.on { animation:segfill .3s ease both; }

/* right drawer (item ficha, cotação detail, envio detail — stackable) */
.pd .drawer-back { position:fixed; inset:0; background:rgba(10,10,10,.28);
  z-index:40; }
.pd .drawer { position:fixed; top:0; right:0; bottom:0; width:min(760px,94vw);
  background:var(--card); border-left:1px solid var(--border);
  box-shadow:-12px 0 40px rgba(0,0,0,.14); z-index:41; overflow-y:auto;
  padding:20px 22px; animation:drawin .18s ease; }
.pd .drawer.lvl2 { width:min(660px,90vw); z-index:43; }
.pd .drawer-back.lvl2 { z-index:42; }
@keyframes drawin { from { transform:translateX(24px); opacity:.4; } to { transform:none; opacity:1; } }
.pd .drawer .d-close { position:sticky; top:0; float:right; background:var(--card);
  border:1px solid var(--border); border-radius:999px; width:28px; height:28px;
  font-size:14px; line-height:1; }
.pd .drawer h2 { font-size:15px; font-weight:600; margin:0 0 4px; }
.pd .drawer .d-sect { font-size:10.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; color:var(--primary); margin:18px 0 8px; }
.pd .drawer .kv { display:flex; justify-content:space-between; gap:12px;
  border-bottom:1px solid var(--border); padding:6px 0; font-size:13px; }
.pd .drawer .kv:last-child { border-bottom:0; }
.pd .drawer .kv .k { color:var(--muted-foreground); }
.pd .drawer .kv .v { text-align:right; }
.pd .row-click { cursor:pointer; }
.pd .row-click:hover { background:var(--secondary); }

/* back arrow beside the title */
.pd .backarrow { display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border:1px solid var(--border); border-radius:999px;
  text-decoration:none; color:var(--muted-foreground); font-size:15px; }
.pd .backarrow:hover { border-color:var(--ring); color:var(--foreground); }

/* timeline (Histórico) */
.pd .timeline { position:relative; padding-left:22px; }
.pd .timeline::before { content:""; position:absolute; left:7px; top:6px;
  bottom:6px; width:2px; background:var(--border); border-radius:2px; }
.pd .tl-item { position:relative; padding:7px 0 7px 8px; }
.pd .tl-item::before { content:""; position:absolute; left:-19px; top:13px;
  width:10px; height:10px; border-radius:50%; background:var(--card);
  border:2.5px solid var(--accent-bright); }
.pd .tl-item.ok::before { border-color:#16a34a; }
.pd .tl-item.warn::before { border-color:#f97316; }
.pd .tl-item.bad::before { border-color:var(--destructive); }
.pd .tl-title { font-size:13px; font-weight:500; }
.pd .tl-meta { font-size:11.5px; color:var(--faint);
  font-variant-numeric:tabular-nums; }

/* loading skeleton + panel fade (the pre-merge app's pulse) */
@keyframes pd-pulse { 0%,100% { opacity:1; } 50% { opacity:.45; } }
.pd .skel-row { height:64px; border-radius:12px; background:var(--secondary);
  margin-bottom:8px; animation:pd-pulse 1.6s ease-in-out infinite; }
.pd .skel-line { height:14px; border-radius:6px; background:var(--secondary);
  margin:8px 0; animation:pd-pulse 1.6s ease-in-out infinite; }
@keyframes pd-fadein { from { opacity:0; transform:translateY(3px); }
  to { opacity:1; transform:none; } }
.pd .fade-in { animation:pd-fadein .22s ease both; }

/* logistics option cards (flight-search style, Decisão) */
.pd .logi-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px,1fr));
  gap:10px; }
.pd .logi-card { border:1px solid var(--border); background:var(--card);
  border-radius:12px; padding:14px 16px; cursor:pointer;
  transition:border-color .15s; position:relative; }
.pd .logi-card:hover { border-color:var(--ring); }
.pd .logi-card.sel { border-color:var(--primary);
  box-shadow:inset 0 0 0 1px var(--primary); }
.pd .logi-mode { font-size:12px; color:var(--muted-foreground); }
.pd .logi-price { font-size:20px; font-weight:600;
  font-variant-numeric:tabular-nums; margin:2px 0; }
.pd .logi-transit { font-size:12.5px; color:var(--faint); }

/* shadcn-flavored native controls (vanilla port of the ui kit's look) */
.pd select { appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23615f58' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center;
  padding-right:28px !important; }
.pd input[type=search], .pd input[type=text], .pd select {
  transition:border-color .15s, box-shadow .15s; }
.pd input[type=search]:focus, .pd input[type=text]:focus, .pd select:focus {
  outline:none; border-color:var(--ring);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--ring) 22%, transparent); }
.pd input[type=checkbox] { width:15px; height:15px; accent-color:var(--primary); }

.pd table.tbl th.sortable { cursor:pointer; user-select:none; }
.pd table.tbl th.sortable:hover { color:var(--primary); }
.pd table.tbl th.sorted { color:var(--primary); }
