
/* Bid2Stay Release 12 — Screenshot Visual Baseline */
:root{
  --b12-black:#070707;
  --b12-black2:#111111;
  --b12-gold:#f5ad16;
  --b12-gold2:#ffc42f;
  --b12-cream:#f7f7f5;
  --b12-white:#ffffff;
  --b12-text:#111318;
  --b12-muted:#6f7580;
  --b12-line:#e4e6ea;
  --b12-success:#168c45;
  --b12-danger:#d92d20;
  --b12-warning:#f79009;
  --b12-blue:#2878c8;
  --b12-radius:12px;
  --b12-shadow:0 8px 26px rgba(15,23,42,.07);
  --b12-sidebar:244px;
  --b12-topbar:72px;
}
html,body{background:#f7f7f5;color:var(--b12-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{margin:0}
*{box-sizing:border-box}
.topbar{
  height:var(--b12-topbar)!important;min-height:var(--b12-topbar)!important;
  position:sticky!important;top:0!important;z-index:100!important;
  background:linear-gradient(180deg,#0b0b0b,#070707)!important;
  border-bottom:1px solid #1e1e1e!important;color:#fff!important;
}
.topbar-inner{height:100%;max-width:none!important;padding:0 30px!important;display:flex!important;align-items:center!important}
.logo img{height:47px!important;width:auto!important;max-width:190px!important;object-fit:contain!important}
.header-actions{margin-left:auto!important;display:flex!important;align-items:center!important;gap:16px!important}
.currency{border:1px solid #72500c!important;border-radius:999px!important;padding:3px!important;background:#111!important}
.currency button{min-height:35px!important;padding:0 15px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:#ddd!important;font-size:11px!important;font-weight:800!important}
.currency button.active{background:var(--b12-gold)!important;color:#111!important}
.mobile-toggle{background:#1b1b1b!important;color:#fff!important;border:0!important;border-radius:50%!important;width:42px!important;height:42px!important}

.layout{display:grid!important;grid-template-columns:var(--b12-sidebar) minmax(0,1fr)!important;min-height:calc(100vh - var(--b12-topbar))!important}
.sidebar{
  display:block!important;position:sticky!important;top:var(--b12-topbar)!important;height:calc(100vh - var(--b12-topbar))!important;
  overflow:auto!important;width:var(--b12-sidebar)!important;background:linear-gradient(180deg,#0c0c0c,#080808)!important;
  border-right:1px solid #202020!important;color:#fff!important;padding:18px 14px 24px!important;
}
.sidebar h4{margin:12px 12px 8px!important;font-size:9px!important;color:#777!important;text-transform:uppercase!important;letter-spacing:.16em!important}
.sidebar a{
  display:flex!important;align-items:center!important;gap:12px!important;min-height:43px!important;
  margin:3px 0!important;padding:0 12px!important;border-radius:7px!important;
  color:#f0f0f0!important;font-size:13px!important;font-weight:600!important;position:relative!important;
}
.sidebar a::before{content:attr(data-icon);width:22px;text-align:center;font-size:17px;opacity:.95}
.sidebar a:hover{background:#1a1a1a!important;color:#fff!important;transform:none!important}
.sidebar a.active{background:linear-gradient(180deg,#ffbf21,#eca700)!important;color:#111!important;box-shadow:0 7px 18px rgba(245,173,22,.18)!important}
.sidebar .nav-count{
  margin-left:auto;background:var(--b12-gold);color:#111;border-radius:999px;min-width:21px;height:21px;
  padding:0 6px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:900
}
.sidebar a.active .nav-count{background:#111;color:#fff}

.main{padding:24px 28px 44px!important;min-width:0!important}
.page,.guest-shell,.hotel-shell,.admin-shell,.market-page,.detail-page{max-width:1450px!important;margin:0 auto!important}
.page-head,.guest-head,.hotel-head,.admin-head,.market-head{
  display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:18px!important;margin-bottom:18px!important
}
.page-head h1,.guest-head h1,.hotel-head h1,.admin-head h1,.market-head h1{
  font-size:29px!important;line-height:1.1!important;letter-spacing:-.03em!important;margin:0 0 6px!important;color:#111!important
}
.page-head p,.guest-head p,.hotel-head p,.admin-head p,.market-head p{margin:0!important;color:var(--b12-muted)!important;font-size:13px!important}

.card,.guest-card,.hotel-card,.admin-card,.analytics-card,.market-card,.detail-card{
  background:#fff!important;border:1px solid var(--b12-line)!important;border-radius:var(--b12-radius)!important;
  box-shadow:var(--b12-shadow)!important
}
.card,.guest-card,.hotel-card,.admin-card,.analytics-card,.detail-card{padding:18px!important}
.card h2,.guest-card h2,.hotel-card h2,.admin-card h2,.analytics-card h2{font-size:18px!important;margin:0 0 7px!important}
.card p,.guest-card p,.hotel-card p,.admin-card p{font-size:12px!important;color:var(--b12-muted)!important}

.metrics,.guest-metrics,.hotel-metrics,.admin-metrics,.analytics-metrics{
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;margin-bottom:16px!important
}
.metric,.guest-metric,.hotel-metric,.admin-metric,.analytics-metric{
  padding:17px!important;border:1px solid var(--b12-line)!important;border-radius:10px!important;background:#fff!important;box-shadow:var(--b12-shadow)!important
}
.metric span,.guest-metric span,.hotel-metric span,.admin-metric span,.analytics-metric span{font-size:10px!important;color:#30343a!important;text-transform:none!important;letter-spacing:0!important;font-weight:600!important}
.metric strong,.guest-metric strong,.hotel-metric strong,.admin-metric strong,.analytics-metric strong{font-size:25px!important;color:#111!important;margin-top:5px!important}
.metric small,.guest-metric small,.hotel-metric small,.admin-metric small{font-size:10px!important;color:#7a818d!important}

.btn,a.btn,button.btn{
  min-height:39px!important;padding:0 16px!important;border-radius:7px!important;font-size:11px!important;font-weight:800!important;
  text-transform:none!important;letter-spacing:0!important
}
.btn.primary{background:linear-gradient(180deg,#ffc62f,#efa800)!important;color:#111!important;border-color:#efa800!important}
.btn.light{background:#fff!important;border:1px solid #d9dde3!important;color:#111!important}
.btn.dark{background:#0c0c0c!important;color:#fff!important;border-color:#0c0c0c!important}
.btn.danger{background:#fff!important;color:#bd2018!important;border:1px solid #efbbb7!important}

.row,.guest-row,.hotel-row,.admin-row{
  border:1px solid var(--b12-line)!important;border-radius:9px!important;padding:13px!important;background:#fff!important
}
.row:hover,.guest-row:hover,.hotel-row:hover,.admin-row:hover{background:#fffdf7!important}
.row strong,.guest-row strong,.hotel-row strong,.admin-row strong{font-size:13px!important}
.row span,.guest-row span,.hotel-row span,.admin-row span{font-size:11px!important}

.table-wrap,.hotel-table-wrap,.admin-table-wrap{border:1px solid var(--b12-line);border-radius:10px;overflow:auto;background:#fff}
.table,.hotel-table,.admin-table{min-width:800px!important}
.table th,.hotel-table th,.admin-table th{background:#fff!important;padding:12px 14px!important;color:#3b4048!important;font-size:10px!important;border-bottom:1px solid var(--b12-line)!important}
.table td,.hotel-table td,.admin-table td{padding:12px 14px!important;font-size:11px!important}
.table tbody tr:hover,.hotel-table tbody tr:hover,.admin-table tbody tr:hover{background:#fffaf0!important}

.field label{font-size:10px!important;color:#30343a!important;margin-bottom:6px!important}
.field input,.field select,.field textarea,input,select,textarea{
  min-height:43px!important;border-radius:6px!important;border:1px solid #d9dde3!important;background:#fff!important;padding:9px 11px!important;font-size:12px!important
}
.field input:focus,.field select:focus,.field textarea:focus,input:focus,select:focus,textarea:focus{border-color:var(--b12-gold)!important;box-shadow:0 0 0 3px rgba(245,173,22,.13)!important}

.badge,.guest-status,.hotel-badge,.admin-badge{
  border-radius:5px!important;min-height:25px!important;padding:5px 9px!important;font-size:9px!important;text-transform:none!important
}
.guest-status.live,.hotel-badge.live,.admin-badge.live,.badge.green{background:#e8f7ed!important;color:#137b3d!important}
.guest-status.counter,.hotel-badge.pending,.admin-badge.pending,.badge.gold{background:#fff1cc!important;color:#a66a00!important}
.guest-status.confirmed,.hotel-badge.complete,.admin-badge.complete,.badge.blue{background:#eaf2fb!important;color:#24659e!important}
.hotel-badge.alert,.admin-badge.alert{background:#fdecea!important;color:#bd2018!important}

.tabs,.guest-tabs,.hotel-tabs,.admin-tabs{gap:8px!important;margin-bottom:14px!important}
.tab,.guest-tab,.hotel-tab,.admin-tab{
  min-height:39px!important;border-radius:7px!important;background:#fff!important;border:1px solid var(--b12-line)!important;color:#333!important;font-size:11px!important
}
.tab.active,.guest-tab.active,.hotel-tab.active,.admin-tab.active{background:#fff!important;color:#bd7c00!important;border-color:#e7b23c!important;border-bottom:2px solid var(--b12-gold)!important}

.market-card{overflow:hidden!important;border-radius:11px!important}
.market-card-image{aspect-ratio:16/10!important}
.market-card-body{padding:15px!important}
.market-card-title h3{font-size:16px!important}
.market-offer-panel{border-radius:8px!important;padding:11px!important}
.market-card-actions{gap:8px!important}
.market-live,.market-rank,.market-likelihood{font-size:8px!important;padding:6px 8px!important;border-radius:5px!important}

.guest-grid,.hotel-grid,.admin-grid{gap:14px!important}
.guest-progress{gap:6px!important}
.guest-step{border-radius:7px!important;padding:9px!important}
.hotel-summary div,.admin-summary div{border-radius:8px!important;padding:11px!important}

.empty,.market-empty,.no-results{border-radius:10px!important;min-height:180px!important}
.kicker,.guest-kicker,.hotel-kicker,.admin-kicker{color:#c38300!important;font-size:9px!important;margin-bottom:8px!important}

.ref-top-user{
  display:flex;align-items:center;gap:10px;color:#fff;font-size:12px;font-weight:700
}
.ref-avatar{width:38px;height:38px;border:1px solid var(--b12-gold);border-radius:50%;display:grid;place-items:center;color:var(--b12-gold)}
.ref-notice{position:relative;font-size:20px}
.ref-notice b{position:absolute;right:-8px;top:-8px;min-width:18px;height:18px;border-radius:50%;background:var(--b12-gold);color:#111;font-size:9px;display:grid;place-items:center}

.ref-hero{
  min-height:520px;position:relative;background:#090909 center/cover no-repeat;border-radius:0;overflow:hidden;color:#fff;
}
.ref-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.96),rgba(0,0,0,.47) 55%,rgba(0,0,0,.25))}
.ref-hero-inner{position:relative;z-index:2;min-height:520px;display:grid;grid-template-columns:1fr 380px;align-items:center;gap:50px;max-width:1400px;margin:auto;padding:42px 34px}
.ref-hero h1{font-size:54px;line-height:1.04;margin:0 0 20px;letter-spacing:.02em;color:#fff}
.ref-hero h1 span{color:var(--b12-gold)}
.ref-hero p{font-size:16px;line-height:1.7;color:#eee;max-width:560px}
.ref-hero-actions{display:grid;gap:10px;max-width:320px;margin-top:22px}
.ref-bid-card{background:rgba(9,9,9,.94);border:1px solid #4d4d4d;border-radius:10px;padding:18px;box-shadow:0 22px 60px rgba(0,0,0,.35)}
.ref-bid-card h2{color:var(--b12-gold);font-size:20px;margin:0}
.ref-bid-card p{font-size:12px;margin:2px 0 12px;color:#fff}
.ref-bid-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ref-bid-card .field label{color:#eee!important}
.ref-bid-card input,.ref-bid-card select{background:#111!important;color:#fff!important;border-color:#4d4d4d!important}
.ref-bid-card .wide{grid-column:1/-1}
.ref-steps{background:#fff;padding:22px 28px}
.ref-steps h2{text-align:center;font-size:23px;margin:0 0 18px}
.ref-steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1400px;margin:auto}
.ref-step{display:flex;gap:13px;align-items:center;padding:5px 12px;border-right:1px solid #ead4a7}
.ref-step:last-child{border-right:0}
.ref-step-icon{width:64px;height:64px;border-radius:50%;background:#0b0b0b;color:var(--b12-gold);display:grid;place-items:center;font-size:26px;flex:0 0 auto}
.ref-step strong{font-size:12px}.ref-step p{font-size:11px;margin:4px 0 0;color:#4f555e}
.ref-owner-band{background:#090909;color:#fff;display:grid;grid-template-columns:340px 1fr;min-height:205px}
.ref-owner-image{background:center/cover no-repeat}
.ref-owner-content{padding:28px 40px;display:grid;grid-template-columns:1.1fr repeat(3,1fr);gap:22px;align-items:center}
.ref-owner-content h2{font-size:23px;color:#fff}.ref-owner-content h2 span{color:var(--b12-gold)}
.ref-owner-content p{font-size:11px;color:#ddd}
.ref-owner-benefit{border-left:1px solid #5b4a27;padding-left:22px}
.ref-owner-benefit strong{display:block;color:#fff;font-size:12px}.ref-owner-benefit span{font-size:10px;color:#ccc}
.ref-trust{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;padding:17px 6%;gap:20px}
.ref-trust div{display:flex;gap:14px;align-items:center;justify-content:center;border-right:1px solid #e8d5ae}
.ref-trust div:last-child{border-right:0}
.ref-trust b{font-size:11px}.ref-trust span{font-size:10px;color:#555}

@media(max-width:1100px){
  .metrics,.guest-metrics,.hotel-metrics,.admin-metrics,.analytics-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ref-hero-inner{grid-template-columns:1fr 340px}
  .ref-owner-content{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .layout{grid-template-columns:1fr!important}.sidebar{position:fixed!important;left:-260px!important;z-index:200!important;transition:left .2s}.sidebar.mobile-open{left:0!important}
  .main{padding:18px!important}
  .ref-hero-inner{grid-template-columns:1fr;padding:34px 20px}.ref-hero h1{font-size:42px}.ref-bid-card{max-width:560px}
  .ref-steps-grid{grid-template-columns:1fr 1fr}.ref-owner-band{grid-template-columns:1fr}.ref-owner-image{height:230px}.ref-trust{grid-template-columns:1fr}
}
@media(max-width:600px){
  .metrics,.guest-metrics,.hotel-metrics,.admin-metrics,.analytics-metrics{grid-template-columns:1fr!important}
  .ref-hero h1{font-size:34px}.ref-bid-grid{grid-template-columns:1fr}.ref-bid-card .wide{grid-column:auto}
  .ref-steps-grid{grid-template-columns:1fr}.ref-step{border-right:0;border-bottom:1px solid #ead4a7}.ref-owner-content{grid-template-columns:1fr}.ref-trust div{border-right:0;border-bottom:1px solid #e8d5ae}
}

/* Release 12.5.8.3 — navigation interaction hardening.
   Keeps the established visual design unchanged while ensuring that
   decorative layers cannot intercept sidebar or page controls. */
.layout,
.sidebar,
.main,
.hotel-shell,
.guest-shell,
.admin-shell {
  pointer-events: auto !important;
}

.sidebar {
  isolation: isolate;
  z-index: 210 !important;
}

.sidebar a,
.main a,
.main button,
.main input,
.main select,
.main textarea,
.main [role="button"] {
  pointer-events: auto !important;
  position: relative;
}

.sidebar a {
  z-index: 2;
}

.layout::before,
.layout::after,
.sidebar::before,
.sidebar::after,
.main::before,
.main::after,
.hotel-shell::before,
.hotel-shell::after,
.guest-shell::before,
.guest-shell::after,
.admin-shell::before,
.admin-shell::after {
  pointer-events: none !important;
}
