/* ══════════════════════════════════════════════════════════════════════
   Admin panel — Ink & Gold
   ══════════════════════════════════════════════════════════════════════
   The panel was built in a rose-and-cream palette with Georgia headings.
   The website it administers is ink, gold and Julius Sans One. Sunitha
   moves between the two all day, so they should feel like one product.

   This file only re-points the design tokens and the few places that hard
   -coded a colour. No layout is touched: every screen keeps its structure,
   so nothing can silently break while the panel changes clothes.
   ══════════════════════════════════════════════════════════════════════ */

:root{
  /* ground and paper — the website's cream, one step warmer for a work tool */
  --bg:#f4efe5;
  --paper:#fdfaf3;
  --ink:#241a12;
  --muted:#7b6a55;
  --line:#e6dccb;

  /* the accent is the website's gold; the old --rose names stay so that every
     existing rule keeps working and this file remains a palette swap */
  --rose:#8a6220;
  --rose-dark:#6d4b15;
  --gold:#b8873a;
  --green:#3f7a5c;
  --red:#9d4b45;
  --blue:#436079;
  --purple:#6a5292;

  --shadow:0 18px 45px rgba(51,35,18,.11);
  --soft:0 8px 24px rgba(51,35,18,.07);

  --dsp:"Julius Sans One",Georgia,serif;
  --ui:"Jost",Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}

body{font-family:var(--ui);background:var(--bg);color:var(--ink)}

/* every heading the panel calls "serif" is the website's display face */
.serif,
.panel-head h3,.settings-section h3,.modal-head h3,
.login-brand h1,.login-card h2,.stat-card strong,
.welcome h1,h1,h2,h3{
  font-family:var(--dsp);
  font-weight:400;
  letter-spacing:.055em;
}
.welcome h1{font-size:2.15rem;letter-spacing:.07em;line-height:1.24}
.stat-card strong{font-family:var(--dsp);letter-spacing:.02em;font-size:2.05rem}
.panel-head h3,.settings-section h3,.modal-head h3{letter-spacing:.06em}

/* ── the rail ───────────────────────────────────────────────────────── */
.sidebar{
  background:linear-gradient(180deg,#231810 0%,#2b1f14 46%,#1d140d 100%);
  color:#f2e6d3;
}
.side-brand{border-bottom-color:rgba(232,203,135,.16)}
.side-brand b{font-family:var(--dsp);letter-spacing:.10em;font-weight:400}
.side-brand small,.user-mini small{color:rgba(232,203,135,.62)}
.side-logo{
  background:linear-gradient(145deg,#e8cb87,#a97c2c);
  color:#241a12;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
}
.nav-title{color:rgba(232,203,135,.55);letter-spacing:.18em}
.nav-btn{color:#ded0bb;font-family:var(--ui);letter-spacing:.02em}
.nav-btn:hover{background:rgba(232,203,135,.09);color:#fbf3e4}
.nav-btn.active{
  background:linear-gradient(135deg,rgba(232,203,135,.20),rgba(232,203,135,.09));
  color:#fdf6e7;
  box-shadow:inset 0 0 0 1px rgba(232,203,135,.22);
}
.nav-btn .ico{color:#e8cb87}
.side-footer{border-top-color:rgba(232,203,135,.14)}
/* .avatar is the signed-in owner; .mini-avatar is the customer initials in
   every booking row — the second one kept the old rose and stood out as
   the one pink thing left on the screen */
.avatar,.mini-avatar{background:linear-gradient(145deg,#e8cb87,#a97c2c);color:#241a12}
.mini-avatar{font-weight:700}
.signout{color:rgba(240,228,208,.78)}
.signout:hover{color:#f6e9cd}

/* ── the strip and the bar ──────────────────────────────────────────── */
.preview-note{
  background:linear-gradient(90deg,#1d140d,#2b1f14 50%,#1d140d);
  color:#e8cb87;letter-spacing:.16em;
}
.topbar{
  background:rgba(250,246,238,.88);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  backdrop-filter:blur(18px) saturate(150%);
  border-bottom-color:rgba(198,180,150,.55);
}
.topbar h2{font-family:var(--dsp);font-weight:400;letter-spacing:.09em}

/* ── buttons ────────────────────────────────────────────────────────── */
.btn{font-family:var(--ui);letter-spacing:.04em;font-weight:600}
.btn.primary{
  background:linear-gradient(135deg,#8a6220,#b8873a 52%,#8a6220);
  color:#fdf8ee;
  box-shadow:0 8px 20px rgba(138,98,32,.24);
}
.btn.primary:hover{
  background:linear-gradient(135deg,#7a5619,#a97c2c 52%,#7a5619);
  box-shadow:0 10px 26px rgba(138,98,32,.32);
}
.btn.ghost{background:var(--paper);border-color:var(--line);color:var(--ink)}
.btn.ghost:hover{background:#fff8ec;border-color:#d8c49c}
.btn.soft{background:#f6ecd9;color:#6d4b15}
.btn.soft:hover{background:#f0e2c7}
.btn.danger{background:#fdf0ee;color:var(--red)}
.link-btn{color:var(--rose)}

/* ── surfaces ───────────────────────────────────────────────────────── */
.panel,.stat-card,.settings-section{
  background:var(--paper);
  border-color:var(--line);
  box-shadow:var(--soft);
}
.stat-icon{background:#f6ecd9;color:#8a6220}
.quick{background:#fffaf0;border-color:var(--line)}
.quick:hover{background:#fff4e2;border-color:#dfcda6}
.table th{background:#f8f1e4;color:#7b6a55;letter-spacing:.10em}
.table th,.table td{border-bottom-color:#efe6d6}
.table tbody tr:hover{background:#fffaf0}
.table-wrap{border-color:var(--line)}
.notice{background:#fdf5e6;border-color:#eadcbe;color:#6f5c3c}
.detail{background:#f9f2e5}
.day-row,.blocked{border-color:var(--line)}
.small-check,.checkrow input{accent-color:#8a6220}

/* ── fields ─────────────────────────────────────────────────────────── */
.field label{color:#4c3d2c;letter-spacing:.03em}
.field input,.field select,.field textarea{border-color:var(--line);background:#fffdf8}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:#c39c56;
  box-shadow:0 0 0 4px rgba(138,98,32,.11);
}
.search input,.filter{border-color:var(--line);background:#fffdf8}
:focus-visible{outline-color:rgba(138,98,32,.34)}

/* ── status pills, kept legible rather than merely tinted ───────────── */
.status.new{background:#fdf0d6;color:#7d5511}
.status.confirmed,.status.live,.status.paid,.status.delivered{background:#e8f3ec;color:#2f6650}
.status.pending,.status.reviewing{background:#f1ecfa;color:#5f4589}
.status.completed,.status.packed,.status.dispatched{background:#eaf1f6;color:#3b5f76}
.status.cancelled,.status.sold{background:#fdeeec;color:#95443f}
.status.low,.status.awaiting_payment{background:#fdf0d6;color:#7d5511}
.status.hidden{background:#efeae1;color:#6b6055}

/* ── the shop screen's own pieces ───────────────────────────────────── */
.seg{background:var(--paper);border-color:var(--line)}
.seg-btn{font-family:var(--ui)}
.seg-btn.active{
  background:linear-gradient(135deg,#8a6220,#b8873a 52%,#8a6220);
  box-shadow:0 6px 16px rgba(138,98,32,.20);
}
.bulkbar{background:#fdf5e6;border-color:#e8d8b6}
.piece-blank,.piece-cell img{background:#f2e8d6}
.notify-card{background:#fffaf0;border-color:var(--line)}
.order-item{background:var(--paper);border-color:var(--line)}
.order-hist div{background:#f9f2e5}

/* ── sign-in ────────────────────────────────────────────────────────── */
.login-screen{
  background:
    radial-gradient(circle at 16% 16%,#fffaf0 0,transparent 40%),
    linear-gradient(135deg,#f7f1e5,#efe4d3);
}
.login-brand h1 span{color:#8a6220}
.login-card{background:rgba(253,250,243,.97);border-color:rgba(184,135,58,.32)}
.login-point i{background:#f9f1e2;color:#8a6220}
.login-hint{background:#fdf5e6;color:#6f5c3c}

/* ── the one thing that must never blend in ─────────────────────────── */
.danger-zone{border-color:#e8c9c5;background:#fefaf9}