:root{--menu-bg:#071833;--menu-text:#e5e7eb;--menu-active:#f6c443;}
:root {
  --bg: #071226;
  --bg2: #0d1b36;
  --panel: rgba(8, 18, 38, 0.92);
  --panel-soft: rgba(17, 24, 39, 0.92);
  --panel-strong: #091224;
  --text: #f8fafc;
  --muted: #9fb0c9;
  --primary: #c5161d;
  --accent: #f6c443;
  --ok: #16a34a;
  --warn: #f59e0b;
  --danger: #dc2626;
  --info: #3b82f6;
  --border: rgba(71, 85, 105, 0.45);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, Arial, Helvetica, sans-serif;
  background:
    radial-gradient(circle at top right, rgba(246,196,67,.08), transparent 22%),
    radial-gradient(circle at top left, rgba(197,22,29,.10), transparent 18%),
    linear-gradient(135deg, var(--bg), var(--bg2));
  color: var(--text);
  height: 100vh;
  overflow: hidden;
}
.hidden { display: none !important; }
.screen { min-height: 100vh; }
.center-screen { display: grid; place-items: center; padding: 24px; }
.panel, .card, .table-card, .kpi, .form-card, .stat-card { background: var(--panel); border: 1px solid #233047; border-radius: 16px; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.auth-panel { width: 100%; max-width: 420px; padding: 28px; }
.brand-badge { display: inline-block; background: rgba(250,204,21,.15); color: var(--accent); padding: 6px 10px; border-radius: 999px; font-size: 12px; margin-bottom: 14px; }
h1,h2,h3,h4 { margin: 0 0 10px 0; }
.sub, .muted { color: var(--muted); }
input, select, textarea, button { width: 100%; padding: 11px 12px; border-radius: 10px; border: 1px solid #334155; background: #0b1220; color: var(--text); margin-top: 10px; }
textarea { min-height: 90px; resize: vertical; }
button { cursor: pointer; }
.primary-btn, .chip.active { background: var(--primary); border-color: var(--primary); }
button:hover { filter: brightness(1.06); }
#appView { display: grid; grid-template-columns: 270px 1fr; height: 100vh; overflow: hidden; }
.sidebar { background: #0b1220; border-right: 1px solid #1e293b; padding: 20px; height: 100vh; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; position: sticky; top: 0; scrollbar-width: none; -ms-overflow-style: none; }
.sidebar::-webkit-scrollbar { width: 0; height: 0; background: transparent; }
.sidebar button { text-align: left; margin-top: 8px; background: transparent; }
.brand-block { margin-bottom: 20px; }
.workspace { display: flex; flex-direction: column; min-width: 0; height: 100vh; overflow: hidden; }
.topbar { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 18px 22px; border-bottom: 1px solid #1e293b; background: rgba(15,23,42,.9);  position: sticky; top: 0; z-index: 5; }
.top-actions { display: flex; gap: 10px; }

.topbar-left{display:flex;flex-direction:column;gap:4px;min-width:180px}
.workspace-brand-banner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-width:280px;
  max-width:56%;
  margin:0 auto;
  padding:10px 16px;
  border-radius:18px;
  border:1px solid rgba(246,196,67,.18);
  background:linear-gradient(90deg, rgba(197,22,29,.12), rgba(246,196,67,.10), rgba(59,130,246,.08));
  box-shadow:0 10px 24px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.03);
  overflow:hidden;
  position:relative;
}
.workspace-brand-banner::before{
  content:"";
  position:absolute;
  inset:-120% auto auto -30%;
  width:50%;
  height:300%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
  transform:rotate(18deg);
  animation:headerShimmer 7s linear infinite;
  pointer-events:none;
}
.workspace-brand-banner.hidden{display:none !important}
.workspace-brand-logo{
  width:44px;
  height:44px;
  border-radius:12px;
  object-fit:contain;
  background:rgba(255,255,255,.96);
  padding:4px;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  flex:0 0 auto;
}
.workspace-brand-copy{display:flex;flex-direction:column;min-width:0}
.workspace-brand-title{
  font-size:18px;
  font-weight:800;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.workspace-brand-subtitle{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}
.workspace-brand-banner.is-animated .workspace-brand-title{
  animation:headerPulseText 4.8s ease-in-out infinite;
  transform-origin:left center;
}
.workspace-brand-banner.is-animated .workspace-brand-logo{
  animation:headerFloatLogo 4.8s ease-in-out infinite;
}
@keyframes headerPulseText{
  0%,100%{opacity:.72;transform:translateY(2px) scale(.98)}
  28%{opacity:1;transform:translateY(0) scale(1.03)}
  55%{opacity:.86;transform:translateY(-1px) scale(1.01)}
  78%{opacity:1;transform:translateY(0) scale(1.04)}
}
@keyframes headerFloatLogo{
  0%,100%{transform:translateY(0) scale(1)}
  33%{transform:translateY(-2px) scale(1.04)}
  66%{transform:translateY(1px) scale(.98)}
}
@keyframes headerShimmer{
  0%{left:-42%}
  100%{left:125%}
}
@media (max-width: 980px){
  .topbar{flex-wrap:wrap}
  .workspace-brand-banner{order:3;width:100%;max-width:none;min-width:0;margin-top:10px}
}

.top-actions button { width: auto; min-width: 96px; }
.content { padding: 22px; flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.content::-webkit-scrollbar { width: 8px; background: transparent; }
.content::-webkit-scrollbar-thumb { background: transparent; border-radius: 999px; }
.content:hover::-webkit-scrollbar-thumb,
.content:focus-within::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); }
.grid { display: grid; gap: 16px; }
.grid.kpis { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.kpi { padding: 18px; }
.kpi .label { color: var(--muted); font-size: 13px; }
.kpi .value { font-size: 28px; font-weight: bold; margin-top: 10px; }
.two-col { display: grid; grid-template-columns: minmax(320px, 420px) 1fr; gap: 18px; }
.form-card { padding: 18px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.form-grid .full { grid-column: 1 / -1; }
.table-wrap { overflow: auto; scrollbar-width: thin; scrollbar-color: rgba(246,196,67,.55) rgba(255,255,255,.06); }
.table-wrap::-webkit-scrollbar { width: 10px; height: 10px; }
.table-wrap::-webkit-scrollbar-track { background: rgba(255,255,255,.05); border-radius: 999px; }
.table-wrap::-webkit-scrollbar-thumb { background: rgba(246,196,67,.42); border-radius: 999px; border: 2px solid rgba(8,18,38,.85); transition: background .22s ease, box-shadow .22s ease, border-color .22s ease; }
.table-wrap:hover::-webkit-scrollbar-thumb { background: rgba(246,196,67,.72); box-shadow: 0 0 0 1px rgba(246,196,67,.15), 0 0 12px rgba(246,196,67,.18); }
.table-wrap::-webkit-scrollbar-corner { background: transparent; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { border-bottom: 1px solid #243247; padding: 10px; text-align: left; vertical-align: top; }
th { color: var(--accent); background: #0b1220; position: sticky; top: 0; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.actions button { width: auto; margin-top: 0; }
.tag { display: inline-block; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: bold; }
.Available { background: rgba(22,163,74,.15); color: #4ade80; }
.Occupied { background: rgba(220,38,38,.15); color: #f87171; }
.Reserved { background: rgba(245,158,11,.15); color: #fbbf24; }
.Cleaning, .Pending { background: rgba(37,99,235,.15); color: #60a5fa; }
.Completed, .Paid, .ACTIVE { background: rgba(22,163,74,.15); color: #4ade80; }
.Unpaid, .Cancelled, .Expired, .EXPIRED { background: rgba(220,38,38,.15); color: #f87171; }
.Part\ Paid, .Part\ Paid { background: rgba(245,158,11,.15); color: #fbbf24; }
.toolbar { display: flex; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.toolbar button { width: auto; }
.small { font-size: 12px; }
hr { border: none; border-top: 1px solid #1e293b; margin: 18px 0; }
.doc-preview { background: white; color: #111827; padding: 24px; border-radius: 12px; }
.flex { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
@media (max-width: 980px) {
  body { height: auto; overflow: auto; }
  #appView { grid-template-columns: 1fr; height: auto; overflow: visible; }
  .sidebar { height: auto; max-height: none; position: relative; overflow: visible; }
  .workspace { height: auto; overflow: visible; }
  .content { overflow: visible; }
  .two-col { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
}

.login-logo{display:block;max-width:280px;width:100%;height:auto;margin:0 auto 10px auto}
.sidebar-logo{display:block;max-width:210px;width:100%;height:auto;margin-bottom:10px}
.system-footer{padding:14px 22px;border-top:1px solid #1e293b;color:var(--muted);text-align:center;font-size:13px}
.auth-footer{border-top:none;padding:16px 0 0 0}
.customer-search-wrap{position:relative}
.customer-search-wrap datalist{display:none}
.preview-logo{max-width:180px;max-height:80px;display:block;margin-bottom:12px;background:#fff;border-radius:8px;padding:6px}
.form-help{font-size:12px;color:var(--muted);margin-top:6px}

.calendar-cell{min-width:110px}
.login-logo{max-width:340px;width:100%;height:auto;display:block;margin:0 auto 16px auto}
.doc-preview strong{color:#111827}

.Washing, .Ironing, .Ready, .Delivered, .Inactive { background: rgba(37,99,235,.15); color: #60a5fa; }
.Ready { background: rgba(22,163,74,.15); color: #4ade80; }
.Delivered { background: rgba(22,163,74,.15); color: #4ade80; }
.Inactive { background: rgba(100,116,139,.2); color: #cbd5e1; }


.login-logo { width: 230px; max-width: 100%; display:block; margin: 0 auto 10px; filter: drop-shadow(0 10px 25px rgba(0,0,0,.35)); }
.sidebar-logo { width: 210px; max-width: 100%; display:block; margin-bottom: 12px; }
.auth-panel {
  max-width: 520px; padding: 34px;
  background: linear-gradient(180deg, rgba(9,18,36,.98), rgba(8,18,38,.95));
}
.panel, .card, .table-card, .kpi, .form-card, .stat-card {
  border: 1px solid var(--border);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
  
}
.sidebar {
  background: linear-gradient(180deg, rgba(7,18,38,.98), rgba(7,18,38,.92));
}
.sidebar button {
  border: 1px solid transparent;
  transition: all .18s ease;
}
.sidebar button:hover, .sidebar button.active-nav {
  background: linear-gradient(90deg, rgba(197,22,29,.16), rgba(246,196,67,.08));
  border-color: rgba(246,196,67,.22);
  transform: translateX(2px);
}
.topbar {
  background: linear-gradient(180deg, rgba(8,18,38,.94), rgba(8,18,38,.84));
  border-bottom: 1px solid var(--border);
}
.top-actions button, .actions button, .toolbar button { width: auto; }
button.primary-btn, .chip.active, .top-actions button:first-child {
  background: linear-gradient(135deg, #c5161d, #8f1015);
  border-color: #c5161d;
}
.kpi {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(10,22,44,.92), rgba(7,18,38,.98));
}
.kpi::after {
  content: "";
  position: absolute; inset: auto -20px -30px auto;
  width: 110px; height: 110px;
  background: radial-gradient(circle, rgba(246,196,67,.18), transparent 60%);
}
.enterprise-grid { display:grid; grid-template-columns: 1.4fr 1fr; gap:18px; margin-top:18px; }
.enterprise-card { padding:18px; }
.chart-bars { display:grid; grid-template-columns: repeat(6, 1fr); gap:12px; align-items:end; height:180px; margin-top:16px; }
.chart-bar {
  background: linear-gradient(180deg, rgba(246,196,67,.95), rgba(197,22,29,.95));
  border-radius: 14px 14px 8px 8px;
  min-height: 18px;
  position: relative;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.chart-bar span {
  position:absolute; bottom:-24px; left:50%; transform:translateX(-50%);
  font-size:12px; color: var(--muted);
}
.chart-legend { display:flex; justify-content:space-between; gap:8px; margin-top:30px; color:var(--muted); font-size:12px; }
.audit-list li, .bullet-list li { margin-bottom: 8px; }
.mini-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:14px; }
.soft-card {
  padding: 14px; border-radius: 14px; border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(17,24,39,.70), rgba(8,18,38,.78));
}
.system-footer {
  text-align:center; color:var(--muted); padding:12px 20px 20px;
  border-top: 1px solid rgba(71,85,105,.28);
}
.doc-preview {
  border-radius: 18px;
  box-shadow: 0 16px 35px rgba(15,23,42,.16);
}
.table-card h3, .form-card h3, .enterprise-card h3 { margin-bottom: 12px; }


/* LICENSE UI UPGRADE CSS */
.license-layout{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:14px}
.metric-card,.metric-card-warn,.metric-card-danger{padding:28px;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02)}
.metric-card-warn{border-color:rgba(245,158,11,.35);box-shadow:inset 0 0 0 1px rgba(245,158,11,.05)}
.metric-card-danger{border-color:rgba(239,68,68,.35);box-shadow:inset 0 0 0 1px rgba(239,68,68,.06)}
.metric-title{font-size:18px;color:#c3d0ef;margin-bottom:18px}
.metric-value{font-size:42px;font-weight:800;line-height:1.1;color:#fff}
.license-warning-panel{margin-top:18px;padding:18px 22px;border-radius:18px;background:linear-gradient(90deg, rgba(217,119,6,.22), rgba(180,83,9,.18));border:1px solid rgba(245,158,11,.35);font-size:16px;color:#ffd39b}
.pill{display:inline-block;padding:10px 18px;border-radius:999px;font-weight:700}
.pill-ok{background:rgba(22,163,74,.18);border:1px solid rgba(22,163,74,.32);color:#9ff3b8}
.pill-warn{background:rgba(245,158,11,.18);border:1px solid rgba(245,158,11,.32);color:#ffd39b}
.pill-bad{background:rgba(239,68,68,.18);border:1px solid rgba(239,68,68,.32);color:#ffaaa9}
.three-col{grid-template-columns:1.2fr 1fr auto}
@media (max-width: 980px){.license-layout{grid-template-columns:1fr}.three-col{grid-template-columns:1fr}}


input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #475569;
  box-shadow: none;
}

.topbar, .panel, .card, .table-card, .kpi, .form-card, .stat-card {
  will-change: auto;
}


/* rev21 safe footer */

.footer-logo{
  width:20px;
  height:20px;
  object-fit:contain;
  flex:0 0 auto;
}
.system-footer{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

/* rev63.7 perf */
.form-card,.table-card,.metric-card{backface-visibility:hidden;transform:translateZ(0);}
input:focus, select:focus, textarea:focus{
  outline:none;
  box-shadow:none !important;
}
button, input, select, textarea{
  transition:none !important;
}


/* rev22 printer settings */
#setReceiptPrinter,#setReceiptPaperWidth{min-height:44px}


/* rev24 printer ui + lighter interaction */
#setReceiptPrinter,#setReceiptPaperWidth{min-height:44px}
#testReceiptPrinterBtn{white-space:nowrap}
button,input,select,textarea{transition:none !important;animation:none !important}


/* rev25 GST fields */
#setGstEnabled,#setGstRate,#setGstTin{min-height:44px}


/* rev26 check-in UI */
input::placeholder,textarea::placeholder{color:#93a4c7 !important;opacity:1 !important;}


/* rev27 corporate multi-items */
.multi-item-box{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.quote-item-row{display:grid;grid-template-columns:2fr .7fr 1fr auto;gap:10px;align-items:center}


/* rev28 room/item selectors */
.multi-item-box{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.smart-item-row{display:grid;grid-template-columns:1.5fr 1.4fr .6fr .8fr auto;gap:10px;align-items:center}
#addQuoteRoomBtn,#addInvoiceRoomBtn,#addQuoteItemBtn,#addInvoiceItemBtn{margin-top:6px}


/* rev29 quotation/invoice selector fix */
.multi-item-box{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.smart-item-row{display:grid;grid-template-columns:1.5fr 1.4fr .6fr .8fr auto;gap:10px;align-items:center}
#addQuoteRoomBtn,#addInvoiceRoomBtn,#addQuoteItemBtn,#addInvoiceItemBtn{margin-top:6px}


/* rev30 selector layout fix */
.smart-item-row{
  display:grid;
  grid-template-columns:minmax(220px,2fr) minmax(180px,1.5fr) minmax(90px,.8fr) minmax(120px,1fr) auto;
  gap:12px;
  align-items:center;
  width:100%;
}
.smart-item-row select,
.smart-item-row input,
.smart-item-row button{
  min-height:48px;
  width:100%;
}
.smart-item-row .remove-smart-item{
  min-width:120px;
  padding:10px 14px;
}
.multi-item-box{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}
@media (max-width: 1100px){
  .smart-item-row{
    grid-template-columns:1fr 1fr;
  }
  .smart-item-row .remove-smart-item{
    width:100%;
  }
}
@media (max-width: 700px){
  .smart-item-row{
    grid-template-columns:1fr;
  }
}


/* rev31 best arrangement */
.two-col{
  display:grid;
  grid-template-columns:minmax(460px, 520px) 1fr;
  gap:20px;
  align-items:start;
}
.form-card{
  width:100%;
  overflow:hidden;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  align-items:start;
}
.form-grid .full{
  grid-column:1 / -1;
}
.multi-item-box{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
  margin-top:10px;
}
.smart-item-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  width:100% !important;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.02);
}
.smart-item-row select,
.smart-item-row input,
.smart-item-row button{
  width:100% !important;
  min-height:48px;
}
.smart-item-row .remove-smart-item{
  min-width:unset;
}
#addQuoteRoomBtn,
#addInvoiceRoomBtn,
#addQuoteItemBtn,
#addInvoiceItemBtn{
  width:100%;
  min-height:46px;
}
.table-card, .table-wrap{
  overflow:auto;
}
@media (max-width: 1100px){
  .two-col{
    grid-template-columns:1fr;
  }
}


/* rev32 force layout fix for quotations/invoices */
body .two-col{
  display:grid !important;
  grid-template-columns:minmax(520px, 560px) minmax(0, 1fr) !important;
  gap:24px !important;
  align-items:start !important;
}

body .two-col > .form-card{
  width:100% !important;
  max-width:560px !important;
  min-width:0 !important;
  overflow:hidden !important;
}

body .two-col > div:last-child,
body .two-col > .table-card,
body .two-col > .table-wrap{
  min-width:0 !important;
  width:100% !important;
}

body .form-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px !important;
  align-items:start !important;
}

body .form-grid > *{
  min-width:0 !important;
}

body .form-grid .full{
  grid-column:1 / -1 !important;
}

body #quoteItemsBox,
body #invoiceItemsBox{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  width:100% !important;
  margin-top:10px !important;
}

body .smart-item-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  padding:12px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.02) !important;
  box-sizing:border-box !important;
}

body .smart-item-row > *{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

body .smart-item-row select,
body .smart-item-row input,
body .smart-item-row button{
  min-height:48px !important;
}

body #addQuoteRoomBtn,
body #addInvoiceRoomBtn,
body #addQuoteItemBtn,
body #addInvoiceItemBtn,
body .remove-smart-item{
  width:100% !important;
}

body .table-card,
body .table-wrap{
  width:100% !important;
  max-width:100% !important;
  overflow:auto !important;
}

@media (max-width: 1200px){
  body .two-col{
    grid-template-columns:1fr !important;
  }
  body .two-col > .form-card{
    max-width:none !important;
  }
}

@media (max-width: 700px){
  body .form-grid{
    grid-template-columns:1fr !important;
  }
}


/* rev38 smart printer manager */
#setA4Printer,#testA4PrinterBtn,#testReceiptPrinterBtn{min-height:44px}


/* rev39 conference and open items */
.open-item-grid{
  margin-top:8px;
}
.open-item-grid input{
  min-height:44px;
}
#saveQuoteOpenItemBtn,
#saveInvoiceOpenItemBtn{
  margin-top:8px;
  width:100%;
}


/* rev42 auto logo colors */
.color-preview-box{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:6px;
}
.color-chip{
  min-width:110px;
  min-height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:700;
  border:1px solid rgba(255,255,255,.12);
}
.color-chip.dark-text{
  color:#111827;
}
#autoDetectLogoColorsBtn{
  width:100%;
  min-height:44px;
}


/* rev43 document template selector */
#setDocumentTemplate{min-height:44px}


/* rev44 accounting */


/* rev48 dashboard ui fix */
.dashboard-section{margin-bottom:18px}
.dashboard-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:16px;
}
.dashboard-kpis .kpi{
  min-height:132px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.dashboard-kpis .kpi:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(0,0,0,.25);
  border-color:#3b4d6a;
}
.quick-action-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
}
.quick-action-card{
  text-align:left;
  min-height:122px;
  padding:18px;
  border-radius:16px;
  border:1px solid #233047;
  background:var(--panel);
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.quick-action-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
  border-color:#3b4d6a;
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
}
.quick-action-title{
  font-size:24px;
  font-weight:800;
  color:var(--text);
  margin-bottom:8px;
}
.quick-action-desc{
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}
.dashboard-panels{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.sidebar button.nav-btn,
.sidebar button{
  border-radius:12px;
}
.nav-btn.active{
  background:rgba(255,255,255,.06);
  border:1px solid #30415d;
}
@media (max-width: 980px){
  .dashboard-panels{grid-template-columns:1fr}
}


/* rev49 ui upgrade */
.quick-action-card,
.dashboard-kpis .kpi{
  position: relative;
  overflow: hidden;
}
.quick-action-card::before,
.dashboard-kpis .kpi::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:linear-gradient(135deg, color-mix(in srgb, var(--primary) 70%, transparent), color-mix(in srgb, var(--accent) 70%, transparent));
  opacity:0;
  transition:opacity .22s ease;
  pointer-events:none;
}
.quick-action-card::after,
.dashboard-kpis .kpi::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-60px;
  top:-60px;
  background:radial-gradient(circle, color-mix(in srgb, var(--accent) 28%, transparent) 0%, transparent 70%);
  opacity:.0;
  transition:opacity .22s ease, transform .22s ease;
  transform:scale(.9);
  pointer-events:none;
}
.quick-action-card:hover,
.dashboard-kpis .kpi:hover{
  border-color: color-mix(in srgb, var(--accent) 55%, #3b4d6a);
}
.quick-action-card:hover::before,
.dashboard-kpis .kpi:hover::before{
  opacity:.12;
}
.quick-action-card:hover::after,
.dashboard-kpis .kpi:hover::after{
  opacity:1;
  transform:scale(1);
}
.quick-action-card[data-goto-tab="stays"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, #22c55e 32%, transparent);
  border-color:#22c55e;
}
.quick-action-card[data-goto-tab="invoices"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, #3b82f6 32%, transparent);
  border-color:#3b82f6;
}
.quick-action-card[data-goto-tab="quotations"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, var(--accent) 32%, transparent);
}
.quick-action-card[data-goto-tab="sales"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, var(--primary) 32%, transparent);
}
.kpi.hover-on .value,
.quick-action-card.hover-on .quick-action-title{
  text-shadow:0 0 12px color-mix(in srgb, var(--accent) 45%, transparent);
}


/* rev50 room type dashboard */
.room-type-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
}
.room-type-card{
  background:var(--panel);
  border:1px solid #233047;
  border-radius:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  padding:18px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.room-type-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
  border-color:#3b4d6a;
}
.room-type-name{
  font-size:18px;
  font-weight:800;
  margin-bottom:10px;
}
.room-type-main{
  font-size:26px;
  font-weight:800;
  color:var(--accent);
  margin-bottom:10px;
}
.room-type-meta{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:var(--muted);
}


/* rev52 smoothness cleanup */
.quick-action-card,
.dashboard-kpis .kpi,
.room-type-card{
  will-change: transform;
}
.table-wrap{
  contain: content;
}


/* rev53 revised banking ui */
.section-label{
  margin-top:10px;
  color: var(--accent);
  font-weight: 800;
  font-size: 14px;
}


/* rev53b banking boxes ui */
.section-label{margin-top:10px;color:var(--accent);font-weight:800;font-size:14px}


.field-help{color:var(--muted);font-size:13px;margin-top:-6px;margin-bottom:2px}


/* rev61 sidebar branding */
.sidebar{
  background: linear-gradient(180deg, color-mix(in srgb, var(--secondary-ui) 90%, #000), color-mix(in srgb, var(--secondary-ui) 75%, #001b44)) !important;
  border-right: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  box-shadow: inset -1px 0 0 rgba(255,255,255,.03), 0 0 20px rgba(0,0,0,.15);
}
.sidebar .brand{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
  border-radius: 16px;
  padding: 10px;
}
.sidebar .nav-btn{
  background: transparent;
  border: 1px solid transparent;
}
.sidebar .nav-btn:hover{
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 18%, transparent), transparent);
  border-color: color-mix(in srgb, var(--accent) 20%, transparent);
}
.sidebar .nav-btn.active{
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 28%, transparent), color-mix(in srgb, var(--accent) 12%, transparent));
  border-color: color-mix(in srgb, var(--accent) 35%, transparent);
  box-shadow: inset 3px 0 0 var(--accent);
}


/* rev62 menu theme + dark/light mode */
body.theme-dark{
  --bg:#031022;
  --panel:#06162f;
  --text:#f5f7fb;
  --muted:#9fb0cc;
  --border:#1d3557;
}
body.theme-light{
  --bg:#f4f7fb;
  --panel:#ffffff;
  --text:#132033;
  --muted:#5f6f86;
  --border:#d7dee8;
}
body{
  background: var(--bg);
  color: var(--text);
}
.sidebar{
  background: linear-gradient(180deg, color-mix(in srgb, var(--menu-bg) 96%, #000), color-mix(in srgb, var(--menu-bg) 85%, #001b44)) !important;
  border-right: 1px solid color-mix(in srgb, var(--menu-active) 30%, transparent);
}
.sidebar .brand,
.sidebar .nav-btn{
  color: var(--menu-text);
}
.sidebar .nav-btn{
  background: transparent;
}
.sidebar .nav-btn:hover{
  color: var(--menu-text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--menu-active) 14%, transparent), transparent);
  border-color: color-mix(in srgb, var(--menu-active) 26%, transparent);
}
.sidebar .nav-btn.active{
  color: var(--menu-text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--menu-active) 22%, transparent), color-mix(in srgb, var(--primary) 10%, transparent));
  box-shadow: inset 4px 0 0 var(--menu-active);
  border-color: color-mix(in srgb, var(--menu-active) 40%, transparent);
}
.form-card,.table-card,.kpi,.room-type-card,.quick-action-card{
  background: var(--panel);
  border-color: var(--border);
  color: var(--text);
}
input,select,textarea,button{
  color: var(--text);
}
input,select,textarea{
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  border-color: var(--border);
}
.table-wrap table, table{
  color: var(--text);
}
th,td{
  border-color: var(--border) !important;
}
th{
  background: color-mix(in srgb, var(--panel) 75%, #0000) !important;
}


/* rev67.7 sidebar logo hover-only animation */
.sidebar .sidebar-logo{
  transform-origin:center center;
  transition:transform .22s ease, filter .22s ease, opacity .22s ease !important;
  will-change:transform, opacity, filter;
  animation:none !important;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.20));
}
.sidebar .sidebar-logo:hover{
  animation:sidebarLogoBurstReform .95s cubic-bezier(.22,.61,.36,1) infinite;
}
.system-footer{
  position:relative;
  overflow:hidden;
}
#appView .system-footer{
  animation:footerPulseLoop 4.6s ease-in-out infinite;
}
#appView .system-footer .footer-logo{
  animation:footerLogoGlow 4.6s ease-in-out infinite;
}
#appView .system-footer span{
  animation:footerTextFloat 4.6s ease-in-out infinite;
}
#appView .system-footer::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, transparent 0%, rgba(246,196,67,.08) 35%, rgba(197,22,29,.08) 50%, rgba(246,196,67,.08) 65%, transparent 100%);
  opacity:.0;
  animation:footerShimmer 4.6s ease-in-out infinite;
}
@keyframes sidebarLogoEmerge{
  0%{transform:scale(.72) translateY(12px) rotate(-2deg); opacity:0; filter:drop-shadow(0 0 0 rgba(246,196,67,0));}
  18%{transform:scale(.86) translateY(6px) rotate(-1deg); opacity:.26;}
  36%{transform:scale(.98) translateY(0) rotate(0deg); opacity:.88; filter:drop-shadow(0 0 10px rgba(246,196,67,.18));}
  50%{transform:scale(1.08) translateY(-1px) rotate(.8deg); opacity:1; filter:drop-shadow(0 0 16px rgba(246,196,67,.28)) drop-shadow(0 0 26px rgba(197,22,29,.12));}
  66%{transform:scale(1.02) translateY(1px) rotate(-.6deg); opacity:.76;}
  82%{transform:scale(.90) translateY(7px) rotate(0deg); opacity:.22; filter:drop-shadow(0 0 6px rgba(197,22,29,.14));}
  100%{transform:scale(.72) translateY(12px) rotate(-2deg); opacity:0; filter:drop-shadow(0 0 0 rgba(246,196,67,0));}
}
@keyframes sidebarLogoHoverWave{
  0%,100%{transform:scale(.98) skewX(0deg) translateY(0); opacity:.92;}
  20%{transform:scale(1.02) skewX(-2deg) translateY(-1px); opacity:1;}
  40%{transform:scale(1.06) skewX(2deg) translateY(0); opacity:.98;}
  60%{transform:scale(1.03) skewX(-1.5deg) translateY(1px); opacity:.94;}
  80%{transform:scale(1.01) skewX(1deg) translateY(0); opacity:.98;}
}
@keyframes footerPulseLoop{
  0%,100%{opacity:1; transform:translateY(0);}
  30%{opacity:.26; transform:translateY(0);}
  48%{opacity:.92; transform:translateY(-1px);}
  72%{opacity:.34; transform:translateY(0);}
}
@keyframes footerLogoGlow{
  0%,100%{transform:scale(.92); opacity:.15; filter:drop-shadow(0 0 0 rgba(246,196,67,0));}
  45%{transform:scale(1.08); opacity:1; filter:drop-shadow(0 0 8px rgba(246,196,67,.32));}
  70%{transform:scale(.98); opacity:.42; filter:drop-shadow(0 0 4px rgba(197,22,29,.28));}
}
@keyframes footerTextFloat{
  0%,100%{letter-spacing:.2px; transform:translateY(0); opacity:1;}
  45%{letter-spacing:.8px; transform:translateY(-1px); opacity:.92;}
  72%{opacity:.34;}
}
@keyframes footerShimmer{
  0%,100%{opacity:0; transform:translateX(-18%);}
  45%{opacity:.6; transform:translateX(0%);}
  75%{opacity:0; transform:translateX(18%);}
}


.field-hint{font-size:12px;color:#9fb3d9;margin-top:-6px;padding:2px 4px;}
.full-span{grid-column:1 / -1;}
.status-badge.danger{background:rgba(220,38,38,.16);color:#fca5a5;border-color:rgba(220,38,38,.35);}
.status-badge.warn{background:rgba(245,158,11,.16);color:#fde68a;border-color:rgba(245,158,11,.35);}


.checkout-alert-card{
  background: linear-gradient(180deg, rgba(255,196,0,.10), rgba(255,90,90,.08)), var(--panel);
  border: 1px solid rgba(255,196,0,.35);
  box-shadow: 0 10px 24px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.03);
}
.checkout-alert-card h3{
  color: #ffe67a;
}
.checkout-alert-card .muted{
  color: #f4ddb0;
}


/* rev66.6 premium grouped sidebar */
.nav-group{margin-top:14px;padding-top:6px}
.nav-group:first-child{margin-top:6px}
.nav-group-title{display:flex;align-items:center;gap:10px;color:color-mix(in srgb,var(--menu-text) 78%, #b6c2d9);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:8px 6px 10px;opacity:.98;position:relative}
.nav-group-title-text{display:inline-flex;align-items:center;flex-wrap:wrap;gap:1px;animation:navGroupTitlePulse 2.4s ease-in-out infinite}
.nav-group-letter{display:inline-block;position:relative;will-change:transform,color,text-shadow;animation:navGroupLetterGlow 1.8s ease-in-out infinite, navGroupLetterShift 3.4s linear infinite;color:#f2e94e;text-shadow:0 0 4px rgba(255,227,102,.35),0 0 12px rgba(255,90,90,.20);filter:drop-shadow(0 0 5px rgba(255,180,80,.18));animation-delay:calc(var(--letter-index) * .08s);padding:0 1px}
.nav-group-line{display:inline-block;width:18px;height:1px;background:linear-gradient(90deg,var(--menu-active),transparent);box-shadow:0 0 10px color-mix(in srgb,var(--menu-active) 35%, transparent)}
.sidebar .nav-btn{display:flex;align-items:center;gap:10px;position:relative;overflow:hidden;border-radius:14px;transition:transform .18s ease, background .22s ease, box-shadow .22s ease, border-color .22s ease}
.sidebar .nav-btn:hover{transform:translateX(3px);box-shadow:0 10px 24px color-mix(in srgb,var(--menu-active) 10%, transparent), inset 0 0 0 1px color-mix(in srgb,var(--menu-active) 8%, transparent)}
.sidebar .nav-btn.active{transform:translateX(2px)}
.nav-indicator{width:12px;height:12px;min-width:12px;border-radius:999px;border:2px solid color-mix(in srgb,var(--menu-active) 75%, #fff);background:color-mix(in srgb,var(--menu-active) 18%, transparent);display:inline-block;position:relative;box-shadow:0 0 0 3px color-mix(in srgb,var(--menu-active) 8%, transparent);transition:all .24s ease}
.nav-indicator::after{content:'';position:absolute;left:2px;top:0px;width:4px;height:7px;border-right:2px solid transparent;border-bottom:2px solid transparent;transform:rotate(45deg) scale(.6);opacity:0;transition:all .22s ease}
.sidebar .nav-btn:hover .nav-indicator,.sidebar .nav-btn.active .nav-indicator{border-color:color-mix(in srgb,var(--menu-active) 95%, #fff);background:linear-gradient(180deg,color-mix(in srgb,var(--menu-active) 90%, #fff), color-mix(in srgb,var(--menu-active) 58%, #0b1220));box-shadow:0 0 14px color-mix(in srgb,var(--menu-active) 30%, transparent)}
.sidebar .nav-btn:hover .nav-indicator::after,.sidebar .nav-btn.active .nav-indicator::after{opacity:1;border-right-color:#ffffff;border-bottom-color:#ffffff;left:3px;top:1px;transform:rotate(45deg) scale(1)}
.nav-label{flex:1;text-align:left}

@keyframes navGroupLetterGlow{
  0%{transform:translateY(0);color:#f4e85d;text-shadow:0 0 2px rgba(255,230,120,.18),0 0 7px rgba(255,120,80,.12)}
  12%{transform:translateY(-1px);color:#ffd86b;text-shadow:0 0 4px rgba(255,220,110,.35),0 0 10px rgba(255,106,106,.22),0 0 16px rgba(255,64,64,.18)}
  26%{transform:translateY(0);color:#ffb66d;text-shadow:0 0 4px rgba(255,182,109,.30),0 0 12px rgba(255,105,180,.18)}
  42%{transform:translateY(1px);color:#7cf7ff;text-shadow:0 0 5px rgba(124,247,255,.32),0 0 14px rgba(53,180,255,.18)}
  58%{transform:translateY(0);color:#c1ff72;text-shadow:0 0 5px rgba(193,255,114,.28),0 0 12px rgba(97,255,162,.16)}
  74%{transform:translateY(-1px);color:#ff8bf5;text-shadow:0 0 5px rgba(255,139,245,.28),0 0 12px rgba(255,88,176,.18)}
  100%{transform:translateY(0);color:#f2e94e;text-shadow:0 0 2px rgba(255,230,120,.18),0 0 7px rgba(255,120,80,.12)}
}

@keyframes navGroupLetterShift{
  0%,100%{transform:translateY(0) scale(1)}
  25%{transform:translateY(-2px) scale(1.05)}
  50%{transform:translateY(1px) scale(.98)}
  75%{transform:translateY(-1px) scale(1.03)}
}


.duplicate-notice {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(246, 196, 67, 0.35);
  background: linear-gradient(135deg, rgba(246,196,67,0.12), rgba(197,22,29,0.10));
  color: #f8fafc;
}
.duplicate-title { font-weight: 700; margin-bottom: 4px; }
.duplicate-line { font-size: 12px; opacity: 0.95; margin-bottom: 6px; }
.dup-chip-wrap { display:flex; flex-wrap:wrap; gap:6px; }
.dup-chip { display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; font-size:11px; background:rgba(15,23,42,0.45); border:1px solid rgba(255,255,255,0.12); }
.dup-chip.exact { border-color: rgba(248,113,113,0.45); }
.dup-chip.similar { border-color: rgba(251,191,36,0.45); }
body.theme-light .duplicate-notice { color:#111827; background: linear-gradient(135deg, rgba(246,196,67,0.18), rgba(197,22,29,0.08)); }


/* rev68.0 smoky sidebar logo background */
.sidebar-logo-shell{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:230px;
  max-width:100%;
  min-height:126px;
  margin:4px auto 16px;
  isolation:isolate;
}
.sidebar-logo-smoke{
  position:absolute;
  inset:8px 10px 12px;
  border-radius:28px;
  background:
    radial-gradient(40% 55% at 30% 50%, rgba(197,22,29,.20), transparent 72%),
    radial-gradient(42% 58% at 70% 46%, rgba(130,0,0,.18), transparent 70%),
    radial-gradient(58% 80% at 50% 60%, rgba(125,0,0,.18), transparent 74%);
  filter: blur(18px) saturate(115%);
  opacity:.72;
  z-index:0;
  pointer-events:none;
  animation:sidebarSmokeLoop 8.5s ease-in-out infinite;
}
.sidebar-logo-shell::before,
.sidebar-logo-shell::after{
  content:"";
  position:absolute;
  inset:12px 18px;
  border-radius:999px;
  background:radial-gradient(circle at 50% 50%, rgba(255,70,70,.12), transparent 66%);
  filter: blur(14px);
  opacity:.55;
  pointer-events:none;
  z-index:0;
}
.sidebar-logo-shell::after{
  inset:18px 32px 14px;
  animation:sidebarSmokeDrift 10s ease-in-out infinite reverse;
}
.sidebar .sidebar-logo{
  position:relative;
  z-index:1;
  margin-bottom:0 !important;
}
@keyframes sidebarSmokeLoop{
  0%,100%{transform:translate3d(-6px,0,0) scale(1); opacity:.52;}
  20%{transform:translate3d(10px,-4px,0) scale(1.06); opacity:.78;}
  45%{transform:translate3d(-2px,5px,0) scale(.98); opacity:.62;}
  70%{transform:translate3d(8px,3px,0) scale(1.09); opacity:.84;}
}
@keyframes sidebarSmokeDrift{
  0%,100%{transform:translateX(-10px) scale(.96); opacity:.24;}
  50%{transform:translateX(14px) scale(1.08); opacity:.48;}
}


@keyframes navGroupTitlePulse{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.12)}
}

/* Rev72.14: lightweight non-blocking status notices for printing/saving actions */
.toast-box{position:fixed;right:18px;bottom:18px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast-note{background:#092245;color:#fff;border:1px solid rgba(246,196,67,.45);box-shadow:0 10px 30px rgba(0,0,0,.35);border-radius:12px;padding:10px 14px;font-weight:700;max-width:320px;transition:opacity .25s ease,transform .25s ease}.toast-note.ok{border-color:rgba(34,197,94,.45)}.toast-note.fade{opacity:0;transform:translateY(8px)}


/* Rev72.18 POS recent sales visibility: show many records with a proper vertical scroll. */
.sales-history-panel .table-wrap{
  max-height: calc(100vh - 250px);
  overflow-y: auto !important;
  overflow-x: auto !important;
}
.sales-history-panel .table-card{
  max-height: none !important;
}
.sales-history-panel table{
  min-width: 780px;
}
.toast-note.warn{
  border-color: rgba(245,158,11,.45);
  background: rgba(245,158,11,.16);
  color: #fde68a;
}

/* Rev72.19 Advanced Restaurant POS and separated receipt setup */
.pos-advanced-layout{align-items:start;gap:22px}
.pos-sale-card{position:relative;overflow:hidden;border-color:rgba(246,196,67,.30)!important;background:linear-gradient(145deg,rgba(7,24,51,.98),rgba(9,34,69,.94))!important;box-shadow:0 18px 48px rgba(0,0,0,.32)}
.pos-sale-card::before{content:"";position:absolute;inset:-80px -70px auto auto;width:220px;height:220px;border-radius:999px;background:radial-gradient(circle,rgba(246,196,67,.18),transparent 65%);pointer-events:none}
.pos-heading-row{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}
.pos-heading-row h3{margin:0 0 4px;font-size:22px}
.pos-heading-row .pill{white-space:nowrap;margin-top:4px}
.pos-sale-card .form-grid input,.pos-sale-card .form-grid select,.pos-sale-card .form-grid textarea{border-color:rgba(148,163,184,.28);background:rgba(2,14,31,.72)}
.pos-sale-card #saleDraftItems table{background:rgba(2,14,31,.42);border-radius:14px;overflow:hidden}
.pos-sale-card #saleDraftItems th{background:rgba(246,196,67,.10)}

/* Rev72.21 POS cash/change controls + lightweight color and button motion */
.pos-sale-card{
  background:
    radial-gradient(circle at 88% 10%, rgba(34,197,94,.16), transparent 24%),
    radial-gradient(circle at 8% 92%, rgba(220,38,38,.14), transparent 28%),
    linear-gradient(145deg, rgba(7,24,51,.98), rgba(7,32,62,.96)) !important;
}
.pos-cash-panel,.pos-change-panel{
  border:1px solid rgba(246,196,67,.34);
  background:linear-gradient(135deg, rgba(246,196,67,.12), rgba(34,197,94,.10));
  border-radius:14px;
  padding:8px 12px 10px;
  margin-top:10px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 10px 26px rgba(0,0,0,.18);
}
.pos-cash-panel label,.pos-change-panel label{
  display:block;
  color:#fde68a;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:4px;
}
.pos-cash-panel input{
  margin-top:0 !important;
  border-color:rgba(34,197,94,.42) !important;
  background:rgba(2,14,31,.72) !important;
  font-size:18px;
  font-weight:800;
}
.pos-change-amount{
  min-height:44px;
  display:flex;
  align-items:center;
  font-size:22px;
  font-weight:900;
  color:#86efac;
}
.pos-payment-summary .pos-total-card{
  border-color:rgba(59,130,246,.30);
  background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(30,64,175,.22));
}
.pos-payment-summary .pos-change-card{
  border-color:rgba(34,197,94,.38);
  background:linear-gradient(135deg,rgba(6,78,59,.25),rgba(15,23,42,.92));
}
.pos-sale-card .actions button,
.sales-history-panel .actions button,
.pos-daily-report-card .actions button{
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease !important;
}
.pos-sale-card .actions button:hover,
.sales-history-panel .actions button:hover,
.pos-daily-report-card .actions button:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(0,0,0,.25), 0 0 0 1px rgba(246,196,67,.16);
}
.pos-sale-card .actions button:active,
.sales-history-panel .actions button:active,
.pos-daily-report-card .actions button:active{
  transform:translateY(0) scale(.985);
}
#createSaleBtn{
  background:linear-gradient(135deg,#dc2626,#b91c1c 50%,#991b1b) !important;
  border-color:rgba(248,113,113,.5) !important;
  color:#fff !important;
  font-weight:900;
  box-shadow:0 12px 26px rgba(220,38,38,.25);
}
#createSaleBtn:hover{
  filter:brightness(1.08) !important;
  box-shadow:0 16px 36px rgba(220,38,38,.36),0 0 0 1px rgba(254,202,202,.18) !important;
}
#addSaleItemBtn{
  background:linear-gradient(135deg,rgba(22,163,74,.90),rgba(5,150,105,.88)) !important;
  border-color:rgba(134,239,172,.35) !important;
  color:#fff !important;
  font-weight:800;
}
#clearSaleDraftBtn{
  background:linear-gradient(135deg,rgba(30,41,59,.95),rgba(51,65,85,.90)) !important;
  border-color:rgba(148,163,184,.32) !important;
}
@media (prefers-reduced-motion: reduce){
  .pos-sale-card .actions button,
  .sales-history-panel .actions button,
  .pos-daily-report-card .actions button{transition:none !important;}
  .pos-sale-card .actions button:hover,
  .sales-history-panel .actions button:hover,
  .pos-daily-report-card .actions button:hover{transform:none;}
}

/* Rev72.22 Modern POS cashier interface inspired by fast supermarket/counter POS layouts */
.modern-pos-shell{
  display:grid;
  grid-template-columns:minmax(560px,1fr) 420px;
  gap:22px;
  align-items:start;
}
.modern-products-pane{
  min-height:calc(100vh - 190px);
  border:1px solid rgba(246,196,67,.28);
  border-radius:22px;
  padding:22px;
  background:linear-gradient(145deg,#ffffff,#fffaf0 58%,#fff7da);
  color:#050816;
  box-shadow:0 20px 44px rgba(0,0,0,.24);
  overflow:hidden;
}
.modern-pos-topline{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}
.modern-pos-topline h2{color:#050816;font-size:28px;margin:0}
.modern-products-pane .muted{color:#64748b!important}
.modern-pos-actions{display:flex;align-items:center;gap:8px;color:#64748b;font-weight:700;white-space:nowrap}
.rapid-dot{width:10px;height:10px;border-radius:999px;background:#10b981;display:inline-block;box-shadow:0 0 0 4px rgba(16,185,129,.12)}
.modern-search-row{display:grid;grid-template-columns:180px minmax(220px,1fr) 160px 90px 118px;gap:14px;align-items:center;margin-bottom:24px}
.modern-search-row input,.modern-search-row select{background:#fff!important;color:#0f172a!important;border:2px solid #e2e8f0!important;border-radius:18px!important;margin:0!important;min-height:58px;font-size:16px;box-shadow:0 5px 16px rgba(15,23,42,.08)}
.modern-search-row #saleItemSearch{font-size:22px;padding-left:22px}
.modern-black-btn{background:#050505!important;color:#fff!important;border-color:#050505!important;border-radius:18px!important;min-height:58px;font-weight:900;font-size:18px;box-shadow:0 10px 22px rgba(0,0,0,.18);transition:transform .16s ease,box-shadow .16s ease,filter .16s ease!important}
.modern-black-btn:hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(0,0,0,.24)}
.modern-product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;max-height:calc(100vh - 390px);overflow:auto;padding-right:8px;scrollbar-width:thin;scrollbar-color:#f59e0b rgba(0,0,0,.05)}
.modern-product-grid::-webkit-scrollbar{width:10px}.modern-product-grid::-webkit-scrollbar-thumb{background:#f59e0b;border-radius:999px}.modern-product-grid::-webkit-scrollbar-track{background:rgba(0,0,0,.05);border-radius:999px}
.modern-product-card{background:#fff;border:1px solid #e5e7eb;border-radius:24px;padding:22px 20px 20px;box-shadow:0 8px 20px rgba(15,23,42,.08);cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;min-height:292px;display:flex;flex-direction:column;gap:12px}
.modern-product-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(15,23,42,.16);border-color:#fbbf24}
.modern-product-card.is-low{background:linear-gradient(145deg,#fff,#fff7f7);border-color:#fecaca}
.modern-product-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.modern-product-head h4{font-size:25px;line-height:1.12;color:#050816;margin:0;min-height:56px}
.stock-pill{padding:7px 15px;border-radius:999px;font-size:12px;font-weight:900;white-space:nowrap}.stock-pill.ok{background:#dcfce7;color:#047857}.stock-pill.low{background:#fee2e2;color:#b91c1c}
.modern-product-category{color:#64748b;font-size:18px;min-height:22px}
.modern-price-box{background:linear-gradient(135deg,#111827,#1f2937);color:#fff;border-radius:18px;padding:18px 20px;margin-top:auto;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.modern-price-box span{display:block;color:#cbd5e1;font-size:14px;font-weight:800;margin-bottom:4px}.modern-price-box strong{font-size:36px;line-height:1}
.modern-stock-row{display:flex;justify-content:space-between;color:#64748b;font-size:16px}.modern-stock-row strong{color:#0f172a;font-size:18px}
.modern-add-cart{margin:6px 0 0!important;background:linear-gradient(135deg,#fbbf24,#f59e0b)!important;color:#050816!important;border:0!important;border-radius:18px!important;font-size:18px;font-weight:900;min-height:58px;box-shadow:0 12px 20px rgba(245,158,11,.26);transition:transform .16s ease,box-shadow .16s ease!important}.modern-add-cart:hover{transform:translateY(-1px);box-shadow:0 18px 28px rgba(245,158,11,.34)}
.modern-empty-products{grid-column:1/-1;border:2px dashed #e2e8f0;border-radius:18px;padding:28px;text-align:center;color:#64748b;background:#fff}
.modern-current-sale{position:sticky;top:0;border-radius:24px;padding:24px 22px;background:#050918;color:#fff;box-shadow:0 22px 48px rgba(0,0,0,.32);border:1px solid rgba(148,163,184,.18)}
.current-sale-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}.current-sale-header h2{font-size:28px;margin:0;color:#fff}.auto-print-toggle{display:flex;align-items:center;gap:8px;width:auto;color:#fff;font-size:14px;font-weight:700}.auto-print-toggle input{width:auto;margin:0;accent-color:#3b82f6}
.modern-current-sale input,.modern-current-sale select,.modern-current-sale textarea{background:#fff!important;color:#0f172a!important;border:0!important;border-radius:20px!important;min-height:58px;font-size:17px;margin-top:12px!important;padding:14px 18px!important}
.modern-two-inputs{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modern-notes{min-height:74px!important}
.modern-cart-box{margin-top:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);border-radius:20px;padding:14px}.modern-cart-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.modern-empty-cart{border-radius:16px;background:rgba(255,255,255,.06);color:#cbd5e1;padding:18px 20px;font-size:17px}
.modern-cart-line{display:grid;grid-template-columns:minmax(0,1fr) 74px 86px 40px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}.modern-cart-line:last-child{border-bottom:0}.cart-line-main strong{display:block;color:#fff}.cart-line-main span{display:block;color:#94a3b8;font-size:12px}.modern-cart-line input{min-height:44px!important;margin:0!important;border-radius:14px!important;text-align:center;padding:8px!important}.cart-line-total{font-weight:900;color:#fde68a;text-align:right}.modern-cart-line button{margin:0!important;width:36px;height:36px;padding:0;border-radius:12px;background:rgba(220,38,38,.18);border-color:rgba(248,113,113,.32);color:#fecaca;font-size:20px}
.modern-summary-card{margin-top:22px;background:#fff;color:#0f172a;border-radius:22px;padding:20px 22px}.modern-summary-card div{display:flex;justify-content:space-between;gap:16px;align-items:center;color:#475569;font-size:18px;margin:12px 0}.modern-summary-card strong{color:#0f172a}.modern-summary-card hr{border-top:1px solid #e2e8f0;margin:16px 0}.modern-summary-card .grand{font-size:26px;font-weight:900;color:#050816}.modern-summary-card .grand strong{font-size:34px}.modern-summary-card .change-line,.modern-summary-card .change-line strong{color:#047857;font-weight:900}
.modern-sale-buttons{display:grid;grid-template-columns:110px 1fr;gap:14px;margin-top:22px}.modern-sale-buttons button{min-height:62px;border-radius:18px!important;font-size:19px;font-weight:900;margin:0!important}.modern-complete-sale{background:linear-gradient(135deg,#fbbf24,#f59e0b)!important;color:#050816!important;border:0!important;box-shadow:0 15px 28px rgba(245,158,11,.26)!important}.modern-complete-sale:hover{transform:translateY(-1px);box-shadow:0 20px 34px rgba(245,158,11,.34)!important}
.modern-pos-report-strip{margin-top:22px;display:grid;grid-template-columns:minmax(260px,1fr) 230px 150px repeat(4,92px);gap:10px;align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:12px}.modern-pos-report-strip strong{color:#0f172a}.modern-pos-report-strip input,.modern-pos-report-strip select,.modern-pos-report-strip button{margin:0!important;background:#fff!important;color:#0f172a!important;border:1px solid #e2e8f0!important}.modern-pos-report-strip button{background:#0f172a!important;color:#fff!important;font-weight:800}
.modern-report-kpis{margin-top:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.modern-report-kpis .kpi{background:#fff!important;color:#0f172a!important;border:1px solid #e5e7eb!important;box-shadow:0 6px 16px rgba(15,23,42,.08)!important}.modern-report-kpis .kpi .label{color:#64748b}.modern-report-kpis .kpi .value{font-size:20px;color:#0f172a}
.modern-sales-history{margin-top:22px}.modern-sales-history .table-wrap{max-height:430px;overflow:auto}.modern-sales-history table{min-width:780px}
@media (max-width:1200px){.modern-pos-shell{grid-template-columns:1fr}.modern-current-sale{position:relative}.modern-search-row{grid-template-columns:1fr 1fr}.modern-pos-report-strip{grid-template-columns:1fr 1fr}.modern-report-kpis{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.modern-search-row,.modern-two-inputs,.modern-sale-buttons,.modern-pos-report-strip,.modern-report-kpis{grid-template-columns:1fr}.modern-products-pane{padding:16px}.modern-product-grid{grid-template-columns:1fr}.modern-cart-line{grid-template-columns:1fr 70px}.cart-line-total{text-align:left}.modern-cart-line button{width:100%}}

/* Rev72.23 Compact Modern POS interface fit update
   Reduces text, controls and product cards so the POS fits cleanly on normal laptop/desktop screens. */
.modern-pos-shell{
  grid-template-columns:minmax(0,1fr) minmax(340px,390px);
  gap:16px;
}
.modern-products-pane{
  min-height:calc(100vh - 170px);
  padding:18px;
  border-radius:18px;
  min-width:0;
}
.modern-pos-topline{gap:12px;margin-bottom:14px}
.modern-pos-topline h2{font-size:24px;line-height:1.05}
.modern-pos-topline .small{font-size:13px;line-height:1.22;margin-top:6px}
.modern-pos-actions{font-size:13px;gap:6px}
.rapid-dot{width:8px;height:8px;box-shadow:0 0 0 3px rgba(16,185,129,.12)}
.modern-search-row{
  grid-template-columns:150px minmax(180px,1fr) 130px 70px 90px;
  gap:10px;
  margin-bottom:16px;
}
.modern-search-row input,.modern-search-row select{
  min-height:46px!important;
  border-radius:14px!important;
  font-size:14px!important;
  padding:10px 12px!important;
}
.modern-search-row #saleItemSearch{font-size:17px!important;padding-left:14px!important}
.modern-black-btn{
  min-height:46px!important;
  border-radius:14px!important;
  font-size:15px!important;
  box-shadow:0 8px 16px rgba(0,0,0,.16);
}
.modern-product-grid{
  grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  gap:14px;
  max-height:calc(100vh - 335px);
  padding-right:6px;
}
.modern-product-card{
  min-height:218px;
  padding:16px 14px 14px;
  border-radius:18px;
  gap:8px;
}
.modern-product-card:hover{transform:translateY(-2px)}
.modern-product-head{gap:8px}
.modern-product-head h4{
  font-size:20px;
  line-height:1.1;
  min-height:44px;
}
.stock-pill{padding:5px 11px;font-size:11px}
.modern-product-category{font-size:14px;min-height:18px}
.modern-price-box{
  border-radius:14px;
  padding:12px 14px;
}
.modern-price-box span{font-size:12px;margin-bottom:2px}
.modern-price-box strong{font-size:28px;line-height:1.05}
.modern-stock-row{font-size:13px}.modern-stock-row strong{font-size:14px}
.modern-add-cart{
  min-height:44px!important;
  border-radius:14px!important;
  font-size:15px!important;
  margin-top:4px!important;
  box-shadow:0 8px 16px rgba(245,158,11,.22);
}
.modern-current-sale{
  padding:18px 16px;
  border-radius:20px;
  max-height:calc(100vh - 155px);
  overflow:auto;
}
.current-sale-header{margin-bottom:12px}
.current-sale-header h2{font-size:24px;line-height:1.05}
.auto-print-toggle{font-size:12px;gap:6px;white-space:nowrap}
.modern-current-sale input,.modern-current-sale select,.modern-current-sale textarea{
  min-height:46px!important;
  border-radius:15px!important;
  font-size:14px!important;
  margin-top:10px!important;
  padding:10px 13px!important;
}
.modern-two-inputs{gap:10px}
.modern-notes{min-height:54px!important}
.modern-cart-box{margin-top:14px;border-radius:16px;padding:12px}
.modern-cart-title{margin-bottom:8px;font-size:13px}
.modern-empty-cart{padding:13px 14px;font-size:14px;border-radius:14px}
.modern-cart-line{grid-template-columns:minmax(0,1fr) 58px 72px 34px;gap:7px;padding:8px 0}
.cart-line-main strong{font-size:14px}.cart-line-main span{font-size:11px}
.modern-cart-line input{min-height:36px!important;border-radius:11px!important;font-size:13px!important;padding:6px!important}
.cart-line-total{font-size:13px}.modern-cart-line button{width:30px;height:30px;border-radius:10px;font-size:17px}
.modern-summary-card{margin-top:14px;border-radius:16px;padding:14px 16px}
.modern-summary-card div{font-size:14px;margin:8px 0}.modern-summary-card hr{margin:10px 0}
.modern-summary-card .grand{font-size:20px}.modern-summary-card .grand strong{font-size:25px}
.modern-sale-buttons{grid-template-columns:88px 1fr;gap:10px;margin-top:14px}
.modern-sale-buttons button{min-height:48px!important;border-radius:14px!important;font-size:15px!important}
.modern-pos-report-strip{margin-top:16px;grid-template-columns:minmax(220px,1fr) 180px 130px repeat(4,76px);gap:8px;border-radius:14px;padding:10px;font-size:12px}
.modern-pos-report-strip .small{font-size:11px}.modern-pos-report-strip input,.modern-pos-report-strip select,.modern-pos-report-strip button{min-height:38px!important;font-size:12px!important;padding:7px 8px!important;border-radius:10px!important}
.modern-report-kpis{gap:8px;margin-top:10px}.modern-report-kpis .kpi{padding:11px!important;border-radius:14px!important}.modern-report-kpis .kpi .value{font-size:16px}
.modern-sales-history{margin-top:16px}.modern-sales-history .table-wrap{max-height:330px}
@media (max-width:1360px){
  .modern-pos-shell{grid-template-columns:minmax(0,1fr) minmax(320px,370px);gap:14px}
  .modern-product-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
  .modern-product-card{min-height:205px;padding:14px 12px}
  .modern-product-head h4{font-size:18px;min-height:40px}
  .modern-price-box strong{font-size:25px}
  .modern-add-cart{min-height:40px!important;font-size:14px!important}
}

/* Rev72.24 Ultra Compact POS fit update
   Further reduces heading, number, button, card and input sizes so the modern POS fits neatly on laptop screens. */
.modern-pos-shell{
  grid-template-columns:minmax(0,1fr) minmax(300px,340px)!important;
  gap:12px!important;
}
.modern-products-pane{
  min-height:calc(100vh - 150px)!important;
  padding:14px!important;
  border-radius:16px!important;
}
.modern-pos-topline{gap:8px!important;margin-bottom:10px!important;align-items:flex-start!important}
.modern-pos-topline h2{font-size:20px!important;line-height:1.02!important;letter-spacing:-.02em!important}
.modern-pos-topline .small{font-size:11px!important;line-height:1.15!important;margin-top:4px!important;max-width:270px!important}
.modern-pos-actions{font-size:11px!important;gap:5px!important;line-height:1.1!important}
.rapid-dot{width:7px!important;height:7px!important;box-shadow:0 0 0 3px rgba(16,185,129,.11)!important}
.modern-search-row{
  grid-template-columns:130px minmax(150px,1fr) 105px 54px 72px!important;
  gap:8px!important;
  margin-bottom:12px!important;
}
.modern-search-row input,.modern-search-row select{
  min-height:38px!important;
  border-radius:12px!important;
  font-size:12px!important;
  padding:7px 9px!important;
  border-width:1px!important;
}
.modern-search-row #saleItemSearch{font-size:14px!important;padding-left:10px!important}
.modern-black-btn{
  min-height:38px!important;
  border-radius:12px!important;
  font-size:12px!important;
  padding:7px 10px!important;
}
.modern-product-grid{
  grid-template-columns:repeat(auto-fill,minmax(145px,1fr))!important;
  gap:10px!important;
  max-height:calc(100vh - 285px)!important;
  padding-right:5px!important;
}
.modern-product-card{
  min-height:178px!important;
  padding:11px 10px!important;
  border-radius:15px!important;
  gap:6px!important;
}
.modern-product-card:hover{transform:translateY(-1px)!important}
.modern-product-head{gap:6px!important}
.modern-product-head h4{
  font-size:15px!important;
  line-height:1.08!important;
  min-height:32px!important;
  letter-spacing:-.02em!important;
}
.stock-pill{padding:4px 8px!important;font-size:9px!important;line-height:1.1!important}
.modern-product-category{font-size:11px!important;min-height:14px!important;line-height:1.15!important}
.modern-price-box{
  border-radius:12px!important;
  padding:9px 10px!important;
}
.modern-price-box span{font-size:10px!important;margin-bottom:2px!important;line-height:1.1!important}
.modern-price-box strong{font-size:21px!important;line-height:1!important;letter-spacing:-.03em!important}
.modern-stock-row{font-size:11px!important;line-height:1.1!important}.modern-stock-row strong{font-size:12px!important}
.modern-add-cart{
  min-height:35px!important;
  border-radius:12px!important;
  font-size:12px!important;
  margin-top:3px!important;
  padding:7px 8px!important;
}
.modern-current-sale{
  padding:14px 12px!important;
  border-radius:17px!important;
  max-height:calc(100vh - 145px)!important;
}
.current-sale-header{margin-bottom:9px!important;gap:7px!important}
.current-sale-header h2{font-size:20px!important;line-height:1.02!important;letter-spacing:-.02em!important}
.auto-print-toggle{font-size:10px!important;gap:4px!important}.auto-print-toggle input{transform:scale(.85)!important}
.modern-current-sale input,.modern-current-sale select,.modern-current-sale textarea{
  min-height:38px!important;
  border-radius:12px!important;
  font-size:12px!important;
  margin-top:8px!important;
  padding:8px 10px!important;
}
.modern-two-inputs{gap:8px!important}.modern-notes{min-height:42px!important}
.modern-cart-box{margin-top:10px!important;border-radius:14px!important;padding:9px!important}
.modern-cart-title{margin-bottom:6px!important;font-size:11px!important}
.modern-empty-cart{padding:10px 11px!important;font-size:12px!important;border-radius:12px!important}
.modern-cart-line{grid-template-columns:minmax(0,1fr) 46px 58px 28px!important;gap:6px!important;padding:6px 0!important}
.cart-line-main strong{font-size:12px!important}.cart-line-main span{font-size:10px!important}.cart-line-total{font-size:11px!important}
.modern-cart-line input{min-height:30px!important;border-radius:9px!important;font-size:11px!important;padding:4px!important}
.modern-cart-line button{width:25px!important;height:25px!important;border-radius:8px!important;font-size:14px!important}
.modern-summary-card{margin-top:10px!important;border-radius:14px!important;padding:11px 12px!important}
.modern-summary-card div{font-size:12px!important;margin:6px 0!important}.modern-summary-card hr{margin:8px 0!important}
.modern-summary-card .grand{font-size:16px!important}.modern-summary-card .grand strong{font-size:20px!important}
.modern-sale-buttons{grid-template-columns:70px 1fr!important;gap:8px!important;margin-top:10px!important}
.modern-sale-buttons button{min-height:40px!important;border-radius:12px!important;font-size:12px!important;padding:8px!important}
.modern-pos-report-strip{margin-top:12px!important;grid-template-columns:minmax(180px,1fr) 140px 100px repeat(4,62px)!important;gap:6px!important;border-radius:12px!important;padding:8px!important;font-size:10px!important}
.modern-pos-report-strip .small{font-size:9px!important}.modern-pos-report-strip input,.modern-pos-report-strip select,.modern-pos-report-strip button{min-height:30px!important;font-size:10px!important;padding:5px 6px!important;border-radius:8px!important}
.modern-report-kpis{gap:6px!important;margin-top:8px!important}.modern-report-kpis .kpi{padding:8px!important;border-radius:12px!important}.modern-report-kpis .kpi .label{font-size:10px!important}.modern-report-kpis .kpi .value{font-size:13px!important}
.modern-sales-history{margin-top:12px!important}.modern-sales-history .table-wrap{max-height:285px!important}
@media (max-width:1360px){
  .modern-pos-shell{grid-template-columns:minmax(0,1fr) minmax(285px,320px)!important;gap:10px!important}
  .modern-product-grid{grid-template-columns:repeat(auto-fill,minmax(135px,1fr))!important;gap:8px!important;max-height:calc(100vh - 275px)!important}
  .modern-product-card{min-height:168px!important;padding:10px 9px!important}
  .modern-product-head h4{font-size:14px!important;min-height:30px!important}
  .modern-price-box strong{font-size:19px!important}
  .modern-add-cart{min-height:32px!important;font-size:11px!important}
  .modern-search-row{grid-template-columns:118px minmax(130px,1fr) 92px 50px 64px!important;gap:7px!important}
}

/* Rev72.25 POS orderly fit and report button containment
   Tightens product cards further and forces the daily report controls to fit inside the POS window. */
.modern-products-pane{
  overflow:hidden!important;
  padding:12px!important;
}
.modern-product-grid{
  grid-template-columns:repeat(auto-fill,minmax(126px,1fr))!important;
  gap:7px!important;
  max-height:calc(100vh - 260px)!important;
  padding-right:4px!important;
}
.modern-product-card{
  min-height:148px!important;
  padding:8px 8px!important;
  border-radius:13px!important;
  gap:4px!important;
}
.modern-product-head h4{
  font-size:12px!important;
  line-height:1.05!important;
  min-height:24px!important;
}
.stock-pill{
  padding:3px 6px!important;
  font-size:8px!important;
}
.modern-product-category{
  font-size:10px!important;
  min-height:12px!important;
}
.modern-price-box{
  padding:7px 8px!important;
  border-radius:10px!important;
}
.modern-price-box span{
  font-size:8px!important;
}
.modern-price-box strong{
  font-size:17px!important;
  line-height:1!important;
}
.modern-stock-row{
  font-size:9px!important;
}
.modern-stock-row strong{
  font-size:10px!important;
}
.modern-add-cart{
  min-height:28px!important;
  border-radius:10px!important;
  font-size:10px!important;
  padding:5px 6px!important;
}
.modern-search-row{
  grid-template-columns:112px minmax(130px,1fr) 88px 46px 58px!important;
  gap:6px!important;
  margin-bottom:9px!important;
}
.modern-search-row input,.modern-search-row select,.modern-black-btn{
  min-height:32px!important;
  border-radius:10px!important;
  font-size:10px!important;
  padding:5px 7px!important;
}
.modern-search-row #saleItemSearch{
  font-size:11px!important;
}
.modern-pos-report-strip{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  margin-top:9px!important;
  display:grid!important;
  grid-template-columns:minmax(150px,1fr) minmax(120px,150px) 92px repeat(4,minmax(46px,54px))!important;
  gap:5px!important;
  padding:7px!important;
  border-radius:11px!important;
  align-items:center!important;
}
.modern-pos-report-strip strong{font-size:10px!important;line-height:1.05!important;display:block!important}
.modern-pos-report-strip .small{font-size:8px!important;line-height:1.05!important;margin:3px 0 0!important}
.modern-pos-report-strip input,.modern-pos-report-strip select,.modern-pos-report-strip button{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  min-height:28px!important;
  font-size:9px!important;
  padding:4px 5px!important;
  border-radius:7px!important;
  white-space:nowrap!important;
}
.modern-report-kpis{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
@media (max-width:1500px){
  .modern-pos-shell{grid-template-columns:minmax(0,1fr) minmax(290px,330px)!important;gap:8px!important}
  .modern-pos-report-strip{grid-template-columns:minmax(140px,1fr) minmax(115px,140px) 88px repeat(4,minmax(42px,50px))!important;gap:4px!important}
  .modern-pos-report-strip button{font-size:8.5px!important;padding-left:3px!important;padding-right:3px!important}
}
@media (max-width:1280px){
  .modern-pos-report-strip{grid-template-columns:1fr 1fr 90px repeat(4,48px)!important}
  .modern-product-grid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))!important}
}
@media (max-width:980px){
  .modern-pos-report-strip{grid-template-columns:1fr 1fr!important;overflow:visible!important}
}

/* Rev72.29 Admin POS sale delete action */
.actions .danger-btn,
button.danger-btn {
  background: linear-gradient(135deg, #b91c1c, #ef4444);
  color: #fff;
  border-color: rgba(248, 113, 113, 0.45);
}
.actions .danger-btn:hover,
button.danger-btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

/* Rev72.36 Check-In POS-style payment workflow
   Removes the separate Open Front Desk POS shortcut and makes Check In itself handle payment flow. */
.checkin-pos-card{
  background:linear-gradient(145deg,rgba(2,10,28,.98),rgba(8,25,54,.96))!important;
  border-color:rgba(59,130,246,.24)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.checkin-pos-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  margin-bottom:14px;
}
.checkin-pos-head h3{
  margin:0 0 4px!important;
  font-size:22px!important;
  letter-spacing:-.02em;
}
.checkin-live-pill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(16,185,129,.12);
  border:1px solid rgba(52,211,153,.28);
  color:#bbf7d0;
  font-weight:800;
  font-size:12px;
  white-space:nowrap;
}
.checkin-live-pill span{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#34d399;
  box-shadow:0 0 0 5px rgba(52,211,153,.12);
}
.checkin-pos-grid input,
.checkin-pos-grid select,
.checkin-pos-grid textarea{
  background:rgba(255,255,255,.05)!important;
  border-color:rgba(96,165,250,.24)!important;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease!important;
}
.checkin-pos-grid input:focus,
.checkin-pos-grid select:focus,
.checkin-pos-grid textarea:focus{
  border-color:rgba(251,191,36,.70)!important;
  box-shadow:0 0 0 4px rgba(251,191,36,.10)!important;
  transform:translateY(-1px);
}
.checkin-payment-panel{
  margin:4px 0 2px;
  padding:14px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(248,250,252,.98),rgba(241,245,249,.93));
  border:1px solid rgba(226,232,240,.95);
  box-shadow:0 15px 32px rgba(0,0,0,.20);
}
.checkin-payment-title{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-end;
  margin-bottom:10px;
}
.checkin-payment-title strong{
  color:#0f172a;
  font-size:16px;
}
.checkin-payment-title span{
  color:#64748b;
  font-size:12px;
  text-align:right;
}
.checkin-payment-controls{
  display:grid;
  grid-template-columns:minmax(180px,240px) minmax(180px,1fr);
  gap:10px;
}
.checkin-payment-controls select,
.checkin-payment-controls input{
  background:#fff!important;
  color:#0f172a!important;
  border:1px solid #dbeafe!important;
  border-radius:14px!important;
  min-height:46px!important;
  font-size:14px!important;
}
.checkin-payment-preview{
  margin-top:10px!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px!important;
  padding:10px!important;
  border-radius:14px!important;
  background:#0f172a!important;
  color:#e2e8f0!important;
  border:1px solid rgba(148,163,184,.18)!important;
}
.checkin-payment-preview span{
  display:block;
  font-size:12px;
  line-height:1.25;
}
.checkin-payment-preview b{
  color:#fde68a;
}
.checkin-payment-preview.credit-mode{
  background:#172554!important;
}
.cash-attention.needs-cash{
  border-color:#f59e0b!important;
  animation:cashFieldPulse 1.15s ease-in-out infinite;
}
.cash-attention.cash-short{
  border-color:#ef4444!important;
  box-shadow:0 0 0 4px rgba(239,68,68,.13)!important;
  animation:cashFieldShake .22s ease-in-out 2;
}
@keyframes cashFieldPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.28)}
  50%{box-shadow:0 0 0 8px rgba(245,158,11,.08)}
}
@keyframes cashFieldShake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-3px)}
  75%{transform:translateX(3px)}
}
.checkin-actions{
  display:flex;
  justify-content:flex-start;
  gap:10px;
}
.checkin-main-btn{
  min-height:48px!important;
  border-radius:16px!important;
  padding:12px 20px!important;
  font-weight:900!important;
  background:linear-gradient(135deg,#dc2626,#ef4444)!important;
  box-shadow:0 14px 26px rgba(220,38,38,.24)!important;
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease!important;
}
.checkin-main-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 34px rgba(220,38,38,.34)!important;
  filter:brightness(1.05);
}
@media (max-width:900px){
  .checkin-pos-head,.checkin-payment-title{display:block}
  .checkin-live-pill{margin-top:10px}
  .checkin-payment-controls,.checkin-payment-preview{grid-template-columns:1fr!important}
}


/* Rev72.38 Check-In branded POS-standard UX polish */
.checkin-pos-card{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 0%, rgba(220,38,38,.22), transparent 34%),
    radial-gradient(circle at 92% 10%, rgba(245,158,11,.18), transparent 28%),
    linear-gradient(145deg, rgba(2,10,28,.99), rgba(7,24,52,.98) 58%, rgba(2,12,28,.99))!important;
  border:1px solid rgba(251,191,36,.20)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.checkin-pos-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:linear-gradient(180deg,#dc2626,#f59e0b,#10b981);
  opacity:.95;
}
.checkin-pos-card::after{
  content:"FRONT DESK PAYMENT";
  position:absolute;
  right:18px;
  bottom:18px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
  color:rgba(255,255,255,.055);
  pointer-events:none;
}
.checkin-pos-head{
  padding:14px 16px;
  margin:-4px 0 14px;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(15,23,42,.70),rgba(30,41,59,.42));
  border:1px solid rgba(148,163,184,.13);
}
.checkin-pos-head h3{
  color:#fff!important;
  font-size:24px!important;
  text-shadow:0 2px 16px rgba(0,0,0,.30);
}
.checkin-subtitle{
  color:#b6c6e6!important;
  max-width:620px;
}
.checkin-live-pill{
  background:linear-gradient(135deg,rgba(16,185,129,.24),rgba(5,150,105,.12))!important;
  border-color:rgba(52,211,153,.44)!important;
  color:#d1fae5!important;
  box-shadow:0 10px 28px rgba(16,185,129,.12);
  animation:checkinReadyGlow 1.8s ease-in-out infinite;
}
@keyframes checkinReadyGlow{
  0%,100%{transform:translateY(0); box-shadow:0 10px 24px rgba(16,185,129,.10)}
  50%{transform:translateY(-1px); box-shadow:0 16px 32px rgba(16,185,129,.20)}
}
.checkin-pos-grid{
  gap:14px 16px!important;
}
.checkin-pos-grid input,
.checkin-pos-grid select,
.checkin-pos-grid textarea{
  min-height:52px!important;
  border-radius:17px!important;
  background:linear-gradient(135deg,rgba(15,23,42,.88),rgba(15,35,68,.70))!important;
  color:#f8fafc!important;
  border:1px solid rgba(96,165,250,.32)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035), 0 12px 24px rgba(0,0,0,.10);
}
.checkin-pos-grid input::placeholder,
.checkin-pos-grid textarea::placeholder{color:#9fb2d4!important;opacity:.95}
.checkin-pos-grid input:hover,
.checkin-pos-grid select:hover,
.checkin-pos-grid textarea:hover{
  border-color:rgba(251,191,36,.46)!important;
  background:linear-gradient(135deg,rgba(20,31,55,.94),rgba(17,45,85,.78))!important;
}
.checkin-pos-grid input:focus,
.checkin-pos-grid select:focus,
.checkin-pos-grid textarea:focus{
  border-color:#fbbf24!important;
  box-shadow:0 0 0 4px rgba(251,191,36,.14), 0 14px 30px rgba(0,0,0,.18)!important;
}
.checkin-rate-hint{
  margin:0!important;
  padding:12px 14px!important;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(251,191,36,.12),rgba(14,165,233,.08));
  border:1px dashed rgba(251,191,36,.36);
  color:#dbeafe!important;
}
.checkin-rate-hint strong{color:#fde68a!important}
.checkin-payment-panel{
  background:
    radial-gradient(circle at 0% 0%,rgba(34,197,94,.16),transparent 32%),
    linear-gradient(135deg,#f8fafc,#fff7ed 62%,#fef3c7)!important;
  border:1px solid rgba(251,191,36,.55)!important;
  box-shadow:0 18px 38px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.checkin-payment-title strong{
  color:#991b1b!important;
  font-size:17px!important;
  letter-spacing:-.01em;
}
.checkin-payment-title span{
  color:#475569!important;
  font-weight:700;
}
.checkin-payment-controls select,
.checkin-payment-controls input{
  min-height:50px!important;
  background:#ffffff!important;
  color:#0f172a!important;
  border:1px solid #cbd5e1!important;
  box-shadow:0 8px 18px rgba(15,23,42,.08)!important;
}
.checkin-payment-controls input.cash-attention{
  font-weight:900!important;
  border-color:#f59e0b!important;
  background:linear-gradient(135deg,#fff,#fffbeb)!important;
}
.checkin-payment-controls input.cash-attention::placeholder{color:#b45309!important;font-weight:800!important}
.checkin-payment-preview{
  background:linear-gradient(135deg,#020617,#111827)!important;
  border:1px solid rgba(251,191,36,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.checkin-payment-preview span{
  padding:7px 8px;
  border-radius:10px;
  background:rgba(255,255,255,.045);
}
.checkin-payment-preview b{color:#fcd34d!important}
.checkin-main-btn{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#b91c1c,#dc2626 52%,#f59e0b)!important;
  border-color:rgba(252,211,77,.55)!important;
  text-transform:none;
}
.checkin-main-btn::after{
  content:"";
  position:absolute;
  top:-70%;
  left:-30%;
  width:40%;
  height:240%;
  transform:rotate(25deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);
  animation:checkinButtonSweep 2.6s ease-in-out infinite;
}
.checkin-main-btn span{position:relative;z-index:1}
@keyframes checkinButtonSweep{
  0%{left:-45%}
  45%,100%{left:130%}
}
.checkin-actions button:not(.checkin-main-btn),
.form-card.checkin-pos-card + div button,
#checkOutBtn,
button[data-open-frontdesk-pos]{
  border-radius:14px!important;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}
.checkin-actions button:not(.checkin-main-btn):hover,
#checkOutBtn:hover,
button[data-open-frontdesk-pos]:hover{
  transform:translateY(-1px);
  border-color:rgba(251,191,36,.50)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
}

/* Rev72.39 Check-In layout: active guest list moved below the form */
.checkin-stack-layout{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:18px!important;
  align-items:start!important;
  width:100%!important;
}
.checkin-stack-layout > .checkin-form-wide,
.checkin-stack-layout > .active-stays-card{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
.checkin-stack-layout .checkin-pos-card{
  grid-column:1 / -1!important;
}
.active-stays-card{
  background:linear-gradient(145deg,rgba(2,12,30,.98),rgba(8,24,52,.96))!important;
  border:1px solid rgba(96,165,250,.24)!important;
  box-shadow:0 20px 55px rgba(0,0,0,.26)!important;
  overflow:hidden!important;
}
.section-head-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:12px;
}
.section-head-row h3{
  margin:0 0 4px!important;
  color:#fff!important;
}
.status-badge.active{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(16,185,129,.16);
  color:#86efac;
  border:1px solid rgba(52,211,153,.28);
  font-weight:800;
  white-space:nowrap;
}
.full-width-table .table-wrap{
  max-height:460px;
  overflow:auto!important;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.16);
}
.full-width-table table{
  min-width:980px;
}
.full-width-table th,
.full-width-table td{
  padding:10px 12px!important;
  line-height:1.22!important;
}
.full-width-table .actions{
  gap:6px!important;
}
.full-width-table .actions button{
  padding:8px 10px!important;
  min-height:34px!important;
  border-radius:10px!important;
  font-size:12px!important;
}
@media (max-width: 900px){
  .section-head-row{display:block}
  .status-badge.active{margin-top:8px}
  .full-width-table table{min-width:820px}
}

/* Rev72.41 - Branded Reservation POS-style UX */
.reservation-pos-layout{
  /* Rev72.43: keep the Latest Reservations register below the New Reservation desk.
     This prevents the register from sitting beside the form on wide screens and
     makes the reservation workflow easier for front-desk users. */
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:22px !important;
  align-items:start !important;
}
.reservation-pos-card{
  width:100%;
  max-width:1120px;
  position:relative;
  overflow:hidden !important;
  padding:24px !important;
  border-radius:26px !important;
  border:1px solid rgba(246,196,67,.28) !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(246,196,67,.14), transparent 28%),
    radial-gradient(circle at 3% 92%, rgba(197,22,29,.20), transparent 30%),
    linear-gradient(145deg, rgba(8,18,38,.98), rgba(10,27,54,.96) 55%, rgba(5,15,33,.98)) !important;
  box-shadow:0 24px 55px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
.reservation-pos-bg-orb{
  position:absolute;
  width:220px;
  height:220px;
  border-radius:999px;
  opacity:.18;
  filter:blur(10px);
  pointer-events:none;
  animation:reservationFloat 7s ease-in-out infinite;
}
.reservation-pos-bg-orb.orb-red{background:#c5161d;left:-88px;bottom:-88px;}
.reservation-pos-bg-orb.orb-gold{background:#f6c443;right:-105px;top:-105px;animation-delay:1.4s;}
@keyframes reservationFloat{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(12px,-10px,0) scale(1.06)}
}
.reservation-pos-head,
.reservation-list-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}
.reservation-pos-head h3,
.reservation-list-head h3{
  font-size:26px;
  line-height:1.1;
  margin:3px 0 6px;
  letter-spacing:-.03em;
}
.reservation-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#f6c443;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.reservation-live-pill,
.reservation-count-pill{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(16,185,129,.34);
  background:linear-gradient(135deg, rgba(16,185,129,.18), rgba(22,163,74,.10));
  color:#bbf7d0;
  font-size:12px;
  font-weight:900;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}
.reservation-live-pill span{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#34d399;
  box-shadow:0 0 0 5px rgba(52,211,153,.16), 0 0 18px rgba(52,211,153,.75);
  animation:reservationPulse 1.55s ease-in-out infinite;
}
@keyframes reservationPulse{
  0%,100%{transform:scale(.88);opacity:.78}
  50%{transform:scale(1.13);opacity:1}
}
.reservation-quick-strip{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
  margin:18px 0 18px;
}
.reservation-mini-stat{
  min-height:68px;
  padding:12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  background:linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
}
.reservation-mini-stat strong{
  display:block;
  font-size:21px;
  line-height:1;
  color:#fff;
}
.reservation-mini-stat span{
  display:block;
  margin-top:7px;
  font-size:11px;
  color:#aebdda;
}
.reservation-pos-grid{
  position:relative;
  z-index:1;
  gap:14px !important;
}
.reservation-field{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin:0;
  min-width:0;
}
.reservation-field span{
  font-size:11px;
  font-weight:800;
  color:#dbeafe;
  letter-spacing:.04em;
  text-transform:uppercase;
  opacity:.92;
}
.reservation-field input,
.reservation-field select,
.reservation-field textarea{
  margin-top:0 !important;
  min-height:50px;
  border-radius:16px !important;
  border:1px solid rgba(96,165,250,.28) !important;
  background:linear-gradient(145deg, rgba(11,27,54,.95), rgba(8,18,38,.95)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 8px 18px rgba(0,0,0,.13);
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.reservation-field input:hover,
.reservation-field select:hover,
.reservation-field textarea:hover{
  border-color:rgba(246,196,67,.46) !important;
}
.reservation-field input:focus,
.reservation-field select:focus,
.reservation-field textarea:focus{
  outline:none;
  transform:translateY(-1px);
  border-color:rgba(246,196,67,.86) !important;
  box-shadow:0 0 0 4px rgba(246,196,67,.12), 0 12px 24px rgba(0,0,0,.20) !important;
}
.reservation-date-field input{
  border-color:rgba(246,196,67,.36) !important;
}
.money-field input{
  border-color:rgba(16,185,129,.36) !important;
}
.reservation-notes textarea{
  min-height:108px;
}
.reservation-actions{
  position:relative;
  z-index:1;
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:18px;
}
.reservation-save-btn,
.reservation-clear-btn{
  width:auto !important;
  min-width:170px;
  min-height:52px;
  border-radius:16px !important;
  font-weight:900;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.reservation-save-btn{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg, #c5161d, #ef4444 45%, #f59e0b) !important;
  border-color:rgba(246,196,67,.34) !important;
  box-shadow:0 16px 28px rgba(197,22,29,.25), 0 0 0 1px rgba(255,255,255,.04) inset;
}
.reservation-save-btn::after{
  content:"";
  position:absolute;
  inset:-80% auto auto -40%;
  width:44%;
  height:260%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  transform:rotate(18deg);
  animation:reservationButtonShine 4.2s linear infinite;
}
@keyframes reservationButtonShine{0%{left:-42%}100%{left:128%}}
.reservation-save-btn:hover,
.reservation-clear-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 30px rgba(0,0,0,.26);
}
.reservation-save-btn:active,
.reservation-clear-btn:active{
  transform:translateY(0) scale(.99);
}
.reservation-clear-btn{
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(255,255,255,.16) !important;
}
.reservation-list-panel{
  width:100%;
  max-width:1120px;
  min-width:0;
  padding:20px;
  border-radius:24px;
  border:1px solid rgba(71,85,105,.55);
  background:linear-gradient(145deg, rgba(8,18,38,.95), rgba(7,24,48,.94));
  box-shadow:0 22px 45px rgba(0,0,0,.28);
}
.reservation-list-panel .table-wrap{
  max-height:520px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.06);
}
.reservation-list-panel table{
  font-size:13px;
}
.reservation-list-panel th{
  color:#fde68a;
  background:rgba(5,15,33,.98);
}
.reservation-table-actions button{
  padding:8px 12px;
  border-radius:12px;
}
@media (max-width: 1180px){
  .reservation-pos-layout{grid-template-columns:1fr !important;}
  .reservation-pos-card{padding:20px !important;}
}
@media (max-width: 720px){
  .reservation-pos-grid{grid-template-columns:1fr !important;}
  .reservation-quick-strip{grid-template-columns:1fr;}
  .reservation-pos-head,.reservation-list-head{flex-direction:column;}
  .reservation-save-btn,.reservation-clear-btn{width:100% !important;}
}


/* Rev72.43 - Reservation register under form layout fix */
.reservation-pos-layout{
  grid-template-columns:1fr !important;
}
.reservation-pos-card,
.reservation-list-panel{
  width:100% !important;
  max-width:1120px !important;
  margin-left:0 !important;
  margin-right:auto !important;
}
.reservation-list-panel{
  margin-top:2px !important;
}
.reservation-list-panel .table-wrap{
  overflow:auto !important;
}
.reservation-list-panel table{
  min-width:980px;
}

/* REV72.42 - GLOBAL DARK DROPDOWN LIST FIX
   Removes unreadable white option popup backgrounds across the whole system.
   Applies to Reservations, Check In/Out, POS, Reports, Purchasing, Clients,
   Branding/Setup and every other native select list. */
select,
select.form-control,
select.dark-select {
  color-scheme: dark !important;
  background-color: #071833 !important;
  color: #f8fafc !important;
}
select option,
select optgroup {
  background-color: #071833 !important;
  color: #f8fafc !important;
  font-weight: 700;
}
select option:checked,
select option:hover,
select option:focus {
  background-color: #c5161d !important;
  color: #ffffff !important;
}
select optgroup {
  color: #f6c443 !important;
  font-style: normal;
}

/* Keep POS/modern light input boxes readable, but force their opened dropdown options dark. */
.modern-search-row select option,
.modern-current-sale select option,
.modern-pos-report-strip select option,
.checkin-pos-grid select option,
.checkin-payment-controls select option,
.reservation-field select option,
.pos-sale-card select option,
.smart-item-row select option {
  background-color: #071833 !important;
  color: #f8fafc !important;
}
.modern-search-row select option:checked,
.modern-current-sale select option:checked,
.modern-pos-report-strip select option:checked,
.checkin-pos-grid select option:checked,
.checkin-payment-controls select option:checked,
.reservation-field select option:checked,
.pos-sale-card select option:checked,
.smart-item-row select option:checked {
  background-color: #c5161d !important;
  color: #ffffff !important;
}

/* Dark readable browser autofill/dropdown helper treatment where Chromium supports it. */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: #f8fafc !important;
  -webkit-box-shadow: 0 0 0 1000px #071833 inset !important;
  transition: background-color 9999s ease-in-out 0s;
}


/* Rev72.44 - Reservation availability / double booking protection */
.reservation-availability-note {
  border-radius: 16px;
  padding: 11px 14px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .01em;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(10, 20, 40, .78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.reservation-availability-note.ok {
  color: #bbf7d0;
  border-color: rgba(34,197,94,.35);
  background: linear-gradient(135deg, rgba(5,72,48,.92), rgba(4,28,38,.84));
}
.reservation-availability-note.warn {
  color: #fde68a;
  border-color: rgba(245,158,11,.45);
  background: linear-gradient(135deg, rgba(84,57,7,.75), rgba(14,25,46,.86));
}
.reservation-availability-note.danger {
  color: #fecaca;
  border-color: rgba(239,68,68,.45);
  background: linear-gradient(135deg, rgba(86,20,20,.82), rgba(14,25,46,.86));
  animation: availabilityPulse 1.4s ease-in-out infinite;
}
@keyframes availabilityPulse {
  0%, 100% { box-shadow: 0 0 0 rgba(239,68,68,0); }
  50% { box-shadow: 0 0 18px rgba(239,68,68,.22); }
}

/* Rev72.45 - Selected Room summary should reflect chosen room, not default room */
.selected-room-stat{
  border-color:rgba(245, 158, 11, .42);
  background:linear-gradient(145deg, rgba(245,158,11,.14), rgba(16,185,129,.08), rgba(255,255,255,.025));
  box-shadow:0 10px 25px rgba(245,158,11,.08);
}
.selected-room-stat strong{
  color:#fff7d6;
}
.selected-room-stat span{
  color:#f8d36b;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

/* Rev72.47: Card/EFTPOS bank/network selector */
.card-provider-select{
  border-color:#f59e0b!important;
  box-shadow:0 0 0 1px rgba(245,158,11,.12), 0 10px 22px rgba(245,158,11,.10)!important;
  font-weight:800!important;
}
.card-provider-select:focus{
  outline:none!important;
  border-color:#22c55e!important;
  box-shadow:0 0 0 3px rgba(34,197,94,.20), 0 12px 24px rgba(15,23,42,.16)!important;
}
.checkin-payment-controls{
  grid-template-columns:minmax(160px,220px) minmax(180px,260px) minmax(220px,1fr)!important;
}
@media (max-width:1100px){
  .checkin-payment-controls{grid-template-columns:1fr!important;}
}


/* rev72.48 compact animated dashboard ux */
.dashboard-hero-strip{
  margin: 8px 0 14px;
  padding: 14px 18px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 12% 30%, rgba(245,158,11,.22), transparent 34%),
    radial-gradient(circle at 85% 18%, rgba(34,197,94,.18), transparent 30%),
    linear-gradient(135deg, rgba(8,25,50,.96), rgba(5,15,31,.96));
  box-shadow: 0 14px 35px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.06);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  overflow:hidden;
  position:relative;
}
.dashboard-hero-strip::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,.07) 48%, transparent 70%);
  transform:translateX(-120%);
  animation: dashboardShine 6s ease-in-out infinite;
  pointer-events:none;
}
.dashboard-eyebrow{
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .20em;
  margin-bottom: 4px;
}
.dashboard-hero-strip h2{
  margin:0;
  font-size: 22px;
  line-height:1.1;
}
.dashboard-hero-strip p{
  margin:4px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.dashboard-hero-pills{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.pulse-pill{
  border-radius:999px;
  padding:8px 11px;
  font-weight:900;
  font-size:12px;
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  white-space:nowrap;
  animation: softPulse 2.8s ease-in-out infinite;
}
.pulse-pill.green{background:rgba(16,185,129,.20); color:#bbf7d0; border-color:rgba(16,185,129,.35)}
.pulse-pill.gold{background:rgba(245,158,11,.20); color:#fde68a; border-color:rgba(245,158,11,.35)}
.pulse-pill.red{background:rgba(239,68,68,.18); color:#fecaca; border-color:rgba(239,68,68,.32)}
.dashboard-kpi-section{margin-bottom:14px}
.dashboard-kpis{
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 12px !important;
}
.dashboard-kpis .kpi.dashboard-mini-kpi{
  min-height: 92px !important;
  padding: 14px 16px !important;
  justify-content:flex-end !important;
  border-radius: 17px !important;
  background: linear-gradient(145deg, rgba(10,31,61,.98), rgba(8,21,43,.98)) !important;
  border:1px solid rgba(96,165,250,.18) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.dashboard-kpis .kpi.dashboard-mini-kpi .label{
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #aebed4 !important;
  margin-bottom: 4px !important;
  line-height: 1.15 !important;
}
.dashboard-kpis .kpi.dashboard-mini-kpi .value{
  font-size: 25px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing:-.04em;
}
.dashboard-kpis .kpi.dashboard-mini-kpi .kpi-icon{
  position:absolute;
  right:12px;
  top:10px;
  width:28px;
  height:28px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:900;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.08);
}
.dashboard-kpis .kpi.dashboard-mini-kpi .kpi-glow{
  position:absolute;
  width:90px;
  height:90px;
  right:-35px;
  bottom:-42px;
  border-radius:50%;
  opacity:.22;
  filter: blur(8px);
}
.kpi-tone-green .value,.kpi-tone-green .kpi-icon{color:#86efac!important}.kpi-tone-green .kpi-glow{background:#22c55e}
.kpi-tone-gold .value,.kpi-tone-gold .kpi-icon{color:#fde68a!important}.kpi-tone-gold .kpi-glow{background:#f59e0b}
.kpi-tone-blue .value,.kpi-tone-blue .kpi-icon{color:#93c5fd!important}.kpi-tone-blue .kpi-glow{background:#3b82f6}
.kpi-tone-red .value,.kpi-tone-red .kpi-icon{color:#fca5a5!important}.kpi-tone-red .kpi-glow{background:#ef4444}
.kpi-tone-purple .value,.kpi-tone-purple .kpi-icon{color:#d8b4fe!important}.kpi-tone-purple .kpi-glow{background:#a855f7}
.dashboard-section h3,
.dashboard-panels h3{
  font-size: 17px !important;
  line-height: 1.15 !important;
  margin: 0 0 10px !important;
}
.quick-action-grid{
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
  gap: 12px !important;
}
.quick-action-card{
  min-height: 86px !important;
  padding: 13px 14px !important;
  border-radius: 16px !important;
}
.quick-action-title{
  font-size: 18px !important;
  margin-bottom: 4px !important;
}
.quick-action-desc{
  font-size: 12px !important;
  line-height: 1.25 !important;
}
.room-type-grid{
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
  gap: 12px !important;
}
.room-type-card{
  padding: 13px 14px !important;
  border-radius: 16px !important;
}
.room-type-name{font-size:15px!important;margin-bottom:5px!important}
.room-type-main{font-size:20px!important;margin-bottom:5px!important}
.room-type-meta{font-size:12px!important;gap:3px!important}
.dashboard-panels{
  gap: 12px !important;
}
.dashboard-panels .table-card > div{
  padding: 12px !important;
}
.dashboard-panels table th,
.dashboard-panels table td{
  font-size: 12px !important;
  padding: 8px 9px !important;
}
.dashboard-panels .muted{
  font-size: 12px !important;
}
#content h1,#content h2,#content h3{
  letter-spacing:-.02em;
}
@keyframes dashboardShine{
  0%, 72%{transform:translateX(-120%)}
  100%{transform:translateX(120%)}
}
@keyframes softPulse{
  0%,100%{transform:scale(1); filter:brightness(1)}
  50%{transform:scale(1.025); filter:brightness(1.08)}
}
@media (max-width: 980px){
  .dashboard-hero-strip{align-items:flex-start; flex-direction:column}
  .dashboard-hero-pills{justify-content:flex-start}
  .dashboard-kpis{grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)) !important}
}


/* rev72.49 overstayed dashboard warning light */
.dashboard-kpis .kpi.dashboard-mini-kpi.kpi-overstayed-alert{
  border-color: rgba(248, 113, 113, .78) !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(255, 0, 0, .32), transparent 28%),
    radial-gradient(circle at 70% 95%, rgba(239, 68, 68, .28), transparent 34%),
    linear-gradient(145deg, rgba(32, 8, 18, .98), rgba(10, 24, 48, .98)) !important;
  box-shadow:
    0 0 0 1px rgba(239, 68, 68, .28),
    0 0 24px rgba(239, 68, 68, .28),
    0 10px 24px rgba(0, 0, 0, .22),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
  animation: overstayCardBreath 1.25s ease-in-out infinite;
}
.dashboard-kpis .kpi.dashboard-mini-kpi.kpi-overstayed-alert .label{
  color:#ffe4e6 !important;
}
.dashboard-kpis .kpi.dashboard-mini-kpi.kpi-overstayed-alert .value{
  color:#fff1f2 !important;
  text-shadow: 0 0 14px rgba(248, 113, 113, .85);
}
.overstay-warning-light{
  position:absolute;
  right: 44px;
  top: 12px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(127, 29, 29, .78);
  border: 1px solid rgba(254, 202, 202, .65);
  box-shadow: 0 0 0 rgba(248, 113, 113, 0);
  display:flex;
  align-items:center;
  justify-content:center;
  animation: overstayLightFlash .72s ease-in-out infinite;
  z-index:2;
}
.overstay-warning-light span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ef4444;
  box-shadow:0 0 10px rgba(239,68,68,.95);
}
.overstay-action-text{
  position:absolute;
  right: 12px;
  bottom: 10px;
  font-size: 8px;
  line-height:1;
  font-weight: 950;
  letter-spacing:.11em;
  color:#fecaca;
  background:rgba(127,29,29,.45);
  border:1px solid rgba(248,113,113,.35);
  border-radius:999px;
  padding:5px 7px;
  animation: overstayTextBlink 1.05s ease-in-out infinite;
}
.pulse-pill.red{
  position:relative;
}
.pulse-pill.red::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:#ef4444;
  display:inline-block;
  margin-right:6px;
  vertical-align:middle;
  box-shadow:0 0 10px rgba(239,68,68,.9);
  animation: overstayLightFlash .72s ease-in-out infinite;
}
@keyframes overstayLightFlash{
  0%, 100% { opacity: .42; box-shadow: 0 0 0 rgba(248,113,113,0); transform: scale(.92); }
  50% { opacity: 1; box-shadow: 0 0 18px rgba(248,113,113,.95), 0 0 34px rgba(220,38,38,.55); transform: scale(1.08); }
}
@keyframes overstayCardBreath{
  0%, 100% { transform: translateY(0); filter: brightness(1); }
  50% { transform: translateY(-1px); filter: brightness(1.08); }
}
@keyframes overstayTextBlink{
  0%, 100% { opacity:.58; }
  50% { opacity:1; }
}
@media (prefers-reduced-motion: reduce){
  .dashboard-kpis .kpi.dashboard-mini-kpi.kpi-overstayed-alert,
  .overstay-warning-light,
  .overstay-action-text,
  .pulse-pill.red::before{
    animation:none !important;
  }
}

/* rev72.50 modern occupancy calendar UX */
.occupancy-modern-wrap{
  margin: 8px 18px 22px;
  padding: 18px;
  border-radius: 26px;
  border: 1px solid rgba(96, 165, 250, .28);
  background:
    radial-gradient(circle at 14% 0%, rgba(245, 158, 11, .16), transparent 28%),
    radial-gradient(circle at 92% 6%, rgba(16, 185, 129, .18), transparent 28%),
    linear-gradient(145deg, rgba(8, 20, 40, .98), rgba(4, 17, 32, .98));
  box-shadow: 0 24px 55px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06);
  overflow: hidden;
}
.occupancy-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding: 16px 18px;
  border-radius: 22px;
  border:1px solid rgba(250, 204, 21, .22);
  background:
    linear-gradient(100deg, rgba(255,255,255,.07), rgba(16,185,129,.10), rgba(239,68,68,.06)),
    rgba(15, 23, 42, .72);
  position: relative;
}
.occupancy-hero::after{
  content:"";
  position:absolute;
  inset:-60% -30%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent);
  transform: translateX(-60%);
  animation: occupancyHeroShine 6s ease-in-out infinite;
  pointer-events:none;
}
.occupancy-hero h2{
  margin: 4px 0 6px;
  font-size: 26px;
  line-height:1.05;
}
.occupancy-hero .muted{
  max-width: 760px;
  margin:0;
  font-size: 13px;
}
.occupancy-hero-stats{
  display:grid;
  grid-template-columns: repeat(2, minmax(118px, 1fr));
  gap: 10px;
  min-width: 280px;
  position:relative;
  z-index:1;
}
.occ-stat{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 10px 12px;
  border-radius: 18px;
  font-weight: 900;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(2, 6, 23, .42);
}
.occ-stat b{font-size:20px; line-height:1; color:#fff}
.occ-stat small{font-size:10px; color:#cbd5e1; text-transform:uppercase; letter-spacing:.07em; text-align:right}
.occ-stat.green{box-shadow: inset 0 0 28px rgba(16,185,129,.16); border-color:rgba(16,185,129,.28)}
.occ-stat.red{box-shadow: inset 0 0 28px rgba(239,68,68,.16); border-color:rgba(239,68,68,.28)}
.occ-stat.gold{box-shadow: inset 0 0 28px rgba(245,158,11,.18); border-color:rgba(245,158,11,.34)}
.occ-stat.blue{box-shadow: inset 0 0 28px rgba(96,165,250,.16); border-color:rgba(96,165,250,.28)}
.occupancy-legend{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  padding: 14px 4px 10px;
  color:#cbd5e1;
  font-size:12px;
  font-weight: 800;
}
.occupancy-legend span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  background: rgba(15, 23, 42, .72);
  border:1px solid rgba(148, 163, 184, .14);
  border-radius:999px;
  padding:7px 10px;
}
.legend-dot{width:9px; height:9px; border-radius:999px; display:inline-block; box-shadow:0 0 12px currentColor}
.legend-dot.occupied{background:#ef4444; color:#ef4444}
.legend-dot.reserved{background:#f59e0b; color:#f59e0b}
.legend-dot.available{background:#10b981; color:#10b981}
.legend-dot.cleaning{background:#a78bfa; color:#a78bfa}
.occupancy-weekdays{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap:10px;
  margin: 4px 0 10px;
}
.occupancy-weekdays div{
  padding: 9px 10px;
  border-radius: 14px;
  background: rgba(15, 23, 42, .74);
  color:#fde68a;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  font-weight: 950;
  text-align:center;
  border:1px solid rgba(245,158,11,.12);
}
.occupancy-grid{
  display:grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}
.occupancy-day{
  min-height: 126px;
  border-radius: 20px;
  padding: 11px;
  background:
    radial-gradient(circle at 90% 12%, rgba(96,165,250,.12), transparent 34%),
    linear-gradient(145deg, rgba(15, 31, 57, .96), rgba(8, 21, 39, .98));
  border: 1px solid rgba(96, 165, 250, .18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 12px 26px rgba(0,0,0,.16);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
  position: relative;
  overflow:hidden;
}
.occupancy-day::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.08;
  background: linear-gradient(135deg, transparent, rgba(255,255,255,.2), transparent);
  transform: translateX(-130%);
  transition: transform .42s ease;
  pointer-events:none;
}
.occupancy-day:hover{
  transform: translateY(-5px) scale(1.015);
  border-color: rgba(250, 204, 21, .46);
  box-shadow: 0 20px 38px rgba(0,0,0,.28), 0 0 0 1px rgba(250,204,21,.12), inset 0 1px 0 rgba(255,255,255,.08);
  filter: brightness(1.08);
  z-index: 4;
}
.occupancy-day:hover::before{ transform: translateX(130%); }
.occupancy-day.empty{
  min-height: 126px;
  opacity:.22;
  border-style:dashed;
  background: rgba(15, 23, 42, .34);
  box-shadow:none;
}
.occupancy-day.empty:hover{ transform:none; filter:none; box-shadow:none; border-color:rgba(96,165,250,.18)}
.occupancy-day.has-occupied{ border-color: rgba(248,113,113,.34); background: radial-gradient(circle at 92% 8%, rgba(239,68,68,.26), transparent 36%), linear-gradient(145deg, rgba(35,15,30,.96), rgba(8,21,39,.98));}
.occupancy-day.has-reserved{ border-color: rgba(245,158,11,.36); background: radial-gradient(circle at 92% 8%, rgba(245,158,11,.24), transparent 36%), linear-gradient(145deg, rgba(33,27,12,.96), rgba(8,21,39,.98));}
.occupancy-day.is-clear{ border-color: rgba(16,185,129,.22); }
.occupancy-day.is-today{
  outline: 2px solid rgba(250, 204, 21, .55);
  outline-offset: 2px;
}
.occ-day-top{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:9px}
.occ-date{font-size:20px; font-weight:950; color:#fff; line-height:1}
.occ-today-pill{
  font-size:9px;
  font-weight:950;
  letter-spacing:.09em;
  color:#0f172a;
  background:#fde68a;
  padding:4px 7px;
  border-radius:999px;
  text-transform:uppercase;
}
.occ-live-dot{
  width:10px; height:10px; border-radius:999px; background:#22c55e; box-shadow:0 0 12px rgba(34,197,94,.9); animation: occDotPulse 1.2s ease-in-out infinite;
}
.occ-meter{
  height: 7px;
  border-radius:999px;
  background: rgba(148, 163, 184, .18);
  overflow:hidden;
  margin-bottom:10px;
}
.occ-meter span{
  display:block;
  height:100%;
  border-radius:inherit;
  background: linear-gradient(90deg, #22c55e, #facc15, #ef4444);
  transition: width .25s ease;
}
.occ-count-row{display:grid; grid-template-columns: 1fr 1fr; gap:7px; margin-bottom:7px}
.occ-count-row.lower{margin-bottom:0}
.occ-count-chip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:4px;
  padding:7px 8px;
  border-radius: 14px;
  background: rgba(2, 6, 23, .52);
  border:1px solid rgba(255,255,255,.08);
  transition: transform .18s ease, background .18s ease;
}
.occupancy-day:hover .occ-count-chip{ animation: occCountPop .48s ease both; }
.occupancy-day:hover .occ-count-chip:nth-child(2){ animation-delay:.05s; }
.occ-count-chip b{font-size:16px; line-height:1; color:#fff; font-weight:950}
.occ-count-chip small{font-size:8px; line-height:1; color:#cbd5e1; text-transform:uppercase; letter-spacing:.05em; font-weight:900}
.occ-count-chip.occupied{border-color:rgba(239,68,68,.22); box-shadow: inset 0 0 14px rgba(239,68,68,.10)}
.occ-count-chip.reserved{border-color:rgba(245,158,11,.24); box-shadow: inset 0 0 14px rgba(245,158,11,.10)}
.occ-count-chip.available{border-color:rgba(16,185,129,.22); box-shadow: inset 0 0 14px rgba(16,185,129,.10)}
.occ-count-chip.cleaning{border-color:rgba(167,139,250,.28); box-shadow: inset 0 0 14px rgba(167,139,250,.10)}
.occ-count-chip.clear{border-color:rgba(16,185,129,.18); opacity:.85}
.occupancy-status-summary h3{font-size:18px; margin:0 0 10px}
@keyframes occupancyHeroShine{
  0%, 70%{ transform:translateX(-60%); }
  100%{ transform:translateX(60%); }
}
@keyframes occDotPulse{
  0%,100%{opacity:.55; transform:scale(.86)}
  50%{opacity:1; transform:scale(1.12)}
}
@keyframes occCountPop{
  0%{ transform: translateY(0) scale(1); }
  45%{ transform: translateY(-2px) scale(1.06); }
  100%{ transform: translateY(0) scale(1); }
}
@media (max-width: 1200px){
  .occupancy-grid{gap:8px}
  .occupancy-day{min-height:118px; padding:9px}
  .occ-count-chip{padding:6px 7px}
  .occ-count-chip small{font-size:7px}
  .occupancy-hero{align-items:flex-start; flex-direction:column}
  .occupancy-hero-stats{width:100%; min-width:0; grid-template-columns: repeat(4, minmax(0, 1fr));}
}
@media (max-width: 820px){
  .occupancy-grid,.occupancy-weekdays{grid-template-columns: repeat(2, minmax(0, 1fr));}
  .occupancy-weekdays div:nth-child(n+3){display:none}
  .occupancy-hero-stats{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (prefers-reduced-motion: reduce){
  .occupancy-hero::after,
  .occ-live-dot,
  .occupancy-day:hover .occ-count-chip{
    animation:none !important;
  }
  .occupancy-day{transition:none !important;}
}


/* rev72.51 compact occupancy calendar text + daily room status report controls */
.occupancy-modern-wrap{padding:14px!important;margin:6px 14px 18px!important;border-radius:22px!important}
.occupancy-hero{padding:12px 14px!important;border-radius:18px!important;gap:12px!important}
.occupancy-hero h2{font-size:21px!important;margin:3px 0 4px!important}
.occupancy-hero .muted{font-size:11px!important;line-height:1.25!important}
.occupancy-hero-stats{gap:7px!important;min-width:240px!important;grid-template-columns:repeat(2,minmax(104px,1fr))!important}
.occ-stat{padding:8px 9px!important;border-radius:14px!important}
.occ-stat b{font-size:17px!important}.occ-stat small{font-size:8px!important;line-height:1.05!important}
.occupancy-legend{font-size:10px!important;gap:7px!important;padding:9px 2px 7px!important}.occupancy-legend span{padding:5px 8px!important}
.occupancy-weekdays{gap:7px!important;margin:3px 0 7px!important}.occupancy-weekdays div{padding:7px 8px!important;font-size:9px!important;border-radius:11px!important}
.occupancy-grid{gap:7px!important}.occupancy-day{min-height:96px!important;padding:8px!important;border-radius:16px!important}
.occupancy-day.empty{min-height:96px!important}.occ-day-top{margin-bottom:6px!important}.occ-date{font-size:16px!important}.occ-today-pill{font-size:7px!important;padding:3px 5px!important}
.occ-live-dot{width:8px!important;height:8px!important}.occ-meter{height:5px!important;margin-bottom:7px!important}.occ-count-row{gap:5px!important;margin-bottom:5px!important}
.occ-count-chip{padding:5px 6px!important;border-radius:11px!important;min-width:0!important}.occ-count-chip b{font-size:13px!important}.occ-count-chip small{font-size:6.8px!important;letter-spacing:.03em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.occupancy-status-summary h3{font-size:15px!important}.occupancy-status-summary table{font-size:11px!important}.occupancy-status-summary th,.occupancy-status-summary td{padding:7px 8px!important}
.occupancy-report-bar{display:grid;grid-template-columns:minmax(240px,1fr) 150px 180px;gap:10px;align-items:center;margin:10px 0 8px;padding:10px 12px;border-radius:16px;border:1px solid rgba(245,158,11,.22);background:linear-gradient(90deg,rgba(15,23,42,.76),rgba(245,158,11,.10),rgba(16,185,129,.08));box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.occupancy-report-bar strong{display:block;color:#fde68a;font-size:11px;text-transform:uppercase;letter-spacing:.06em}.occupancy-report-bar span{display:block;color:#cbd5e1;font-size:10px;margin-top:2px;line-height:1.2}.occupancy-report-bar input{height:38px;border-radius:12px;border:1px solid rgba(96,165,250,.25);background:#0b1b33;color:#fff;padding:0 10px;font-size:12px;font-weight:800}.occupancy-report-bar button{height:38px;border-radius:12px;border:0;background:linear-gradient(135deg,#b91c1c,#f59e0b);color:#fff;font-size:11px;font-weight:950;letter-spacing:.02em;box-shadow:0 12px 24px rgba(185,28,28,.25);transition:transform .16s ease,filter .16s ease}.occupancy-report-bar button:hover{transform:translateY(-2px);filter:brightness(1.08)}
@media (max-width:1200px){.occupancy-report-bar{grid-template-columns:1fr 140px 160px}.occupancy-day{min-height:90px!important}.occ-count-chip small{font-size:6.3px!important}}
@media (max-width:820px){.occupancy-report-bar{grid-template-columns:1fr}.occupancy-report-bar input,.occupancy-report-bar button{width:100%}}


/* Rev72.55 - Global Operational Module UI Polish */
.pro-module{
  --module-accent:#f59e0b;
  --module-accent-soft:rgba(245,158,11,.16);
  --module-accent-strong:rgba(245,158,11,.34);
}
.pro-module-blue{--module-accent:#60a5fa;--module-accent-soft:rgba(96,165,250,.16);--module-accent-strong:rgba(96,165,250,.34)}
.pro-module-green{--module-accent:#34d399;--module-accent-soft:rgba(52,211,153,.16);--module-accent-strong:rgba(52,211,153,.34)}
.pro-module-red{--module-accent:#f87171;--module-accent-soft:rgba(248,113,113,.16);--module-accent-strong:rgba(248,113,113,.34)}
.pro-module-purple{--module-accent:#c084fc;--module-accent-soft:rgba(192,132,252,.16);--module-accent-strong:rgba(192,132,252,.34)}
.module-polish-banner{
  position:relative;
  overflow:hidden;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  margin:0 0 16px;
  padding:18px 20px;
  border-radius:22px;
  border:1px solid var(--module-accent-strong);
  background:
    radial-gradient(circle at 15% 20%, var(--module-accent-soft), transparent 34%),
    linear-gradient(135deg, rgba(15,23,42,.98), rgba(12,22,39,.92));
  box-shadow:0 18px 44px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.03);
}
.module-polish-banner::before{
  content:"";
  position:absolute;
  inset:-60% auto -60% -30%;
  width:42%;
  transform:rotate(18deg);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent);
  animation:moduleBannerSweep 7s ease-in-out infinite;
  pointer-events:none;
}
.module-kicker{
  color:var(--module-accent);
  letter-spacing:.24em;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  margin-bottom:7px;
}
.module-polish-banner h2{
  margin:0;
  font-size:24px;
  line-height:1.05;
  letter-spacing:-.03em;
}
.module-polish-banner p{
  margin:8px 0 0;
  max-width:680px;
  color:#b7c5da;
  font-size:13px;
  line-height:1.35;
}
.module-metric-row{
  display:grid;
  grid-template-columns:repeat(3, minmax(110px,1fr));
  gap:10px;
  min-width:min(440px, 46%);
}
.module-metric{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(2,6,23,.52);
  border-radius:16px;
  padding:10px 12px;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.module-metric:hover{
  transform:translateY(-3px) scale(1.02);
  border-color:var(--module-accent);
  box-shadow:0 0 0 1px var(--module-accent-soft), 0 12px 28px rgba(0,0,0,.25);
}
.module-metric span{
  display:block;
  color:#aebbd1;
  font-size:11px;
  font-weight:700;
}
.module-metric strong{
  display:block;
  color:#fff;
  font-size:19px;
  line-height:1.1;
  margin-top:5px;
  transition:transform .18s ease, color .18s ease;
}
.module-metric:hover strong{
  color:var(--module-accent);
  transform:scale(1.08);
  animation:moduleCountPulse .55s ease;
}
.pro-module .polished-form-card,
.pro-module .polished-table-card{
  position:relative;
  overflow:hidden;
  border-color:rgba(96,165,250,.18)!important;
  background:
    radial-gradient(circle at 100% 0%, var(--module-accent-soft), transparent 26%),
    linear-gradient(180deg, rgba(15,23,42,.97), rgba(10,24,44,.96))!important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.pro-module .polished-form-card::before,
.pro-module .polished-table-card::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--module-accent),transparent);
  opacity:.9;
}
.pro-module .polished-form-card:hover,
.pro-module .polished-table-card:hover{
  transform:translateY(-2px);
  border-color:var(--module-accent-strong)!important;
  box-shadow:0 18px 46px rgba(0,0,0,.28), 0 0 0 1px var(--module-accent-soft);
}
.pro-module .polished-form-card h3,
.pro-module .polished-table-card h3{
  font-size:18px;
  letter-spacing:-.02em;
}
.pro-module label,
.pro-module .form-help,
.pro-module .muted.small{
  color:#aebbd1!important;
}
.pro-module input,
.pro-module select,
.pro-module textarea{
  border-color:rgba(96,165,250,.24)!important;
  background:rgba(8,22,42,.78)!important;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}
.pro-module input:hover,
.pro-module select:hover,
.pro-module textarea:hover{
  transform:translateY(-1px);
  border-color:var(--module-accent-strong)!important;
}
.pro-module input:focus,
.pro-module select:focus,
.pro-module textarea:focus{
  border-color:var(--module-accent)!important;
  box-shadow:0 0 0 3px var(--module-accent-soft), 0 0 26px rgba(0,0,0,.22)!important;
  background:rgba(10,27,51,.94)!important;
}
.pro-module .polished-date-field{
  color:#f8fafc!important;
  font-weight:800;
  border-color:var(--module-accent-strong)!important;
  background:linear-gradient(135deg, rgba(8,22,42,.88), rgba(15,23,42,.92))!important;
}
.pro-module .polished-date-field:hover{
  animation:dateFieldGlow 1.25s ease-in-out infinite alternate;
}
.pro-module .polished-button,
.pro-module button{
  position:relative;
  overflow:hidden;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.pro-module .polished-button:hover,
.pro-module button:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.24), 0 0 0 1px var(--module-accent-soft);
  border-color:var(--module-accent-strong)!important;
}
.pro-module .primary-btn,
.pro-module button.primary-btn{
  background:linear-gradient(135deg, #c5161d, #e11d48 48%, var(--module-accent))!important;
  color:#fff!important;
  border:0!important;
}
.pro-module .primary-btn::after,
.pro-module button.primary-btn::after{
  content:"";
  position:absolute;
  top:0;bottom:0;left:-55%;
  width:44%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
  transform:skewX(-18deg);
  animation:moduleButtonShine 4.5s ease-in-out infinite;
}
.pro-module .polished-data-table th{
  color:#fde68a!important;
  background:rgba(2,6,23,.5)!important;
  font-size:12px!important;
  letter-spacing:.02em;
}
.pro-module .polished-data-table td{
  font-size:12px!important;
  transition:background .16s ease, color .16s ease;
}
.pro-module .polished-data-table tr:hover td{
  background:var(--module-accent-soft)!important;
  color:#fff!important;
}
.pro-module .kpi,
.pro-module .stat-card{
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.pro-module .kpi:hover,
.pro-module .stat-card:hover{
  transform:translateY(-3px) scale(1.015);
  border-color:var(--module-accent-strong)!important;
  box-shadow:0 18px 38px rgba(0,0,0,.24);
}
.pro-module .kpi:hover strong,
.pro-module .kpi:hover .value,
.pro-module .stat-card:hover strong{
  color:var(--module-accent)!important;
  animation:moduleCountPulse .55s ease;
}
@keyframes moduleBannerSweep{0%,62%{left:-42%;opacity:0}72%{opacity:1}100%{left:122%;opacity:0}}
@keyframes moduleCountPulse{0%{transform:scale(1)}45%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes moduleButtonShine{0%,70%{left:-55%;opacity:0}78%{opacity:1}100%{left:125%;opacity:0}}
@keyframes dateFieldGlow{from{box-shadow:0 0 0 0 var(--module-accent-soft)}to{box-shadow:0 0 0 3px var(--module-accent-soft),0 0 24px var(--module-accent-soft)}}
@media (max-width:1100px){
  .module-polish-banner{flex-direction:column;align-items:flex-start}
  .module-metric-row{min-width:100%;width:100%;grid-template-columns:repeat(3,1fr)}
}
@media (max-width:720px){
  .module-metric-row{grid-template-columns:1fr}
  .module-polish-banner h2{font-size:20px}
}

/* Rev72.56 Accounts rebuild: MYOB-style hotel finance UI */
.accounts-pro-shell{display:block;width:100%;}
.accounts-banner{border-color:rgba(245,158,11,.45)!important;background:linear-gradient(135deg, rgba(24,34,52,.94), rgba(10,26,46,.96) 55%, rgba(245,158,11,.12))!important;}
.accounts-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:14px;margin:18px 0;}
.account-kpi{position:relative;overflow:hidden;border:1px solid rgba(148,163,184,.22);border-radius:18px;padding:15px;background:linear-gradient(145deg,rgba(11,28,52,.96),rgba(15,23,42,.92));box-shadow:0 16px 34px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;}
.account-kpi:before{content:"";position:absolute;inset:auto -20% -38% 42%;height:90px;border-radius:999px;filter:blur(8px);opacity:.24;background:#f59e0b;}
.account-kpi.cash:before{background:#22c55e}.account-kpi.bank:before{background:#38bdf8}.account-kpi.ar:before{background:#a78bfa}.account-kpi.gst:before{background:#f97316}.account-kpi.revenue:before{background:#fde047}.account-kpi.profit:before{background:#10b981}
.account-kpi:hover{transform:translateY(-4px) scale(1.012);border-color:rgba(253,230,138,.65);box-shadow:0 22px 44px rgba(0,0,0,.25),0 0 0 1px rgba(245,158,11,.22)}
.account-kpi span{display:block;color:#b6c3d8;font-size:12px;font-weight:900;letter-spacing:.03em;margin-bottom:9px;}
.account-kpi strong{display:block;color:#fff;font-size:24px;line-height:1.05;font-weight:1000;letter-spacing:-.03em;position:relative;z-index:1;}
.account-kpi small{display:block;color:#90a4c5;font-size:11px;line-height:1.25;margin-top:8px;position:relative;z-index:1;}
.account-kpi:hover strong{animation:moduleCountPulse .55s ease;color:#fde68a;}
.accounts-panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px;margin-top:16px;}
.accounts-card{border:1px solid rgba(148,163,184,.24)!important;background:linear-gradient(145deg,rgba(8,22,42,.96),rgba(15,23,42,.93))!important;box-shadow:0 18px 40px rgba(0,0,0,.20);}
.accounts-card h3{font-size:18px!important;letter-spacing:-.02em;}
.accounts-card h4{color:#fde68a;font-size:13px;letter-spacing:.04em;text-transform:uppercase;}
.accounts-card table th{font-size:11px!important;color:#fde68a!important;background:rgba(2,6,23,.58)!important;}
.accounts-card table td{font-size:11.5px!important;}
.accounts-action-card .actions button{min-height:42px;padding:10px 16px;border-radius:14px;}
@media (max-width:960px){.accounts-panels{grid-template-columns:1fr}.accounts-kpi-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.accounts-kpi-grid{grid-template-columns:1fr}.account-kpi strong{font-size:20px}}


/* Rev72.57 - Occupancy Calendar compact green OK status */
.occupancy-day .occ-count-chip{
  height: 30px !important;
  padding: 4px 6px !important;
  border-radius: 999px !important;
  gap: 3px !important;
}
.occupancy-day .occ-count-chip b{
  font-size: 11.5px !important;
  min-width: 12px !important;
}
.occupancy-day .occ-count-chip small{
  font-size: 6px !important;
  max-width: 32px !important;
  letter-spacing: .01em !important;
}
.occupancy-day .occ-count-chip.available{
  background: linear-gradient(135deg, rgba(16,185,129,.22), rgba(4,120,87,.12)) !important;
  border-color: rgba(16,185,129,.42) !important;
}
.occupancy-day .occ-count-chip.clear,
.occupancy-day .occ-count-chip.ok-clear{
  background: linear-gradient(135deg, rgba(34,197,94,.38), rgba(5,150,105,.24)) !important;
  border-color: rgba(74,222,128,.62) !important;
  box-shadow: inset 0 0 16px rgba(34,197,94,.22), 0 0 12px rgba(34,197,94,.12) !important;
  opacity: 1 !important;
}
.occupancy-day .occ-count-chip.clear b,
.occupancy-day .occ-count-chip.ok-clear b{
  color:#bbf7d0 !important;
  font-size: 12px !important;
}
.occupancy-day .occ-count-chip.clear small,
.occupancy-day .occ-count-chip.ok-clear small{
  color:#dcfce7 !important;
  font-size:5.6px !important;
}
.occupancy-day.is-clear{
  border-color: rgba(34,197,94,.38) !important;
  background: radial-gradient(circle at 92% 8%, rgba(34,197,94,.16), transparent 34%), linear-gradient(145deg, rgba(12,35,35,.96), rgba(8,21,39,.98)) !important;
}
.occupancy-day.is-clear:hover{
  border-color: rgba(74,222,128,.72) !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.25), 0 0 0 1px rgba(34,197,94,.22), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
@media (max-width: 1200px){
  .occupancy-day .occ-count-chip{height:28px !important;padding:3px 5px !important;}
  .occupancy-day .occ-count-chip b{font-size:10.5px !important;}
  .occupancy-day .occ-count-chip small{font-size:5.5px !important;max-width:28px !important;}
}

/* Rev72.59 Rooms UI polish: full-width setup + register below */
.room-module {
  display: grid;
  gap: 18px;
  padding: 10px 14px 80px;
}
.module-hero.room-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 22px 26px;
  border-radius: 26px;
  background:
    radial-gradient(circle at 85% 20%, rgba(255, 199, 46, .20), transparent 28%),
    radial-gradient(circle at 10% 90%, rgba(31, 202, 129, .13), transparent 34%),
    linear-gradient(135deg, rgba(21, 34, 54, .98), rgba(5, 18, 35, .94));
  border: 1px solid rgba(255, 211, 95, .24);
  box-shadow: 0 18px 45px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05);
}
.module-hero.room-hero h2 { margin: 4px 0 6px; font-size: 1.62rem; line-height: 1.1; }
.module-hero.room-hero p { margin: 0; max-width: 820px; color: #b6c7df; font-size: .94rem; }
.eyebrow { color: #ffd95e; font-size: .78rem; letter-spacing: .16em; font-weight: 900; text-transform: uppercase; }
.hero-status-pill {
  display: inline-flex; align-items: center; gap: 9px; white-space: nowrap;
  padding: 10px 16px; border-radius: 999px; font-weight: 900; color: #d8ffe9;
  background: rgba(18, 121, 84, .32); border: 1px solid rgba(37, 211, 132, .42);
  box-shadow: 0 0 24px rgba(32, 201, 151, .15);
}
.hero-status-pill.green { background: rgba(11, 132, 80, .30); color: #9ff0bd; }
.pulse-dot { width: 11px; height: 11px; border-radius: 50%; background: #2ee6a6; box-shadow: 0 0 0 0 rgba(46,230,166,.55); animation: roomPulse 1.7s infinite; }
@keyframes roomPulse { 0% { box-shadow: 0 0 0 0 rgba(46,230,166,.55);} 70% { box-shadow: 0 0 0 12px rgba(46,230,166,0);} 100% { box-shadow: 0 0 0 0 rgba(46,230,166,0);} }
.room-summary-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.room-summary-card {
  position: relative; overflow: hidden; padding: 14px 16px; border-radius: 18px;
  background: linear-gradient(145deg, rgba(15, 35, 61, .92), rgba(8, 21, 39, .96));
  border: 1px solid rgba(89, 142, 205, .22); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.room-summary-card::after { content:""; position:absolute; right:-38px; bottom:-45px; width:110px; height:110px; border-radius:50%; filter: blur(14px); opacity:.32; }
.room-summary-card:hover { transform: translateY(-3px); border-color: rgba(255, 217, 94, .45); box-shadow: 0 16px 35px rgba(0,0,0,.22); }
.room-summary-card b { display:block; color:#fff; font-size:1.55rem; line-height:1; margin-bottom:5px; }
.room-summary-card span { color:#b7c5dc; font-size:.82rem; font-weight:700; }
.room-summary-card.green::after { background:#20c997; }
.room-summary-card.red::after { background:#ff5263; }
.room-summary-card.blue::after { background:#5ea3ff; }
.room-summary-card.gold::after { background:#ffd95e; }
.room-summary-card.total::after { background:#92b4ff; }
.room-setup-card, .room-register-card {
  border-radius: 24px;
  background:
    linear-gradient(140deg, rgba(11, 31, 57, .96), rgba(6, 20, 38, .98));
  border: 1px solid rgba(69, 130, 196, .25);
  box-shadow: 0 14px 35px rgba(0,0,0,.18);
}
.room-setup-card { padding: 22px; }
.room-register-card { padding: 20px; }
.section-title-row { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin-bottom: 15px; }
.section-title-row h3 { margin: 2px 0 4px; font-size: 1.32rem; }
.section-title-row .muted { margin:0; font-size:.85rem; }
.glow-label { padding: 7px 11px; border-radius: 999px; background: rgba(255,217,94,.12); color: #ffe18a; border: 1px solid rgba(255,217,94,.28); font-weight: 900; }
.room-form-grid label { display:flex; flex-direction:column; gap:7px; }
.room-form-grid label span { color:#c6d2e8; font-size:.76rem; font-weight:900; letter-spacing:.05em; text-transform:uppercase; }
.room-form-grid input, .room-form-grid select, .room-form-grid textarea {
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.room-form-grid input:focus, .room-form-grid select:focus, .room-form-grid textarea:focus {
  transform: translateY(-1px); border-color: rgba(255, 217, 94, .62) !important;
  box-shadow: 0 0 0 3px rgba(255, 217, 94, .10), 0 0 28px rgba(255, 217, 94, .08);
}
.room-form-actions { margin-top: 14px; }
.animated-primary { position: relative; overflow:hidden; }
.animated-primary::after { content:""; position:absolute; top:0; bottom:0; left:-45%; width:42%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent); transform: skewX(-18deg); transition: left .35s ease; }
.animated-primary:hover::after { left:115%; }
.soft-btn { background: rgba(12, 22, 39, .75); border:1px solid rgba(157, 179, 212, .24); }
.room-register-card .table-card { margin-top: 10px; }
.room-register-card .table-wrap { max-height: 460px; }
.room-register-card table th { color:#ffe588; font-size:.82rem; }
.room-register-card table td { font-size:.88rem; vertical-align: middle; }
.room-register-card table tbody tr { transition: background .16s ease, transform .16s ease; }
.room-register-card table tbody tr:hover { background: rgba(255, 217, 94, .055); transform: scale(1.003); }
.room-no-chip { display:inline-flex; min-width:42px; justify-content:center; padding:7px 10px; border-radius:12px; color:#fff; font-weight:900; background:linear-gradient(135deg, rgba(255,217,94,.20), rgba(31,202,129,.10)); border:1px solid rgba(255,217,94,.22); }
.room-type-cell { display:flex; flex-direction:column; gap:3px; }
.room-type-cell small { color:#91a7c6; font-size:.72rem; }
.money-pill { display:inline-flex; padding:6px 10px; border-radius:999px; font-weight:900; color:#071225; background:#ffd95e; }
.room-actions { display:flex; gap:8px; flex-wrap:wrap; }
.mini-action { padding:8px 12px; border-radius:12px; font-size:.82rem; }
.mini-action.edit { border-color:rgba(96,165,250,.35); }
.mini-action.danger { border-color:rgba(255,87,103,.45); color:#ffd6da; }
@media (max-width: 1100px) { .room-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .module-hero.room-hero, .section-title-row { flex-direction: column; } }

/* Rev72.60 - Room Group / Wing field and display */
.wing-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:170px;
  padding:6px 10px;
  border-radius:999px;
  color:#ffeaa0;
  font-weight:800;
  font-size:.78rem;
  line-height:1.1;
  background:linear-gradient(135deg, rgba(255,196,55,.18), rgba(31,202,129,.10));
  border:1px solid rgba(255,217,94,.28);
  box-shadow:0 0 14px rgba(255,196,55,.08);
  white-space:normal;
}
.room-register-card table td:nth-child(2) { min-width:120px; }

/* Rev72.61 - Rooms register search bar */
.room-register-title-row { margin-bottom: 10px; }
.room-register-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(7, 19, 37, .86), rgba(12, 35, 62, .78));
  border: 1px solid rgba(255, 217, 94, .18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 12px 25px rgba(0,0,0,.16);
}
.room-search-box {
  flex:1;
  min-width: 260px;
  position:relative;
  display:flex;
  align-items:center;
}
.room-search-box .search-icon {
  position:absolute;
  left:14px;
  color:#ffd95e;
  font-size:1.15rem;
  font-weight:900;
  pointer-events:none;
  filter: drop-shadow(0 0 8px rgba(255,217,94,.25));
}
.room-search-box input {
  width:100%;
  height: 46px;
  padding: 0 16px 0 42px;
  border-radius: 15px;
  background: rgba(6, 19, 37, .92) !important;
  border: 1px solid rgba(87, 145, 210, .35) !important;
  color:#f8fbff !important;
  font-weight:700;
  font-size:.92rem;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.room-search-box input:focus {
  outline:none;
  transform: translateY(-1px);
  border-color: rgba(255,217,94,.62) !important;
  box-shadow: 0 0 0 3px rgba(255,217,94,.10), 0 0 28px rgba(255,217,94,.08);
}
.room-search-count {
  white-space: nowrap;
  display:flex;
  align-items:center;
  gap:6px;
  padding: 10px 14px;
  border-radius: 999px;
  color:#d8ffe9;
  background: rgba(18, 121, 84, .24);
  border: 1px solid rgba(37, 211, 132, .34);
  font-weight:800;
  font-size:.84rem;
}
.room-search-count b { color:#56f0a5; font-size:1rem; }
@media (max-width: 850px) {
  .room-register-toolbar { flex-direction:column; align-items:stretch; }
  .room-search-box { min-width:0; }
  .room-search-count { justify-content:center; }
}


/* rev72.67 cashflow layout + interactive ledger */
.cashflow-stack{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.cashflow-form-card,
.cashflow-ledger-shell{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(45,212,191,.18);
  background:linear-gradient(135deg, rgba(10,20,42,.96), rgba(8,24,48,.92));
  box-shadow:0 16px 36px rgba(2,8,23,.28);
}
.cashflow-form-card::before,
.cashflow-ledger-shell::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top right, rgba(45,212,191,.12), transparent 34%), radial-gradient(circle at bottom left, rgba(246,196,67,.10), transparent 28%);
  pointer-events:none;
}
.cashflow-section-head,
.cashflow-ledger-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:14px;
  position:relative;
  z-index:1;
}
.cashflow-section-head p,
.cashflow-ledger-header p{max-width:780px}
.cashflow-top-pills,
.cashflow-ledger-stats{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
}
.cashflow-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
  letter-spacing:.01em;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:#e5eefc;
  transition:transform .22s ease, box-shadow .22s ease;
}
.cashflow-pill:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 18px rgba(2,8,23,.22);
}
.cashflow-pill.success{background:rgba(22,163,74,.14);border-color:rgba(22,163,74,.28);color:#9ff3b8}
.cashflow-pill.info{background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.28);color:#bfdbfe}
.cashflow-pill.warn{background:rgba(245,158,11,.16);border-color:rgba(245,158,11,.28);color:#fde68a}
.cashflow-pill.danger{background:rgba(220,38,38,.16);border-color:rgba(220,38,38,.28);color:#fecaca}
.cashflow-mini-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;
  margin-top:14px;
  position:relative;
  z-index:1;
}
.cashflow-mini-stat{
  position:relative;
  overflow:hidden;
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(13,23,44,.92), rgba(9,18,36,.82));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.cashflow-mini-stat::after{
  content:'';
  position:absolute;
  right:-10px;
  bottom:-10px;
  width:110px;
  height:110px;
  border-radius:50%;
  filter:blur(2px);
  opacity:.45;
  pointer-events:none;
}
.cashflow-mini-stat.tone-in::after{background:radial-gradient(circle, rgba(45,212,191,.42), transparent 62%)}
.cashflow-mini-stat.tone-out::after{background:radial-gradient(circle, rgba(248,113,113,.35), transparent 62%)}
.cashflow-mini-stat.tone-net::after{background:radial-gradient(circle, rgba(246,196,67,.38), transparent 62%)}
.cashflow-mini-stat:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 28px rgba(2,8,23,.24);
}
.cashflow-mini-stat .label{
  color:#b7c7e6;
  font-size:14px;
  letter-spacing:.02em;
}
.cashflow-mini-stat .value{
  font-size:24px;
  font-weight:900;
  line-height:1.1;
  margin-top:10px;
  transition:transform .25s ease, text-shadow .25s ease;
}
.cashflow-mini-stat .meta{
  margin-top:8px;
  color:#8ea2c8;
  font-size:12px;
}
.count-pop:hover .value{
  animation:numberPulse .65s ease;
  text-shadow:0 0 14px rgba(255,255,255,.08);
}
@keyframes numberPulse{
  0%{transform:scale(1)}
  35%{transform:scale(1.08)}
  70%{transform:scale(.98)}
  100%{transform:scale(1)}
}
.cashflow-ledger-shell{
  padding:18px;
}
.cashflow-table-wrap{
  position:relative;
  z-index:1;
  max-height:520px;
}
.cashflow-table{
  width:100%;
  border-collapse:collapse;
}
.cashflow-table th{
  background:rgba(9,18,36,.95);
  color:#fde68a;
  font-size:13px;
  letter-spacing:.02em;
}
.cashflow-table td{
  font-size:14px;
  color:#e5eefc;
}
.cashflow-row td{transition:background .18s ease}
.cashflow-row:hover td{background:rgba(255,255,255,.03)}
.cashflow-row.is-in td:first-child{border-left:3px solid rgba(45,212,191,.9)}
.cashflow-row.is-out td:first-child{border-left:3px solid rgba(248,113,113,.9)}
.cashflow-date-cell strong{display:block}
.cashflow-date-cell span{display:block;margin-top:4px;font-size:12px;color:#8ea2c8}
.cashflow-amount{font-weight:800;white-space:nowrap}
.cashflow-amount.in{color:#fde68a}
.cashflow-amount.out{color:#fecaca}
@media (max-width: 980px){
  .cashflow-mini-kpis{grid-template-columns:1fr}
  .cashflow-form-card,
  .cashflow-ledger-shell{border-radius:18px}
}

/* Rev72.68: Pick Up & Drop Off arrangement list below form + modern transport UX */
.transport-workspace{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.transport-hero-card{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:18px 20px;
  border-radius:24px;
  border:1px solid rgba(96,165,250,.28);
  background:radial-gradient(circle at 18% 20%,rgba(96,165,250,.20),transparent 30%),radial-gradient(circle at 85% 10%,rgba(245,158,11,.18),transparent 26%),linear-gradient(135deg,rgba(9,25,47,.98),rgba(15,23,42,.96));
  box-shadow:0 22px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
}
.transport-hero-card:before{
  content:"";
  position:absolute;
  inset:-60% auto -60% -25%;
  width:38%;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);
  animation:transportSweep 6s ease-in-out infinite;
  pointer-events:none;
}
.transport-kicker{
  font-size:11px;
  font-weight:950;
  letter-spacing:.22em;
  color:#93c5fd;
  text-transform:uppercase;
  margin-bottom:7px;
}
.transport-hero-card h3{margin:0;font-size:24px;letter-spacing:-.03em;color:#f8fafc;}
.transport-hero-card p{margin:7px 0 0;max-width:780px;color:#b7c5da;font-size:13px;line-height:1.35;}
.transport-status-light{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
  color:#bfdbfe;
  font-weight:900;
  border:1px solid rgba(96,165,250,.28);
  background:rgba(15,23,42,.62);
  border-radius:999px;
  padding:10px 14px;
}
.transport-status-light span{
  width:12px;height:12px;border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 0 6px rgba(34,197,94,.13),0 0 24px rgba(34,197,94,.7);
  animation:transportPulse 1.35s ease-in-out infinite;
}
.transport-stats-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(145px,1fr));
  gap:12px;
}
.transport-stat{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(96,165,250,.23);
  border-radius:18px;
  padding:13px 15px;
  background:linear-gradient(135deg,rgba(9,25,47,.96),rgba(15,23,42,.92));
  transition:transform .18s ease!important,border-color .18s ease!important,box-shadow .18s ease!important;
}
.transport-stat:after{
  content:"";
  position:absolute;
  right:-22px;bottom:-36px;
  width:105px;height:90px;border-radius:50%;
  background:rgba(96,165,250,.2);
  filter:blur(4px);
}
.transport-stat.warn:after{background:rgba(245,158,11,.25);}
.transport-stat.today:after{background:rgba(59,130,246,.24);}
.transport-stat.done:after{background:rgba(34,197,94,.24);}
.transport-stat.paid:after{background:rgba(168,85,247,.24);}
.transport-stat:hover{
  transform:translateY(-3px) scale(1.015);
  border-color:#60a5fa;
  box-shadow:0 18px 38px rgba(0,0,0,.28);
}
.transport-stat span{display:block;color:#aebbd1;font-size:11px;font-weight:800;}
.transport-stat strong{
  display:block;color:#fff;font-size:26px;line-height:1;margin-top:8px;
  transition:transform .18s ease!important,color .18s ease!important;
}
.transport-stat:hover strong{color:#93c5fd;animation:transportCountPulse .55s ease!important;}
.transport-form-card,.transport-register-card{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  border-radius:22px;
  border:1px solid rgba(96,165,250,.24)!important;
  background:linear-gradient(135deg,rgba(10,22,44,.96),rgba(12,26,52,.94))!important;
  box-shadow:0 18px 42px rgba(0,0,0,.26)!important;
}
.transport-form-title-row,.transport-register-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.transport-form-title-row h3,.transport-register-head h3{margin:0;font-size:22px;}
.transport-form-badge,.transport-count-badge{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;
  border:1px solid rgba(245,158,11,.38);
  background:rgba(245,158,11,.14);
  color:#fde68a;
  font-weight:950;
  padding:9px 13px;
  white-space:nowrap;
}
.transport-form-grid input[type="date"],.transport-form-grid input[type="time"]{
  border-color:rgba(96,165,250,.38)!important;
  box-shadow:0 0 0 1px rgba(96,165,250,.04), inset 0 0 22px rgba(96,165,250,.035)!important;
}
.transport-form-grid input:focus,.transport-form-grid select:focus,.transport-form-grid textarea:focus{
  border-color:#60a5fa!important;
  box-shadow:0 0 0 3px rgba(96,165,250,.12)!important;
}
.transport-save-actions{margin-top:12px!important;}
.transport-save-actions .primary-btn{position:relative;overflow:hidden;}
.transport-save-actions .primary-btn:after{
  content:"";position:absolute;top:0;bottom:0;left:-55%;width:42%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);
  transform:skewX(-18deg);
  animation:transportButtonShine 4.5s ease-in-out infinite;
}
.transport-register-head p{margin:5px 0 0;}
.transport-search-row{
  display:grid;
  grid-template-columns:minmax(260px,1fr) 150px;
  gap:10px;
  margin-bottom:12px;
}
.transport-search-row input,.transport-search-row button{height:42px;}
.transport-table-wrap{
  max-height:460px;
  overflow:auto;
  border-radius:16px;
  border:1px solid rgba(96,165,250,.18);
  background:rgba(2,6,23,.16);
}
.transport-table{width:100%;border-collapse:collapse;font-size:12px;}
.transport-table th{
  position:sticky;top:0;z-index:1;
  background:rgba(3,7,18,.92)!important;
  color:#fde68a!important;
  font-size:12px!important;
  letter-spacing:.02em;
}
.transport-table td{
  font-size:12px!important;
  transition:background .16s ease!important,color .16s ease!important;
}
.transport-table tr:hover td{background:rgba(96,165,250,.12)!important;color:#fff!important;}
.transport-ref-chip,.transport-service-chip,.transport-date-chip{
  display:inline-flex;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:900;line-height:1.1;
}
.transport-ref-chip{background:rgba(96,165,250,.16);border:1px solid rgba(96,165,250,.28);color:#bfdbfe;}
.transport-service-chip{background:rgba(245,158,11,.15);border:1px solid rgba(245,158,11,.26);color:#fde68a;}
.transport-date-chip{background:rgba(34,197,94,.13);border:1px solid rgba(34,197,94,.25);color:#bbf7d0;}
.transport-actions{gap:6px;flex-wrap:wrap;}
.transport-actions button{font-size:11px!important;padding:7px 9px!important;border-radius:12px!important;}
@keyframes transportPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.82)}}
@keyframes transportSweep{0%{left:-45%}100%{left:125%}}
@keyframes transportCountPulse{0%,100%{transform:scale(1)}45%{transform:scale(1.12)}}
@keyframes transportButtonShine{0%,65%{left:-55%}100%{left:120%}}
@media(max-width:1200px){.transport-stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.transport-stats-grid{grid-template-columns:1fr}.transport-hero-card,.transport-form-title-row,.transport-register-head{flex-direction:column;align-items:flex-start}.transport-search-row{grid-template-columns:1fr}.transport-hero-card h3{font-size:20px}.transport-form-title-row h3,.transport-register-head h3{font-size:19px}}

/* Rev72.69: Purchasing / Restocking full-width workflow + modern inventory UX */
.purchasing-module{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.purchasing-hero-card{
  position:relative;
  overflow:hidden;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:20px 22px;
  border-radius:24px;
  border:1px solid rgba(245,158,11,.26);
  background:
    radial-gradient(circle at 14% 16%, rgba(245,158,11,.18), transparent 34%),
    radial-gradient(circle at 86% 12%, rgba(34,197,94,.14), transparent 32%),
    linear-gradient(135deg, rgba(12,24,46,.98), rgba(15,23,42,.96));
  box-shadow:0 22px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
}
.purchasing-hero-card::before{
  content:"";
  position:absolute;
  inset:-60% auto -60% -30%;
  width:40%;
  transform:rotate(18deg);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.16), transparent);
  animation:purchasingSweep 6.5s ease-in-out infinite;
  pointer-events:none;
}
.purchasing-kicker,.purchasing-eyebrow{
  color:#f6d365;
  text-transform:uppercase;
  letter-spacing:.20em;
  font-size:11px;
  font-weight:950;
}
.purchasing-hero-card h3,
.purchasing-section-head h3{
  margin:4px 0;
  color:#f8fafc;
}
.purchasing-hero-card p{
  max-width:760px;
  margin:6px 0 0;
  color:#b7c5da;
  font-size:13px;
  line-height:1.35;
}
.purchasing-live-pill,.purchasing-status-pill,.purchasing-count-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  font-weight:950;
  white-space:nowrap;
  border:1px solid rgba(34,197,94,.32);
  background:rgba(34,197,94,.13);
  color:#bbf7d0;
  box-shadow:0 12px 24px rgba(0,0,0,.16);
}
.purchasing-live-pill span{
  width:12px;
  height:12px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 0 6px rgba(34,197,94,.12),0 0 24px rgba(34,197,94,.65);
  animation:purchasingPulse 1.35s ease-in-out infinite;
}
.purchasing-status-pill{border-color:rgba(245,158,11,.35);background:rgba(245,158,11,.15);color:#fde68a;}
.purchasing-count-pill{border-color:rgba(96,165,250,.30);background:rgba(96,165,250,.13);color:#bfdbfe;}
.purchasing-stats-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(160px,1fr));
  gap:12px;
}
.purchasing-stat{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(96,165,250,.22);
  border-radius:18px;
  padding:14px 16px;
  background:linear-gradient(135deg,rgba(9,25,47,.96),rgba(15,23,42,.92));
  transition:transform .18s ease!important,border-color .18s ease!important,box-shadow .18s ease!important;
}
.purchasing-stat::after{
  content:"";
  position:absolute;
  right:-26px;
  bottom:-40px;
  width:115px;
  height:95px;
  border-radius:50%;
  background:rgba(96,165,250,.2);
  filter:blur(4px);
}
.purchasing-stat.warn::after{background:rgba(239,68,68,.24)}
.purchasing-stat.open::after{background:rgba(245,158,11,.28)}
.purchasing-stat.value::after{background:rgba(34,197,94,.25)}
.purchasing-stat:hover{
  transform:translateY(-3px) scale(1.015)!important;
  border-color:#f6c443;
  box-shadow:0 18px 38px rgba(0,0,0,.28);
}
.purchasing-stat span{
  display:block;
  color:#aebbd1;
  font-size:11px;
  font-weight:850;
}
.purchasing-stat strong{
  display:block;
  color:#fff;
  font-size:24px;
  line-height:1.1;
  margin-top:8px;
  transition:transform .18s ease!important,color .18s ease!important;
}
.purchasing-stat:hover strong{
  color:#fde68a;
  transform:scale(1.08)!important;
  animation:purchasingCountPulse .55s ease;
}
.purchasing-form-card,.purchasing-section{
  width:100%!important;
  max-width:none!important;
  position:relative;
  overflow:hidden;
  padding:18px!important;
  border-radius:22px!important;
  border:1px solid rgba(96,165,250,.22)!important;
  background:
    radial-gradient(circle at 15% 0%, rgba(96,165,250,.10), transparent 30%),
    radial-gradient(circle at 86% 8%, rgba(245,158,11,.08), transparent 30%),
    linear-gradient(135deg,rgba(9,25,47,.96),rgba(15,23,42,.94))!important;
  box-shadow:0 18px 36px rgba(0,0,0,.25)!important;
}
.purchasing-form-card input:focus,
.purchasing-form-card select:focus,
.purchasing-form-card textarea:focus,
.purchasing-section input:focus,
.purchasing-section select:focus{
  border-color:#f6c443!important;
  box-shadow:0 0 0 3px rgba(246,196,67,.11)!important;
}
.purchasing-section-head,.purchasing-draft-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.purchasing-action-bar,.purchasing-report-actions{
  margin-top:12px;
  gap:9px;
  flex-wrap:wrap;
}
.purchasing-action-bar button,.purchasing-report-actions button,.purchase-actions button{
  transition:transform .16s ease!important,box-shadow .16s ease!important,border-color .16s ease!important;
}
.purchasing-action-bar button:hover,.purchasing-report-actions button:hover,.purchase-actions button:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 12px 24px rgba(0,0,0,.22)!important;
}
.purchasing-draft-card{
  margin-top:14px;
  padding:14px;
  border-radius:18px;
  border:1px dashed rgba(245,158,11,.32);
  background:rgba(255,255,255,.035);
}
.purchasing-report-controls{margin-top:8px;}
.purchasing-report-preview-grid{
  display:grid;
  grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);
  gap:14px;
  margin-top:14px;
}
.purchasing-mini-card{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:12px;
  background:rgba(2,6,23,.28);
  overflow:auto;
}
.purchasing-mini-card h4{
  margin:0 0 8px;
  color:#fff;
  font-size:18px;
}
.purchasing-module .table-card{
  background:rgba(2,6,23,.28)!important;
  border-color:rgba(96,165,250,.18)!important;
}
.purchasing-module table th{
  color:#fde68a!important;
  background:rgba(2,6,23,.55)!important;
  font-size:12px!important;
  letter-spacing:.02em;
}
.purchasing-module table td{
  font-size:12px!important;
  transition:background .16s ease!important,color .16s ease!important;
}
.purchasing-module table tr:hover td{
  background:rgba(245,158,11,.10)!important;
  color:#fff!important;
}
.low-stock-section{border-left:6px solid rgba(239,68,68,.72)!important;}
.movement-section{border-left:6px solid rgba(96,165,250,.72)!important;}
.purchase-order-section{border-left:6px solid rgba(34,197,94,.72)!important;}
@keyframes purchasingSweep{0%{left:-45%}100%{left:125%}}
@keyframes purchasingPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.82)}}
@keyframes purchasingCountPulse{0%,100%{transform:scale(1.08)}50%{transform:scale(1.18)}}
@media(max-width:1100px){
  .purchasing-stats-grid{grid-template-columns:repeat(2,1fr)}
  .purchasing-hero-card{flex-direction:column;align-items:flex-start}
  .purchasing-report-preview-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  .purchasing-stats-grid{grid-template-columns:1fr}
  .purchasing-hero-card h3{font-size:20px}
  .purchasing-section-head h3{font-size:19px}
}


/* Rev72.71 - Quotation / Invoice full-width booking UX */
.hotel-doc-workspace {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.hotel-doc-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  border-radius: 24px;
  border: 1px solid rgba(246,196,67,.28);
  background:
    radial-gradient(circle at 12% 5%, rgba(246,196,67,.15), transparent 30%),
    radial-gradient(circle at 86% 12%, rgba(34,197,94,.12), transparent 28%),
    linear-gradient(135deg, rgba(8,24,48,.98), rgba(14,22,42,.96));
  box-shadow: 0 22px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
}
.hotel-doc-hero:before {
  content: "";
  position: absolute;
  inset: -60% auto -60% -30%;
  width: 38%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
  animation: moduleBannerSweep 6s ease-in-out infinite;
  pointer-events: none;
}
.hotel-doc-hero h3 { margin: 0; font-size: 25px; letter-spacing: -.03em; color: #f8fafc; }
.hotel-doc-hero p { margin: 7px 0 0; max-width: 800px; color: #b7c5da; font-size: 13px; line-height: 1.35; }
.hotel-doc-hero-stats { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; position: relative; z-index: 1; }
.hotel-doc-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border-radius: 999px;
  padding: 9px 14px;
  border: 1px solid rgba(34,197,94,.35);
  background: rgba(34,197,94,.14);
  color: #bbf7d0;
  font-weight: 950;
  white-space: nowrap;
  transition: transform .18s ease, box-shadow .18s ease;
}
.hotel-doc-pill:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 16px 30px rgba(0,0,0,.22); }
.hotel-doc-pill.warn { border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.14); color: #fecaca; }
.hotel-doc-pill.gold { border-color: rgba(246,196,67,.35); background: rgba(246,196,67,.14); color: #fde68a; }
.hotel-doc-form-card,
.hotel-doc-register-card {
  width: 100%;
  max-width: none !important;
  position: relative;
  overflow: hidden;
  border-left: 5px solid rgba(246,196,67,.80);
  background:
    radial-gradient(circle at 80% 0%, rgba(246,196,67,.10), transparent 30%),
    linear-gradient(135deg, rgba(10,22,44,.96), rgba(7,18,38,.96)) !important;
}
.hotel-doc-form-card:after,
.hotel-doc-register-card:after {
  content: "";
  position: absolute;
  right: -60px;
  bottom: -70px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(246,196,67,.12), transparent 65%);
  pointer-events: none;
}
.quote-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.quote-subsection-title {
  margin: 6px 0 -4px;
  color: #fde68a;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.quote-room-preview {
  border: 1px dashed rgba(246,196,67,.35);
  border-radius: 18px;
  padding: 12px;
  background: rgba(246,196,67,.06);
}
.quote-room-preview-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
}
.quote-room-preview-grid div {
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(15,23,42,.70);
  border: 1px solid rgba(255,255,255,.08);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.quote-room-preview-grid div:hover {
  transform: translateY(-2px);
  border-color: rgba(246,196,67,.35);
  box-shadow: 0 14px 28px rgba(0,0,0,.22);
}
.quote-room-preview-grid span {
  display: block;
  color: #a9b8d0;
  font-size: 11px;
  font-weight: 800;
}
.quote-room-preview-grid strong {
  display: block;
  color: #fff;
  margin-top: 4px;
  font-size: 15px;
}
.hotel-doc-draft-box {
  border: 1px solid rgba(96,165,250,.18);
  border-radius: 18px;
  padding: 12px;
  background: rgba(96,165,250,.05);
}
.hotel-doc-draft-table {
  padding: 12px;
  margin-top: 8px;
}
.hotel-doc-register-card .table-card {
  margin-top: 10px;
}
.hotel-doc-register-card th {
  color: #fde68a !important;
}
.hotel-doc-register-card td {
  font-size: 13px !important;
}
.hotel-doc-register-card tr:hover td {
  background: rgba(246,196,67,.08) !important;
}
.quote-action-stack button {
  font-size: 12px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
}
.hotel-doc-form-card input:focus,
.hotel-doc-form-card select:focus,
.hotel-doc-form-card textarea:focus {
  border-color: #f6c443 !important;
  box-shadow: 0 0 0 3px rgba(246,196,67,.13) !important;
}
@media (max-width: 1100px) {
  .hotel-doc-hero,
  .section-title-row { flex-direction: column; align-items: flex-start; }
  .quote-room-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .quote-form-grid { grid-template-columns: 1fr !important; }
  .quote-room-preview-grid { grid-template-columns: 1fr; }
}

/* Rev72.72: Automatic Room Accommodation Line */
.quote-auto-room-note {
  border: 1px dashed rgba(34,197,94,.38);
  background: linear-gradient(135deg, rgba(34,197,94,.12), rgba(245,158,11,.08));
  color: #bbf7d0;
  border-radius: 16px;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .01em;
}
.quote-auto-room-note::before {
  content: "✓ ";
  color: #22c55e;
  font-weight: 900;
}


/* Rev72.73 automatic quotation validity */
.quote-validity-auto{
  min-height:56px;
  display:flex;
  align-items:center;
  padding:0 18px;
  border-radius:14px;
  border:1px solid rgba(34,197,94,.30);
  background:linear-gradient(135deg, rgba(34,197,94,.12), rgba(246,196,67,.08));
  color:#dbeafe;
  font-weight:800;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
}
.quote-validity-auto strong{color:#86efac;margin-right:8px}
.quote-validity-auto:hover{border-color:rgba(34,197,94,.55);box-shadow:0 0 0 3px rgba(34,197,94,.08);}


/* ===== Hostinger Mobile PWA v6 desktop-safe/mobile-friendly overrides ===== */
:root{--menu-bg:#071833;--menu-text:#e5e7eb;--menu-active:#f6c443;}
:root {
  --bg: #071226;
  --bg2: #0d1b36;
  --panel: rgba(8, 18, 38, 0.92);
  --panel-soft: rgba(17, 24, 39, 0.92);
  --panel-strong: #091224;
  --text: #f8fafc;
  --muted: #9fb0c9;
  --primary: #c5161d;
  --accent: #f6c443;
  --ok: #16a34a;
  --warn: #f59e0b;
  --danger: #dc2626;
  --info: #3b82f6;
  --border: rgba(71, 85, 105, 0.45);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, Arial, Helvetica, sans-serif;
  background:
    radial-gradient(circle at top right, rgba(246,196,67,.08), transparent 22%),
    radial-gradient(circle at top left, rgba(197,22,29,.10), transparent 18%),
    linear-gradient(135deg, var(--bg), var(--bg2));
  color: var(--text);
  height: 100vh;
  overflow: hidden;
}
.hidden { display: none !important; }
.screen { min-height: 100vh; }
.center-screen { display: grid; place-items: center; padding: 24px; }
.panel, .card, .table-card, .kpi, .form-card, .stat-card { background: var(--panel); border: 1px solid #233047; border-radius: 16px; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.auth-panel { width: 100%; max-width: 420px; padding: 28px; }
.brand-badge { display: inline-block; background: rgba(250,204,21,.15); color: var(--accent); padding: 6px 10px; border-radius: 999px; font-size: 12px; margin-bottom: 14px; }
h1,h2,h3,h4 { margin: 0 0 10px 0; }
.sub, .muted { color: var(--muted); }
input, select, textarea, button { width: 100%; padding: 11px 12px; border-radius: 10px; border: 1px solid #334155; background: #0b1220; color: var(--text); margin-top: 10px; }
textarea { min-height: 90px; resize: vertical; }
button { cursor: pointer; }
.primary-btn, .chip.active { background: var(--primary); border-color: var(--primary); }
button:hover { filter: brightness(1.06); }
#appView { display: grid; grid-template-columns: 270px 1fr; height: 100vh; overflow: hidden; }
.sidebar { background: #0b1220; border-right: 1px solid #1e293b; padding: 20px; height: 100vh; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; position: sticky; top: 0; scrollbar-width: none; -ms-overflow-style: none; }
.sidebar::-webkit-scrollbar { width: 0; height: 0; background: transparent; }
.sidebar button { text-align: left; margin-top: 8px; background: transparent; }
.brand-block { margin-bottom: 20px; }
.workspace { display: flex; flex-direction: column; min-width: 0; height: 100vh; overflow: hidden; }
.topbar { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 18px 22px; border-bottom: 1px solid #1e293b; background: rgba(15,23,42,.9);  position: sticky; top: 0; z-index: 5; }
.top-actions { display: flex; gap: 10px; }

.topbar-left{display:flex;flex-direction:column;gap:4px;min-width:180px}
.workspace-brand-banner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-width:280px;
  max-width:56%;
  margin:0 auto;
  padding:10px 16px;
  border-radius:18px;
  border:1px solid rgba(246,196,67,.18);
  background:linear-gradient(90deg, rgba(197,22,29,.12), rgba(246,196,67,.10), rgba(59,130,246,.08));
  box-shadow:0 10px 24px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.03);
  overflow:hidden;
  position:relative;
}
.workspace-brand-banner::before{
  content:"";
  position:absolute;
  inset:-120% auto auto -30%;
  width:50%;
  height:300%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
  transform:rotate(18deg);
  animation:headerShimmer 7s linear infinite;
  pointer-events:none;
}
.workspace-brand-banner.hidden{display:none !important}
.workspace-brand-logo{
  width:44px;
  height:44px;
  border-radius:12px;
  object-fit:contain;
  background:rgba(255,255,255,.96);
  padding:4px;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  flex:0 0 auto;
}
.workspace-brand-copy{display:flex;flex-direction:column;min-width:0}
.workspace-brand-title{
  font-size:18px;
  font-weight:800;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.workspace-brand-subtitle{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}
.workspace-brand-banner.is-animated .workspace-brand-title{
  animation:headerPulseText 4.8s ease-in-out infinite;
  transform-origin:left center;
}
.workspace-brand-banner.is-animated .workspace-brand-logo{
  animation:headerFloatLogo 4.8s ease-in-out infinite;
}
@keyframes headerPulseText{
  0%,100%{opacity:.72;transform:translateY(2px) scale(.98)}
  28%{opacity:1;transform:translateY(0) scale(1.03)}
  55%{opacity:.86;transform:translateY(-1px) scale(1.01)}
  78%{opacity:1;transform:translateY(0) scale(1.04)}
}
@keyframes headerFloatLogo{
  0%,100%{transform:translateY(0) scale(1)}
  33%{transform:translateY(-2px) scale(1.04)}
  66%{transform:translateY(1px) scale(.98)}
}
@keyframes headerShimmer{
  0%{left:-42%}
  100%{left:125%}
}
@media (max-width: 980px){
  .topbar{flex-wrap:wrap}
  .workspace-brand-banner{order:3;width:100%;max-width:none;min-width:0;margin-top:10px}
}

.top-actions button { width: auto; min-width: 96px; }
.content { padding: 22px; flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.content::-webkit-scrollbar { width: 8px; background: transparent; }
.content::-webkit-scrollbar-thumb { background: transparent; border-radius: 999px; }
.content:hover::-webkit-scrollbar-thumb,
.content:focus-within::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); }
.grid { display: grid; gap: 16px; }
.grid.kpis { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.kpi { padding: 18px; }
.kpi .label { color: var(--muted); font-size: 13px; }
.kpi .value { font-size: 28px; font-weight: bold; margin-top: 10px; }
.two-col { display: grid; grid-template-columns: minmax(320px, 420px) 1fr; gap: 18px; }
.form-card { padding: 18px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.form-grid .full { grid-column: 1 / -1; }
.table-wrap { overflow: auto; scrollbar-width: thin; scrollbar-color: rgba(246,196,67,.55) rgba(255,255,255,.06); }
.table-wrap::-webkit-scrollbar { width: 10px; height: 10px; }
.table-wrap::-webkit-scrollbar-track { background: rgba(255,255,255,.05); border-radius: 999px; }
.table-wrap::-webkit-scrollbar-thumb { background: rgba(246,196,67,.42); border-radius: 999px; border: 2px solid rgba(8,18,38,.85); transition: background .22s ease, box-shadow .22s ease, border-color .22s ease; }
.table-wrap:hover::-webkit-scrollbar-thumb { background: rgba(246,196,67,.72); box-shadow: 0 0 0 1px rgba(246,196,67,.15), 0 0 12px rgba(246,196,67,.18); }
.table-wrap::-webkit-scrollbar-corner { background: transparent; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { border-bottom: 1px solid #243247; padding: 10px; text-align: left; vertical-align: top; }
th { color: var(--accent); background: #0b1220; position: sticky; top: 0; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.actions button { width: auto; margin-top: 0; }
.tag { display: inline-block; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: bold; }
.Available { background: rgba(22,163,74,.15); color: #4ade80; }
.Occupied { background: rgba(220,38,38,.15); color: #f87171; }
.Reserved { background: rgba(245,158,11,.15); color: #fbbf24; }
.Cleaning, .Pending { background: rgba(37,99,235,.15); color: #60a5fa; }
.Completed, .Paid, .ACTIVE { background: rgba(22,163,74,.15); color: #4ade80; }
.Unpaid, .Cancelled, .Expired, .EXPIRED { background: rgba(220,38,38,.15); color: #f87171; }
.Part\ Paid, .Part\ Paid { background: rgba(245,158,11,.15); color: #fbbf24; }
.toolbar { display: flex; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.toolbar button { width: auto; }
.small { font-size: 12px; }
hr { border: none; border-top: 1px solid #1e293b; margin: 18px 0; }
.doc-preview { background: white; color: #111827; padding: 24px; border-radius: 12px; }
.flex { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
@media (max-width: 980px) {
  body { height: auto; overflow: auto; }
  #appView { grid-template-columns: 1fr; height: auto; overflow: visible; }
  .sidebar { height: auto; max-height: none; position: relative; overflow: visible; }
  .workspace { height: auto; overflow: visible; }
  .content { overflow: visible; }
  .two-col { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
}

.login-logo{display:block;max-width:280px;width:100%;height:auto;margin:0 auto 10px auto}
.sidebar-logo{display:block;max-width:210px;width:100%;height:auto;margin-bottom:10px}
.system-footer{padding:14px 22px;border-top:1px solid #1e293b;color:var(--muted);text-align:center;font-size:13px}
.auth-footer{border-top:none;padding:16px 0 0 0}
.customer-search-wrap{position:relative}
.customer-search-wrap datalist{display:none}
.preview-logo{max-width:180px;max-height:80px;display:block;margin-bottom:12px;background:#fff;border-radius:8px;padding:6px}
.form-help{font-size:12px;color:var(--muted);margin-top:6px}

.calendar-cell{min-width:110px}
.login-logo{max-width:340px;width:100%;height:auto;display:block;margin:0 auto 16px auto}
.doc-preview strong{color:#111827}

.Washing, .Ironing, .Ready, .Delivered, .Inactive { background: rgba(37,99,235,.15); color: #60a5fa; }
.Ready { background: rgba(22,163,74,.15); color: #4ade80; }
.Delivered { background: rgba(22,163,74,.15); color: #4ade80; }
.Inactive { background: rgba(100,116,139,.2); color: #cbd5e1; }


.login-logo { width: 230px; max-width: 100%; display:block; margin: 0 auto 10px; filter: drop-shadow(0 10px 25px rgba(0,0,0,.35)); }
.sidebar-logo { width: 210px; max-width: 100%; display:block; margin-bottom: 12px; }
.auth-panel {
  max-width: 520px; padding: 34px;
  background: linear-gradient(180deg, rgba(9,18,36,.98), rgba(8,18,38,.95));
}
.panel, .card, .table-card, .kpi, .form-card, .stat-card {
  border: 1px solid var(--border);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
  
}
.sidebar {
  background: linear-gradient(180deg, rgba(7,18,38,.98), rgba(7,18,38,.92));
}
.sidebar button {
  border: 1px solid transparent;
  transition: all .18s ease;
}
.sidebar button:hover, .sidebar button.active-nav {
  background: linear-gradient(90deg, rgba(197,22,29,.16), rgba(246,196,67,.08));
  border-color: rgba(246,196,67,.22);
  transform: translateX(2px);
}
.topbar {
  background: linear-gradient(180deg, rgba(8,18,38,.94), rgba(8,18,38,.84));
  border-bottom: 1px solid var(--border);
}
.top-actions button, .actions button, .toolbar button { width: auto; }
button.primary-btn, .chip.active, .top-actions button:first-child {
  background: linear-gradient(135deg, #c5161d, #8f1015);
  border-color: #c5161d;
}
.kpi {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(10,22,44,.92), rgba(7,18,38,.98));
}
.kpi::after {
  content: "";
  position: absolute; inset: auto -20px -30px auto;
  width: 110px; height: 110px;
  background: radial-gradient(circle, rgba(246,196,67,.18), transparent 60%);
}
.enterprise-grid { display:grid; grid-template-columns: 1.4fr 1fr; gap:18px; margin-top:18px; }
.enterprise-card { padding:18px; }
.chart-bars { display:grid; grid-template-columns: repeat(6, 1fr); gap:12px; align-items:end; height:180px; margin-top:16px; }
.chart-bar {
  background: linear-gradient(180deg, rgba(246,196,67,.95), rgba(197,22,29,.95));
  border-radius: 14px 14px 8px 8px;
  min-height: 18px;
  position: relative;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.chart-bar span {
  position:absolute; bottom:-24px; left:50%; transform:translateX(-50%);
  font-size:12px; color: var(--muted);
}
.chart-legend { display:flex; justify-content:space-between; gap:8px; margin-top:30px; color:var(--muted); font-size:12px; }
.audit-list li, .bullet-list li { margin-bottom: 8px; }
.mini-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:14px; }
.soft-card {
  padding: 14px; border-radius: 14px; border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(17,24,39,.70), rgba(8,18,38,.78));
}
.system-footer {
  text-align:center; color:var(--muted); padding:12px 20px 20px;
  border-top: 1px solid rgba(71,85,105,.28);
}
.doc-preview {
  border-radius: 18px;
  box-shadow: 0 16px 35px rgba(15,23,42,.16);
}
.table-card h3, .form-card h3, .enterprise-card h3 { margin-bottom: 12px; }


/* LICENSE UI UPGRADE CSS */
.license-layout{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:14px}
.metric-card,.metric-card-warn,.metric-card-danger{padding:28px;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02)}
.metric-card-warn{border-color:rgba(245,158,11,.35);box-shadow:inset 0 0 0 1px rgba(245,158,11,.05)}
.metric-card-danger{border-color:rgba(239,68,68,.35);box-shadow:inset 0 0 0 1px rgba(239,68,68,.06)}
.metric-title{font-size:18px;color:#c3d0ef;margin-bottom:18px}
.metric-value{font-size:42px;font-weight:800;line-height:1.1;color:#fff}
.license-warning-panel{margin-top:18px;padding:18px 22px;border-radius:18px;background:linear-gradient(90deg, rgba(217,119,6,.22), rgba(180,83,9,.18));border:1px solid rgba(245,158,11,.35);font-size:16px;color:#ffd39b}
.pill{display:inline-block;padding:10px 18px;border-radius:999px;font-weight:700}
.pill-ok{background:rgba(22,163,74,.18);border:1px solid rgba(22,163,74,.32);color:#9ff3b8}
.pill-warn{background:rgba(245,158,11,.18);border:1px solid rgba(245,158,11,.32);color:#ffd39b}
.pill-bad{background:rgba(239,68,68,.18);border:1px solid rgba(239,68,68,.32);color:#ffaaa9}
.three-col{grid-template-columns:1.2fr 1fr auto}
@media (max-width: 980px){.license-layout{grid-template-columns:1fr}.three-col{grid-template-columns:1fr}}


input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #475569;
  box-shadow: none;
}

.topbar, .panel, .card, .table-card, .kpi, .form-card, .stat-card {
  will-change: auto;
}


/* rev21 safe footer */

.footer-logo{
  width:20px;
  height:20px;
  object-fit:contain;
  flex:0 0 auto;
}
.system-footer{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

/* rev63.7 perf */
.form-card,.table-card,.metric-card{backface-visibility:hidden;transform:translateZ(0);}
input:focus, select:focus, textarea:focus{
  outline:none;
  box-shadow:none !important;
}
button, input, select, textarea{
  transition:none !important;
}


/* rev22 printer settings */
#setReceiptPrinter,#setReceiptPaperWidth{min-height:44px}


/* rev24 printer ui + lighter interaction */
#setReceiptPrinter,#setReceiptPaperWidth{min-height:44px}
#testReceiptPrinterBtn{white-space:nowrap}
button,input,select,textarea{transition:none !important;animation:none !important}


/* rev25 GST fields */
#setGstEnabled,#setGstRate,#setGstTin{min-height:44px}


/* rev26 check-in UI */
input::placeholder,textarea::placeholder{color:#93a4c7 !important;opacity:1 !important;}


/* rev27 corporate multi-items */
.multi-item-box{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.quote-item-row{display:grid;grid-template-columns:2fr .7fr 1fr auto;gap:10px;align-items:center}


/* rev28 room/item selectors */
.multi-item-box{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.smart-item-row{display:grid;grid-template-columns:1.5fr 1.4fr .6fr .8fr auto;gap:10px;align-items:center}
#addQuoteRoomBtn,#addInvoiceRoomBtn,#addQuoteItemBtn,#addInvoiceItemBtn{margin-top:6px}


/* rev29 quotation/invoice selector fix */
.multi-item-box{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.smart-item-row{display:grid;grid-template-columns:1.5fr 1.4fr .6fr .8fr auto;gap:10px;align-items:center}
#addQuoteRoomBtn,#addInvoiceRoomBtn,#addQuoteItemBtn,#addInvoiceItemBtn{margin-top:6px}


/* rev30 selector layout fix */
.smart-item-row{
  display:grid;
  grid-template-columns:minmax(220px,2fr) minmax(180px,1.5fr) minmax(90px,.8fr) minmax(120px,1fr) auto;
  gap:12px;
  align-items:center;
  width:100%;
}
.smart-item-row select,
.smart-item-row input,
.smart-item-row button{
  min-height:48px;
  width:100%;
}
.smart-item-row .remove-smart-item{
  min-width:120px;
  padding:10px 14px;
}
.multi-item-box{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}
@media (max-width: 1100px){
  .smart-item-row{
    grid-template-columns:1fr 1fr;
  }
  .smart-item-row .remove-smart-item{
    width:100%;
  }
}
@media (max-width: 700px){
  .smart-item-row{
    grid-template-columns:1fr;
  }
}


/* rev31 best arrangement */
.two-col{
  display:grid;
  grid-template-columns:minmax(460px, 520px) 1fr;
  gap:20px;
  align-items:start;
}
.form-card{
  width:100%;
  overflow:hidden;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  align-items:start;
}
.form-grid .full{
  grid-column:1 / -1;
}
.multi-item-box{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
  margin-top:10px;
}
.smart-item-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  width:100% !important;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.02);
}
.smart-item-row select,
.smart-item-row input,
.smart-item-row button{
  width:100% !important;
  min-height:48px;
}
.smart-item-row .remove-smart-item{
  min-width:unset;
}
#addQuoteRoomBtn,
#addInvoiceRoomBtn,
#addQuoteItemBtn,
#addInvoiceItemBtn{
  width:100%;
  min-height:46px;
}
.table-card, .table-wrap{
  overflow:auto;
}
@media (max-width: 1100px){
  .two-col{
    grid-template-columns:1fr;
  }
}


/* rev32 force layout fix for quotations/invoices */
body .two-col{
  display:grid !important;
  grid-template-columns:minmax(520px, 560px) minmax(0, 1fr) !important;
  gap:24px !important;
  align-items:start !important;
}

body .two-col > .form-card{
  width:100% !important;
  max-width:560px !important;
  min-width:0 !important;
  overflow:hidden !important;
}

body .two-col > div:last-child,
body .two-col > .table-card,
body .two-col > .table-wrap{
  min-width:0 !important;
  width:100% !important;
}

body .form-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px !important;
  align-items:start !important;
}

body .form-grid > *{
  min-width:0 !important;
}

body .form-grid .full{
  grid-column:1 / -1 !important;
}

body #quoteItemsBox,
body #invoiceItemsBox{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  width:100% !important;
  margin-top:10px !important;
}

body .smart-item-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  padding:12px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.02) !important;
  box-sizing:border-box !important;
}

body .smart-item-row > *{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

body .smart-item-row select,
body .smart-item-row input,
body .smart-item-row button{
  min-height:48px !important;
}

body #addQuoteRoomBtn,
body #addInvoiceRoomBtn,
body #addQuoteItemBtn,
body #addInvoiceItemBtn,
body .remove-smart-item{
  width:100% !important;
}

body .table-card,
body .table-wrap{
  width:100% !important;
  max-width:100% !important;
  overflow:auto !important;
}

@media (max-width: 1200px){
  body .two-col{
    grid-template-columns:1fr !important;
  }
  body .two-col > .form-card{
    max-width:none !important;
  }
}

@media (max-width: 700px){
  body .form-grid{
    grid-template-columns:1fr !important;
  }
}


/* rev38 smart printer manager */
#setA4Printer,#testA4PrinterBtn,#testReceiptPrinterBtn{min-height:44px}


/* rev39 conference and open items */
.open-item-grid{
  margin-top:8px;
}
.open-item-grid input{
  min-height:44px;
}
#saveQuoteOpenItemBtn,
#saveInvoiceOpenItemBtn{
  margin-top:8px;
  width:100%;
}


/* rev42 auto logo colors */
.color-preview-box{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:6px;
}
.color-chip{
  min-width:110px;
  min-height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:700;
  border:1px solid rgba(255,255,255,.12);
}
.color-chip.dark-text{
  color:#111827;
}
#autoDetectLogoColorsBtn{
  width:100%;
  min-height:44px;
}


/* rev43 document template selector */
#setDocumentTemplate{min-height:44px}


/* rev44 accounting */


/* rev48 dashboard ui fix */
.dashboard-section{margin-bottom:18px}
.dashboard-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:16px;
}
.dashboard-kpis .kpi{
  min-height:132px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.dashboard-kpis .kpi:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(0,0,0,.25);
  border-color:#3b4d6a;
}
.quick-action-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
}
.quick-action-card{
  text-align:left;
  min-height:122px;
  padding:18px;
  border-radius:16px;
  border:1px solid #233047;
  background:var(--panel);
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.quick-action-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
  border-color:#3b4d6a;
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
}
.quick-action-title{
  font-size:24px;
  font-weight:800;
  color:var(--text);
  margin-bottom:8px;
}
.quick-action-desc{
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}
.dashboard-panels{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.sidebar button.nav-btn,
.sidebar button{
  border-radius:12px;
}
.nav-btn.active{
  background:rgba(255,255,255,.06);
  border:1px solid #30415d;
}
@media (max-width: 980px){
  .dashboard-panels{grid-template-columns:1fr}
}


/* rev49 ui upgrade */
.quick-action-card,
.dashboard-kpis .kpi{
  position: relative;
  overflow: hidden;
}
.quick-action-card::before,
.dashboard-kpis .kpi::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:linear-gradient(135deg, color-mix(in srgb, var(--primary) 70%, transparent), color-mix(in srgb, var(--accent) 70%, transparent));
  opacity:0;
  transition:opacity .22s ease;
  pointer-events:none;
}
.quick-action-card::after,
.dashboard-kpis .kpi::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-60px;
  top:-60px;
  background:radial-gradient(circle, color-mix(in srgb, var(--accent) 28%, transparent) 0%, transparent 70%);
  opacity:.0;
  transition:opacity .22s ease, transform .22s ease;
  transform:scale(.9);
  pointer-events:none;
}
.quick-action-card:hover,
.dashboard-kpis .kpi:hover{
  border-color: color-mix(in srgb, var(--accent) 55%, #3b4d6a);
}
.quick-action-card:hover::before,
.dashboard-kpis .kpi:hover::before{
  opacity:.12;
}
.quick-action-card:hover::after,
.dashboard-kpis .kpi:hover::after{
  opacity:1;
  transform:scale(1);
}
.quick-action-card[data-goto-tab="stays"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, #22c55e 32%, transparent);
  border-color:#22c55e;
}
.quick-action-card[data-goto-tab="invoices"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, #3b82f6 32%, transparent);
  border-color:#3b82f6;
}
.quick-action-card[data-goto-tab="quotations"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, var(--accent) 32%, transparent);
}
.quick-action-card[data-goto-tab="sales"]:hover{
  box-shadow:0 14px 30px color-mix(in srgb, var(--primary) 32%, transparent);
}
.kpi.hover-on .value,
.quick-action-card.hover-on .quick-action-title{
  text-shadow:0 0 12px color-mix(in srgb, var(--accent) 45%, transparent);
}


/* rev50 room type dashboard */
.room-type-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
}
.room-type-card{
  background:var(--panel);
  border:1px solid #233047;
  border-radius:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  padding:18px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.room-type-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
  border-color:#3b4d6a;
}
.room-type-name{
  font-size:18px;
  font-weight:800;
  margin-bottom:10px;
}
.room-type-main{
  font-size:26px;
  font-weight:800;
  color:var(--accent);
  margin-bottom:10px;
}
.room-type-meta{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:var(--muted);
}


/* rev52 smoothness cleanup */
.quick-action-card,
.dashboard-kpis .kpi,
.room-type-card{
  will-change: transform;
}
.table-wrap{
  contain: content;
}


/* rev53 revised banking ui */
.section-label{
  margin-top:10px;
  color: var(--accent);
  font-weight: 800;
  font-size: 14px;
}


/* rev53b banking boxes ui */
.section-label{margin-top:10px;color:var(--accent);font-weight:800;font-size:14px}


.field-help{color:var(--muted);font-size:13px;margin-top:-6px;margin-bottom:2px}


/* rev61 sidebar branding */
.sidebar{
  background: linear-gradient(180deg, color-mix(in srgb, var(--secondary-ui) 90%, #000), color-mix(in srgb, var(--secondary-ui) 75%, #001b44)) !important;
  border-right: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  box-shadow: inset -1px 0 0 rgba(255,255,255,.03), 0 0 20px rgba(0,0,0,.15);
}
.sidebar .brand{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
  border-radius: 16px;
  padding: 10px;
}
.sidebar .nav-btn{
  background: transparent;
  border: 1px solid transparent;
}
.sidebar .nav-btn:hover{
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 18%, transparent), transparent);
  border-color: color-mix(in srgb, var(--accent) 20%, transparent);
}
.sidebar .nav-btn.active{
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 28%, transparent), color-mix(in srgb, var(--accent) 12%, transparent));
  border-color: color-mix(in srgb, var(--accent) 35%, transparent);
  box-shadow: inset 3px 0 0 var(--accent);
}


/* rev62 menu theme + dark/light mode */
body.theme-dark{
  --bg:#031022;
  --panel:#06162f;
  --text:#f5f7fb;
  --muted:#9fb0cc;
  --border:#1d3557;
}
body.theme-light{
  --bg:#f4f7fb;
  --panel:#ffffff;
  --text:#132033;
  --muted:#5f6f86;
  --border:#d7dee8;
}
body{
  background: var(--bg);
  color: var(--text);
}
.sidebar{
  background: linear-gradient(180deg, color-mix(in srgb, var(--menu-bg) 96%, #000), color-mix(in srgb, var(--menu-bg) 85%, #001b44)) !important;
  border-right: 1px solid color-mix(in srgb, var(--menu-active) 30%, transparent);
}
.sidebar .brand,
.sidebar .nav-btn{
  color: var(--menu-text);
}
.sidebar .nav-btn{
  background: transparent;
}
.sidebar .nav-btn:hover{
  color: var(--menu-text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--menu-active) 14%, transparent), transparent);
  border-color: color-mix(in srgb, var(--menu-active) 26%, transparent);
}
.sidebar .nav-btn.active{
  color: var(--menu-text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--menu-active) 22%, transparent), color-mix(in srgb, var(--primary) 10%, transparent));
  box-shadow: inset 4px 0 0 var(--menu-active);
  border-color: color-mix(in srgb, var(--menu-active) 40%, transparent);
}
.form-card,.table-card,.kpi,.room-type-card,.quick-action-card{
  background: var(--panel);
  border-color: var(--border);
  color: var(--text);
}
input,select,textarea,button{
  color: var(--text);
}
input,select,textarea{
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  border-color: var(--border);
}
.table-wrap table, table{
  color: var(--text);
}
th,td{
  border-color: var(--border) !important;
}
th{
  background: color-mix(in srgb, var(--panel) 75%, #0000) !important;
}


/* rev67.7 sidebar logo hover-only animation */
.sidebar .sidebar-logo{
  transform-origin:center center;
  transition:transform .22s ease, filter .22s ease, opacity .22s ease !important;
  will-change:transform, opacity, filter;
  animation:none !important;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.20));
}
.sidebar .sidebar-logo:hover{
  animation:sidebarLogoBurstReform .95s cubic-bezier(.22,.61,.36,1) infinite;
}
.system-footer{
  position:relative;
  overflow:hidden;
}
#appView .system-footer{
  animation:footerPulseLoop 4.6s ease-in-out infinite;
}
#appView .system-footer .footer-logo{
  animation:footerLogoGlow 4.6s ease-in-out infinite;
}
#appView .system-footer span{
  animation:footerTextFloat 4.6s ease-in-out infinite;
}
#appView .system-footer::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, transparent 0%, rgba(246,196,67,.08) 35%, rgba(197,22,29,.08) 50%, rgba(246,196,67,.08) 65%, transparent 100%);
  opacity:.0;
  animation:footerShimmer 4.6s ease-in-out infinite;
}
@keyframes sidebarLogoEmerge{
  0%{transform:scale(.72) translateY(12px) rotate(-2deg); opacity:0; filter:drop-shadow(0 0 0 rgba(246,196,67,0));}
  18%{transform:scale(.86) translateY(6px) rotate(-1deg); opacity:.26;}
  36%{transform:scale(.98) translateY(0) rotate(0deg); opacity:.88; filter:drop-shadow(0 0 10px rgba(246,196,67,.18));}
  50%{transform:scale(1.08) translateY(-1px) rotate(.8deg); opacity:1; filter:drop-shadow(0 0 16px rgba(246,196,67,.28)) drop-shadow(0 0 26px rgba(197,22,29,.12));}
  66%{transform:scale(1.02) translateY(1px) rotate(-.6deg); opacity:.76;}
  82%{transform:scale(.90) translateY(7px) rotate(0deg); opacity:.22; filter:drop-shadow(0 0 6px rgba(197,22,29,.14));}
  100%{transform:scale(.72) translateY(12px) rotate(-2deg); opacity:0; filter:drop-shadow(0 0 0 rgba(246,196,67,0));}
}
@keyframes sidebarLogoHoverWave{
  0%,100%{transform:scale(.98) skewX(0deg) translateY(0); opacity:.92;}
  20%{transform:scale(1.02) skewX(-2deg) translateY(-1px); opacity:1;}
  40%{transform:scale(1.06) skewX(2deg) translateY(0); opacity:.98;}
  60%{transform:scale(1.03) skewX(-1.5deg) translateY(1px); opacity:.94;}
  80%{transform:scale(1.01) skewX(1deg) translateY(0); opacity:.98;}
}
@keyframes footerPulseLoop{
  0%,100%{opacity:1; transform:translateY(0);}
  30%{opacity:.26; transform:translateY(0);}
  48%{opacity:.92; transform:translateY(-1px);}
  72%{opacity:.34; transform:translateY(0);}
}
@keyframes footerLogoGlow{
  0%,100%{transform:scale(.92); opacity:.15; filter:drop-shadow(0 0 0 rgba(246,196,67,0));}
  45%{transform:scale(1.08); opacity:1; filter:drop-shadow(0 0 8px rgba(246,196,67,.32));}
  70%{transform:scale(.98); opacity:.42; filter:drop-shadow(0 0 4px rgba(197,22,29,.28));}
}
@keyframes footerTextFloat{
  0%,100%{letter-spacing:.2px; transform:translateY(0); opacity:1;}
  45%{letter-spacing:.8px; transform:translateY(-1px); opacity:.92;}
  72%{opacity:.34;}
}
@keyframes footerShimmer{
  0%,100%{opacity:0; transform:translateX(-18%);}
  45%{opacity:.6; transform:translateX(0%);}
  75%{opacity:0; transform:translateX(18%);}
}


.field-hint{font-size:12px;color:#9fb3d9;margin-top:-6px;padding:2px 4px;}
.full-span{grid-column:1 / -1;}
.status-badge.danger{background:rgba(220,38,38,.16);color:#fca5a5;border-color:rgba(220,38,38,.35);}
.status-badge.warn{background:rgba(245,158,11,.16);color:#fde68a;border-color:rgba(245,158,11,.35);}


.checkout-alert-card{
  background: linear-gradient(180deg, rgba(255,196,0,.10), rgba(255,90,90,.08)), var(--panel);
  border: 1px solid rgba(255,196,0,.35);
  box-shadow: 0 10px 24px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.03);
}
.checkout-alert-card h3{
  color: #ffe67a;
}
.checkout-alert-card .muted{
  color: #f4ddb0;
}


/* rev66.6 premium grouped sidebar */
.nav-group{margin-top:14px;padding-top:6px}
.nav-group:first-child{margin-top:6px}
.nav-group-title{display:flex;align-items:center;gap:10px;color:color-mix(in srgb,var(--menu-text) 78%, #b6c2d9);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:8px 6px 10px;opacity:.98;position:relative}
.nav-group-title-text{display:inline-flex;align-items:center;flex-wrap:wrap;gap:1px;animation:navGroupTitlePulse 2.4s ease-in-out infinite}
.nav-group-letter{display:inline-block;position:relative;will-change:transform,color,text-shadow;animation:navGroupLetterGlow 1.8s ease-in-out infinite, navGroupLetterShift 3.4s linear infinite;color:#f2e94e;text-shadow:0 0 4px rgba(255,227,102,.35),0 0 12px rgba(255,90,90,.20);filter:drop-shadow(0 0 5px rgba(255,180,80,.18));animation-delay:calc(var(--letter-index) * .08s);padding:0 1px}
.nav-group-line{display:inline-block;width:18px;height:1px;background:linear-gradient(90deg,var(--menu-active),transparent);box-shadow:0 0 10px color-mix(in srgb,var(--menu-active) 35%, transparent)}
.sidebar .nav-btn{display:flex;align-items:center;gap:10px;position:relative;overflow:hidden;border-radius:14px;transition:transform .18s ease, background .22s ease, box-shadow .22s ease, border-color .22s ease}
.sidebar .nav-btn:hover{transform:translateX(3px);box-shadow:0 10px 24px color-mix(in srgb,var(--menu-active) 10%, transparent), inset 0 0 0 1px color-mix(in srgb,var(--menu-active) 8%, transparent)}
.sidebar .nav-btn.active{transform:translateX(2px)}
.nav-indicator{width:12px;height:12px;min-width:12px;border-radius:999px;border:2px solid color-mix(in srgb,var(--menu-active) 75%, #fff);background:color-mix(in srgb,var(--menu-active) 18%, transparent);display:inline-block;position:relative;box-shadow:0 0 0 3px color-mix(in srgb,var(--menu-active) 8%, transparent);transition:all .24s ease}
.nav-indicator::after{content:'';position:absolute;left:2px;top:0px;width:4px;height:7px;border-right:2px solid transparent;border-bottom:2px solid transparent;transform:rotate(45deg) scale(.6);opacity:0;transition:all .22s ease}
.sidebar .nav-btn:hover .nav-indicator,.sidebar .nav-btn.active .nav-indicator{border-color:color-mix(in srgb,var(--menu-active) 95%, #fff);background:linear-gradient(180deg,color-mix(in srgb,var(--menu-active) 90%, #fff), color-mix(in srgb,var(--menu-active) 58%, #0b1220));box-shadow:0 0 14px color-mix(in srgb,var(--menu-active) 30%, transparent)}
.sidebar .nav-btn:hover .nav-indicator::after,.sidebar .nav-btn.active .nav-indicator::after{opacity:1;border-right-color:#ffffff;border-bottom-color:#ffffff;left:3px;top:1px;transform:rotate(45deg) scale(1)}
.nav-label{flex:1;text-align:left}

@keyframes navGroupLetterGlow{
  0%{transform:translateY(0);color:#f4e85d;text-shadow:0 0 2px rgba(255,230,120,.18),0 0 7px rgba(255,120,80,.12)}
  12%{transform:translateY(-1px);color:#ffd86b;text-shadow:0 0 4px rgba(255,220,110,.35),0 0 10px rgba(255,106,106,.22),0 0 16px rgba(255,64,64,.18)}
  26%{transform:translateY(0);color:#ffb66d;text-shadow:0 0 4px rgba(255,182,109,.30),0 0 12px rgba(255,105,180,.18)}
  42%{transform:translateY(1px);color:#7cf7ff;text-shadow:0 0 5px rgba(124,247,255,.32),0 0 14px rgba(53,180,255,.18)}
  58%{transform:translateY(0);color:#c1ff72;text-shadow:0 0 5px rgba(193,255,114,.28),0 0 12px rgba(97,255,162,.16)}
  74%{transform:translateY(-1px);color:#ff8bf5;text-shadow:0 0 5px rgba(255,139,245,.28),0 0 12px rgba(255,88,176,.18)}
  100%{transform:translateY(0);color:#f2e94e;text-shadow:0 0 2px rgba(255,230,120,.18),0 0 7px rgba(255,120,80,.12)}
}

@keyframes navGroupLetterShift{
  0%,100%{transform:translateY(0) scale(1)}
  25%{transform:translateY(-2px) scale(1.05)}
  50%{transform:translateY(1px) scale(.98)}
  75%{transform:translateY(-1px) scale(1.03)}
}


.duplicate-notice {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(246, 196, 67, 0.35);
  background: linear-gradient(135deg, rgba(246,196,67,0.12), rgba(197,22,29,0.10));
  color: #f8fafc;
}
.duplicate-title { font-weight: 700; margin-bottom: 4px; }
.duplicate-line { font-size: 12px; opacity: 0.95; margin-bottom: 6px; }
.dup-chip-wrap { display:flex; flex-wrap:wrap; gap:6px; }
.dup-chip { display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; font-size:11px; background:rgba(15,23,42,0.45); border:1px solid rgba(255,255,255,0.12); }
.dup-chip.exact { border-color: rgba(248,113,113,0.45); }
.dup-chip.similar { border-color: rgba(251,191,36,0.45); }
body.theme-light .duplicate-notice { color:#111827; background: linear-gradient(135deg, rgba(246,196,67,0.18), rgba(197,22,29,0.08)); }


/* rev68.0 smoky sidebar logo background */
.sidebar-logo-shell{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:230px;
  max-width:100%;
  min-height:126px;
  margin:4px auto 16px;
  isolation:isolate;
}
.sidebar-logo-smoke{
  position:absolute;
  inset:8px 10px 12px;
  border-radius:28px;
  background:
    radial-gradient(40% 55% at 30% 50%, rgba(197,22,29,.20), transparent 72%),
    radial-gradient(42% 58% at 70% 46%, rgba(130,0,0,.18), transparent 70%),
    radial-gradient(58% 80% at 50% 60%, rgba(125,0,0,.18), transparent 74%);
  filter: blur(18px) saturate(115%);
  opacity:.72;
  z-index:0;
  pointer-events:none;
  animation:sidebarSmokeLoop 8.5s ease-in-out infinite;
}
.sidebar-logo-shell::before,
.sidebar-logo-shell::after{
  content:"";
  position:absolute;
  inset:12px 18px;
  border-radius:999px;
  background:radial-gradient(circle at 50% 50%, rgba(255,70,70,.12), transparent 66%);
  filter: blur(14px);
  opacity:.55;
  pointer-events:none;
  z-index:0;
}
.sidebar-logo-shell::after{
  inset:18px 32px 14px;
  animation:sidebarSmokeDrift 10s ease-in-out infinite reverse;
}
.sidebar .sidebar-logo{
  position:relative;
  z-index:1;
  margin-bottom:0 !important;
}
@keyframes sidebarSmokeLoop{
  0%,100%{transform:translate3d(-6px,0,0) scale(1); opacity:.52;}
  20%{transform:translate3d(10px,-4px,0) scale(1.06); opacity:.78;}
  45%{transform:translate3d(-2px,5px,0) scale(.98); opacity:.62;}
  70%{transform:translate3d(8px,3px,0) scale(1.09); opacity:.84;}
}
@keyframes sidebarSmokeDrift{
  0%,100%{transform:translateX(-10px) scale(.96); opacity:.24;}
  50%{transform:translateX(14px) scale(1.08); opacity:.48;}
}


@keyframes navGroupTitlePulse{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.12)}
}

/* Mobile UX v2.0 - Hotel Kimininga phone/tablet interface */
.mobile-menu-btn,
.mobile-close-nav,
.mobile-nav-overlay,
.mobile-bottom-nav,
.mobile-action-fab,
.mobile-action-sheet,
.mobile-action-backdrop,
.mobile-swipe-hint,
.mobile-card-list,
.mobile-dashboard-hub { display:none; }

@media (max-width: 860px) {
  html { height: 100%; -webkit-text-size-adjust: 100%; }
  body {
    height: auto !important;
    min-height: 100%;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #061226 !important;
    padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom) 0;
  }
  .screen { min-height: 100dvh; }
  .center-screen { padding: 14px; align-items: start; padding-top: 28px; }
  .auth-panel {
    max-width: 100% !important;
    width: 100%;
    min-height: auto;
    padding: 22px 18px !important;
    border-radius: 24px !important;
  }
  .login-logo { width: 190px !important; max-width: 70% !important; margin-bottom: 18px !important; }
  .auth-panel h1 { font-size: 32px; line-height: 1.05; }
  .auth-panel .sub { font-size: 16px; line-height: 1.45; }
  input, select, textarea, button {
    min-height: 52px !important;
    font-size: 16px !important;
    border-radius: 15px !important;
    padding: 13px 14px !important;
  }
  #appView {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }
  .workspace {
    height: auto !important;
    min-height: 100dvh;
    overflow: visible !important;
    padding-top: calc(74px + env(safe-area-inset-top));
  }
  .topbar {
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 900;
    min-height: calc(66px + env(safe-area-inset-top));
    padding: calc(10px + env(safe-area-inset-top)) 12px 10px 12px !important;
    display: grid !important;
    grid-template-columns: 48px 1fr auto;
    gap: 8px;
    align-items: center;
    background: rgba(6, 18, 38, .98) !important;
    backdrop-filter: blur(12px);
    box-shadow: 0 8px 24px rgba(0,0,0,.28);
  }
  .mobile-menu-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #c5161d, #8f1015) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    color: #fff !important;
    font-size: 24px !important;
    line-height: 1;
  }
  .topbar-left { min-width: 0 !important; gap: 1px !important; }
  .topbar-left h3 { font-size: 18px !important; margin: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #licenseHint { font-size: 11px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .workspace-brand-banner { display: none !important; }
  .top-actions { gap: 6px !important; justify-content: flex-end; }
  .top-actions button {
    min-width: 0 !important;
    width: auto !important;
    min-height: 42px !important;
    padding: 10px 11px !important;
    margin: 0 !important;
    font-size: 12px !important;
    border-radius: 13px !important;
  }
  .content {
    padding: 12px 12px calc(98px + env(safe-area-inset-bottom)) 12px !important;
    overflow: visible !important;
  }
  .sidebar {
    position: fixed !important;
    top: 0; bottom: 0; left: 0;
    z-index: 1100;
    width: min(88vw, 350px) !important;
    height: 100dvh !important;
    max-height: none !important;
    overflow-y: auto !important;
    transform: translateX(-104%);
    transition: transform .22s ease !important;
    padding: calc(14px + env(safe-area-inset-top)) 14px calc(90px + env(safe-area-inset-bottom)) !important;
    border-right: 1px solid rgba(246,196,67,.26) !important;
    box-shadow: 20px 0 50px rgba(0,0,0,.45) !important;
  }
  body.mobile-nav-open .sidebar { transform: translateX(0); }
  .mobile-nav-overlay {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0,0,0,.56);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
  }
  body.mobile-nav-open .mobile-nav-overlay { opacity: 1; pointer-events: auto; }
  .mobile-close-nav {
    display: inline-flex !important;
    position: absolute;
    top: calc(10px + env(safe-area-inset-top)); right: 10px;
    width: 42px !important; height: 42px !important;
    min-height: 42px !important; min-width: 42px !important;
    align-items: center; justify-content: center;
    padding: 0 !important; margin: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
    font-size: 26px !important;
    z-index: 2;
  }
  .sidebar-logo-shell { width: 180px !important; min-height: 96px !important; margin-top: 28px !important; }
  .sidebar button.nav-btn, .sidebar button {
    min-height: 48px !important;
    margin-top: 7px !important;
    font-size: 15px !important;
  }
  .nav-group-title { font-size: 10px !important; margin-top: 14px !important; }
  .grid.kpis, .dashboard-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  .kpi { padding: 13px !important; min-height: 104px !important; border-radius: 18px !important; }
  .kpi .label { font-size: 12px !important; }
  .kpi .value { font-size: 23px !important; margin-top: 6px !important; }
  .quick-action-grid, .room-type-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .quick-action-card, .room-type-card, .form-card, .table-card, .card, .panel {
    border-radius: 18px !important;
    padding: 14px !important;
  }
  .quick-action-card { min-height: 86px !important; }
  .quick-action-title { font-size: 20px !important; }
  .quick-action-desc { font-size: 13px !important; }
  .dashboard-panels, .enterprise-grid, .license-layout, .two-col, body .two-col {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .form-grid, body .form-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
  .toolbar, .actions, .top-actions { flex-wrap: wrap; }
  .toolbar button, .actions button {
    width: 100% !important;
    margin-top: 6px !important;
  }
  .actions { gap: 6px !important; }
  .table-card { margin-top: 12px; overflow: hidden !important; }
  .table-wrap { max-width: 100%; overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  table { min-width: 760px; font-size: 13px !important; }
  th, td { padding: 9px 8px !important; }
  .mobile-swipe-hint {
    display: block !important;
    font-size: 12px;
    color: #ffd86b;
    margin-bottom: 8px;
    padding: 8px 10px;
    border-radius: 12px;
    background: rgba(246,196,67,.10);
    border: 1px solid rgba(246,196,67,.18);
  }
  .mobile-card-list {
    display: grid !important;
    gap: 10px;
    margin-top: 10px;
  }
  .mobile-record-card {
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.035);
    border-radius: 16px;
    padding: 12px;
  }
  .mobile-record-row {
    display: grid;
    grid-template-columns: 38% 1fr;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px solid rgba(255,255,255,.07);
  }
  .mobile-record-row:last-child { border-bottom: 0; }
  .mobile-record-key { color: #a9bad8; font-size: 12px; font-weight: 700; }
  .mobile-record-val { color: #fff; font-size: 13px; word-break: break-word; }
  .table-wrap.has-mobile-cards { margin-top: 8px; }
  .doc-preview { overflow-x: auto; padding: 14px !important; border-radius: 14px !important; }
  .system-footer { display: none !important; }
  .mobile-bottom-nav {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr);
    position: fixed;
    left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom));
    z-index: 930;
    border-radius: 24px;
    padding: 7px;
    background: rgba(7,18,38,.98);
    border: 1px solid rgba(246,196,67,.20);
    box-shadow: 0 10px 32px rgba(0,0,0,.42);
    backdrop-filter: blur(14px);
    gap: 4px;
  }
  .mobile-bottom-nav button {
    min-width: 0 !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 6px 3px !important;
    border: 0 !important;
    background: transparent !important;
    border-radius: 18px !important;
    color: #afbdd4 !important;
    font-size: 11px !important;
    line-height: 1.15;
  }
  .mobile-bottom-nav button .ico { display:block; font-size: 18px; margin-bottom: 3px; }
  .mobile-bottom-nav button.active {
    color: #fff !important;
    background: linear-gradient(135deg, rgba(197,22,29,.9), rgba(246,196,67,.22)) !important;
  }
  .mobile-action-fab {
    display: inline-flex !important;
    align-items: center; justify-content: center;
    position: fixed;
    right: 16px; bottom: calc(76px + env(safe-area-inset-bottom));
    z-index: 940;
    width: 58px !important; height: 58px !important;
    min-width: 58px !important; min-height: 58px !important;
    padding: 0 !important; margin: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #f6c443, #c5161d) !important;
    color: #fff !important;
    font-size: 30px !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.42);
  }
  .mobile-action-backdrop {
    display: block;
    position: fixed; inset: 0; z-index: 1200;
    background: rgba(0,0,0,.54);
    opacity: 0; pointer-events: none;
    transition: opacity .2s ease;
  }
  .mobile-action-sheet {
    display: block;
    position: fixed; left: 0; right: 0; bottom: 0;
    z-index: 1210;
    padding: 16px 14px calc(18px + env(safe-area-inset-bottom));
    border-radius: 26px 26px 0 0;
    background: #081832;
    border-top: 1px solid rgba(246,196,67,.25);
    box-shadow: 0 -18px 46px rgba(0,0,0,.52);
    transform: translateY(105%);
    transition: transform .22s ease;
  }
  body.mobile-actions-open .mobile-action-backdrop { opacity:1; pointer-events:auto; }
  body.mobile-actions-open .mobile-action-sheet { transform: translateY(0); }
  .mobile-action-sheet h3 { font-size: 18px; margin-bottom: 12px; }
  .mobile-action-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .mobile-action-grid button {
    margin: 0 !important;
    min-height: 58px !important;
    background: rgba(255,255,255,.055) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    text-align: left;
    font-size: 14px !important;
  }
  .mobile-dashboard-hub {
    display: block !important;
    margin-bottom: 12px;
    padding: 14px;
    border-radius: 20px;
    border: 1px solid rgba(246,196,67,.18);
    background: linear-gradient(135deg, rgba(197,22,29,.18), rgba(246,196,67,.10));
  }
  .mobile-dashboard-hub h3 { font-size: 18px; margin-bottom: 5px; }
  .mobile-hub-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 12px; }
  .mobile-hub-grid button { min-height: 56px !important; margin: 0 !important; text-align: left; }
}

@media (max-width: 420px) {
  .grid.kpis, .dashboard-kpis { grid-template-columns: 1fr 1fr !important; }
  .mobile-record-row { grid-template-columns: 1fr; gap: 3px; }
  .auth-panel h1 { font-size: 29px; }
}

/* Mobile UX v3.0 - single selected page/panel mode */
.mobile-current-page-label,
.mobile-pane-switcher { display:none; }
@media (max-width: 860px) {
  .mobile-current-page-label {
    display:flex !important;
    flex-direction:column;
    gap:4px;
    margin:0 0 10px 0;
    padding:12px 14px;
    border-radius:18px;
    background:linear-gradient(135deg, rgba(197,22,29,.20), rgba(246,196,67,.10));
    border:1px solid rgba(246,196,67,.20);
    color:#fff;
  }
  .mobile-current-page-label strong { font-size:17px; line-height:1.1; }
  .mobile-current-page-label span { font-size:12px; color:#bfd0ec; line-height:1.35; }
  .mobile-pane-switcher {
    display:flex !important;
    gap:8px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:4px 1px 10px;
    margin-bottom:6px;
  }
  .mobile-pane-switcher::-webkit-scrollbar{ display:none; }
  .mobile-pane-switcher button {
    flex:0 0 auto;
    min-height:44px !important;
    padding:10px 14px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.055) !important;
    border:1px solid rgba(255,255,255,.12) !important;
    color:#c7d6ee !important;
    font-size:14px !important;
    margin:0 !important;
    white-space:nowrap;
  }
  .mobile-pane-switcher button.active {
    color:#fff !important;
    background:linear-gradient(135deg,#c5161d,#8f1015) !important;
    border-color:rgba(246,196,67,.36) !important;
    box-shadow:0 8px 20px rgba(0,0,0,.28);
  }
  .mobile-single-section .mobile-pane { display:none !important; }
  .mobile-single-section .mobile-pane.mobile-pane-active { display:block !important; }
  .two-col > .mobile-pane-switcher { grid-column: 1 / -1; }
  .two-col > .mobile-pane.mobile-pane-active { min-width:0; }
  body[data-mobile-page="dashboard"] .mobile-action-fab { display:inline-flex !important; }
  body[data-mobile-page]:not([data-mobile-page="dashboard"]) .content > *:not(.mobile-current-page-label):not(.mobile-pane-switcher):not(.mobile-pane-active):not(.two-col) {
    /* non-panel loose content remains available, but panels are controlled by mobile-pane classes */
  }
  .content { scroll-behavior:smooth; }
  .table-card .table-wrap.has-mobile-cards table { min-width:720px; }
  .mobile-card-list + .table-wrap { max-height:220px; }
}

/* ===== Lodge Manager Pro Mobile V5: fast compressed menu only on phones ===== */
.mobile-menu-toggle, .mobile-drawer-backdrop, .mobile-dashboard-home-strip { display:none; }

/* Hard desktop protection: never show mobile shell on desktop/tablet-wide views */
@media (min-width: 901px) {
  body:not(.mobile-layout) .mobile-menu-toggle,
  body:not(.mobile-layout) .mobile-drawer-backdrop,
  body:not(.mobile-layout) .mobile-dashboard-home-strip { display:none !important; }
  body:not(.mobile-layout).mobile-menu-open .sidebar,
  body:not(.mobile-layout).mobile-nav-open .sidebar { transform:none !important; }
}

@media (max-width: 900px) {
  body.mobile-layout { width:100%; min-height:100%; overflow:hidden !important; background:#071226 !important; }
  body.mobile-layout #appView:not(.hidden) {
    display:block !important;
    height:100dvh !important;
    min-height:100dvh !important;
    overflow:hidden !important;
    background:#071226 !important;
  }
  body.mobile-layout .workspace {
    width:100% !important;
    max-width:100% !important;
    height:100dvh !important;
    min-height:100dvh !important;
    margin:0 !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
  }
  body.mobile-layout .sidebar {
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    bottom:0 !important;
    width:min(86vw, 340px) !important;
    max-width:340px !important;
    height:100dvh !important;
    max-height:100dvh !important;
    z-index:9999 !important;
    transform:translateX(-110%) !important;
    transition:transform .18s ease !important;
    padding:calc(54px + env(safe-area-inset-top)) 14px calc(22px + env(safe-area-inset-bottom)) !important;
    background:#071833 !important;
    border-right:1px solid rgba(246,196,67,.35) !important;
    box-shadow:24px 0 60px rgba(0,0,0,.56) !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  body.mobile-layout.mobile-menu-open .sidebar,
  body.mobile-layout.mobile-nav-open .sidebar { transform:translateX(0) !important; }

  body.mobile-layout .mobile-drawer-backdrop {
    display:block !important;
    position:fixed !important;
    inset:0 !important;
    z-index:9990 !important;
    background:rgba(0,0,0,.58) !important;
    opacity:0 !important;
    pointer-events:none !important;
    transition:opacity .16s ease !important;
  }
  body.mobile-layout.mobile-menu-open .mobile-drawer-backdrop,
  body.mobile-layout.mobile-nav-open .mobile-drawer-backdrop { opacity:1 !important; pointer-events:auto !important; }

  body.mobile-layout .mobile-menu-toggle {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:fixed !important;
    top:calc(12px + env(safe-area-inset-top)) !important;
    left:12px !important;
    z-index:10010 !important;
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    min-height:46px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:16px !important;
    background:linear-gradient(135deg, #c5161d, #8f1015) !important;
    color:#fff !important;
    border:1px solid rgba(246,196,67,.45) !important;
    font-size:24px !important;
    line-height:1 !important;
    box-shadow:0 10px 25px rgba(0,0,0,.38) !important;
  }
  body.mobile-layout.mobile-menu-open .mobile-menu-toggle,
  body.mobile-layout.mobile-nav-open .mobile-menu-toggle { background:#f6c443 !important; color:#071226 !important; }

  body.mobile-layout .topbar {
    flex:0 0 auto !important;
    position:sticky !important;
    top:0 !important;
    z-index:900 !important;
    min-height:74px !important;
    padding:calc(10px + env(safe-area-inset-top)) 12px 10px 70px !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    background:rgba(7,18,38,.98) !important;
    border-bottom:1px solid rgba(246,196,67,.18) !important;
    box-shadow:0 10px 30px rgba(0,0,0,.18) !important;
  }
  body.mobile-layout #pageTitle { font-size:20px !important; margin:0 !important; }
  body.mobile-layout #licenseHint { display:none !important; }
  body.mobile-layout .workspace-brand-banner { display:none !important; }
  body.mobile-layout .top-actions { margin-left:auto !important; display:flex !important; gap:6px !important; width:auto !important; }
  body.mobile-layout .top-actions button {
    width:auto !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:8px 10px !important;
    margin:0 !important;
    border-radius:12px !important;
    font-size:12px !important;
  }
  body.mobile-layout .content {
    flex:1 1 auto !important;
    min-height:0 !important;
    height:auto !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    padding:12px 10px calc(92px + env(safe-area-inset-bottom)) !important;
  }
  body.mobile-layout .brand-block { margin-bottom:14px !important; }
  body.mobile-layout .sidebar-logo-shell { width:150px !important; min-height:76px !important; margin:0 auto 8px !important; }
  body.mobile-layout .nav-group-title { margin:14px 4px 6px !important; font-size:10px !important; letter-spacing:.36em !important; }
  body.mobile-layout .nav-btn {
    min-height:46px !important;
    height:auto !important;
    margin:5px 0 !important;
    padding:10px 12px !important;
    border-radius:15px !important;
    font-size:14px !important;
  }
  body.mobile-layout .nav-btn.active {
    background:linear-gradient(135deg, rgba(197,22,29,.9), rgba(246,196,67,.18)) !important;
    border-color:rgba(246,196,67,.55) !important;
  }
  body.mobile-layout .mobile-dashboard-home-strip {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin:0 0 12px !important;
    padding:10px !important;
    border-radius:18px !important;
    background:linear-gradient(135deg, rgba(197,22,29,.18), rgba(246,196,67,.08)) !important;
    border:1px solid rgba(246,196,67,.18) !important;
  }
  body.mobile-layout .mobile-dashboard-home-strip button {
    margin:0 !important;
    min-height:48px !important;
    border-radius:14px !important;
    padding:10px !important;
    font-size:13px !important;
    text-align:left !important;
    background:rgba(255,255,255,.055) !important;
    border:1px solid rgba(255,255,255,.10) !important;
  }
  body.mobile-layout .two-col,
  body.mobile-layout .dashboard-panels,
  body.mobile-layout .enterprise-grid,
  body.mobile-layout .grid,
  body.mobile-layout .form-grid { grid-template-columns:1fr !important; }
  body.mobile-layout .form-card,
  body.mobile-layout .table-card,
  body.mobile-layout .card,
  body.mobile-layout .panel,
  body.mobile-layout .kpi { border-radius:16px !important; }
  body.mobile-layout table { font-size:13px !important; }
  body.mobile-layout .system-footer { display:none !important; }
}

@media (max-width: 560px) {
  body.mobile-layout .mobile-dashboard-home-strip { grid-template-columns:1fr 1fr !important; }
  body.mobile-layout .top-actions button#refreshBtn { display:none !important; }
  body.mobile-layout #pageTitle { font-size:18px !important; }
}

/* ===== V6 desktop-safe override: absolutely hide mobile menu on desktop ===== */
@media (min-width: 901px), (hover: hover) and (pointer: fine) {
  .mobile-menu-btn,
  .mobile-menu-toggle,
  .mobile-close-nav,
  .mobile-nav-overlay,
  .mobile-drawer-backdrop,
  .mobile-bottom-nav,
  .mobile-action-fab,
  .mobile-action-sheet,
  .mobile-action-backdrop,
  .mobile-swipe-hint,
  .mobile-dashboard-home-strip,
  .mobile-current-page-label,
  .mobile-pane-switcher {
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
    width:0 !important;
    height:0 !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }
  body.mobile-layout .mobile-menu-toggle,
  body.mobile-layout .mobile-menu-btn { display:none !important; }
  body.mobile-layout,
  body.mobile-menu-open,
  body.mobile-nav-open {
    overflow:auto !important;
  }
  body.mobile-layout .workspace { display:grid !important; grid-template-columns:360px 1fr !important; height:100vh !important; overflow:hidden !important; }
  body.mobile-layout .sidebar { position:relative !important; transform:none !important; width:auto !important; max-width:none !important; height:100vh !important; z-index:auto !important; }
  body.mobile-layout .topbar { position:sticky !important; padding:24px 28px !important; display:flex !important; }
  body.mobile-layout .content { overflow:auto !important; padding:32px !important; }
}

/* On real phones only, keep one small fixed menu icon. */
@media (max-width: 900px) and (hover: none), (max-width: 900px) and (pointer: coarse) {
  body.mobile-layout .mobile-menu-btn,
  body.mobile-layout .mobile-menu-toggle {
    display:inline-flex !important;
    position:fixed !important;
    top:calc(12px + env(safe-area-inset-top)) !important;
    left:12px !important;
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    min-height:46px !important;
    max-width:46px !important;
    max-height:46px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:14px !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:10010 !important;
  }
}


/* Final desktop safety: hide mobile menu unless body is mobile-layout. */
body:not(.mobile-layout) .mobile-menu-toggle, body:not(.mobile-layout) .mobile-menu-btn, body:not(.mobile-layout) .mobile-drawer-backdrop { display:none !important; }

/* Web backup controls: desktop folder selection removed for Hostinger/MySQL version */
.web-backup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.web-backup-actions button:disabled {
  opacity: .55;
  cursor: not-allowed;
}
@media (max-width: 760px) {
  .web-backup-actions { display: grid; grid-template-columns: 1fr; }
  .web-backup-actions button { width: 100%; }
}