/* Zumřík systém — brand cukrárny (krémová + malinová) */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --cream:#FAF3EA; --paper:#fff; --cocoa:#2E2018; --cocoa2:#6E5A4B; --mut:#8A7460;
  --berry:#C13A5E; --berry-d:#A82C4E; --line:#EADFD2; --ok:#3D8E5A; --okbg:#EFF7F1;
  --warn:#E08A2E; --warnbg:#FBF3E6; --gold:#C9995C;
}
body { font-family:'Inter',system-ui,sans-serif; background:var(--cream); color:var(--cocoa); font-size:15px; }
a { color:var(--berry); text-decoration:none; }
.serif { font-family:'Fraunces',Georgia,serif; }
button { font:inherit; cursor:pointer; }
input, select, textarea { font:inherit; color:var(--cocoa); background:#fff; border:1.5px solid var(--line); border-radius:10px; padding:9px 12px; width:100%; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--berry); }
label { font-size:11px; font-weight:700; letter-spacing:1.2px; color:var(--cocoa2); display:block; margin:0 0 4px; }

/* layout */
.app { display:flex; min-height:100vh; }
.side { width:216px; flex:none; background:#fff; border-right:1px solid var(--line); padding:18px 14px; display:flex; flex-direction:column; gap:4px; position:sticky; top:0; height:100vh; }
.brand { display:flex; align-items:center; gap:10px; padding:4px 8px 16px; }
.mark { width:34px; height:34px; border-radius:50%; background:var(--berry); position:relative; flex:none; }
.mark::after { content:""; position:absolute; left:9px; top:9px; width:16px; height:16px; border-radius:50% 50% 50% 3px; background:var(--cream); }
.brand b { font-family:'Fraunces',serif; font-size:17px; line-height:1.1; }
.brand span { font-size:10px; letter-spacing:2px; color:var(--cocoa2); font-weight:600; }
.nav a { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:11px; color:#4E3B2E; font-weight:600; font-size:14px; }
.nav a.on, .nav a:hover { background:#FDF4F6; color:var(--berry); }
.side .spacer { flex:1; }
.me { border-top:1px solid var(--line); padding:12px 8px 4px; font-size:13px; }
.me b { display:block; }
.me span { color:var(--mut); font-size:11.5px; }
.main { flex:1; padding:22px 26px 60px; min-width:0; }
.tophead { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:18px; flex-wrap:wrap; }
h1 { font-family:'Fraunces',serif; font-size:26px; font-weight:600; }
.hsub { color:var(--cocoa2); font-size:13px; margin-top:3px; }

/* komponenty */
.btn { display:inline-flex; align-items:center; gap:8px; background:var(--berry); color:#fff; border:none; font-weight:700; font-size:14px; padding:11px 18px; border-radius:11px; }
.btn:hover { background:var(--berry-d); }
.btn.ghost { background:#fff; color:#4E3B2E; border:1.5px solid var(--line); font-weight:600; }
.btn.ok { background:var(--ok); }
.btn.mini { padding:6px 11px; font-size:12.5px; border-radius:9px; }
.card { background:#fff; border:1px solid var(--line); border-radius:14px; }
.card .cap { padding:12px 16px 8px; font-size:11px; font-weight:700; letter-spacing:1.4px; color:var(--cocoa2); display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.pad { padding:14px 16px; }
.zprava { background:var(--warnbg); border:1px solid #EFD9B8; color:#7A5A22; border-radius:11px; padding:10px 14px; margin-bottom:14px; font-size:13.5px; font-weight:500; }
.chip { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:#fff; border-radius:999px; padding:4px 11px; font-size:12px; font-weight:600; color:#4E3B2E; }
.stav { display:inline-block; font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; }
.stav.zapsan { background:#F1ECFB; color:#5B44B0; }
.stav.slozen { background:var(--warnbg); color:#9A6A1E; }
.stav.hotovo { background:var(--okbg); color:var(--ok); }
.stav.vydan { background:#EEEAE4; color:var(--mut); }
.badge-prov { font-size:10px; font-weight:700; padding:2px 8px; border-radius:999px; border:1px solid var(--line); }
.badge-prov.PDY { background:#fff; }
.badge-prov.LANY { background:#FBE9D8; border-color:#EFC9A0; color:#8A5A22; }
table.tbl { width:100%; border-collapse:collapse; font-size:13.5px; }
.tbl th { text-align:left; font-size:10.5px; letter-spacing:1px; color:var(--mut); font-weight:700; padding:8px 10px; border-bottom:1px solid var(--line); }
.tbl td { padding:9px 10px; border-bottom:1px solid #F3EDE3; vertical-align:middle; }
.tbl tr:hover td { background:#FDFAF5; }
.r { text-align:right; }

/* týdenní záložky (šanon) */
.tydny { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.tydny a { border:1px solid var(--line); background:#fff; border-radius:10px; padding:7px 13px; font-weight:700; font-size:13px; color:#4E3B2E; }
.tydny a.on { background:var(--berry); border-color:var(--berry); color:#fff; }
.tydny .sip { font-size:16px; padding:7px 11px; }

/* kapacita */
.kap { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
.kap .slot { background:#fff; border:1px solid var(--line); border-radius:11px; padding:9px 11px; }
.kap .slot b { font-size:12.5px; display:block; }
.kap .bar { height:7px; border-radius:99px; background:#F0E8DB; margin-top:7px; overflow:hidden; }
.kap .bar i { display:block; height:100%; background:var(--ok); border-radius:99px; }
.kap .bar i.plno { background:var(--berry); }
.kap small { color:var(--mut); font-size:11px; }

/* formulář zakázky */
.fgrid { display:grid; grid-template-columns:repeat(12,1fr); gap:12px; }
.fgrid > div { grid-column:span 3; }
.fgrid .s2{grid-column:span 2} .fgrid .s4{grid-column:span 4} .fgrid .s6{grid-column:span 6} .fgrid .s12{grid-column:span 12}
.sekce { margin-bottom:16px; }
.sekce .cap { padding-left:0; }
.pills { display:flex; gap:7px; flex-wrap:wrap; }
.pill { border:1.5px solid var(--line); background:#fff; border-radius:999px; padding:8px 14px; font-size:13px; font-weight:600; color:#4E3B2E; }
.pill.on { border-color:var(--berry); background:#FDF4F6; color:var(--berry); }
.check { display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:#4E3B2E; cursor:pointer; }
.check input { width:18px; height:18px; accent-color:var(--berry); }
#zakuskyTab td { padding:5px 6px; }
#zakuskyTab input, #zakuskyTab select { padding:7px 9px; }

/* nástěnka */
.board { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; align-items:start; }
.col { background:#F3ECE1; border-radius:14px; padding:10px; min-height:300px; }
.col h3 { font-size:12px; letter-spacing:1.4px; color:var(--cocoa2); padding:2px 6px 10px; display:flex; justify-content:space-between; }
.kz { background:#fff; border:1px solid var(--line); border-left:5px solid var(--berry); border-radius:11px; padding:10px 12px; margin-bottom:9px; display:block; color:var(--cocoa); }
.kz.lany { border-left-color:var(--gold); }
.kz b { font-size:14.5px; }
.kz .meta { color:var(--cocoa2); font-size:12px; margin-top:3px; line-height:1.45; }
.kz .mag { width:11px; height:11px; border-radius:50%; display:inline-block; vertical-align:-1px; border:1px solid rgba(0,0,0,.2); }

/* login */
.lwrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
.lbox { width:min(560px,100%); }
.lusers { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; margin:18px 0; }
.luser { background:#fff; border:1.5px solid var(--line); border-radius:14px; padding:14px; text-align:center; }
.luser.on { border-color:var(--berry); background:#FDF4F6; }
.luser b { display:block; font-size:15px; }
.luser span { font-size:11.5px; color:var(--mut); }
.pinpad { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; max-width:260px; margin:14px auto; }
.pinpad button { height:52px; font-size:19px; font-weight:700; background:#fff; border:1.5px solid var(--line); border-radius:12px; }
.pindots { display:flex; gap:10px; justify-content:center; margin:8px 0; }
.pindots i { width:12px; height:12px; border-radius:50%; background:#E7DBC9; }
.pindots i.on { background:var(--berry); }

@media (max-width: 900px) {
  .app { flex-direction:column; }
  .side { width:100%; height:auto; position:static; flex-direction:row; align-items:center; overflow-x:auto; padding:10px; }
  .side .brand { padding:0 10px 0 4px; } .side .brand span { display:none; }
  .nav { display:flex; gap:2px; } .nav a { padding:8px 10px; font-size:13px; white-space:nowrap; }
  .side .spacer, .me .r2 { display:none; } .me { border:none; padding:0 8px; white-space:nowrap; }
  .main { padding:14px 12px 80px; }
  .fgrid > div, .fgrid .s2, .fgrid .s4, .fgrid .s6 { grid-column:span 6; }
  .board { grid-template-columns:1fr 1fr; } .kap { grid-template-columns:repeat(2,1fr); }
}