/* Bid2Stay 28.22.0 — Production UI Consolidation
   Consolidates 28.21.3 density cleanup + 28.21.3.1 stability hotfix.
   Scope: content surfaces, typography, density, paint stability. Navigation and Supabase contracts are untouched. */

/* Bid2Stay 28.21.3 — Typography & Card Density Cleanup with Navigation Lock
   IMPORTANT: does not alter admin, guest, provider or public navigation/side-menu design. */

@media (max-width:900px){
  :root{
    --b2s-clean-pad:12px;
    --b2s-clean-gap:10px;
    --b2s-clean-radius:14px;
    --b2s-clean-text:#172437;
    --b2s-clean-muted:#667487;
  }

  html,body{max-width:100%;overflow-x:hidden!important}
  body{font-size:14.5px!important;line-height:1.45!important;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  main,.main,.admin-main,.guest-main,.provider-main,.availability-shell{min-width:0!important;max-width:100%!important}

  /* Mobile typography only — navigation is intentionally excluded. */
  main h1,.main h1,.admin-main h1,.page-title,.hero-title{
    margin-top:0!important;font-size:clamp(23px,6.5vw,28px)!important;line-height:1.08!important;letter-spacing:-.025em!important
  }
  main h2,.main h2,.admin-main h2,.section-title{font-size:19px!important;line-height:1.16!important;letter-spacing:-.012em!important}
  main h3,.main h3,.admin-main h3{font-size:16px!important;line-height:1.22!important}
  main p,.main p,.admin-main p,main li,.main li{font-size:13.5px!important;line-height:1.5!important}
  main small,.main small,.admin-main small,.helper,.help-text,.field-help,.hint{font-size:11.5px!important;line-height:1.4!important}

  .admin-main,.availability-shell,
  body[data-portal-role="guest"] .main,
  body[data-portal-role="guest"] main,
  body[data-portal-role="provider"] .main,
  body[data-portal-role="hotel"] .main{text-align:left!important}
  .admin-top>div,.starter-section-head>div,.report-section-head>div,.dashboard-section-head>div,
  .b2s-gh-section-head>div,.b2s-gh-intro,.b2s-gh-search,.availability-card{text-align:left!important}

  /* Preserve existing menu/header dimensions. Only content padding is reduced. */
  .admin-main{padding-left:var(--b2s-clean-pad)!important;padding-right:var(--b2s-clean-pad)!important}
  body[data-portal-role="guest"] .main,
  body[data-portal-role="guest"] main,
  body[data-portal-role="provider"] .main,
  body[data-portal-role="hotel"] .main{padding-left:var(--b2s-clean-pad)!important;padding-right:var(--b2s-clean-pad)!important}

  /* Card height and density cleanup. */
  .card,.panel,.surface,.guest-card,.provider-card,.admin-card,.form-card,
  .availability-card,.report-section,.report-toolbar,.metric,
  .b2s-gh-search,.b2s-gh-action-card,.b2s2798-shell,
  [data-review-detail],[data-review-host]{min-height:0!important;height:auto!important;box-sizing:border-box!important}

  .card,.panel,.surface,.guest-card,.provider-card,.admin-card,.form-card,
  .availability-card,.report-section,.report-toolbar{padding:13px!important;border-radius:var(--b2s-clean-radius)!important}

  .card .card,.panel .panel,.surface .surface,.card .panel,.panel .card{
    margin-top:9px!important;padding:10px!important;border-radius:11px!important;box-shadow:none!important
  }
  .grid,.metrics,.form-grid,.field-grid,.fields-grid,.detail-grid{gap:10px!important}

  .metrics{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .metrics .metric,.metric{min-height:78px!important;padding:10px 11px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:3px!important}
  .metric span{font-size:10.5px!important;line-height:1.2!important}
  .metric strong{font-size:22px!important;line-height:1!important}
  .metric small{margin-top:2px!important;font-size:10.5px!important;line-height:1.3!important}

  /* Forms and controls only; navigation buttons are excluded. */
  main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  .main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  .admin-main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  main select,.main select,.admin-main select{min-height:44px!important;height:44px!important;padding:0 11px!important;font-size:15px!important;border-radius:10px!important}
  main textarea,.main textarea,.admin-main textarea{min-height:88px!important;padding:10px 11px!important;font-size:15px!important;border-radius:10px!important}
  main button:not([data-admin-menu]):not(.b2s-mobile-more-button):not(.b2s-mobile-nav-close),
  .main button:not([data-admin-menu]):not(.b2s-mobile-more-button):not(.b2s-mobile-nav-close),
  .admin-main button:not([data-admin-menu]),
  main .btn,.main .btn,.admin-main .btn{min-height:42px!important;height:auto!important;padding:9px 12px!important;font-size:13px!important;line-height:1.2!important;border-radius:10px!important}
  main label,.main label,.admin-main label,.form-label,.field-label,legend{font-size:11.5px!important;line-height:1.25!important}

  /* Operational content density. */
  .table-wrap{border-radius:11px!important}
  .table th,.table td{padding:9px 9px!important}
  .table th{font-size:10px!important;line-height:1.25!important}
  .table td{font-size:12px!important;line-height:1.38!important}
  .row-card{padding:10px 11px!important;border-radius:11px!important;gap:9px!important}
  .row-card h3{font-size:15px!important}.row-card p{font-size:12.5px!important}
  .detail{margin-top:10px!important;padding-top:12px!important}.detail-grid{gap:8px!important}.detail-item{padding:9px!important;border-radius:10px!important}

  /* Guest/content surfaces. */
  .b2s-gh-search{padding:14px!important;border-radius:15px!important}
  .b2s-gh-actions{gap:8px!important;margin-top:12px!important}
  .b2s-gh-btn{min-height:42px!important;padding:9px 12px!important;font-size:12.5px!important}
  .b2s-gh-section{padding-top:18px!important;padding-bottom:18px!important}
  .b2s-gh-quick{gap:9px!important}
  .b2s-gh-action-card{padding:12px!important;gap:9px!important;border-radius:13px!important}
  .b2s-gh-action-card strong{font-size:13.5px!important}.b2s-gh-action-card span span{font-size:11.5px!important;line-height:1.4!important}
  .b2s-gh-icon{width:36px!important;height:36px!important;flex:0 0 36px!important}
  .b2s-gh-destinations{gap:10px!important}
  .b2s-gh-destination-card{min-height:0!important;height:auto!important;border-radius:14px!important}

  .availability-card{margin-top:10px!important}
  .availability-switch-card{padding:11px!important;gap:9px!important;border-radius:11px!important}
  .availability-note{padding:10px 11px!important;border-radius:10px!important}

  p,li,label,button,a,span,td,th,strong{overflow-wrap:anywhere}
  img,svg,video,canvas,iframe{max-width:100%}
}

@media (min-width:901px){
  :root{--b2s-d-radius:13px;--b2s-d-muted:#667487}
  body{font-size:14px;line-height:1.48}

  /* Desktop typography only — sidebars/top navigation are deliberately untouched. */
  .admin-main h1,.main h1,main h1,.page-title{font-size:30px!important;line-height:1.08!important;letter-spacing:-.025em!important}
  .admin-main h2,.main h2,main h2,.section-title{font-size:21px!important;line-height:1.16!important;letter-spacing:-.012em!important}
  .admin-main h3,.main h3,main h3{font-size:16.5px!important;line-height:1.22!important}
  .admin-main p,.main p,main p,.admin-main li,.main li,main li{font-size:13px!important;line-height:1.5!important}
  .admin-main small,.main small,main small,.helper,.help-text,.field-help,.hint{font-size:11px!important;line-height:1.4!important}

  /* Content-area spacing only; navigation columns remain from the original design. */
  .admin-main{padding-top:22px!important;padding-bottom:38px!important}
  body[data-portal-role="guest"] .main,
  body[data-portal-role="provider"] .main,
  body[data-portal-role="hotel"] .main{padding-top:22px!important;padding-bottom:40px!important}

  .card,.panel,.surface,.guest-card,.provider-card,.admin-card,.form-card,
  .availability-card,.report-section,.report-toolbar,.b2s-gh-search,.b2s-gh-action-card,
  .b2s2798-shell,[data-review-detail],[data-review-host]{min-height:0!important;height:auto!important;box-sizing:border-box!important}
  .card,.panel,.surface,.guest-card,.provider-card,.admin-card,.form-card,.availability-card,.report-section,.report-toolbar{padding:16px!important;border-radius:var(--b2s-d-radius)!important}
  .card .card,.panel .panel,.surface .surface,.card .panel,.panel .card{margin-top:10px!important;padding:12px!important;border-radius:11px!important;box-shadow:none!important}
  .grid,.form-grid,.field-grid,.fields-grid,.detail-grid{gap:12px!important}
  .card{margin-bottom:14px!important}.card h2{margin-bottom:4px!important}.card>p:first-of-type{margin-bottom:12px!important}

  body.admin-page:not([data-admin-page="autobid"]) .metrics{gap:10px!important;margin-bottom:14px!important}
  body.admin-page:not([data-admin-page="autobid"]) .metrics .metric{min-height:82px!important;height:auto!important;padding:13px 14px!important;border-radius:13px!important;box-shadow:0 4px 14px rgba(20,36,56,.035)!important}
  body.admin-page:not([data-admin-page="autobid"]) .metric span{font-size:10px!important}
  body.admin-page:not([data-admin-page="autobid"]) .metric strong{font-size:24px!important;line-height:1!important;margin-top:5px!important}
  body.admin-page:not([data-admin-page="autobid"]) .metric small{margin-top:4px!important;font-size:10.5px!important;line-height:1.3!important}
  .report-summary{gap:10px!important;margin:12px 0!important}.report-summary article{min-height:86px!important;padding:12px 13px!important;border-radius:12px!important;box-shadow:none!important}.report-summary strong{font-size:24px!important;margin:4px 0!important}

  .table-wrap{border-radius:12px!important}.table th,.table td{padding:10px 11px!important}.table th{font-size:10px!important;line-height:1.25!important}.table td{font-size:12.5px!important;line-height:1.4!important}.table td small{font-size:10.5px!important;line-height:1.35!important}
  .row-card{padding:11px 12px!important;border-radius:11px!important;gap:10px!important}.row-card h3{font-size:14.5px!important}.row-card p{font-size:12.5px!important}
  .detail{margin-top:12px!important;padding-top:14px!important}.detail-grid{gap:9px!important}.detail-item{padding:9px 10px!important;border-radius:10px!important}

  /* Forms/buttons inside content only. */
  main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  .main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  .admin-main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  main select,.main select,.admin-main select{min-height:42px!important;height:42px!important;padding:0 11px!important;font-size:14px!important;border-radius:9px!important}
  main textarea,.main textarea,.admin-main textarea{min-height:92px!important;padding:10px 11px!important;font-size:14px!important;border-radius:9px!important}
  main button:not([data-admin-menu]),.main button:not([data-admin-menu]),.admin-main button:not([data-admin-menu]),main .btn,.main .btn,.admin-main .btn{min-height:40px!important;height:auto!important;padding:8px 12px!important;font-size:12.5px!important;line-height:1.2!important;border-radius:9px!important}
  main label,.main label,.admin-main label,.form-label,.field-label,legend{font-size:11.5px!important;line-height:1.3!important}
  .actions,.report-actions,.availability-actions,.b2s2842-share-actions{gap:8px!important}

  .b2s-gh-shell{max-width:1440px!important;margin-inline:auto!important;padding-inline:24px!important}.b2s-gh-hero{gap:18px!important}.b2s-gh-search{padding:18px!important;border-radius:16px!important}.b2s-gh-actions{gap:9px!important;margin-top:14px!important}.b2s-gh-btn{min-height:42px!important;padding:9px 13px!important;font-size:12.5px!important}.b2s-gh-section{padding-top:22px!important;padding-bottom:22px!important}.b2s-gh-quick{gap:10px!important}.b2s-gh-action-card{padding:14px!important;gap:11px!important;border-radius:14px!important}.b2s-gh-action-card strong{font-size:14px!important}.b2s-gh-action-card span span{font-size:11.5px!important;line-height:1.4!important}.b2s-gh-icon{width:38px!important;height:38px!important;flex:0 0 38px!important}.b2s-gh-destinations{gap:12px!important}.b2s-gh-destination-card{min-height:210px!important;height:210px!important;border-radius:15px!important}

  .availability-shell{max-width:1380px!important;margin-inline:auto!important}.availability-card{margin-top:12px!important}.availability-switch-card{padding:13px!important;gap:10px!important;border-radius:12px!important}.availability-note{padding:11px 12px!important;border-radius:10px!important}

  .b2s30-destination-image{max-height:250px!important;object-fit:cover!important}.b2s-home-featured-destinations .b2s30-destination-image{height:228px!important;min-height:228px!important;max-height:228px!important}.b2s-home-featured-destinations .b2s30-card-content{padding:16px!important;gap:7px!important}.b2s-home-featured-destinations h3{font-size:20px!important}
  p,li,label,button,a,span,td,th,strong{overflow-wrap:anywhere}img,svg,video,canvas,iframe{max-width:100%}
}


/* --- 28.21.3.1 stability rules (consolidated) --- */
/* Bid2Stay 28.21.3.1 — Surgical UI Stability Hotfix
   Derived from the approved 28.21.3 baseline.
   Scope: initial-paint transition suppression + Accommodation Inventory action-cell repair only.
   Navigation design, dimensions, colours and workflow are intentionally untouched. */

/* Keep button labels intact. The approved baseline globally permits aggressive word wrapping;
   this override is limited to interactive controls so labels such as “Open & Edit” do not split. */
main button,
main .btn,
.admin-main button,
.admin-main .btn{
  overflow-wrap:normal!important;
  word-break:normal!important;
}

/* Accommodation Inventory — action column only. */
body[data-admin-page="inventory"] .b2s2877-table th:last-child,
body[data-admin-page="inventory"] .b2s2877-table td:last-child{
  width:136px!important;
  min-width:136px!important;
  text-align:center!important;
}
body[data-admin-page="inventory"] .b2s2877-open{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:116px!important;
  max-width:none!important;
  padding-inline:14px!important;
  white-space:nowrap!important;
  overflow:visible!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  text-overflow:clip!important;
}

@media(max-width:760px){
  body[data-admin-page="inventory"] .b2s2877-table td:last-child{
    width:100%!important;
    min-width:0!important;
    text-align:left!important;
    padding-top:8px!important;
  }
  body[data-admin-page="inventory"] .b2s2877-open{
    width:100%!important;
    min-width:0!important;
    max-width:220px!important;
  }
}

/* --- 28.22.0 production refinement: premium restrained surfaces --- */
:root{
  --b2s-ui-bg:#f5f6f7;
  --b2s-ui-surface:#ffffff;
  --b2s-ui-surface-soft:#fafafa;
  --b2s-ui-border:#e3e7eb;
  --b2s-ui-border-strong:#d7dde3;
  --b2s-ui-text:#172437;
  --b2s-ui-muted:#687586;
  --b2s-ui-shadow:0 1px 2px rgba(16,24,40,.025),0 8px 24px rgba(16,24,40,.045);
  --b2s-ui-shadow-hover:0 2px 5px rgba(16,24,40,.035),0 12px 30px rgba(16,24,40,.055);
  --b2s-ui-radius:14px;
}

/* Keep the design system native and stable: no web-font swap is required for core UI. */
body,input,select,textarea,button{
  font-family:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
}
body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* Content surfaces only. Headers, sidebars and navigation are intentionally excluded. */
.admin-main,
body[data-portal-role="guest"] .main,
body[data-portal-role="guest"] main,
body[data-portal-role="provider"] .main,
body[data-portal-role="hotel"] .main{
  color:var(--b2s-ui-text);
}

.card,.panel,.surface,.content-card,.guest-card,.provider-card,.admin-card,.form-card,
.availability-card,.report-section,.report-toolbar,.metric,.row-card,.detail-item,
.b2s-provider-access-card,.b2s-gh-search,.b2s-gh-action-card{
  border-color:var(--b2s-ui-border)!important;
}
.card,.panel,.surface,.content-card,.guest-card,.provider-card,.admin-card,.form-card,
.availability-card,.report-section,.report-toolbar,.b2s-provider-access-card{
  box-shadow:var(--b2s-ui-shadow)!important;
}

/* Reduce visual noise from oversized legacy empty states and stacked blank areas. */
.empty,.empty-state,.b2s-empty-state,
main .empty,.main .empty,.admin-main .empty{
  min-height:120px!important;
  padding:20px!important;
}
.page-head,.admin-top,.dashboard-section-head,.report-section-head,.starter-section-head{
  margin-bottom:14px!important;
}
.card+.card,.panel+.panel,.surface+.surface,
.report-section+.report-section{
  margin-top:12px!important;
}

/* Consistent heading rhythm without touching navigation labels. */
main :where(h1,h2,h3),.main :where(h1,h2,h3),.admin-main :where(h1,h2,h3){
  text-wrap:balance;
}
main :where(p,li),.main :where(p,li),.admin-main :where(p,li){
  color:inherit;
}
main :where(.muted,.subtle,.helper,.help-text,.hint),
.main :where(.muted,.subtle,.helper,.help-text,.hint),
.admin-main :where(.muted,.subtle,.helper,.help-text,.hint){
  color:var(--b2s-ui-muted)!important;
}

/* Form surfaces: quiet, precise, Microsoft/Apple-like geometry. */
main :where(input,select,textarea),
.main :where(input,select,textarea),
.admin-main :where(input,select,textarea){
  box-shadow:none;
}
main :where(input,select,textarea):focus,
.main :where(input,select,textarea):focus,
.admin-main :where(input,select,textarea):focus{
  box-shadow:0 0 0 3px rgba(216,165,29,.14)!important;
}

/* Tables and operational cards should be dense, not cramped. */
.table-wrap,.admin-table-wrap,.responsive-table,.b2s2883-table-scroll{
  background:var(--b2s-ui-surface);
  border-radius:12px;
}
.table tbody tr:last-child td{border-bottom:0}

/* Public content spacing — preserve hero/header composition while removing excessive dead space. */
.public-section{padding-top:54px!important;padding-bottom:54px!important}
.b2s-gh-section{padding-top:22px!important;padding-bottom:22px!important}

/* Avoid hover motion/layout jitter on touch devices. Touch geometry is CSS-driven, not JS-measured. */
@media (hover:none),(pointer:coarse){
  main :where(button,.btn,a.btn,[role="button"]),
  .main :where(button,.btn,a.btn,[role="button"]),
  .admin-main :where(button,.btn,a.btn,[role="button"]){
    min-height:44px;
  }
  main :where(.card,.panel,.surface),
  .main :where(.card,.panel,.surface),
  .admin-main :where(.card,.panel,.surface){
    transform:none!important;
  }
}

@media(max-width:900px){
  .public-section{padding-top:38px!important;padding-bottom:38px!important}
  .empty,.empty-state,.b2s-empty-state{min-height:96px!important;padding:16px!important}
  .page-head,.admin-top,.dashboard-section-head,.report-section-head,.starter-section-head{margin-bottom:11px!important}
  .card+.card,.panel+.panel,.surface+.surface,.report-section+.report-section{margin-top:10px!important}
}

@media(prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
}

/* --- 28.22.0 typography/network stability lock --- */
:root{
  --b2s-font-family:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif!important;
  --b2s-font:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif!important;
  --b2s-global-font:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif!important;
}
body,input,select,textarea,button{font-family:var(--b2s-font)!important}

/* The density layer permits emergency wrapping in content. Restore normal word integrity in navigation. */
header :where(a,button,span),
nav :where(a,button,span),
.sidebar :where(a,button,span),
.admin-nav :where(a,button,span),
.b2s-home-nav :where(a,button,span),
.b2s-global-nav :where(a,button,span),
.b2s-mobile-overflow-links :where(a,button,span){
  overflow-wrap:normal!important;
  word-break:normal!important;
}


/* --- 28.22.1 Admin flicker stability lock --- */
/* Sidebar markup is server-rendered; keep geometry fixed while preserving colour hover feedback. */
body.admin-page .admin-nav .b2s-admin-link{
  transition:background-color .14s ease,color .14s ease!important;
}
body.admin-page .admin-nav .b2s-nav-icon{
  width:20px!important;height:20px!important;flex:0 0 20px!important;
}
body.admin-page .metrics .metric strong{
  display:inline-block;min-width:3ch;font-variant-numeric:tabular-nums;
}
body[data-admin-page="inventory"] .b2s2877-loading,
body[data-admin-page="providers"] .b2s2870-loading{
  animation:none!important;opacity:1!important;
}

/* Bid2Stay 28.22.2 — single-boot layout stability
   Keep modern Admin operational shells present from first paint. Data may hydrate,
   but JavaScript must not create/reposition whole workspaces after initial render. */
body.admin-page .b2s-admin-notification-wrap{flex:0 0 auto}
body[data-admin-page="inventory"] [data-b2s28200-admin-intel]{min-height:250px}
body[data-admin-page="inventory"] [data-b2s2877-rows] .empty{height:72px;vertical-align:middle}
body[data-admin-page="providers"] [data-b2s2870-rows] .empty{height:72px;vertical-align:middle}
body[data-admin-page="autobid"] [data-b2s28192-shell]{min-height:520px}
body[data-admin-page="autobid"] [data-b2s28192-list]{min-height:180px}
@media(max-width:760px){body[data-admin-page="inventory"] [data-b2s28200-admin-intel]{min-height:220px}body[data-admin-page="autobid"] [data-b2s28192-shell]{min-height:460px}}

/* 28.22.6 Provider/Accommodation deterministic hydration */
[data-b2s2870-rows].b2s-data-hydrating,[data-b2s2877-rows].b2s-data-hydrating{opacity:1!important;transition:none!important}
.b2s2870-table-wrap,.b2s2877-table-wrap{min-height:168px}
[data-b2s28200-admin-intel][aria-busy="true"]{opacity:1!important;transition:none!important}
