/* ==========================================================
   Bid2Stay 28.8.3 — Platform UI System Cleanup
   Scope: Admin + Guest + Provider portals.
   This layer normalises spacing, typography, cards, buttons,
   navigation and tables without changing workflows.
   ========================================================== */

:root{
  --b2s-ui-text:#172033;
  --b2s-ui-muted:#667085;
  --b2s-ui-border:#e3e8ee;
  --b2s-ui-soft:#f7f9fb;
  --b2s-ui-radius:16px;
  --b2s-ui-radius-lg:20px;
  --b2s-ui-control-h:44px;
  --b2s-ui-page-gap:18px;
  --b2s-ui-card-pad:18px;
}

/* ---------- Portal typography ---------- */
body[data-portal-role="guest"],
body[data-portal-role="hotel"],
body[data-portal-role="provider"],
body.admin-page,
body[data-portal-role="admin"]{
  color:var(--b2s-ui-text);
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
}

body[data-portal-role="guest"] main,
body[data-portal-role="hotel"] main,
body[data-portal-role="provider"] main,
body.admin-page main,
body[data-portal-role="admin"] main{
  font-size:15px;
  line-height:1.5;
  min-width:0;
}

body[data-portal-role="guest"] main p,
body[data-portal-role="hotel"] main p,
body[data-portal-role="provider"] main p,
body.admin-page main p,
body[data-portal-role="admin"] main p{
  line-height:1.55;
}

body[data-portal-role="guest"] main h1,
body[data-portal-role="hotel"] main h1,
body[data-portal-role="provider"] main h1,
body.admin-page main h1,
body[data-portal-role="admin"] main h1{
  line-height:1.12;
  letter-spacing:-.025em;
}

body[data-portal-role="guest"] main h2,
body[data-portal-role="hotel"] main h2,
body[data-portal-role="provider"] main h2,
body.admin-page main h2,
body[data-portal-role="admin"] main h2{
  line-height:1.18;
  letter-spacing:-.015em;
}

/* ---------- Page rhythm ---------- */
body[data-portal-role="guest"] main > *,
body[data-portal-role="hotel"] main > *,
body[data-portal-role="provider"] main > *,
body.admin-page main > *,
body[data-portal-role="admin"] main > *{
  min-width:0;
}

body.admin-page .admin-main,
body[data-portal-role="admin"] .admin-main{
  padding-top:22px;
  padding-bottom:34px;
}

body[data-portal-role="guest"] .main,
body[data-portal-role="hotel"] .main,
body[data-portal-role="provider"] .main{
  padding-bottom:32px;
}

/* ---------- Cards and panels ---------- */
body[data-portal-role="guest"] :is(.card,.panel,[class*="-card"],[class*="-panel"]),
body[data-portal-role="hotel"] :is(.card,.panel,[class*="-card"],[class*="-panel"]),
body[data-portal-role="provider"] :is(.card,.panel,[class*="-card"],[class*="-panel"]),
body.admin-page :is(.card,.panel,[class*="-card"],[class*="-panel"]),
body[data-portal-role="admin"] :is(.card,.panel,[class*="-card"],[class*="-panel"]){
  box-sizing:border-box;
  min-width:0;
}

/* Remove accidental giant fixed-height cards while preserving maps/media. */
body[data-portal-role="guest"] main :is(.card,.panel,[class*="-card"]):not([class*="map"]):not([class*="gallery"]),
body[data-portal-role="hotel"] main :is(.card,.panel,[class*="-card"]):not([class*="map"]):not([class*="gallery"]),
body[data-portal-role="provider"] main :is(.card,.panel,[class*="-card"]):not([class*="map"]):not([class*="gallery"]),
body.admin-page main :is(.card,.panel,[class*="-card"]):not([class*="map"]):not([class*="gallery"]),
body[data-portal-role="admin"] main :is(.card,.panel,[class*="-card"]):not([class*="map"]):not([class*="gallery"]){
  height:auto;
}

/* ---------- Buttons: containment first ---------- */
body[data-portal-role="guest"] :is(button,.btn,[class*="-btn"],[class*="-button"]),
body[data-portal-role="hotel"] :is(button,.btn,[class*="-btn"],[class*="-button"]),
body[data-portal-role="provider"] :is(button,.btn,[class*="-btn"],[class*="-button"]),
body.admin-page :is(button,.btn,[class*="-btn"],[class*="-button"]),
body[data-portal-role="admin"] :is(button,.btn,[class*="-btn"],[class*="-button"]){
  box-sizing:border-box;
  max-width:100%;
  min-height:var(--b2s-ui-control-h);
  line-height:1.15;
  text-align:center;
  overflow:hidden;
  text-overflow:ellipsis;
  vertical-align:middle;
}

/* Standard compact action buttons stay on one line. */
body[data-portal-role="guest"] :is(.btn,.b2s151-btn,.b23-choose,.b23-head-link,.b2s28729-view,.b2s2881-primary,.b2s2881-secondary),
body.admin-page :is(.btn,.report-action,.dashboard-text-link,.b2s2880-type),
body[data-portal-role="admin"] :is(.btn,.report-action,.dashboard-text-link),
body[data-portal-role="hotel"] :is(.btn),
body[data-portal-role="provider"] :is(.btn){
  white-space:nowrap;
}

/* Rich CTA buttons containing a headline + helper text may wrap cleanly. */
body[data-portal-role="guest"] button:has(small),
body[data-portal-role="hotel"] button:has(small),
body[data-portal-role="provider"] button:has(small),
body.admin-page button:has(small),
body[data-portal-role="admin"] button:has(small){
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  min-height:52px;
}

/* ---------- Forms ---------- */
body[data-portal-role="guest"] :is(input,select,textarea),
body[data-portal-role="hotel"] :is(input,select,textarea),
body[data-portal-role="provider"] :is(input,select,textarea),
body.admin-page :is(input,select,textarea),
body[data-portal-role="admin"] :is(input,select,textarea){
  box-sizing:border-box;
  max-width:100%;
  font:inherit;
}

body[data-portal-role="guest"] :is(input:not([type="checkbox"]):not([type="radio"]),select),
body[data-portal-role="hotel"] :is(input:not([type="checkbox"]):not([type="radio"]),select),
body[data-portal-role="provider"] :is(input:not([type="checkbox"]):not([type="radio"]),select),
body.admin-page :is(input:not([type="checkbox"]):not([type="radio"]),select),
body[data-portal-role="admin"] :is(input:not([type="checkbox"]):not([type="radio"]),select){
  min-height:var(--b2s-ui-control-h);
}

body[data-portal-role="guest"] label,
body[data-portal-role="hotel"] label,
body[data-portal-role="provider"] label,
body.admin-page label,
body[data-portal-role="admin"] label{
  min-width:0;
}

/* ---------- Admin sidebar ---------- */
body.admin-page .admin-nav,
body[data-portal-role="admin"] .admin-nav{
  min-width:218px;
}

body.admin-page .b2s-admin-link,
body[data-portal-role="admin"] .b2s-admin-link{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  padding:9px 12px;
  min-width:0;
}

body.admin-page .b2s-admin-link .b2s-nav-icon,
body[data-portal-role="admin"] .b2s-admin-link .b2s-nav-icon{
  flex:0 0 21px;
  width:21px;
  height:21px;
}

body.admin-page .b2s-admin-link .b2s-nav-label,
body[data-portal-role="admin"] .b2s-admin-link .b2s-nav-label{
  flex:1 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.2;
  font-size:.91rem;
}

body.admin-page .b2s-nav-badge,
body[data-portal-role="admin"] .b2s-nav-badge{
  flex:0 0 auto;
}

/* ---------- Guest/provider top navigation ---------- */
body[data-portal-role="guest"] .header-actions a,
body[data-portal-role="hotel"] .header-actions a,
body[data-portal-role="provider"] .header-actions a,
body[data-portal-role="guest"] .b2s-mobile-overflow-links a,
body[data-portal-role="hotel"] .b2s-mobile-overflow-links a,
body[data-portal-role="provider"] .b2s-mobile-overflow-links a{
  white-space:nowrap;
  line-height:1.2;
}

body[data-portal-role="guest"] .header-actions,
body[data-portal-role="hotel"] .header-actions,
body[data-portal-role="provider"] .header-actions{
  gap:10px;
}

/* ---------- Tables ---------- */
body[data-portal-role="guest"] main table,
body[data-portal-role="hotel"] main table,
body[data-portal-role="provider"] main table,
body.admin-page main table,
body[data-portal-role="admin"] main table{
  width:100%;
  max-width:100%;
  border-collapse:collapse;
  font-size:.9rem;
}

body[data-portal-role="guest"] main :is(th,td),
body[data-portal-role="hotel"] main :is(th,td),
body[data-portal-role="provider"] main :is(th,td),
body.admin-page main :is(th,td),
body[data-portal-role="admin"] main :is(th,td){
  padding:12px 14px;
  vertical-align:middle;
  line-height:1.35;
  overflow-wrap:break-word;
}

body[data-portal-role="guest"] main th,
body[data-portal-role="hotel"] main th,
body[data-portal-role="provider"] main th,
body.admin-page main th,
body[data-portal-role="admin"] main th{
  white-space:nowrap;
  font-size:.75rem;
  letter-spacing:.045em;
}

body[data-portal-role="guest"] main td :is(.btn,button),
body[data-portal-role="hotel"] main td :is(.btn,button),
body[data-portal-role="provider"] main td :is(.btn,button),
body.admin-page main td :is(.btn,button),
body[data-portal-role="admin"] main td :is(.btn,button){
  min-height:38px;
  padding:8px 11px;
  font-size:.82rem;
}

/* ---------- KPI / metric cards ---------- */
body.admin-page :is(.dashboard-kpi,.b2s2880-kpi,[class*="metric"]),
body[data-portal-role="admin"] :is(.dashboard-kpi,.b2s2880-kpi,[class*="metric"]),
body[data-portal-role="guest"] [class*="metric"],
body[data-portal-role="hotel"] [class*="metric"],
body[data-portal-role="provider"] [class*="metric"]{
  min-width:0;
}

body.admin-page :is(.dashboard-kpi,.b2s2880-kpi),
body[data-portal-role="admin"] :is(.dashboard-kpi,.b2s2880-kpi){
  min-height:116px;
  padding:16px;
}

/* ---------- Status chips / pills ---------- */
body[data-portal-role="guest"] :is(.pill,[class*="-pill"],[class*="-chip"],[class*="-badge"]),
body[data-portal-role="hotel"] :is(.pill,[class*="-pill"],[class*="-chip"],[class*="-badge"]),
body[data-portal-role="provider"] :is(.pill,[class*="-pill"],[class*="-chip"],[class*="-badge"]),
body.admin-page :is(.pill,[class*="-pill"],[class*="-chip"],[class*="-badge"]),
body[data-portal-role="admin"] :is(.pill,[class*="-pill"],[class*="-chip"],[class*="-badge"]){
  max-width:100%;
  line-height:1.15;
}

/* ---------- Desktop content widths ---------- */
@media (min-width:901px){
  body.admin-page .admin-main,
  body[data-portal-role="admin"] .admin-main{
    min-width:0;
  }
}

/* ---------- Tablet ---------- */
@media (max-width:1100px){
  body.admin-page .admin-nav,
  body[data-portal-role="admin"] .admin-nav{
    min-width:200px;
  }
  body.admin-page .b2s-admin-link .b2s-nav-label,
  body[data-portal-role="admin"] .b2s-admin-link .b2s-nav-label{
    font-size:.88rem;
  }
}

/* ---------- Mobile ---------- */
@media (max-width:760px){
  :root{
    --b2s-ui-card-pad:15px;
    --b2s-ui-page-gap:14px;
  }

  body[data-portal-role="guest"] main,
  body[data-portal-role="hotel"] main,
  body[data-portal-role="provider"] main,
  body.admin-page main,
  body[data-portal-role="admin"] main{
    font-size:15px;
  }

  body[data-portal-role="guest"] main h1,
  body[data-portal-role="hotel"] main h1,
  body[data-portal-role="provider"] main h1,
  body.admin-page main h1,
  body[data-portal-role="admin"] main h1{
    font-size:clamp(1.55rem,7vw,2rem);
  }

  body[data-portal-role="guest"] :is(.btn,.b2s151-btn,.b23-choose,.b2s28729-view,.b2s2881-primary,.b2s2881-secondary),
  body[data-portal-role="hotel"] .btn,
  body[data-portal-role="provider"] .btn,
  body.admin-page .btn,
  body[data-portal-role="admin"] .btn{
    min-height:44px;
  }

  /* Keep short menu/action labels one line, but never let them escape. */
  body[data-portal-role="guest"] .b2s-mobile-overflow-links a,
  body[data-portal-role="hotel"] .b2s-mobile-overflow-links a,
  body[data-portal-role="provider"] .b2s-mobile-overflow-links a,
  body.admin-page .b2s-admin-link .b2s-nav-label,
  body[data-portal-role="admin"] .b2s-admin-link .b2s-nav-label{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* Tables retain readable columns and scroll horizontally instead of crushing text. */
  body[data-portal-role="guest"] main table,
  body[data-portal-role="hotel"] main table,
  body[data-portal-role="provider"] main table,
  body.admin-page main table,
  body[data-portal-role="admin"] main table{
    min-width:680px;
  }

  body[data-portal-role="guest"] main :is(.table-wrap,[class*="table-wrap"],[class*="table-shell"]),
  body[data-portal-role="hotel"] main :is(.table-wrap,[class*="table-wrap"],[class*="table-shell"]),
  body[data-portal-role="provider"] main :is(.table-wrap,[class*="table-wrap"],[class*="table-shell"]),
  body.admin-page main :is(.table-wrap,[class*="table-wrap"],[class*="table-shell"]),
  body[data-portal-role="admin"] main :is(.table-wrap,[class*="table-wrap"],[class*="table-shell"]){
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    max-width:100%;
  }

  body[data-portal-role="guest"] main :is(th,td),
  body[data-portal-role="hotel"] main :is(th,td),
  body[data-portal-role="provider"] main :is(th,td),
  body.admin-page main :is(th,td),
  body[data-portal-role="admin"] main :is(th,td){
    padding:10px 11px;
  }

  body.admin-page :is(.dashboard-kpi,.b2s2880-kpi),
  body[data-portal-role="admin"] :is(.dashboard-kpi,.b2s2880-kpi){
    min-height:104px;
    padding:14px;
  }
}

/* Narrow mobile: prevent action rows from forcing layout overflow. */
@media (max-width:520px){
  body[data-portal-role="guest"] :is(.b2s151-item-actions,.b2s2881-actions),
  body[data-portal-role="hotel"] [class*="actions"],
  body[data-portal-role="provider"] [class*="actions"],
  body.admin-page :is(.dashboard-action-buttons,.report-row-actions,[class*="actions"]),
  body[data-portal-role="admin"] :is(.dashboard-action-buttons,.report-row-actions,[class*="actions"]){
    max-width:100%;
  }

  body[data-portal-role="guest"] :is(.b2s151-item-actions,.b2s2881-actions) > *,
  body.admin-page .report-row-actions > *,
  body[data-portal-role="admin"] .report-row-actions > *{
    max-width:100%;
  }
}