:root {
  --hotel-green-950:#063b2a; --hotel-green-900:#07553a; --hotel-green-800:#0b6847;
  --hotel-green-700:#16865b; --hotel-green-100:#e8f5ee; --hotel-gold:#c6a15b;
  --hotel-ink:#17241f; --hotel-muted:#607068; --hotel-surface:#ffffff;
  --hotel-bg:#f4f7f5; --hotel-border:#dce7e1; --hotel-danger:#bd2c34;
  --hotel-warning:#c46a16; --hotel-blue:#2f75b5; --hotel-radius:16px;
  --hotel-shadow:0 12px 30px rgba(6,59,42,.09); --hotel-shadow-soft:0 3px 12px rgba(6,59,42,.07);
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--hotel-bg)}
body{min-height:100vh;margin:0;color:var(--hotel-ink);background:var(--hotel-bg);font-family:"Segoe UI",Arial,sans-serif;text-transform:none;line-height:1.45}
button,input,select{font:inherit}
button{transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
button:hover{transform:translateY(-1px);box-shadow:0 5px 12px rgba(6,59,42,.16)}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(22,134,91,.25);outline-offset:2px}
.header{background:linear-gradient(115deg,var(--hotel-green-950),var(--hotel-green-800));min-height:92px;padding:14px 32px;border-bottom:3px solid var(--hotel-gold);box-shadow:var(--hotel-shadow-soft)}
.header h1{font-family:"Segoe UI",Arial,sans-serif;letter-spacing:.01em}
.header-logo img,.header-left img,.brand-block img{background:#fff;border:1px solid rgba(255,255,255,.6);border-radius:12px;object-fit:contain}
.btn,.btn-header,.btn-reports,.btn-green{border-radius:9px;min-height:40px;font-weight:700;letter-spacing:.015em}
.btn-green,.btn-checkin,.btn-confirm{background:var(--hotel-green-700)!important;color:#fff}
.container{width:min(1500px,100%);margin:0 auto;padding:28px 32px}
.menu-section,.cart-section,.table,.card,.room-card,.modal-content{border:1px solid var(--hotel-border);box-shadow:var(--hotel-shadow);background:var(--hotel-surface)}
.room-card,.menu-section,.cart-section,.table,.card{border-radius:var(--hotel-radius)}
.room-card{transition:transform .15s ease,box-shadow .15s ease}
.room-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(6,59,42,.12)}
.room-card.available{border-left-color:var(--hotel-green-700)}
.room-card.occupied{border-left-color:var(--hotel-danger)}
.status-badge.available{background:var(--hotel-green-700)}
.modal{backdrop-filter:blur(3px);background:rgba(5,30,22,.62)}
.modal-content{max-height:88vh;overflow:auto;margin:4vh auto;border-radius:18px}
.form-group input,.form-group select,input,select{border:1px solid #bccdc4;background:#fff;color:var(--hotel-ink)}
.form-group input:focus,.form-group select:focus,input:focus,select:focus{border-color:var(--hotel-green-700)}
.tabs{overflow-x:auto;scrollbar-width:thin}
.tab{white-space:nowrap;text-transform:none}
.tab.active{color:var(--hotel-green-800);border-bottom-color:var(--hotel-green-700)}
.menu-item{border:1px solid transparent;transition:all .15s ease}
.menu-item:hover{border-color:var(--hotel-green-700);background:var(--hotel-green-100);transform:translateY(-2px)}
.title{font-family:"Segoe UI",Arial,sans-serif;color:var(--hotel-green-900);border-left-color:var(--hotel-gold)}
.footer{background:var(--hotel-green-950);border-top:3px solid var(--hotel-gold)}
.empty-state{padding:32px 18px;text-align:center;color:var(--hotel-muted);background:#f8fbf9;border:1px dashed #b7cbc0;border-radius:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){
  .header{align-items:flex-start;gap:16px;flex-wrap:wrap;padding:14px 18px}
  .header-right,.header>div:last-child{width:100%;flex-wrap:wrap;justify-content:space-between}
  .header .kpis{flex-wrap:wrap}.container{padding:22px 18px}.rooms-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  .container:has(.menu-section){display:grid;grid-template-columns:1fr}.cart-section{position:static}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .brand-block img,.header-logo img,.header-left img{width:58px;height:50px}.header h1{font-size:1.05rem}.brand-subtitle{font-size:.68rem}
  .container{padding:16px 12px}.rooms-grid,.cards{grid-template-columns:1fr}.room-card,.menu-section,.cart-section,.table,.card{padding:18px}
  .modal-content{width:94%;padding:20px}.modal-actions{flex-direction:column}.user-row{grid-template-columns:35px 1fr 1fr}.user-row span:nth-child(3),.user-row span:nth-child(4){display:none}
  table{display:block;overflow-x:auto;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}