:root{
--cream:#F5F6F8;--cream2:#E8EBF0;--cream3:#D8DCE3;
--bd:#111827;--b:#1E293B;--bm:#64748B;--bl:#94A3B8;--blr:#CBD5E1;
--gold:#C7A94F;--gl:rgba(199,169,79,.12);--gd:#A8893A;
--w:#FFFFFF;--w2:#F9FAFB;
--red:#DC2626;--rl:#FEE2E2;--grn:#16A34A;--grl:#DCFCE7;
--blu:#2563EB;--bll:#DBEAFE;--org:#EA580C;--ol:#FED7AA;
--pur:#7C3AED;--pl:#EDE9FE;--gry:#9CA3AF;--gryl:#F3F4F6;
--sw:264px;--hh:64px;
--r:12px;--rs:8px;--rx:6px;
--sh:0 1px 3px rgba(0,0,0,.04),0 2px 8px rgba(0,0,0,.04);
--shl:0 4px 12px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.06);
--shx:0 8px 24px rgba(0,0,0,.08),0 24px 48px rgba(0,0,0,.1);
--e:cubic-bezier(.4,0,.2,1);--eb:cubic-bezier(.34,1.56,.64,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Outfit',sans-serif;background:var(--cream);color:var(--bd);overflow:hidden;height:100vh;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:'Outfit',sans-serif;font-weight:700}

/* LOGIN */
.lscreen{position:fixed;inset:0;background:var(--cream);display:flex;align-items:center;justify-content:center;z-index:10000;transition:opacity .6s var(--e),transform .6s var(--e)}.lscreen.hid{opacity:0;transform:scale(1.03);pointer-events:none}
.lbg{position:absolute;inset:0;overflow:hidden;opacity:.07}.lbg .geo{position:absolute;border:1.5px solid var(--gold);border-radius:50%;animation:gfloat 20s infinite ease-in-out}.lbg .geo:nth-child(1){width:300px;height:300px;top:10%;left:5%}.lbg .geo:nth-child(2){width:200px;height:200px;bottom:15%;right:10%;animation-delay:-5s;border-radius:30%}.lbg .geo:nth-child(3){width:400px;height:400px;top:50%;left:50%;transform:translate(-50%,-50%);animation-delay:-10s}
@keyframes gfloat{0%,100%{transform:translate(0,0) rotate(0deg)}25%{transform:translate(20px,-30px) rotate(5deg)}50%{transform:translate(-10px,20px) rotate(-3deg)}75%{transform:translate(15px,10px) rotate(2deg)}}
.lcard{text-align:center;width:400px;position:relative;z-index:1;max-height:90vh;overflow-y:auto}.lcard>*{opacity:0;animation:lrev .7s var(--e) forwards}
.lcard>*:nth-child(1){animation-delay:.1s}.lcard>*:nth-child(2){animation-delay:.2s}.lcard>*:nth-child(3){animation-delay:.25s}.lcard>*:nth-child(4){animation-delay:.35s}.lcard>*:nth-child(5){animation-delay:.45s}.lcard>*:nth-child(6){animation-delay:.55s}.lcard>*:nth-child(7){animation-delay:.65s}.lcard>*:nth-child(8){animation-delay:.7s}.lcard>*:nth-child(9){animation-delay:.75s}
@keyframes lrev{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.llogo{width:108px;height:108px;background:var(--b);border-radius:24px;margin:0 auto 28px;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 40px rgba(0,0,0,.2);position:relative}.llogo::after{content:'';position:absolute;inset:3px;border:1px solid rgba(255,255,255,.15);border-radius:21px}
.lcard h1{font-size:2.6rem;font-weight:700;letter-spacing:-.02em;margin-bottom:2px}.lcard .lsub{color:var(--bl);font-size:.9rem;margin-bottom:32px;letter-spacing:2px;text-transform:uppercase;font-weight:400}
.lfld{position:relative;margin-bottom:14px}.lfld input,.lfld select{width:100%;padding:14px 16px 14px 48px;border:1.5px solid var(--cream2);border-radius:var(--r);font-size:.92rem;font-family:inherit;background:var(--w);color:var(--bd);transition:all .25s var(--e);outline:none}.lfld input:focus,.lfld select:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(199,169,79,.12)}.lfld .fi{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--blr)}
.lfld select{appearance:none;cursor:pointer}
.lerr{color:var(--red);font-size:.82rem;margin-top:6px;display:none;font-weight:500}
.lbtn{width:100%;padding:16px;background:var(--b);color:#fff;border:none;border-radius:var(--r);font-size:.95rem;font-family:inherit;font-weight:600;cursor:pointer;margin-top:10px;transition:all .3s var(--e);letter-spacing:.75px}.lbtn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.lbtn.ldg{pointer-events:none;opacity:.7}.lbtn.ldg::after{content:'';width:18px;height:18px;border:2px solid transparent;border-top-color:#fff;border-radius:50%;display:inline-block;margin-left:8px;animation:spin .6s linear infinite;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}
.lhint{color:var(--blr);font-size:.72rem;margin-top:16px;line-height:1.6}

/* APP */
.app{display:none;height:100vh;opacity:0;transition:opacity .5s var(--e)}.app.vis{display:flex;opacity:1}

/* SIDEBAR */
.sb{width:var(--sw);background:linear-gradient(180deg,var(--bd) 0%,var(--b) 100%);color:#F1F5F9;display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;z-index:100}
.sb-brand{padding:20px 22px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:14px}
.sb-ico{width:44px;height:44px;background:var(--gold);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative}.sb-ico::after{content:'';position:absolute;inset:2px;border:1px solid rgba(255,255,255,.15);border-radius:10px}
.sb-brand h2{font-size:1.2rem;font-weight:600;letter-spacing:.3px}.sb-brand small{display:block;font-size:.62rem;color:var(--blr);letter-spacing:2px;text-transform:uppercase;margin-top:2px;font-family:'Outfit';font-weight:400}
.sb-nav{flex:1;padding:14px 12px;overflow-y:auto}.sb-nav::-webkit-scrollbar{width:0}
.nlbl{font-size:.58rem;text-transform:uppercase;letter-spacing:2.5px;color:var(--blr);padding:16px 12px 6px;opacity:.5;font-weight:600}
.ni{display:flex;align-items:center;gap:11px;padding:10px 13px;border-radius:var(--rs);cursor:pointer;transition:all .2s var(--e);color:rgba(255,255,255,.5);font-size:.84rem;font-weight:400;position:relative;margin-bottom:1px}
.ni:hover{background:rgba(255,255,255,.06);color:rgba(255,255,255,.8)}.ni.act{background:var(--gl);color:var(--gold);font-weight:600}
.ni.act::before{content:'';position:absolute;left:0;top:7px;bottom:7px;width:3px;background:var(--gold);border-radius:2px}
.ni svg{width:17px;height:17px;flex-shrink:0;opacity:.55}.ni.act svg{opacity:1;color:var(--gold)}
.ni .nbg{margin-left:auto;background:var(--gold);color:#fff;font-size:.62rem;font-weight:700;padding:2px 7px;border-radius:10px}

.ni.admin-only{display:none}
.ni.manager-only{display:none}
.is-admin .ni.admin-only{display:flex}
.is-admin .ni.manager-only{display:flex}
.is-manager .ni.manager-only{display:flex}
.sb-ft{padding:14px 18px;border-top:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:11px}
.av{width:36px;height:36px;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.72rem;color:#fff;flex-shrink:0}
.sb-ft .un{font-size:.82rem;font-weight:500;color:var(--cream)}.sb-ft .ur{font-size:.65rem;color:var(--blr)}
.lout{background:none;border:none;color:rgba(255,255,255,.3);cursor:pointer;padding:7px;border-radius:var(--rx);transition:all .2s;margin-left:auto}.lout:hover{color:var(--red);background:rgba(255,255,255,.06)}

/* MAIN */
.mn{margin-left:var(--sw);flex:1;display:flex;flex-direction:column;height:100vh}
.hd{height:var(--hh);background:var(--w);border-bottom:1px solid rgba(44,24,16,.05);display:flex;align-items:center;padding:0 28px;gap:14px;flex-shrink:0}
.hd-t{font-size:1.35rem;font-weight:700;flex:1;letter-spacing:-.01em}
.hd-d{font-size:.78rem;color:var(--bl);display:flex;align-items:center;gap:6px}.hd-d .ld{width:6px;height:6px;border-radius:50%;animation:pls 2s infinite}.ld.sync-online{background:var(--grn)}.ld.sync-offline{background:var(--red)}.ld.sync-loading{background:var(--org)}
@keyframes pls{0%,100%{opacity:1}50%{opacity:.4}}
.hd-a{display:flex;align-items:center;gap:6px}
.ctog{display:flex;background:var(--cream);border-radius:20px;padding:3px;font-size:.72rem;border:1px solid var(--cream2)}.ctog button{padding:4px 11px;border:none;background:none;border-radius:17px;cursor:pointer;font-family:inherit;font-weight:600;font-size:.72rem;color:var(--bl);transition:all .2s var(--e)}.ctog button.act{background:var(--gold);color:#fff}
.ib{width:38px;height:38px;border:1px solid var(--cream2);background:var(--w2);border-radius:var(--rs);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--bm);transition:all .2s var(--e);position:relative}.ib:hover{background:var(--cream);color:var(--b)}
.nd{position:absolute;top:6px;right:6px;width:8px;height:8px;background:var(--red);border-radius:50%;border:2px solid var(--w)}

/* PERIOD TABS */
.period-tab{padding:8px 16px;border:none;background:none;border-radius:var(--rx);cursor:pointer;font-family:inherit;font-size:.84rem;font-weight:500;color:var(--bl);transition:all .2s var(--e)}.period-tab:hover{background:var(--cream);color:var(--b)}.period-tab.active{background:var(--gold);color:#fff;font-weight:600}
.ct{flex:1;overflow-y:auto;padding:24px 28px;scroll-behavior:smooth}
.pg{display:none}.pg.act{display:block}
.pg.act>*{animation:si .45s var(--e) both}.pg.act>*:nth-child(1){animation-delay:.03s}.pg.act>*:nth-child(2){animation-delay:.07s}.pg.act>*:nth-child(3){animation-delay:.11s}.pg.act>*:nth-child(4){animation-delay:.15s}.pg.act>*:nth-child(5){animation-delay:.19s}.pg.act>*:nth-child(6){animation-delay:.23s}
@keyframes si{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* STATS */
.sg{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:22px}
.sc{background:var(--w);border-radius:var(--r);padding:20px;box-shadow:var(--sh);transition:all .25s var(--e);position:relative;overflow:hidden;border:1px solid rgba(44,24,16,.03)}.sc:hover{transform:translateY(-2px);box-shadow:var(--shl)}
.sc .ac{position:absolute;top:0;left:0;right:0;height:3px;border-radius:3px 3px 0 0}
.sc.cb .ac{background:linear-gradient(90deg,var(--blu),#4A9EE0)}.sc.cg .ac{background:linear-gradient(90deg,var(--grn),#4EC080)}.sc.co .ac{background:linear-gradient(90deg,var(--gold),#34D399)}.sc.cr .ac{background:linear-gradient(90deg,var(--org),#E8A050)}.sc.cn .ac{background:linear-gradient(90deg,var(--b),var(--bm))}
.si2{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.cb .si2{background:var(--bll);color:var(--blu)}.cg .si2{background:var(--grl);color:var(--grn)}.co .si2{background:var(--gl);color:var(--gold)}.cr .si2{background:var(--ol);color:var(--org)}.cn .si2{background:var(--cream2);color:var(--b)}
.sv{font-family:'Playfair Display',serif;font-size:1.95rem;font-weight:800;line-height:1;margin-bottom:3px;letter-spacing:-.02em}.sl{font-size:.74rem;color:var(--bl);font-weight:500}.sch{font-size:.68rem;margin-top:8px;display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;font-weight:600}.sch.up{color:var(--grn);background:var(--grl)}.sch.dn{color:var(--red);background:var(--rl)}

/* CARD */
.cd{background:var(--w);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:16px;overflow:hidden;border:1px solid rgba(44,24,16,.03)}
.ch{padding:16px 20px;border-bottom:1px solid rgba(44,24,16,.05);display:flex;align-items:center;justify-content:space-between;gap:12px}.ch h3{font-size:1.05rem;font-weight:700}.cb2{padding:20px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}

/* TABLE */
table{width:100%;border-collapse:collapse}th{text-align:left;padding:10px 14px;font-size:.66rem;text-transform:uppercase;letter-spacing:1.2px;color:var(--bl);font-weight:600;border-bottom:1px solid rgba(44,24,16,.06);white-space:nowrap;font-family:'Outfit'}
td{padding:12px 14px;font-size:.84rem;border-bottom:1px solid rgba(44,24,16,.03);white-space:nowrap}tr{transition:background .15s}tr:hover td{background:rgba(246,241,233,.5)}
.bd{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:600}.bd.confirmed,.bd.reserved{background:var(--bll);color:var(--blu)}.bd.checked-in,.bd.paid{background:var(--grl);color:var(--grn)}.bd.pending,.bd.partial{background:var(--ol);color:var(--org)}.bd.cancelled,.bd.unpaid,.bd.dirty{background:var(--rl);color:var(--red)}.bd.maintenance{background:var(--ol);color:var(--org)}.bd.available{background:var(--grl);color:var(--grn)}.bd.occupied{background:var(--bll);color:var(--blu)}.bdt{width:5px;height:5px;border-radius:50%;background:currentColor}

/* BUTTONS */
.bt{padding:9px 18px;border:none;border-radius:var(--rs);font-family:inherit;font-size:.82rem;font-weight:500;cursor:pointer;transition:all .2s var(--e);display:inline-flex;align-items:center;gap:7px;white-space:nowrap}.bt svg{width:14px;height:14px}
.bp{background:var(--gold);color:#fff}.bp:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.15)}
.bs{background:var(--cream);color:var(--bd);border:1px solid var(--cream2)}.bs:hover{background:var(--cream2)}
.bok{background:var(--grn);color:white}.bok:hover{background:#258A4F}
.bno{background:var(--red);color:white}.bno:hover{background:#9E3228}
.bsm{padding:5px 12px;font-size:.74rem;border-radius:var(--rx)}
.bic{width:32px;height:32px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:var(--rx);background:var(--cream);border:1px solid var(--cream2);cursor:pointer;transition:all .2s var(--e);color:var(--bm)}.bic:hover{background:var(--cream2);color:var(--b)}

/* FORMS */
.fg{margin-bottom:12px}.fg label{display:block;font-size:.74rem;font-weight:600;color:var(--bm);margin-bottom:4px;letter-spacing:.3px}
.fc{width:100%;padding:9px 13px;border:1.5px solid var(--cream2);border-radius:var(--rs);font-family:inherit;font-size:.84rem;color:var(--bd);background:var(--w);transition:all .2s var(--e);outline:none}.fc:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(199,169,79,.1)}
select.fc{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23A68B6B' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}
textarea.fc{resize:vertical;min-height:60px}.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* MODAL */
.mo{position:fixed;inset:0;background:rgba(44,24,16,.45);backdrop-filter:blur(6px);z-index:5000;display:none;align-items:center;justify-content:center}.mo.act{display:flex}
.ml{background:var(--w);border-radius:var(--r);width:92%;max-width:640px;max-height:88vh;overflow-y:auto;box-shadow:var(--shx);animation:msl .3s var(--eb)}
.ml.wide{max-width:800px}
@keyframes msl{from{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
.mh{padding:20px 24px;border-bottom:1px solid rgba(44,24,16,.05);display:flex;align-items:center;justify-content:space-between}.mh h3{font-size:1.15rem;font-weight:700}
.mc{background:none;border:none;cursor:pointer;color:var(--bl);padding:6px;border-radius:var(--rx);transition:all .2s}.mc:hover{color:var(--bd);background:var(--cream)}
.mb{padding:24px}.mf{padding:14px 24px;border-top:1px solid rgba(44,24,16,.05);display:flex;justify-content:flex-end;gap:8px}

/* ROOMS */
.rg{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.rt{background:var(--w);border:2px solid var(--cream2);border-radius:var(--r);padding:14px 10px;text-align:center;cursor:pointer;transition:all .25s var(--e);position:relative;overflow:hidden}
.rt:hover{transform:translateY(-3px);box-shadow:var(--shl)}
.rt::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.rt.occupied{border-color:rgba(42,108,176,.3);background:var(--bll)}.rt.occupied::before{background:var(--blu)}
.rt.available{border-color:rgba(45,139,87,.3);background:var(--grl)}.rt.available::before{background:var(--grn)}
.rt.maintenance{border-color:rgba(201,120,32,.3);background:var(--ol)}.rt.maintenance::before{background:var(--org)}
.rt.dirty{border-color:rgba(184,59,46,.3);background:var(--rl)}.rt.dirty::before{background:var(--red)}
.rt.reserved{border-color:rgba(123,78,173,.3);background:var(--pl)}.rt.reserved::before{background:var(--pur)}
.rn{font-family:'Playfair Display',serif;font-size:1.5rem;font-weight:800;margin-bottom:2px}.rty{font-size:.62rem;color:var(--bl);text-transform:uppercase;letter-spacing:1.2px;margin-bottom:5px;font-weight:500}.rgs{font-size:.74rem;font-weight:500;color:var(--bd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlg{display:flex;gap:14px;margin-bottom:14px;flex-wrap:wrap}.rli{display:flex;align-items:center;gap:5px;font-size:.76rem;color:var(--bm);font-weight:500}
.ldt{width:10px;height:10px;border-radius:3px}.ldt.available{background:var(--grn)}.ldt.occupied{background:var(--blu)}.ldt.reserved{background:var(--pur)}.ldt.maintenance{background:var(--org)}.ldt.dirty{background:var(--red)}
.ftb{display:flex;gap:6px;margin-bottom:16px}.ft{padding:6px 16px;border-radius:20px;background:var(--cream);border:1px solid var(--cream2);font-size:.78rem;font-weight:500;cursor:pointer;transition:all .2s var(--e);font-family:inherit;color:var(--bm)}.ft:hover{background:var(--cream2)}.ft.act{background:var(--gold);color:#fff;border-color:var(--gold)}

/* SEARCH */
.sbar{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.sw{position:relative;flex:1;min-width:180px}.sw svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--blr);width:15px;height:15px;pointer-events:none}
.sin{width:100%;padding:9px 13px 9px 38px;border:1.5px solid var(--cream2);border-radius:var(--rs);font-family:inherit;font-size:.84rem;background:var(--w);outline:none;transition:all .2s var(--e);color:var(--bd)}.sin:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(199,169,79,.1)}

/* GUEST */
.gm{display:flex;align-items:center;gap:9px}.ga{width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,var(--cream2),var(--cream3));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.7rem;color:var(--b);flex-shrink:0}.gnm{font-weight:600;font-size:.84rem}.gdt{font-size:.7rem;color:var(--bl)}

/* QUICK */
.qa{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px}
.qi{background:var(--w);border-radius:var(--r);padding:18px;display:flex;align-items:center;gap:12px;cursor:pointer;border:1.5px solid transparent;transition:all .25s var(--e);box-shadow:var(--sh)}
.qi:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--shl)}
.qico{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.qico.grn{background:var(--grl);color:var(--grn)}.qico.blu{background:var(--bll);color:var(--blu)}.qico.gld{background:var(--gl);color:var(--gd)}.qico.org{background:var(--ol);color:var(--org)}
.qtx h4{font-family:'Outfit';font-size:.84rem;font-weight:600}.qtx p{font-size:.7rem;color:var(--bl);margin-top:1px}

/* TIMELINE */
.tl{position:relative;padding-left:26px}.tl::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--cream2),var(--cream3))}
.ti{position:relative;padding-bottom:18px}.ti:last-child{padding-bottom:0}
.ti::before{content:'';position:absolute;left:-22px;top:3px;width:11px;height:11px;border-radius:50%;border:2.5px solid var(--w);box-shadow:0 0 0 1px var(--cream2)}
.ti.ci::before{background:var(--grn)}.ti.co::before{background:var(--red)}.ti.py::before{background:var(--gold)}
.tt{font-size:.68rem;color:var(--bl);margin-bottom:2px;font-weight:500}.tc{font-size:.84rem}

/* OCCUPANCY */
.ob{height:30px;background:var(--cream);border-radius:15px;overflow:hidden;display:flex;margin:14px 0}.os{height:100%;display:flex;align-items:center;justify-content:center;font-size:.64rem;font-weight:600;color:white;transition:width .8s var(--e)}
.os.occupied{background:linear-gradient(90deg,var(--blu),#4A9EE0)}.os.reserved{background:linear-gradient(90deg,var(--pur),#9B70C9)}.os.available{background:linear-gradient(90deg,var(--grn),#4EC080)}.os.maintenance{background:var(--org)}

/* TABS */
.tbs{display:flex;border-bottom:2px solid var(--cream2);margin-bottom:16px}.tb{padding:9px 20px;background:none;border:none;border-bottom:2.5px solid transparent;margin-bottom:-2px;font-family:inherit;font-size:.84rem;color:var(--bl);cursor:pointer;transition:all .2s;font-weight:500}.tb:hover{color:var(--b)}.tb.act{color:var(--gold);border-bottom-color:var(--gold);font-weight:600}

/* NOTIF */
.np{position:fixed;right:-380px;top:0;bottom:0;width:380px;background:var(--w);box-shadow:-8px 0 40px rgba(44,24,16,.12);z-index:200;transition:right .35s var(--e);display:flex;flex-direction:column}.np.opn{right:0}
.nph{padding:20px;border-bottom:1px solid rgba(44,24,16,.05);display:flex;align-items:center;justify-content:space-between}.npb{flex:1;overflow-y:auto;padding:10px}
.nti{padding:12px 14px;border-radius:var(--rs);margin-bottom:3px;cursor:pointer;transition:all .15s;border-left:3px solid transparent}.nti:hover{background:var(--cream)}.nti.unr{background:rgba(199,169,79,.06);border-left-color:var(--gold)}
.ntt{font-size:.82rem;font-weight:600;margin-bottom:2px}.ntd{font-size:.74rem;color:var(--bl)}.ntm{font-size:.66rem;color:var(--gry);margin-top:3px}

/* INLINE EDIT */
.ie{background:var(--cream);border:1px solid var(--cream2);border-radius:var(--rs);padding:14px 16px;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;transition:all .2s}
.ie:hover{border-color:var(--blr)}.ie-l{font-size:.84rem;font-weight:500}.ie-r{display:flex;align-items:center;gap:6px}

/* SCROLLBAR */
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--blr);border-radius:3px}

/* TOAST */
#toast{position:fixed;bottom:24px;right:24px;background:var(--bd);color:#F1F5F9;padding:13px 20px;border-radius:var(--rs);box-shadow:var(--shx);font-size:.84rem;font-weight:500;z-index:9999;opacity:0;transform:translateY(12px);transition:all .35s var(--eb);pointer-events:none;display:flex;align-items:center;gap:9px;border-left:3px solid var(--gold);max-width:380px}

/* CONFIRM DIALOG */
.cdlg{position:fixed;inset:0;background:rgba(44,24,16,.5);backdrop-filter:blur(4px);z-index:8000;display:none;align-items:center;justify-content:center}.cdlg.act{display:flex}
.cdlg-b{background:var(--w);border-radius:var(--r);padding:28px;max-width:400px;width:90%;text-align:center;box-shadow:var(--shx);animation:msl .3s var(--eb)}
.cdlg-b h4{font-size:1.1rem;margin-bottom:8px}.cdlg-b p{font-size:.86rem;color:var(--bl);margin-bottom:20px}
.cdlg-b .btns{display:flex;gap:8px;justify-content:center}

/* ADMIN TAG */
.admin-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:10px;font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.admin-tag.admin{background:var(--rl);color:var(--red)}.admin-tag.manager{background:var(--ol);color:var(--org)}.admin-tag.receptionist{background:var(--bll);color:var(--blu)}

/* =================== MOBILE HAMBURGER =================== */
.mob-header{display:none;position:fixed;top:0;left:0;right:0;height:56px;background:linear-gradient(145deg,var(--bd),var(--b));z-index:150;align-items:center;padding:0 16px;gap:12px}
.mob-header .sb-ico{width:36px;height:36px;border-radius:10px}
.mob-header h2{color:var(--cream);font-size:1.05rem;flex:1}
.mob-header small{color:var(--blr);font-size:.6rem;letter-spacing:1.5px;text-transform:uppercase;display:block;margin-top:1px}
.ham{background:none;border:none;color:var(--cream);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center}
.sb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99;opacity:0;transition:opacity .3s var(--e)}.sb-overlay.vis{opacity:1}

/* =================== RESPONSIVE — TABLETS (≤1024px) =================== */
@media(max-width:1024px){
  :root{--sw:220px}
  .ni{font-size:.78rem;padding:9px 11px}.ni svg{width:15px;height:15px}
  .sb-brand{padding:16px 18px}.sb-brand h2{font-size:1.05rem}
  .qa{grid-template-columns:repeat(2,1fr)}
  .g2{grid-template-columns:1fr}
  .g3{grid-template-columns:1fr 1fr}
  .ct{padding:20px}
  .hd{padding:0 20px}
}

/* =================== RESPONSIVE — MOBILE (≤768px) =================== */
@media(max-width:768px){
  :root{--sw:272px}
  
  /* Prevent horizontal overflow globally */
  html,body{overflow-x:hidden;max-width:100vw}
  .pg,.ct,.mn{max-width:100vw;overflow-x:hidden}
  
  /* Show mobile header, hide desktop sidebar by default */
  .mob-header{display:flex}
  .sb{transform:translateX(-100%);transition:transform .3s var(--e)}
  .sb.mob-open{transform:translateX(0)}
  .sb-overlay.vis{display:block}
  
  /* Main content takes full width */
  .mn{margin-left:0;padding-top:56px}
  
  /* Header adjustments */
  .hd{height:auto;min-height:52px;padding:10px 16px;flex-wrap:wrap;gap:8px}
  .hd-t{font-size:1rem;width:100%;order:-1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hd-d{font-size:.65rem;display:none}
  .hd-a{margin-left:auto}
  #gsInput{max-width:120px;font-size:.75rem}
  
  /* Content area */
  .ct{padding:14px 12px}
  
  /* Stats grid */
  .sg{grid-template-columns:repeat(2,1fr);gap:8px}
  .sc{padding:14px}.sv{font-size:1.5rem}
  
  /* Quick actions */
  .qa{grid-template-columns:1fr 1fr;gap:8px}
  .qi{padding:14px 10px;flex-direction:column;text-align:center;gap:8px}
  .qtx h4{font-size:.76rem}.qtx p{display:none}
  
  /* Grids */
  .g2,.g3{grid-template-columns:1fr}
  .fr{grid-template-columns:1fr}
  
  /* Room grid */
  .rg{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}
  .rt{padding:10px 6px}.rn{font-size:1.2rem}.rty{font-size:.55rem}
  
  /* Tables — horizontal scroll */
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  thead,tbody,tr{display:table;width:100%;table-layout:auto}
  thead{display:table-header-group}
  
  /* Cards */
  .cd{margin-bottom:10px}
  .ch{padding:12px 14px}.ch h3{font-size:.92rem}
  .cb2{padding:14px}
  
  /* Buttons */
  .bt{padding:8px 14px;font-size:.76rem;max-width:100%}
  .sbar{flex-direction:column;gap:8px}
  .sw{min-width:100%;width:100%}
  
  /* Prevent ANY child from overflowing */
  .pg *{max-width:100%;box-sizing:border-box}
  select,input,textarea{max-width:100%}
  
  /* Force all inline flex to wrap */
  [style*="display:flex"]{flex-wrap:wrap !important}
  
  /* Tables always scrollable */
  table{font-size:.75rem}
  td,th{padding:8px 6px;white-space:nowrap}
  
  /* Floor filter tabs */
  .ftb{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  .ftb::-webkit-scrollbar{display:none}
  .ft{flex-shrink:0}
  
  /* Room legend */
  .rlg{gap:8px;font-size:.7rem}
  
  /* Modals */
  .ml{width:96%;max-width:none;max-height:92vh;border-radius:var(--rs)}
  .mb{padding:16px}.mh{padding:14px 16px}.mf{padding:10px 16px}
  
  /* Inline grids — force single column */
  [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important}
  
  /* Checkout guest cards — no overflow */
  .ie{flex-wrap:wrap !important}
  .ie-l,.ie-r{width:100% !important;min-width:0 !important}
  .ie-r{justify-content:flex-start !important;gap:8px !important;margin-top:6px}

  /* Notifications panel */
  .np{width:100%;right:-100%}
  
  /* Login */
  .lcard{width:90%;max-width:360px;padding:0 12px}
  .lcard h1{font-size:2rem}
  .llogo{width:80px;height:80px;border-radius:18px;margin-bottom:20px}
  
  /* Occupancy bar */
  .ob{height:24px}
  
  /* Toast */
  #toast{left:12px;right:12px;bottom:16px;max-width:none}
  
  /* Search bar buttons */
  .sbar .bt{width:100%}
  
  /* Sidebar footer in mobile */
  .sb-ft{padding:12px 16px}
}

/* =================== RESPONSIVE — SMALL PHONES (≤480px) =================== */
@media(max-width:480px){
  .sg{grid-template-columns:1fr 1fr;gap:6px}
  .sc{padding:12px}.sv{font-size:1.3rem}.sl{font-size:.66rem}
  .qa{grid-template-columns:1fr 1fr;gap:6px}
  .qi{padding:10px 8px}
  .qico{width:36px;height:36px;border-radius:10px}
  .rg{grid-template-columns:repeat(auto-fill,minmax(85px,1fr));gap:6px}
  .rt{padding:8px 4px}.rn{font-size:1rem}
  .hd-t{font-size:1rem}
  .ct{padding:10px 8px}
  td,th{padding:8px 10px;font-size:.72rem}
  /* Modal full width on small phones */
  .ml{width:100%;max-width:100%;margin:0;border-radius:var(--rs) var(--rs) 0 0;max-height:95vh;position:fixed;bottom:0}
  /* Checkout guest cards */
  .co-guest-card{padding:10px !important}
  .co-guest-card *{font-size:.78rem}
}

/* =================== NEW FEATURES CSS =================== */

/* Calendar View */
.cal-nav {
  display: flex;
  align-items: center;
  gap: 16px;
}

.cal-title {
  font-size: 1.2rem;
  font-weight: 600;
  margin: 0;
  min-width: 180px;
  text-align: center;
}

.cal-legend {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
}

.cal-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
}

.cal-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.cal-dot.occupied { background: var(--blu); }
.cal-dot.reserved { background: var(--pur); }
.cal-dot.available { background: var(--grn); }
.cal-dot.maintenance { background: var(--org); }

.cal-container {
  overflow-x: auto;
  max-width: 100%;
}

.cal-grid {
  display: flex;
  flex-direction: column;
  min-width: 800px;
}

.cal-header {
  display: flex;
  background: var(--cream2);
  border-radius: var(--rx) var(--rx) 0 0;
}

.cal-room-header {
  width: 120px;
  padding: 12px;
  font-weight: 600;
  border-right: 1px solid var(--cream3);
}

.cal-day-header {
  flex: 1;
  min-width: 40px;
  padding: 8px 4px;
  text-align: center;
  font-size: 0.8rem;
  border-right: 1px solid var(--cream3);
}

.cal-day-header.today {
  background: var(--gl);
  color: var(--bd);
  font-weight: 600;
}

.cal-day-num {
  font-weight: 600;
  font-size: 0.9rem;
}

.cal-row {
  display: flex;
  border-bottom: 1px solid var(--cream2);
}

.cal-room-cell {
  width: 120px;
  padding: 12px;
  border-right: 1px solid var(--cream2);
  display: flex;
  flex-direction: column;
}

.cal-room-num {
  font-weight: 600;
  font-size: 0.95rem;
}

.cal-room-type {
  font-size: 0.75rem;
  color: var(--bl);
}

.cal-cell {
  flex: 1;
  min-width: 40px;
  min-height: 50px;
  border-right: 1px solid var(--cream2);
  cursor: pointer;
  transition: all 0.2s var(--e);
  display: flex;
  align-items: center;
  justify-content: center;
}

.cal-cell:hover {
  background: var(--cream3);
}

.cal-cell.occupied { background: rgba(42, 108, 176, 0.1); border-left: 3px solid var(--blu); }
.cal-cell.reserved { background: rgba(123, 78, 173, 0.1); border-left: 3px solid var(--pur); }
.cal-cell.available { background: rgba(45, 139, 87, 0.05); }
.cal-cell.maintenance { background: rgba(201, 120, 32, 0.1); border-left: 3px solid var(--org); }
.cal-cell.cal-past { opacity: 0.35; cursor: default; }

.cal-cell-content {
  text-align: center;
  font-size: 0.75rem;
  padding: 2px;
}

.cal-guest-name {
  font-weight: 500;
  color: var(--bd);
}

/* Housekeeping Styles */
.filter-group {
  display: flex;
  gap: 6px;
}

.filter-group .bt {
  padding: 6px 12px;
  font-size: 0.85rem;
}

.sbar-left, .sbar-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

.housekeeping-task-row:hover {
  background: var(--cream2);
}

/* Night Audit Styles */
.audit-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
  margin-bottom: 20px;
}

.audit-stat-group h4 {
  margin: 0 0 12px;
  font-size: 1rem;
  color: var(--bd);
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 12px;
}

.stat-item {
  text-align: center;
  padding: 12px;
  background: var(--w);
  border-radius: var(--rx);
  border: 1px solid var(--cream2);
}

.stat-value {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--bd);
  margin-bottom: 4px;
}

.stat-label {
  font-size: 0.8rem;
  color: var(--bl);
}

.audit-warnings {
  margin: 20px 0;
}

.audit-warnings h4 {
  margin: 0 0 12px;
  font-size: 0.95rem;
}

.warning-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  margin-bottom: 6px;
  border-radius: var(--rx);
  font-size: 0.85rem;
}

.warning-item.success {
  background: var(--grl);
  color: var(--grn);
}

.warning-item.warning {
  background: var(--ol);
  color: var(--org);
}

.warning-item.error {
  background: var(--rl);
  color: var(--red);
}

.warning-item.info {
  background: var(--bll);
  color: var(--blu);
}

.audit-actions {
  text-align: center;
}

.audit-actions textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--cream2);
  border-radius: var(--rx);
  resize: vertical;
  font-family: inherit;
  font-size: 0.9rem;
}

.audit-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}

.audit-detail-section {
  padding: 15px;
  background: var(--cream2);
  border-radius: var(--rx);
}

.audit-detail-section h4 {
  margin: 0 0 10px;
  font-size: 0.95rem;
}

.audit-detail-section p {
  margin: 6px 0;
  font-size: 0.85rem;
}

/* Reports Enhancements */
.date-range-picker {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.date-range-picker label {
  font-weight: 500;
  font-size: 0.9rem;
}

.date-range-picker input[type="date"] {
  padding: 6px 8px;
  border: 1px solid var(--cream2);
  border-radius: var(--rx);
  font-size: 0.85rem;
}

.breakdown-section {
  margin-bottom: 20px;
}

.breakdown-section h4 {
  margin: 0 0 12px;
  font-size: 0.95rem;
}

.breakdown-list {
  space-y: 8px;
}

.breakdown-item {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--cream2);
}

.breakdown-label {
  font-size: 0.9rem;
}

.breakdown-value {
  font-weight: 600;
  color: var(--gold);
}

.breakdown-bar {
  grid-column: 1 / -1;
  height: 4px;
  background: var(--cream2);
  border-radius: 2px;
  margin-top: 4px;
  overflow: hidden;
}

.breakdown-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold), var(--gd));
  border-radius: 2px;
  transition: width 0.3s var(--e);
}

.chart-container {
  padding: 20px 0;
}

.daily-chart {
  width: 100%;
}

.chart-bars {
  background: var(--w);
  border: 1px solid var(--cream2);
  border-radius: var(--rx);
}

.chart-bar {
  position: relative;
}

.chart-bar:hover .chart-bar-fill {
  opacity: 0.8;
}

/* Guest Enhancements */
.form-row {
  margin-bottom: 15px;
}

.form-row label {
  display: block;
  font-weight: 500;
  margin-bottom: 4px;
  font-size: 0.9rem;
}

.form-row input,
.form-row select,
.form-row textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--cream2);
  border-radius: var(--rx);
  font-size: 0.9rem;
  font-family: inherit;
}

.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(199, 169, 79, 0.1);
}

/* Enhanced Badges */
.bd.gold {
  background: rgba(199, 169, 79, 0.1);
  color: var(--gd);
  border: 1px solid rgba(199, 169, 79, 0.2);
}

/* Mobile Responsiveness for New Features */
.svc-pos-grid{grid-template-columns:1fr 320px}
.svc-cart{position:sticky;top:80px}
@media(max-width:900px){
  .svc-pos-grid{grid-template-columns:1fr !important}
  .svc-cart{position:relative !important;top:auto !important;margin-top:16px;border-radius:var(--rx);box-shadow:0 2px 12px rgba(0,0,0,.1)}
  .svc-cart.cart-empty{display:none !important}
}
@media(max-width:768px){
  .cal-nav {
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
  }
  
  .cal-legend {
    justify-content: center;
  }
  
  .cal-grid {
    min-width: 600px;
  }
  
  .audit-stats {
    grid-template-columns: 1fr;
  }
  
  .stat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .date-range-picker {
    flex-direction: column;
    align-items: stretch;
  }
  
  .sbar-left,
  .sbar-right {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  
  .filter-group .bt {
    flex: 1;
  }
  
  .audit-detail-grid {
    grid-template-columns: 1fr;
  }
  
  .breakdown-item {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  
  .breakdown-value {
    text-align: right;
  }
}