: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)}
}