/* ==== RENK ŞEMASI – Aydınlık/Koyu ve Manuel Geçiş ==== */
:root{
  /* Light (varsayılan) */
  --turkuaz:#09a7a1;
  --kirmizi:#ef4444;
  --beyaz:#ffffff;
  --ink:#0f172a;
  --muted:#64748b;
  --bg:#f8fafc;
  --card:#ffffff;
  --ring:#06b6d4;
}
@media (prefers-color-scheme: dark){
  :root{
    --turkuaz:#22d3ee; --kirmizi:#f87171; --beyaz:#0b1220; --ink:#e5eefb;
    --muted:#93a4bd; --bg:#0b1220; --card:#111a2c; --ring:#22d3ee;
  }
}
/* Manuel override */
html[data-theme="light"]{
  --turkuaz:#09a7a1; --kirmizi:#ef4444; --beyaz:#ffffff; --ink:#0f172a;
  --muted:#64748b; --bg:#f8fafc; --card:#ffffff; --ring:#06b6d4;
}
html[data-theme="dark"]{
  --turkuaz:#22d3ee; --kirmizi:#f87171; --beyaz:#0b1220; --ink:#e5eefb;
  --muted:#93a4bd; --bg:#0b1220; --card:#111a2c; --ring:#22d3ee;
}

/* Yumuşak geçişler */
*{transition: background-color .25s ease, color .25s ease, border-color .25s ease}

/* ==== TEMEL ==== */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Noto Sans",sans-serif; overflow-x:hidden}
a{color:var(--turkuaz);text-decoration:none}
.container{max-width:1100px;margin:80px auto 48px;padding:0 16px}
.topbar{position:fixed;z-index:30;left:0;right:0;top:0;background:var(--card);box-shadow:0 2px 10px rgba(0,0,0,.05);display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:10px}
.topbar .brand{font-weight:800;letter-spacing:.5px;color:var(--turkuaz)}
.nav a{margin:0 8px;padding:6px 10px;border-radius:10px}
.nav a:hover{background:#e6fffb}
.acct .btn.small{padding:6px 10px;border:1px solid var(--turkuaz);border-radius:10px;color:var(--turkuaz)}
.footer{padding:24px;text-align:center;color:var(--muted)}
.card{background:var(--card);border-radius:16px;box-shadow:0 10px 25px rgba(2,6,23,.06);padding:16px;margin-bottom:16px}
.grid{display:grid;gap:16px;min-width:0}
.grid-2{grid-template-columns:1fr 1fr}
@media (max-width:800px){.grid-2{grid-template-columns:1fr!important}}
.label{font-size:12px;color:var(--muted);margin-bottom:6px}
.input,select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #e2e8f0;outline:none;min-width:0}
.input:focus,select:focus{border-color:var(--ring);box-shadow:0 0 0 4px rgba(6,182,212,.15)}
.btn{display:inline-block;padding:12px 16px;border-radius:12px;border:none;background:var(--turkuaz);color:#fff;font-weight:600;cursor:pointer;white-space:nowrap;min-width:0}
.btn.red{background:var(--kirmizi)}
.btn.ghost{background:#e2e8f0;color:#0f172a}
.flex{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.right{margin-left:auto}
.kasa-ok{color:#16a34a;font-weight:700}
.kasa-eksik{color:#b91c1c;font-weight:700}
kbd{background:#0f172a;color:#fff;border-radius:6px;padding:2px 6px;font-size:12px}
.touchpad .btn{min-width:80px;font-size:18px}

/* ===== Totals kutusu ===== */
.totals .row{display:flex;justify-content:space-between;align-items:center;padding:4px 0}
.totals .label{color:var(--muted);font-size:13px}
.totals .val{font-weight:700;font-size:14px}
.totals .sep{border-top:1px solid #e2e8f0;margin:6px 0}
.totals input.input.compact{width:110px;height:34px;padding:6px 10px;font-size:14px}
.totals .grandbox{display:flex;justify-content:space-between;align-items:center;border:2px solid var(--turkuaz);background:#e6fffb;border-radius:12px;padding:8px 12px;margin-top:8px}
.totals .grandbox .label{font-size:14px;color:#0e7490;font-weight:700}
.totals .grandbox .val{font-size:20px;font-weight:800;color:#0e7490}

/* ===== Tablo genel ===== */
.table{width:100%;border-collapse:collapse;display:table;table-layout:auto}
.table th,.table td{padding:10px;border-bottom:1px solid #f1f5f9;vertical-align:middle}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px}

/* ==== SEPET TABLOSU – sabit genişlikler & taşma koruması ==== */
#cartTable{table-layout:fixed;width:100%}
#cartTable th,#cartTable td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#cartTable th:nth-child(1), #cartTable td:nth-child(1){width:46%}  /* Ürün */
#cartTable th:nth-child(2), #cartTable td:nth-child(2){width:22%}  /* Fiyat */
#cartTable th:nth-child(3), #cartTable td:nth-child(3){width:16%}  /* Adet */
#cartTable th:nth-child(4), #cartTable td:nth-child(4){width:16%}  /* Tutar */
#cartTable th:nth-child(5), #cartTable td:nth-child(5){width:72px} /* Sil butonu */
#cartTable td:nth-child(5) .btn{padding:8px 10px}

/* ===== Fiş / Yazdırma ===== */
.receipt{display:none;color:#000;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
.receipt.paper58{width:58mm;padding:4mm 3mm}
.receipt.paper80{width:80mm;padding:5mm 4mm}
.receipt .center{text-align:center}
.receipt .title{font-weight:800;font-size:14px;margin-bottom:4px}
.receipt .muted{color:#444;font-size:11px}
.receipt .line{border-top:1px dashed #000;margin:6px 0}
.receipt .row{display:flex;justify-content:space-between;font-size:12px}
.receipt .row.h{font-weight:700}
.receipt .items{margin:6px 0}
.receipt .item{display:flex;justify-content:space-between;gap:6px;font-size:12px}
.receipt .item .name{flex:1}
.receipt .item .qty{width:34px;text-align:right}
.receipt .item .price{width:52px;text-align:right}
.receipt .sum{font-weight:800}
.receipt .kdv{font-size:11px}
.receipt .thanks{text-align:center;margin-top:8px;font-size:12px}
@media print{
  @page{margin:0}
  html,body{background:#fff}
  body.printing :not(#receipt):not(#receipt *){display:none!important}
  #receipt{display:block!important}
  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
}

/* ==== Evrensel mobil düzeltmeler ==== */
@media (max-width:600px){
  .container{margin:64px auto 24px;padding:0 12px;max-width:100%}
  .card{padding:12px}
  .grid{gap:12px}
  .grid-2{grid-template-columns:1fr!important}
  .input,select,.btn{padding:14px 12px;font-size:16px}

  /* Barkod satırı taşmasın */
  #barcode{min-width:0;width:100%}
  .flex,.grid{min-width:0}

  /* Toplamlar metinleri kırılabilsin */
  .totals .row{gap:8px}
  .totals .label,.totals .val{min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:break-word;text-align:left}
  .totals .val{margin-left:auto}

  /* Sepet tablosu mobilde de sabit kalsın */
  #cartTable{display:table}
  #cartTable thead{display:table-header-group}
  #cartTable tbody{display:table-row-group}
  #cartTable tr{display:table-row}
  #cartTable td,#cartTable th{display:table-cell}

  /* Diğer tablolar kart görünümüne geçsin */
  table.table:not(#cartTable):not(.no-stack) thead{display:none}
  table.table:not(#cartTable):not(.no-stack),
  table.table:not(#cartTable):not(.no-stack) tbody,
  table.table:not(#cartTable):not(.no-stack) tr,
  table.table:not(#cartTable):not(.no-stack) td{display:block;width:100%}
  table.table:not(#cartTable):not(.no-stack) tr{
    margin:10px 0;border:1px solid #33415540;border-radius:12px;padding:12px;background:var(--card)
  }
  table.table:not(#cartTable):not(.no-stack) td{
    display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
    padding:8px 0;border:0;border-bottom:1px dashed #33415540;white-space:normal;overflow-wrap:anywhere;word-break:break-word;min-width:0
  }
  table.table:not(#cartTable):not(.no-stack) td:last-child{border-bottom:0}
  table.table:not(#cartTable):not(.no-stack) td::before{
    content:attr(data-th);flex:0 0 110px;min-width:110px;color:#94a3b8
  }

  /* İşlem hücresi butonları rahat sığsın */
  table.table:not(#cartTable):not(.no-stack) td[data-th="İşlem"]{display:block}
  table.table:not(#cartTable):not(.no-stack) td[data-th="İşlem"]::before{display:block;margin-bottom:8px}
  table.table:not(#cartTable):not(.no-stack) td[data-th="İşlem"] .btn{
    display:inline-flex;align-items:center;justify-content:center;min-width:96px;margin:0 8px 8px 0;white-space:nowrap
  }
}

/* Video/kamera alanları taşmasın */
#scanVideo, video{width:100%!important;max-width:100%!important;height:auto;object-fit:cover}

/* ==== Mobil menü (hamburger + drawer) ==== */
.menu-btn{display:none;width:40px;height:36px;border:none;background:transparent;cursor:pointer;align-items:center;justify-content:center;gap:5px;padding:0}
.menu-btn span{display:block;width:22px;height:2px;background:var(--ink);transition:.2s}
.menu-btn.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-btn.active span:nth-child(2){opacity:0}
.menu-btn.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.desktop-nav{display:flex}
@media (max-width:960px){
  .desktop-nav{display:none}
  .menu-btn{display:flex}
  .acct .u{display:none}
}
.drawer-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.45);opacity:0;transition:opacity .2s ease;z-index:49}
.drawer-backdrop.show{opacity:1}
.drawer{position:fixed;top:0;bottom:0;left:0;width:78%;max-width:320px;background:var(--card);box-shadow:0 10px 30px rgba(2,6,23,.3);transform:translateX(-100%);transition:transform .2s ease;z-index:50;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #e2e8f0}
.drawer-close{border:none;background:transparent;font-size:22px;line-height:1;cursor:pointer}
.drawer-nav{display:flex;flex-direction:column;padding:10px;gap:6px}
.drawer-nav a{padding:12px 14px;border-radius:10px;color:var(--ink);font-weight:600}
.drawer-nav a:hover{background:#e6fffb}
.drawer-nav a.logout{color:#b91c1c}
.no-scroll{overflow:hidden}