:root {
  --bg:#FAFAF8; --card:#fff; --text:#1A1714; --muted:#79746E;
  --accent:#C09468; --accent-dark:#8C6840; --border:#E9E4DC;
  --danger:#B3402F; --success:#3E7A4E;
  --radius:14px;
  --shadow:0 2px 16px rgba(26,23,20,.06);
  --shadow-md:0 8px 32px rgba(26,23,20,.10);
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
body { font-family:"Manrope",sans-serif; background:var(--bg); color:var(--text); line-height:1.6; min-height:100vh; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button { font-family:inherit; }

/* ---- TOPBAR ---- */
.topbar { position:sticky; top:0; z-index:40; background:rgba(250,250,248,.92); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
.topbar-inner { max-width:1280px; margin:0 auto; padding:0 1.2rem; height:62px; display:flex; align-items:center; gap:1.5rem; }
.brand { display:flex; flex-direction:column; line-height:1.1; }
.brand-name { font-family:"Playfair Display",serif; font-size:1.15rem; font-weight:600; }
.brand-sub { font-size:.58rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); }
.mainnav { display:flex; gap:.2rem; flex:1; }
.mainnav a { display:flex; align-items:center; gap:.45rem; padding:.45rem .85rem; border-radius:10px; font-size:.85rem; font-weight:600; color:var(--muted); transition:all .18s; }
.mainnav a svg { width:16px; height:16px; }
.mainnav a:hover { color:var(--text); background:rgba(26,23,20,.05); }
.mainnav a.on { color:var(--accent-dark); background:rgba(192,148,104,.13); }
.topbar-right { display:flex; align-items:center; gap:.6rem; }
.userchip { display:flex; align-items:center; gap:.5rem; padding:.3rem .7rem .3rem .3rem; border:1px solid var(--border); border-radius:99px; background:var(--card); transition:border-color .18s; }
.userchip:hover { border-color:var(--accent); }
.userchip-avatar { width:28px; height:28px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-size:.8rem; font-weight:700; }
.userchip-name { font-size:.82rem; font-weight:600; }
.btn-icon { width:36px; height:36px; border-radius:10px; border:1px solid var(--border); background:var(--card); color:var(--muted); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .18s; }
.btn-icon:hover { color:var(--danger); border-color:var(--danger); }
.btn-icon svg { width:16px; height:16px; }
.nav-toggle { display:none; width:38px; height:38px; border:1px solid var(--border); background:var(--card); border-radius:10px; font-size:1.1rem; cursor:pointer; }

/* ---- PAGE ---- */
.page { max-width:1280px; margin:0 auto; padding:1.8rem 1.2rem 4rem; }
.page-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.page-head h1 { font-family:"Playfair Display",serif; font-size:1.6rem; font-weight:600; }
.page-head .sub { color:var(--muted); font-size:.85rem; margin-top:.15rem; }

/* ---- BUTTONS ---- */
.btn { display:inline-flex; align-items:center; gap:.45rem; padding:.6rem 1.25rem; border-radius:99px; font-size:.85rem; font-weight:700; border:1.5px solid transparent; cursor:pointer; transition:all .18s; white-space:nowrap; line-height:1.2; }
.btn svg { width:15px; height:15px; }
.btn-primary { background:var(--text); color:#fff; }
.btn-primary:hover { background:var(--accent-dark); }
.btn-accent { background:var(--accent); color:#fff; }
.btn-accent:hover { background:var(--accent-dark); }
.btn-ghost { background:transparent; color:var(--text); border-color:var(--border); }
.btn-ghost:hover { border-color:var(--text); }
.btn-danger { background:transparent; color:var(--danger); border-color:rgba(179,64,47,.35); }
.btn-danger:hover { background:var(--danger); color:#fff; border-color:var(--danger); }
.btn-sm { padding:.4rem .85rem; font-size:.78rem; }

/* ---- CARD / TABLE ---- */
.card { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.card-pad { padding:1.5rem 1.6rem; }
.table-wrap { overflow-x:auto; }
table.list { width:100%; border-collapse:collapse; font-size:.88rem; }
table.list th { text-align:left; padding:.85rem 1.1rem; font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--border); white-space:nowrap; }
table.list td { padding:.85rem 1.1rem; border-bottom:1px solid var(--border); vertical-align:middle; }
table.list tr:last-child td { border-bottom:0; }
table.list tbody tr { transition:background .15s; }
table.list tbody tr:hover { background:rgba(192,148,104,.05); }
.row-actions { display:flex; gap:.35rem; justify-content:flex-end; flex-wrap:wrap; }

/* ---- BADGES ---- */
.badge { display:inline-block; padding:.22rem .65rem; border-radius:99px; font-size:.7rem; font-weight:700; letter-spacing:.03em; }
.badge-taslak     { background:#F1EDE6; color:#79746E; }
.badge-gonderildi { background:#E8F0F7; color:#2E5F8A; }
.badge-onaylandi  { background:#E6F2E9; color:#3E7A4E; }
.badge-reddedildi { background:#F9E9E6; color:#B3402F; }

/* ---- FORMS ---- */
label.fld { display:block; font-size:.78rem; font-weight:700; color:var(--muted); margin-bottom:1rem; }
label.fld > span { display:block; margin-bottom:.35rem; }
input[type=text], input[type=password], input[type=date], input[type=number], select, textarea {
  width:100%; padding:.6rem .85rem; border:1.5px solid var(--border); border-radius:10px;
  font-family:inherit; font-size:.9rem; color:var(--text); background:var(--card); transition:border-color .18s;
}
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--accent); }
textarea { resize:vertical; min-height:110px; line-height:1.6; }
.fld-row { display:grid; gap:1rem; }
@media (min-width:700px) { .fld-row-2 { grid-template-columns:1fr 1fr; } .fld-row-3 { grid-template-columns:1fr 1fr 1fr; } .fld-row-4 { grid-template-columns:repeat(4,1fr); } }

/* ---- FLASH ---- */
.flash { padding:.85rem 1.2rem; border-radius:12px; font-size:.88rem; font-weight:600; margin-bottom:1.3rem; }
.flash-success { background:#E6F2E9; color:#2C5E3B; border:1px solid #BCDCC5; }
.flash-error   { background:#F9E9E6; color:#8E3325; border:1px solid #EBC5BD; }

/* ---- LOGIN ---- */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:1.5rem; }
.login-box { width:100%; max-width:400px; background:var(--card); border:1px solid var(--border); border-radius:20px; padding:2.5rem 2.2rem; box-shadow:var(--shadow-md); }
.login-brand { text-align:center; margin-bottom:2rem; }
.login-brand .brand-name { font-size:1.7rem; }
.login-brand .brand-sub { font-size:.62rem; }

/* ---- QUOTE EDITOR ---- */
.qe-grid { display:grid; gap:1.4rem; }
@media (min-width:1080px) { .qe-grid { grid-template-columns:1fr 340px; align-items:start; } .qe-side { position:sticky; top:80px; } }
.qe-section { margin-bottom:1.4rem; }
.qe-section-title { font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-dark); margin-bottom:.8rem; display:flex; align-items:center; gap:.5rem; }
.qe-section-title::after { content:""; flex:1; height:1px; background:var(--border); }

/* items editor */
.qi-group { margin-bottom:1rem; border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.qi-group-head { display:flex; align-items:center; gap:.6rem; background:#F5F1EA; padding:.55rem .8rem; }
.qi-group-head input { border:none; background:transparent; font-weight:800; font-size:.82rem; letter-spacing:.05em; text-transform:uppercase; padding:.25rem .4rem; }
.qi-group-head input:focus { background:#fff; border-radius:6px; }
.qi-row { display:grid; grid-template-columns:44px 1fr; gap:.7rem; padding:.8rem; border-top:1px solid var(--border); align-items:start; }
.qi-row:first-child { border-top:none; }
.qi-img { width:44px; }
.qi-thumb { width:44px; height:44px; border-radius:8px; border:1.5px dashed var(--border); background:var(--bg); display:flex; align-items:center; justify-content:center; cursor:pointer; overflow:hidden; color:var(--muted); font-size:1.1rem; transition:border-color .18s; position:relative; }
.qi-thumb:hover { border-color:var(--accent); }
.qi-thumb img { width:100%; height:100%; object-fit:cover; }
.qi-thumb .qi-img-del { position:absolute; inset:0; background:rgba(26,23,20,.55); color:#fff; display:none; align-items:center; justify-content:center; font-size:.9rem; }
.qi-thumb:hover .qi-img-del { display:flex; }
.qi-fields { display:grid; gap:.5rem; }
.qi-line1 { display:grid; grid-template-columns:1fr; gap:.5rem; }
.qi-line2 { display:grid; grid-template-columns:90px 130px 1fr 34px; gap:.5rem; align-items:center; }
.qi-line2 .qi-total-out { text-align:right; font-weight:800; font-size:.92rem; color:var(--accent-dark); white-space:nowrap; }
.qi-del { width:34px; height:34px; border:none; background:transparent; color:var(--muted); font-size:1rem; cursor:pointer; border-radius:8px; }
.qi-del:hover { color:var(--danger); background:rgba(179,64,47,.08); }
.qi-add-bar { display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.6rem; }
input.qi-inp { padding:.45rem .65rem; font-size:.85rem; }
textarea.qi-desc { min-height:38px; padding:.45rem .65rem; font-size:.85rem; }

/* totals box */
.qe-totals { background:#211D18; color:#F3EAD9; border-radius:14px; padding:1.2rem 1.4rem; }
.qe-totals .trow { display:flex; justify-content:space-between; font-size:.88rem; padding:.3rem 0; }
.qe-totals .trow.grand { border-top:1px solid rgba(255,255,255,.15); margin-top:.5rem; padding-top:.7rem; font-size:1.05rem; font-weight:800; color:#E9C9A3; }
.qe-totals .tlabel { color:#BFB4A2; }

/* option pills */
.optrow { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.55rem 0; border-bottom:1px solid var(--border); font-size:.85rem; font-weight:600; }
.optrow:last-child { border-bottom:none; }
.switch { position:relative; width:40px; height:22px; flex-shrink:0; }
.switch input { opacity:0; width:0; height:0; }
.switch .sl { position:absolute; inset:0; background:#D8D2C8; border-radius:99px; cursor:pointer; transition:.2s; }
.switch .sl::before { content:""; position:absolute; width:16px; height:16px; left:3px; top:3px; background:#fff; border-radius:50%; transition:.2s; }
.switch input:checked + .sl { background:var(--accent); }
.switch input:checked + .sl::before { transform:translateX(18px); }

/* share modal-ish */
.sharebox { background:#E6F2E9; border:1px solid #BCDCC5; border-radius:12px; padding:.9rem 1.1rem; margin-bottom:1.2rem; font-size:.85rem; word-break:break-all; }

/* ---- MOBILE ---- */
@media (max-width:860px) {
  .nav-toggle { display:block; }
  .mainnav { display:none; position:absolute; top:62px; left:0; right:0; background:var(--card); border-bottom:1px solid var(--border); flex-direction:column; padding:.6rem; box-shadow:var(--shadow-md); }
  .mainnav.open { display:flex; }
  .userchip-name { display:none; }
  .qi-line2 { grid-template-columns:70px 100px 1fr 30px; }
  .page { padding:1.2rem .8rem 3rem; }
  table.list { font-size:.8rem; }
  table.list th, table.list td { padding:.6rem .6rem; }
}
