/* BLC Premium UI v3 — final visual layer */
:root{
  --blc-bg:#f6f7f9;
  --blc-surface:#ffffff;
  --blc-surface-2:#f9fafb;
  --blc-text:#17171a;
  --blc-muted:#71717a;
  --blc-border:#e7e7eb;
  --blc-border-strong:#d8d8df;
  --blc-accent:#6d5dfc;
  --blc-accent-soft:#f0edff;
  --blc-success:#15803d;
  --blc-warning:#b45309;
  --blc-danger:#b91c1c;
  --blc-radius:16px;
  --blc-shadow:0 1px 2px rgba(0,0,0,.03),0 10px 30px rgba(24,24,27,.04);
}

html{background:var(--blc-bg)}
body{background:var(--blc-bg)!important;color:var(--blc-text)!important;font-family:Heebo,Arial,sans-serif!important;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}

/* Application shell */
.app-shell:not(.auth-locked){min-height:100vh!important;background:var(--blc-bg)!important;display:grid!important;grid-template-columns:264px minmax(0,1fr)!important}
.main{min-width:0!important;padding:0 34px 44px!important;max-width:1600px!important;width:100%!important;margin-inline:auto!important}

/* Sidebar — clean ChatGPT-like navigation */
.sidebar{
  position:sticky!important;top:0!important;height:100vh!important;
  padding:18px 14px!important;background:#fff!important;color:var(--blc-text)!important;
  border-inline-end:1px solid var(--blc-border)!important;box-shadow:none!important;
  display:flex!important;flex-direction:column!important;gap:16px!important;z-index:40!important;
}
.sidebar .brand{height:52px!important;padding:0 8px!important;gap:11px!important;display:flex!important;align-items:center!important}
.brand-mark{width:34px!important;height:34px!important;border-radius:10px!important;background:#17171a!important;color:#fff!important;font-size:11px!important;box-shadow:none!important;letter-spacing:.4px!important}
.sidebar .brand strong{font-size:14px!important;line-height:1.2!important;color:var(--blc-text)!important}
.sidebar .brand span{font-size:11px!important;color:var(--blc-muted)!important;margin-top:2px!important}
.sidebar nav{display:flex!important;flex-direction:column!important;gap:3px!important;padding-top:8px!important;border-top:1px solid var(--blc-border)!important}
.nav-item{
  min-height:43px!important;width:100%!important;border:0!important;border-radius:10px!important;
  padding:0 11px!important;background:transparent!important;color:#52525b!important;
  display:flex!important;align-items:center!important;gap:11px!important;text-align:right!important;
  font-size:13.5px!important;font-weight:500!important;transition:background .16s ease,color .16s ease!important;
  box-shadow:none!important;position:relative!important;
}
.nav-item svg{width:18px!important;height:18px!important;flex:0 0 18px!important;stroke:currentColor!important;stroke-width:1.8!important;fill:none!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.nav-item:hover{background:#f4f4f5!important;color:#18181b!important;transform:none!important}
.nav-item.active{background:#f1f1f3!important;color:#18181b!important;font-weight:650!important}
.nav-item.active::before{content:"";position:absolute;right:0;top:11px;bottom:11px;width:3px;border-radius:4px;background:var(--blc-accent)}
.trial-badge,.sidebar-foot{margin-top:auto!important;background:#fafafa!important;border:1px solid var(--blc-border)!important;border-radius:12px!important;padding:11px!important;box-shadow:none!important;color:var(--blc-text)!important}
.plan-pill{background:var(--blc-accent-soft)!important;color:#5b4be7!important;border-radius:7px!important;font-size:10px!important;padding:4px 7px!important}
.sidebar-foot small,.trial-badge small{color:var(--blc-muted)!important}

/* Top bar */
.topbar{height:82px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;border-bottom:1px solid var(--blc-border)!important;background:rgba(246,247,249,.92)!important;backdrop-filter:blur(16px)!important;position:sticky!important;top:0!important;z-index:30!important;padding:0!important;margin-bottom:28px!important}
.topbar-home{border:0!important;background:transparent!important;padding:0!important;text-align:right!important;color:inherit!important;cursor:pointer!important}
.topbar h1{font-size:20px!important;font-weight:700!important;letter-spacing:-.2px!important;margin:0!important}
.topbar p{font-size:13px!important;color:var(--blc-muted)!important;margin:3px 0 0!important}
.top-actions{display:flex!important;gap:9px!important;align-items:center!important}
.icon-btn{width:40px!important;height:40px!important;padding:0!important;border-radius:10px!important;border:1px solid var(--blc-border)!important;background:#fff!important;color:#3f3f46!important;display:grid!important;place-items:center!important;box-shadow:none!important}
.icon-btn svg{width:18px!important;height:18px!important;stroke:currentColor!important;fill:none!important;stroke-width:1.8!important}
.icon-btn:hover{background:#f7f7f8!important;border-color:var(--blc-border-strong)!important}
.primary{min-height:40px!important;border-radius:10px!important;padding:0 15px!important;background:#18181b!important;color:white!important;border:1px solid #18181b!important;box-shadow:none!important;font-size:13.5px!important;font-weight:650!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;transition:.16s ease!important}
.primary:hover{background:#2d2d31!important;transform:translateY(-1px)!important}
.primary svg{width:17px!important;height:17px!important;stroke:currentColor!important;fill:none!important;stroke-width:2!important}
.secondary{min-height:40px!important;border-radius:10px!important;border:1px solid var(--blc-border)!important;background:#fff!important;color:#3f3f46!important;box-shadow:none!important}
.secondary:hover{border-color:var(--blc-border-strong)!important;background:#fafafa!important}

/* Page structure */
.page{margin-top:0!important;animation:none!important}
.page-title,.dashboard-head{display:flex!important;justify-content:space-between!important;align-items:flex-end!important;gap:20px!important;margin-bottom:22px!important}
.page-title h2,.dashboard-head h2{font-size:28px!important;line-height:1.2!important;font-weight:750!important;letter-spacing:-.5px!important;color:var(--blc-text)!important;margin:3px 0 0!important}
.page-title p,.dashboard-head p{font-size:14px!important;line-height:1.6!important;color:var(--blc-muted)!important;margin:6px 0 0!important}
.eyebrow{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;font-weight:750!important;color:var(--blc-accent)!important}

/* Hero: compact, useful, non-decorative */
.hero-card{min-height:172px!important;border-radius:20px!important;padding:28px 30px!important;background:#17171a!important;color:#fff!important;border:1px solid #242428!important;box-shadow:none!important;overflow:hidden!important;position:relative!important}
.hero-card::after{content:"";position:absolute;inset:auto -70px -110px auto;width:310px;height:310px;border-radius:50%;background:radial-gradient(circle,rgba(109,93,252,.24),transparent 68%);pointer-events:none}
.hero-card h2{font-size:28px!important;line-height:1.2!important;margin:8px 0!important;max-width:620px!important}
.hero-card p{font-size:14px!important;max-width:620px!important;color:#c7c7ce!important;opacity:1!important}
.hero-card .balloon-art{display:none!important}
.ghost-light{min-height:38px!important;border:1px solid #3f3f46!important;background:#27272a!important;color:#fff!important;border-radius:9px!important;padding:0 14px!important}

/* Cards and metrics */
.stats-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;margin:16px 0 20px!important}
.stat,.panel,.data-card,.stock-card,.inventory-summary article,.empty-state,.table-surface{
  background:var(--blc-surface)!important;border:1px solid var(--blc-border)!important;
  border-radius:var(--blc-radius)!important;box-shadow:var(--blc-shadow)!important;
}
.stat{padding:18px!important;min-height:122px!important;position:relative!important;overflow:hidden!important}
.stat::before{content:"";position:absolute;right:0;top:0;bottom:0;width:3px;background:#e4e4e7}
.stat:nth-child(1)::before{background:#6d5dfc}.stat:nth-child(2)::before{background:#0ea5e9}.stat:nth-child(3)::before{background:#22c55e}.stat.warning::before{background:#f59e0b}
.stat span{font-size:12.5px!important;color:var(--blc-muted)!important}
.stat strong{font-size:27px!important;line-height:1.1!important;font-weight:750!important;letter-spacing:-.5px!important;margin:12px 0 9px!important;color:var(--blc-text)!important}
.stat small{font-size:11.5px!important;color:var(--blc-success)!important}
.panel{padding:22px!important}
.content-grid{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr)!important;gap:16px!important;margin-top:0!important}
.panel-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important;padding-bottom:16px!important;border-bottom:1px solid var(--blc-border)!important}
.panel h3{font-size:18px!important;font-weight:700!important;margin:3px 0 0!important}
.link-btn{font-size:12.5px!important;color:#5b4be7!important;background:transparent!important;border:0!important;font-weight:650!important}

/* Forms */
.form-card{padding:24px!important}
.field-grid,.mini-form{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px 16px!important;margin:20px 0!important}
.mini-form{grid-template-columns:repeat(3,minmax(0,1fr))!important}
label{font-size:12.5px!important;font-weight:650!important;color:#52525b!important}
input,select,textarea{
  width:100%!important;min-height:43px!important;margin-top:7px!important;padding:10px 12px!important;
  border:1px solid var(--blc-border-strong)!important;border-radius:10px!important;background:#fff!important;
  color:var(--blc-text)!important;outline:none!important;box-shadow:none!important;transition:border-color .15s ease,box-shadow .15s ease!important;
}
textarea{min-height:110px!important;resize:vertical!important}
input:hover,select:hover,textarea:hover{border-color:#c5c5cc!important}
input:focus,select:focus,textarea:focus{border-color:var(--blc-accent)!important;box-shadow:0 0 0 3px rgba(109,93,252,.12)!important}
.addons{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;margin-bottom:20px!important}
.addons>span{grid-column:1/-1!important}
.addons label{min-height:42px!important;border:1px solid var(--blc-border)!important;background:#fafafa!important;border-radius:10px!important;padding:10px 11px!important;display:flex!important;align-items:center!important;gap:8px!important}
.addons input{width:auto!important;min-height:auto!important;margin:0!important}

/* Pricing/results */
.price-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}
.price-row>div,.result-price{border:1px solid var(--blc-border)!important;border-radius:12px!important;padding:14px!important;background:#fff!important}
.recommended,.featured{background:var(--blc-accent-soft)!important;border-color:#dcd6ff!important}
.price-row strong,.result-price strong{font-size:22px!important;color:var(--blc-text)!important}
.featured strong{font-size:31px!important;color:#5144d7!important}
.result-card{position:sticky!important;top:104px!important}

/* Lists and inventory */
.toolbar{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:12px!important;margin:0 0 16px!important}
.toolbar input{max-width:420px!important;margin:0!important;background:#fff!important}
.data-list,.data-grid{display:grid!important;gap:10px!important}
.data-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
.data-card{padding:16px 18px!important;transition:border-color .15s ease,transform .15s ease!important}
.data-card:hover,.stock-card:hover{border-color:#d1d1d7!important;transform:translateY(-1px)!important}
.stock-card{padding:18px!important;min-height:190px!important}
.stock-head h3{font-size:16px!important;margin:4px 0!important}
.stock-numbers{margin:18px 0!important;padding:14px 0!important;border-top:1px solid var(--blc-border)!important;border-bottom:1px solid var(--blc-border)!important}
.stock-card .bar{height:7px!important;background:#ececf0!important}
.stock-card .bar i{background:var(--blc-accent)!important}
.inventory-summary{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin:16px 0 20px!important}
.inventory-summary article{padding:16px!important}
.inventory-summary strong{font-size:24px!important}
.inventory-tabs{background:#ededf0!important;border-radius:10px!important;padding:3px!important;margin-bottom:16px!important}
.inventory-tabs button{border-radius:8px!important;padding:8px 14px!important;font-size:12.5px!important}
.inventory-tabs button.active{box-shadow:none!important;border:1px solid var(--blc-border)!important}

/* Empty states */
.empty-state{min-height:280px!important;padding:54px 24px!important;display:grid!important;place-items:center!important;text-align:center!important;color:var(--blc-muted)!important;background:#fff!important}
.empty-state div{font-size:0!important;width:44px!important;height:44px!important;border-radius:12px!important;background:#f4f4f5!important;border:1px solid var(--blc-border)!important;margin-bottom:12px!important;position:relative!important}
.empty-state div::after{content:"";position:absolute;inset:12px;border:1.8px solid #71717a;border-radius:4px}
.empty-state h3{color:var(--blc-text)!important;font-size:17px!important;margin:0 0 6px!important}
.empty-state p{font-size:13px!important;max-width:360px!important;margin:auto!important}

/* Calendar */
.calendar-grid{background:#fff!important;border:1px solid var(--blc-border)!important;border-radius:16px!important;overflow:hidden!important;box-shadow:var(--blc-shadow)!important}
.calendar-controls{display:flex!important;align-items:center!important;gap:10px!important}

/* Modal */
.modal,.auth-modal{background:rgba(9,9,11,.48)!important;backdrop-filter:blur(8px)!important}
.modal-card,.auth-card{border-radius:18px!important;border:1px solid rgba(255,255,255,.3)!important;background:#fff!important;color:var(--blc-text)!important;padding:24px!important;box-shadow:0 24px 80px rgba(0,0,0,.22)!important}
.modal-head{padding-bottom:15px!important;border-bottom:1px solid var(--blc-border)!important;margin-bottom:18px!important}
.modal-close,.auth-close{background:#f4f4f5!important;border:1px solid var(--blc-border)!important;border-radius:9px!important;width:34px!important;height:34px!important;color:#52525b!important}
.auth-tabs{background:#f1f1f3!important;border-radius:10px!important;padding:3px!important}
.auth-tabs button{border-radius:8px!important}
.auth-tabs button.active{background:#fff!important;color:#18181b!important;box-shadow:0 1px 2px rgba(0,0,0,.06)!important}

/* Mobile */
.mobile-menu-btn,.mobile-sidebar-backdrop{display:none!important}
@media(max-width:1050px){
  .app-shell:not(.auth-locked){grid-template-columns:84px minmax(0,1fr)!important}
  .sidebar{padding:16px 10px!important}
  .sidebar .brand>div:last-child,.nav-item span,.trial-badge div,.sidebar-foot .account-trigger-copy{display:none!important}
  .sidebar .brand{justify-content:center!important;padding:0!important}
  .nav-item{justify-content:center!important;padding:0!important}
  .nav-item.active::before{right:-10px!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .content-grid,.calc-layout{grid-template-columns:1fr!important}
  .result-card{position:static!important}
  .data-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:700px){
  body{background:#f7f7f8!important}
  .app-shell:not(.auth-locked){display:block!important;padding-bottom:76px!important}
  .main{padding:0 14px 24px!important}
  .sidebar{
    position:fixed!important;inset:auto 0 0 0!important;height:68px!important;width:100%!important;
    border:0!important;border-top:1px solid var(--blc-border)!important;background:rgba(255,255,255,.96)!important;
    backdrop-filter:blur(18px)!important;padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important;
    display:block!important;z-index:100!important;
  }
  .sidebar .brand,.trial-badge,.sidebar-foot{display:none!important}
  .sidebar nav{height:100%!important;border:0!important;padding:0!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:2px!important;overflow:visible!important}
  .sidebar nav .nav-item:nth-child(n+6){display:none!important}
  .nav-item{height:54px!important;min-height:54px!important;border-radius:9px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:3px!important;padding:0 2px!important;font-size:10px!important;color:#71717a!important}
  .nav-item span{display:block!important;font-size:9.5px!important;line-height:1!important;white-space:nowrap!important}
  .nav-item svg{width:19px!important;height:19px!important}
  .nav-item.active{background:#f1efff!important;color:#5848e8!important}
  .nav-item.active::before{display:none!important}
  .topbar{height:64px!important;margin-bottom:20px!important;background:rgba(247,247,248,.94)!important}
  .topbar h1{font-size:18px!important}.topbar p{display:none!important}
  .top-actions{gap:7px!important}.icon-btn{width:38px!important;height:38px!important}
  .top-actions .primary{width:38px!important;height:38px!important;min-height:38px!important;padding:0!important}
  .top-actions .primary span{display:none!important}
  .page-title,.dashboard-head{align-items:flex-start!important;margin-bottom:18px!important;gap:12px!important}
  .page-title h2,.dashboard-head h2{font-size:24px!important}
  .page-title p,.dashboard-head p{font-size:12.5px!important}
  .page-title>.primary{flex:0 0 auto!important;padding:0 11px!important;font-size:12px!important}
  .hero-card{min-height:150px!important;padding:22px!important;border-radius:17px!important}
  .hero-card h2{font-size:23px!important}.hero-card p{font-size:12.5px!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin:12px 0 16px!important}
  .stat{min-height:108px!important;padding:15px!important;border-radius:14px!important}
  .stat strong{font-size:23px!important;margin:9px 0 7px!important}
  .content-grid,.calc-layout,.data-grid,.inventory-summary,.reservation-columns{grid-template-columns:1fr!important;gap:12px!important}
  .panel{padding:17px!important;border-radius:14px!important}
  .panel-head{display:block!important}.panel-head .link-btn{margin-top:10px!important;padding:0!important}
  .field-grid,.mini-form{grid-template-columns:1fr!important;gap:14px!important;margin:16px 0!important}
  .addons{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .price-row{grid-template-columns:1fr!important}
  .toolbar{display:block!important}.toolbar input{max-width:none!important}
  .data-card{padding:14px!important;border-radius:13px!important}
  .event-row{grid-template-columns:44px minmax(0,1fr) auto!important}
  .stock-card{min-height:auto!important;border-radius:14px!important}
  .inventory-tabs{width:100%!important;display:flex!important;overflow:auto!important}
  .inventory-tabs button{flex:1!important;white-space:nowrap!important}
  .modal{padding:10px!important;align-items:end!important}
  .modal-card{width:100%!important;max-height:90vh!important;border-radius:20px 20px 0 0!important;padding:20px!important}
  .modal-form.two-col{grid-template-columns:1fr!important}
  .full-span{grid-column:auto!important}
  .empty-state{min-height:240px!important;padding:44px 18px!important;border-radius:14px!important}
}
