/* Kalendář salonu — vzhled = kopie Reservia (screeny 12.7.2026, claude-files/reservio-screeny/) */
:root{
  --modra:#4a7fee; --modra-tm:#3567d6; --cervena:#e03131; --text:#20232a; --sede:#6b7280;
  --pozadi:#ececf0; --karta:#fff; --linka:#e5e7eb; --svetle:#f7f7f9; --zelena:#12b76a;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--pozadi);color:var(--text);font-size:15px}
a{color:var(--modra);text-decoration:none}
h1{font-size:1.55rem;margin:0}
small,.sede{color:var(--sede)}

/* horní lišta */
.hlava{display:flex;align-items:center;gap:8px;background:#fff;border-bottom:1px solid var(--linka);padding:0 16px;height:56px;position:sticky;top:0;z-index:40}
.hlava .logo{font-weight:800;color:var(--cervena);font-size:1.25rem;white-space:nowrap;margin-right:8px}
/* CALLIPEDA — zlaté logo na černé plaketce (nové logo 12.7.2026) */
.logo-cp{display:inline-flex;align-items:center;gap:8px;background:#0c0c0e;border-radius:10px;padding:5px 13px 5px 9px;margin-right:8px;white-space:nowrap}
.logo-cp .mono{font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:1.35rem;line-height:1;background:linear-gradient(160deg,#f6e27a 0%,#cb9b2e 45%,#a87700 60%,#f0d060 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo-cp .napis{font-family:Georgia,"Times New Roman",serif;font-size:.92rem;letter-spacing:.16em;background:linear-gradient(160deg,#f6e27a,#cb9b2e 60%,#e8c95a);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(max-width:600px){.logo-cp .napis{display:none}}
.hlava nav{display:flex;gap:6px;justify-content:center;flex:1;min-width:0;overflow-x:auto}
.hlava nav a{display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:8px;color:#444;font-weight:600;white-space:nowrap}
.hlava nav a.akt{color:var(--modra);background:#eef3fe}
.hlava .kdo{color:var(--sede);white-space:nowrap}

/* tlačítka a pole */
.btn{display:inline-flex;align-items:center;gap:7px;background:var(--modra);color:#fff;border:0;border-radius:8px;padding:10px 16px;font-weight:700;font-size:.92rem;cursor:pointer;text-align:center;justify-content:center}
.btn:hover{background:var(--modra-tm)}
.btn.obrys{background:#fff;color:var(--text);border:1px solid #d1d5db}
.btn.cerv{background:#fff;color:var(--cervena);border:1px solid #f3c2c2}
.btn.maly{padding:6px 10px;font-size:.85rem}
input,select,textarea{background:#fff;color:var(--text);border:1px solid #d1d5db;border-radius:8px;padding:9px 10px;font-size:.92rem;font-family:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid #bcd0f7;border-color:var(--modra)}
label.pole{display:block;margin-bottom:10px}
label.pole b{display:block;font-size:.83rem;margin-bottom:4px;font-weight:600}
label.chk{display:flex;align-items:center;gap:8px;font-size:.9rem;margin:6px 0}

/* rozvržení se sidebar */
.rozloz{display:flex;min-height:calc(100vh - 56px)}
.bok{width:230px;background:#fff;border-right:1px solid var(--linka);padding:12px;flex-shrink:0}
.obsah{flex:1;min-width:0;padding:18px}
.bok h4{margin:16px 4px 6px;font-size:.72rem;letter-spacing:.06em;color:var(--sede);text-transform:uppercase}
.bok .pol{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:8px;color:#333;font-size:.9rem;cursor:pointer}
.bok .pol.akt{background:#eef3fe;color:var(--modra);font-weight:700}
.bok .pol:hover{background:var(--svetle)}
.tecka{display:inline-block;width:11px;height:11px;border-radius:50%;flex-shrink:0}
.vlajka{display:inline-block;width:4px;height:14px;border-radius:2px;flex-shrink:0}

/* karty */
.karta{background:var(--karta);border:1px solid var(--linka);border-radius:12px;padding:16px;margin-bottom:14px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.karta h2{margin:0 0 12px;font-size:1.05rem}
.radek-sez{display:flex;align-items:center;gap:12px;padding:11px 4px;border-bottom:1px solid var(--svetle);cursor:pointer}
.radek-sez:hover{background:var(--svetle)}
.radek-sez:last-child{border-bottom:0}
.avatar{width:40px;height:40px;border-radius:50%;background:#e4e6ea;color:#444;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;position:relative}
.avatar.barevny{color:#fff}
.sipka{margin-left:auto;color:#c2c6cd}

/* kalendář */
.kal-hlava{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.kal-hlava .nadpis{font-size:1.25rem;font-weight:700;margin-right:auto}
.prepinac{display:flex;border:1px solid #d1d5db;border-radius:8px;overflow:hidden;background:#fff}
.prepinac a{padding:7px 14px;color:#444;font-size:.88rem;border-right:1px solid var(--linka)}
.prepinac a:last-child{border-right:0}
.prepinac a.akt{background:#eef3fe;color:var(--modra);font-weight:700}
.kal-wrap{overflow-x:auto;background:#fff;border:1px solid var(--linka);border-radius:12px}
.kal{display:grid;min-width:760px}
.kal .den-h{padding:8px 6px;text-align:center;border-bottom:1px solid var(--linka);border-left:1px solid var(--svetle);font-size:.85rem;color:#444;background:#fff;position:sticky;top:0}
.kal .den-h.dnes b{color:var(--modra)}
.kal .den-h b{display:block;font-size:1.05rem}
.sloupec{position:relative;border-left:1px solid #f0f0f3}
.sloupec.zavreno{background:repeating-linear-gradient(45deg,#f4f4f6 0 8px,#ededf0 8px 16px)}
.hodrada{border-top:1px solid #f0f0f3}
.hodpop{font-size:.72rem;color:#9aa0a8;text-align:right;padding-right:6px;transform:translateY(-7px)}
.smena{position:absolute;left:0;right:0;background:#fff;border-left:2px solid #dfe3ea}
.sloupec .pozadi-mimo{position:absolute;left:0;right:0;background:#f4f4f6}
.blok{position:absolute;left:3px;right:3px;border-radius:6px;padding:3px 6px;font-size:.74rem;line-height:1.25;overflow:hidden;color:#1f2430;border-left:4px solid rgba(0,0,0,.25);cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.07)}
.blok b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.76rem}
.blok.navrzena{outline:2px dashed var(--modra);outline-offset:-2px}
.blok.seda{background:#e8eaee;border-left-color:#9aa0a8;color:#555}
.lajna{position:absolute;left:0;right:0;height:2px;background:var(--cervena);z-index:5;pointer-events:none}
.lajna:before{content:"";position:absolute;left:-1px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--cervena)}

/* mini měsíc v sidebaru */
.mini{width:100%;border-collapse:collapse;margin-top:4px}
.mini th{font-size:.68rem;color:var(--sede);font-weight:600;padding:2px}
.mini td{text-align:center;padding:0}
.mini td a{display:block;padding:4px 2px;border-radius:6px;font-size:.78rem;color:#333}
.mini td a:hover{background:var(--svetle)}
.mini td a.dnes{color:var(--modra);font-weight:800}
.mini td a.vybrany{background:#eef3fe;color:var(--modra);font-weight:700}
.mini td a.mimo{color:#c4c8cf}

/* modal + drawer */
.zaclona{display:none;position:fixed;inset:0;background:rgba(15,18,25,.45);z-index:90}
.zaclona.zobraz{display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:30px 10px}
.modal{background:#fff;border-radius:14px;padding:20px;width:100%;max-width:480px;box-shadow:0 10px 40px rgba(0,0,0,.25)}
.modal h3{margin:0 0 14px;font-size:1.1rem}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,100%);background:#fff;box-shadow:-6px 0 30px rgba(0,0,0,.15);z-index:95;padding:18px;overflow-y:auto;display:none}
.drawer.zobraz{display:block}
.drawer h3{margin:0 0 14px;text-align:center}
.zavrit{background:none;border:0;font-size:1.4rem;cursor:pointer;color:#666;float:right;line-height:1}

/* hlášky, štítky */
.chyba{background:#fdecec;border:1px solid #f5b5b5;color:#8f1d1d;border-radius:10px;padding:10px 14px;margin-bottom:12px}
.info{background:#e8f6ee;border:1px solid #b3e2c7;color:#14532d;border-radius:10px;padding:10px 14px;margin-bottom:12px}
.stitek{display:inline-block;background:var(--svetle);border-radius:6px;padding:2px 8px;font-size:.78rem;color:#555;margin-right:4px}
.stitek.cerveny{background:#fdecec;color:#b42318}
.stitek.zeleny{background:#e8f6ee;color:#14532d}

/* statistiky */
.dlazdice{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:14px}
.dlazdice .d{background:#fff;border:1px solid var(--linka);border-radius:12px;padding:16px;text-align:center}
.dlazdice .d b{display:block;font-size:1.7rem}
.sloupg{display:flex;align-items:flex-end;gap:3px;height:130px;padding:6px 0}
.sloupg div{flex:1;background:var(--modra);border-radius:3px 3px 0 0;min-width:6px;position:relative}
.sloupg div span{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:.62rem;color:var(--sede)}
.pruh{display:flex;align-items:center;gap:8px;margin:6px 0}
.pruh .jm{width:110px;font-size:.85rem;text-align:right;flex-shrink:0}
.pruh .p{background:var(--modra);height:20px;border-radius:3px;color:#fff;font-size:.75rem;display:flex;align-items:center;justify-content:flex-end;padding:0 6px;min-width:24px}

/* mobil */
@media(max-width:820px){
  .bok{display:none}
  .bok.zobraz{display:block;position:fixed;left:0;top:56px;bottom:0;z-index:60;overflow-y:auto;box-shadow:4px 0 20px rgba(0,0,0,.15)}
  .obsah{padding:10px}
  .hlava nav a span{display:none}
  .hlava nav a{padding:8px 10px}
  .menu-tl{display:inline-flex!important}
}
.menu-tl{display:none;background:none;border:1px solid #d1d5db;border-radius:8px;padding:7px 10px;cursor:pointer}
