[hidden]{display:none!important}
:root{--paper:#F4F5F2;--surface:#fff;--ink:#1E2226;--muted:#626A71;--line:#D9DCD6;--asphalt:#2F353B;--side-ink:#DDE1E4;--mark:#E3A914;--gain:#2B7A4B;--loss:#B2352B;--chip:#ECEEE9;
--c-trendyol:#F27A1A;--c-hepsiburada:#FF6000;--c-n11:#7B2CBF;--c-pttavm:#E1B000;--c-pazarama:#1E6FD9;--c-idefix:#D4145A;--c-surat:#E30613}
@media (prefers-color-scheme:dark){:root{--paper:#181B1E;--surface:#212529;--ink:#E9EBE7;--muted:#9AA2A9;--line:#343A40;--asphalt:#111416;--mark:#F0BC30;--gain:#5CC08A;--loss:#EE7A6E;--chip:#2B3035}}
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 "Barlow",system-ui,sans-serif;font-variant-numeric:tabular-nums}
h1,h2,h3,.cond,.brand,.brand-lg{font-family:"Barlow Condensed","Arial Narrow",sans-serif}
h1{font-size:25px;margin:0}h2{font-size:21px;margin:0 0 10px;font-weight:600}h3{font-size:18px;margin:0;font-weight:600}
.small{font-size:13px}.muted{color:var(--muted)}.pos{color:var(--gain);font-weight:600}.neg{color:var(--loss);font-weight:600}
button{font:inherit;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:8px 14px;border-radius:6px;cursor:pointer}
button.primary{background:var(--asphalt);color:#fff;border-color:var(--asphalt)}
@media (prefers-color-scheme:dark){button.primary{background:var(--mark);color:#1b1b1b;border-color:var(--mark)}}
button:hover{border-color:var(--ink)}button:disabled{opacity:.5;cursor:default}
button.ghost{border-color:transparent;background:transparent;padding:4px 8px}
button.danger{color:var(--loss)}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--mark);outline-offset:2px}
select,input{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:7px 9px;min-width:0}
input[type=number]{text-align:right}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
label.inline{flex-direction:row;align-items:center;gap:8px;color:var(--ink);font-size:14px}

/* Giriş */
.login{min-height:100%;display:grid;place-items:center;background:var(--asphalt);padding:20px}
.login-card{background:var(--surface);border-radius:12px;padding:28px;width:min(360px,100%);display:flex;flex-direction:column;gap:14px}
.brand-lg{font-size:30px;font-weight:700;margin-bottom:6px}

/* İskelet */
.shell{display:grid;grid-template-columns:232px 1fr;min-height:100%}
.side{background:var(--asphalt);color:var(--side-ink);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding-top:env(safe-area-inset-top,0px)}
.brand{font-size:24px;font-weight:700;color:#fff;padding:20px 20px 16px}
.side nav{display:flex;flex-direction:column;padding:0 10px;gap:2px}
.side a{color:var(--side-ink);text-decoration:none;padding:9px 12px;border-radius:6px;display:flex;align-items:center;gap:10px;border-left:3px solid transparent}
.side a:hover{background:rgba(255,255,255,.06)}
.side a.active{background:rgba(255,255,255,.1);color:#fff;border-left-color:var(--mark)}
.ico{width:18px;text-align:center;opacity:.8}
.nav-group{font-size:12px;color:#8E969D;padding:16px 12px 4px}
.nav-badge{margin-left:auto;font-size:12px;border-radius:999px;padding:0 7px;font-weight:700}
.nav-badge.bad{background:var(--loss);color:#fff}.nav-badge.good{background:rgba(92,192,138,.2);color:#8FD6AE}
.side-foot{margin-top:auto;padding:14px 20px;font-size:12px;color:#8E969D;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
.main{min-width:0;padding-bottom:env(safe-area-inset-bottom,0px)}
.bar{display:flex;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0;z-index:5;flex-wrap:wrap}
.bar-right{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.menu-btn{display:none;font-size:20px}
.content-pad{padding:0 24px;max-width:1280px}
.page{padding-top:20px;padding-bottom:40px}
#alerts:empty{display:none}#alerts{padding-top:16px}

.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:18px}
.hero-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 32px}
.net-big{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:clamp(44px,7vw,68px);line-height:1}
.tread{display:flex;height:30px;border-radius:5px;overflow:hidden;margin:18px 0 10px;background:var(--chip)}
.tread span{height:100%;transition:flex-basis .4s}
.legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px}
.legend i{display:inline-block;width:11px;height:11px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.s-net{background:var(--gain);background-image:repeating-linear-gradient(115deg,transparent 0 10px,rgba(255,255,255,.14) 10px 14px)}
.s-kom{background:#C8742A}.s-hiz{background:#9A6B3F}.s-stp{background:#7D8791}.s-krg{background:var(--mark)}.s-diger{background:#B9B3A6}.s-vat{background:#A7AFB6}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:8px 12px;background:var(--surface);text-decoration:none;color:inherit;font-weight:500}
.st{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:13px;font-weight:700;flex:none}
.st.ok{background:var(--gain);color:#fff}.st.error{background:var(--loss);color:#fff}.st.none{background:var(--chip);color:var(--muted)}.st.pending{background:var(--mark);color:#1b1b1b}
.chart{width:100%;height:180px;display:block}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th{font-weight:600;color:var(--muted);text-align:right;padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
th:first-child,td:first-child,.l{text-align:left}
tr:last-child td{border-bottom:none}tfoot td{font-weight:700;border-top:2px solid var(--ink)}
tbody tr.click{cursor:pointer}tbody tr.click:hover{background:var(--chip)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px}
.est{color:var(--muted);font-size:11px;vertical-align:super;margin-left:2px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;align-items:center}
.chip{border-radius:999px;padding:5px 12px;background:var(--chip);border:1px solid transparent;font-weight:500}
.chip[aria-pressed=true]{background:var(--asphalt);color:#fff}
.prod{max-width:300px;overflow:hidden;text-overflow:ellipsis}
.tag{font-size:12px;border-radius:4px;padding:1px 6px;margin-left:6px;font-weight:600}
.tag.iade{background:color-mix(in srgb,var(--loss) 15%,transparent);color:var(--loss)}.tag.iptal{background:var(--chip);color:var(--muted)}
.empty{padding:34px 10px;text-align:center;color:var(--muted)}
.note{font-size:13px;color:var(--muted)}
.warn{background:color-mix(in srgb,var(--mark) 18%,var(--surface));border:1px solid var(--mark);border-radius:8px;padding:10px 14px;margin-bottom:10px;font-size:14px}
.err{background:color-mix(in srgb,var(--loss) 12%,var(--surface));border:1px solid var(--loss);border-radius:8px;padding:10px 14px;margin-bottom:10px;font-size:14px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 14px}
.row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;align-items:center}
.set-table input{width:92px}
/* Bağlantı kartları */
.conn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:18px}
.conn{border-top:4px solid var(--c)}
.conn-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.conn-state{margin-left:auto;font-size:13px;font-weight:600}
.conn-meta{font-size:13px;color:var(--muted);min-height:20px;margin-bottom:10px}
.conn-err{font-size:13px;color:var(--loss);background:color-mix(in srgb,var(--loss) 8%,transparent);border-radius:6px;padding:6px 8px;margin-bottom:10px;word-break:break-word}
.ip-big{font-family:"Barlow Condensed",sans-serif;font-size:34px;font-weight:700;line-height:1.1}
/* Sipariş detayı */
dialog{border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);padding:0;width:min(800px,94vw);max-height:90vh}
dialog::backdrop{background:rgba(20,22,25,.45)}
.dlg{padding:20px;overflow:auto;max-height:90vh}
.ladder td{padding:10px 8px}.ladder td.src{font-size:13px;color:var(--muted);text-align:left;white-space:normal}
.ladder tr.total td{border-top:2px solid var(--ink);font-weight:700;font-size:17px}
.lbar{height:8px;border-radius:3px;background:var(--mark);display:inline-block;vertical-align:middle}
pre{background:var(--chip);padding:12px;border-radius:8px;overflow:auto;max-height:320px;font-size:12px}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--asphalt);color:#fff;padding:10px 16px;border-radius:8px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s;z-index:50}
.toast.show{opacity:1}
@media (prefers-reduced-motion:reduce){.tread span,.toast{transition:none}}
@media (max-width:900px){
  .shell{grid-template-columns:1fr}
  .side{position:fixed;inset:0 auto 0 0;width:250px;z-index:20;transform:translateX(-100%);transition:transform .2s}
  .side.open{transform:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.35)}
  .menu-btn{display:inline-block}
  .grid2{grid-template-columns:1fr}
  .bar{padding:12px 16px}.content-pad{padding-left:16px;padding-right:16px}
  .bar-right{margin-left:0;width:100%}
}

/* Özet: satır satır siparişler */
.card-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.olist td{vertical-align:middle}
.olist .note{margin-top:1px}
.mini{display:flex;width:150px;height:12px;border-radius:3px;overflow:hidden;background:var(--chip)}
.mini span{height:100%}
.mini.loss{background:color-mix(in srgb,var(--loss) 14%,transparent);color:var(--loss);font-size:10px;font-weight:700;line-height:12px;justify-content:center}
.back{margin-bottom:10px;font-size:15px}
.detail{max-width:900px}
.olist .prod{max-width:210px}
.olist td,.olist th{padding-left:6px;padding-right:6px}
.mini{width:120px}
@media (max-width:1200px){.olist .prod{max-width:150px}}

.ladder tr.subtotal td{font-weight:700;background:var(--chip)}
.real-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gain);margin-left:4px;vertical-align:1px}

.ship{display:inline-block;font-size:12px;font-weight:600;border-radius:999px;padding:1px 8px;white-space:nowrap}
.ship.ok{background:color-mix(in srgb,var(--gain) 16%,transparent);color:var(--gain)}
.ship.go{background:color-mix(in srgb,#1E6FD9 14%,transparent);color:#1E6FD9}
.ship.wait{background:var(--chip);color:var(--muted)}
.ship.bad{background:color-mix(in srgb,var(--loss) 14%,transparent);color:var(--loss)}
.ship.off{background:var(--chip);color:var(--muted);text-decoration:line-through}
@media (prefers-color-scheme:dark){.ship.go{color:#7FB2F5}}
.deliv{margin:4px 0 10px;color:var(--gain)}
.timeline{margin:6px 0 4px}.timeline summary{cursor:pointer;color:var(--muted);font-size:14px}
.timeline ol{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:14px}
/* Özet listesi: kargo sütunu eklendi, sığması için sıkılaştırma */
.olist{font-size:13px}
.olist .prod{max-width:170px}
.mini{width:90px}
@media (max-width:1400px){.olist .prod{max-width:120px}}

.prog{margin:10px 0 4px}.prog-bar{height:10px;border-radius:5px;background:var(--chip);overflow:hidden}
.prog-bar span{display:block;height:100%;background:var(--mark);transition:width .6s}
.codebox{border:2px solid var(--mark);background:color-mix(in srgb,var(--mark) 14%,var(--surface));border-radius:10px;padding:12px 14px;margin:10px 0}
code.sel{user-select:all;word-break:break-all;background:var(--chip);padding:2px 5px;border-radius:4px;font-size:12px}

form.lf{border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin:8px 0}
.lf-id{font-size:11px;margin-bottom:4px}
fieldset.lf-radio{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
fieldset.lf-radio legend{font-size:13px;color:var(--muted);margin-bottom:4px}
.lf-code{font-size:18px;letter-spacing:2px;max-width:200px}
.lf h3{font-size:16px;margin:0 0 8px}.lf-prim{border:2px solid var(--mark);background:color-mix(in srgb,var(--mark) 8%,var(--surface))}
.chk{border:2px solid var(--mark)}button.small{font-size:12px;padding:2px 6px}
.site-snip{border:1px dashed var(--line);border-radius:6px;padding:8px;font-size:13px;max-width:420px}.site-snip td{padding:2px 6px}
img.shot{max-width:100%;border:1px solid var(--line);border-radius:6px;cursor:crosshair;margin-top:6px}
