/* ===== Teklif Yazılımı — admin chrome (strictly black & white, responsive) ===== */
:root{
    --ink:#000;
    --paper:#fff;
    --line:#000;
    --shade:#ededed;
    --soft:#f7f7f7;
    --muted:#666;
    --hair:#cfcfcf;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
    font:14px/1.45 "Arial","Liberation Sans",-apple-system,sans-serif;
    color:var(--ink); background:var(--paper);
    -webkit-font-smoothing:antialiased;
}
a{ color:var(--ink); }
h2{ font-size:20px; margin:0 0 4px; }
h3{ font-size:15px; margin:0 0 10px; text-transform:uppercase; letter-spacing:.4px; }
.muted{ color:var(--muted); font-weight:400; }
.mono{ font-family:"SF Mono",Menlo,Consolas,monospace; font-size:13px; }
.ar{ text-align:right; }

/* ---------- Top bar ---------- */
.topbar{
    display:flex; align-items:center; gap:18px;
    background:var(--ink); color:var(--paper);
    padding:0 18px; height:52px; position:sticky; top:0; z-index:50;
}
.topbar .brand{ color:var(--paper); font-weight:800; letter-spacing:2px; text-decoration:none; font-size:16px; }
.mainnav{ display:flex; gap:4px; flex:1; }
.mainnav a{
    color:var(--paper); text-decoration:none; padding:8px 12px; border-radius:0;
    opacity:.8; font-weight:600;
}
.mainnav a:hover{ opacity:1; }
.mainnav a.active{ opacity:1; background:var(--paper); color:var(--ink); }
.userbox{ display:flex; align-items:center; gap:12px; }
.userbox .uname{ color:var(--paper); opacity:.85; font-size:13px; }
.btn-link{ background:none; border:none; color:var(--paper); cursor:pointer; text-decoration:underline; font:inherit; padding:6px; }
.nav-toggle, .nav-burger{ display:none; }

/* ---------- Page ---------- */
.page{ max-width:1180px; margin:0 auto; padding:22px 18px 60px; }
.narrow{ max-width:520px; margin:30px auto; padding:0 16px; }
.toolbar-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }

/* ---------- Buttons ---------- */
.btn{
    display:inline-flex; align-items:center; justify-content:center; gap:6px;
    border:1.5px solid var(--ink); background:var(--paper); color:var(--ink);
    padding:8px 14px; font:inherit; font-weight:700; cursor:pointer; border-radius:0;
    text-decoration:none; white-space:nowrap; line-height:1.1;
}
.btn:hover{ background:var(--ink); color:var(--paper); }
.btn-primary{ background:var(--ink); color:var(--paper); }
.btn-primary:hover{ background:var(--paper); color:var(--ink); }
.btn-ghost{ border-color:var(--hair); font-weight:600; }
.btn-ghost:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn-sm{ padding:5px 9px; font-size:12.5px; font-weight:600; }
.btn-block{ width:100%; }
.btn:disabled{ opacity:.5; cursor:default; }

/* ---------- Cards / forms ---------- */
.card{ border:1.5px solid var(--ink); background:var(--paper); padding:16px; margin-bottom:18px; }
.form-grid{ display:flex; flex-direction:column; gap:12px; }
.field{ display:flex; flex-direction:column; gap:4px; }
.field > span{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; color:#222; }
input[type=text],input[type=password],input[type=search],input[type=date],input[type=number],textarea,select{
    border:1.5px solid var(--ink); background:var(--paper); color:var(--ink);
    padding:8px 10px; font:inherit; border-radius:0; width:100%;
}
textarea{ resize:vertical; }
input:focus,textarea:focus,select:focus{ outline:2px solid var(--ink); outline-offset:-1px; }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.row3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }
.form-actions{ display:flex; gap:10px; margin-top:4px; }
.inline{ display:inline; }
.inline-form{ display:flex; gap:8px; align-items:center; margin-bottom:12px; }
.chk{ display:inline-flex; align-items:center; gap:6px; font-size:13px; white-space:nowrap; }
.chk input{ width:auto; }

/* ---------- Filters ---------- */
.filters{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; padding:12px; }
.filters .grow{ flex:1 1 240px; }
.filters select, .filters input[type=date]{ width:auto; }
.inline-field{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:#333; }
.inline-field input{ width:auto; }

/* ---------- Tables ---------- */
.table-wrap{ overflow-x:auto; border:1.5px solid var(--ink); }
table.list{ border-collapse:collapse; width:100%; background:var(--paper); }
table.list th, table.list td{ border-bottom:1px solid var(--hair); padding:9px 11px; text-align:left; vertical-align:middle; }
table.list thead th{ background:var(--shade); border-bottom:1.5px solid var(--ink); font-size:12px; text-transform:uppercase; letter-spacing:.3px; }
table.list tbody tr:hover{ background:var(--soft); }
table.list .sub{ font-size:12px; color:var(--muted); }
table.list .empty{ text-align:center; color:var(--muted); padding:24px; }
.row-inactive{ opacity:.5; }
.actions{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.actions-col{ width:1%; white-space:nowrap; }
.mini{ padding:4px 6px; font-size:12px; width:auto; }
.mini-num{ width:54px; padding:4px 6px; }
.reset-form{ display:inline-flex; gap:4px; align-items:center; }
.reset-form .mini{ width:110px; }

/* status badges (B/W) */
.badge{ display:inline-block; border:1px solid var(--ink); padding:2px 8px; font-size:11.5px; font-weight:700; text-transform:uppercase; }
.badge-draft{ background:var(--paper); color:var(--ink); }
.badge-sent{ background:var(--shade); }
.badge-accepted{ background:var(--ink); color:var(--paper); }
.badge-rejected{ background:var(--paper); text-decoration:line-through; }
.badge-expired{ background:var(--paper); color:var(--muted); border-color:var(--muted); }
.badge-archived{ background:var(--soft); color:var(--muted); }

/* ---------- Split layout (catalog / users) ---------- */
.split{ display:grid; grid-template-columns:1fr 360px; gap:20px; align-items:start; }
.split-side .card{ position:sticky; top:70px; }

/* ---------- Settings ---------- */
.settings-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start; }
.settings-grid .wide{ grid-column:1 / -1; }
.label-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.label-grid .field > span{ font-size:10.5px; text-transform:none; color:var(--muted); }
.brand-previews{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.bp{ display:flex; flex-direction:column; gap:6px; font-size:12px; font-weight:700; }
.bp-img{ border:1px solid var(--hair); height:90px; display:flex; align-items:center; justify-content:center; background:var(--soft); }
.bp-img img{ max-width:100%; max-height:100%; object-fit:contain; }
.tmpl-list{ list-style:none; margin:0; padding:0; }
.tmpl-list li{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid var(--hair); }

/* ---------- Flash ---------- */
.flash{ border:1.5px solid var(--ink); padding:10px 14px; margin:0 0 14px; font-weight:600; }
.flash-ok{ background:var(--soft); }
.flash-error{ background:var(--ink); color:var(--paper); }
.flash-warn{ background:var(--shade); }

/* ---------- Login ---------- */
.login-body{ background:var(--paper); }
.login-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
.login-card{ width:340px; border:2px solid var(--ink); padding:28px 24px; display:flex; flex-direction:column; gap:14px; }
.login-title{ text-align:center; font-size:18px; letter-spacing:2px; margin:0 0 6px; }

/* ---------- Editor chrome ---------- */
.editor-toolbar{
    position:sticky; top:52px; z-index:40;
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    background:var(--paper); border-bottom:2px solid var(--ink);
    padding:9px 16px; flex-wrap:wrap;
}
.editor-toolbar .tb-left,.editor-toolbar .tb-right,.editor-toolbar .tb-center{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.qnum{ font-weight:700; }
.save-status{ font-size:13px; color:var(--muted); font-style:italic; }
.save-status.ok{ color:var(--ink); font-style:normal; font-weight:700; }
.save-status.saving,.save-status.pending{ color:var(--muted); }
.save-status.error{ color:var(--ink); font-style:normal; font-weight:800; text-decoration:underline; }
.kdv-rate-wrap{ gap:2px; }

.editor-stage{ display:flex; justify-content:center; overflow:auto; padding:18px 16px 60px; background:var(--paper); }
/* hidden until editor.js sizes/centers it -> no "load from the right" flash; revealed in init */
.sheet-fit{ position:relative; visibility:hidden; }
.sheet-fit.ready{ visibility:visible; }
.sheet-scaler{ position:absolute; top:0; left:0; transform-origin:top left; }

/* autocomplete / catalog dropdown */
.ac-dropdown{
    position:absolute; z-index:200; background:var(--paper); border:1.5px solid var(--ink);
    max-height:280px; overflow:auto; min-width:220px; box-shadow:none;
}
.ac-item{ padding:8px 10px; cursor:pointer; border-bottom:1px solid var(--hair); display:flex; flex-direction:column; gap:2px; }
.ac-item:last-child{ border-bottom:none; }
.ac-item:hover{ background:var(--ink); color:var(--paper); }
.ac-item .ac-meta{ font-size:11.5px; color:var(--muted); }
.ac-item:hover .ac-meta{ color:var(--paper); }

/* print page standalone */
.print-body{ background:var(--paper); }
.print-toolbar{ position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:12px; padding:10px 16px; border-bottom:2px solid var(--ink); background:var(--paper); }
.print-stage{ display:flex; justify-content:center; padding:24px 16px 60px; overflow:auto; }

/* ---------- Responsive ---------- */
@media (max-width:980px){
    .split{ grid-template-columns:1fr; }
    .split-side .card{ position:static; }
    .settings-grid{ grid-template-columns:1fr; }
    .label-grid{ grid-template-columns:1fr 1fr; }
    .brand-previews{ grid-template-columns:1fr; }
}
@media (max-width:760px){
    .nav-burger{ display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:24px; color:var(--paper); margin-left:auto; width:40px; height:40px; }
    .mainnav{
        display:none; position:absolute; top:52px; left:0; right:0;
        flex-direction:column; background:var(--ink); padding:6px 0; gap:0;
    }
    .nav-toggle:checked ~ .mainnav{ display:flex; }
    .mainnav a{ padding:12px 18px; }
    .userbox{ order:3; }
    .userbox .uname{ display:none; }
    .row2,.row3,.label-grid{ grid-template-columns:1fr; }
    .editor-toolbar{ top:52px; }
    .page{ padding:16px 12px 50px; }
}
@media (max-width:480px){
    .topbar{ gap:10px; padding:0 12px; }
    .editor-toolbar{ position:static; }
}