/* Premium responsive UI layer for SalonSuite / Mad Success portals
   Applies after page-level CSS to unify desktop, tablet, and mobile views. */
:root{
  --ms-premium-primary:var(--ms-primary,#8f4f5b);
  --ms-premium-secondary:var(--ms-secondary,#b76e79);
  --ms-premium-accent:var(--ms-accent,#d8a7b1);
  --ms-premium-bg:var(--ms-bg,#fff9fa);
  --ms-premium-soft:var(--ms-soft,#fff1f3);
  --ms-premium-surface:var(--ms-surface,#ffffff);
  --ms-premium-text:var(--ms-text,#2b2b2b);
  --ms-premium-muted:var(--ms-muted,#666b73);
  --ms-premium-border:var(--ms-border,#f0d8dc);
  --ms-premium-sidebar:var(--ms-sidebar,#242124);
  --ms-premium-shadow:0 18px 45px rgba(143,79,91,.10);
  --ms-premium-shadow-strong:0 24px 70px rgba(43,33,38,.16);
  --ms-premium-radius:24px;
  --ms-premium-radius-sm:16px;
  --ms-premium-font:var(--ms-font,"SF Pro Display","SF Pro Text",Inter,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
html,body{min-height:100%;}
body{font-family:var(--ms-premium-font)!important;background:
  radial-gradient(circle at 8% -8%, rgba(183,110,121,.15), transparent 30%),
  radial-gradient(circle at 92% 0%, rgba(216,167,177,.20), transparent 34%),
  var(--ms-premium-bg)!important;color:var(--ms-premium-text)!important;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;}
body,input,select,textarea,button,table{font-family:var(--ms-premium-font)!important;}
a{text-underline-offset:3px;}
img,svg,video,canvas{max-width:100%;height:auto;}

/* Shared portal shell */
.layout,.dashboard,.app{width:100%!important;min-height:100vh!important;}
.sidebar,.owner-sidebar{background:linear-gradient(180deg,#1f1b1f 0%, var(--ms-premium-sidebar) 100%)!important;color:#fff!important;border-right:1px solid rgba(255,255,255,.10)!important;box-shadow:10px 0 34px rgba(32,24,28,.10)!important;scrollbar-gutter:stable!important;}
.sidebar::-webkit-scrollbar,.owner-sidebar::-webkit-scrollbar{width:7px;height:7px;}
.sidebar::-webkit-scrollbar-thumb,.owner-sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25);border-radius:999px;}
.sidebar .brand,.owner-sidebar .brand,.sidebar .logo{letter-spacing:-.02em;}
.sidebar a,.owner-sidebar a,.menu a{touch-action:manipulation;}
.main,.layout>.main,.app>.main,.dashboard>.main{background:transparent!important;}
.main{min-width:0!important;}

/* Premium cards, panels, forms, and tables */
.topbar{border-radius:28px!important;border:1px solid rgba(240,216,220,.95)!important;background:rgba(255,255,255,.88)!important;backdrop-filter:blur(18px)!important;box-shadow:var(--ms-premium-shadow)!important;}
.topbar h1{letter-spacing:-.04em!important;line-height:1.1!important;}
.topbar p{line-height:1.55!important;color:var(--ms-premium-muted)!important;}
.panel,.card,.stat-card,.stat,.mini-card,.portal-card,.feature-card,.price-card,.hero-card,.dashboard-preview,.selected-plan-card,.tier-card,.plan-summary,.billing-choice,.table-wrap,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card,.permission-item,.empty,.appointment,.preview-card,.role-box{
  border-color:var(--ms-premium-border)!important;
  box-shadow:var(--ms-premium-shadow)!important;
}
.panel,.card,.stat-card,.stat,.mini-card,.portal-card,.feature-card,.price-card,.hero-card,.selected-plan-card,.tier-card,.plan-summary,.table-wrap,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card,.permission-item,.empty{
  border-radius:var(--ms-premium-radius)!important;
}
.panel,.card,.stat-card,.stat,.mini-card,.feature-card,.portal-card,.price-card,.selected-plan-card,.tier-card,.table-wrap,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card,.permission-item{background:rgba(255,255,255,.94)!important;}
.panel:hover,.card:hover,.feature-card:hover,.portal-card:hover,.price-card:hover,.tier-card:hover{box-shadow:var(--ms-premium-shadow-strong)!important;}
.panel h2,.panel h3,.card h2,.card h3,.stat-card strong,.stat strong,.price,.tier-price,.preview-card strong,.feature-card h3,.portal-card h3,.price-card h3{letter-spacing:-.025em!important;}
.muted,p.small,.panel-subtitle,.member-meta,.booking-info,.info-item span,td{color:var(--ms-premium-muted)!important;}
.btn,button.btn,input.btn,.btn-primary,.btn-outline,.btn-light,.btn-soft,.btn-dark,button[type="submit"],input[type="submit"]{min-height:42px;border-radius:999px!important;font-weight:850!important;letter-spacing:-.005em!important;box-shadow:none!important;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease!important;}
.btn:hover,button.btn:hover,.btn-primary:hover,.btn-outline:hover,.btn-light:hover,.btn-soft:hover,button[type="submit"]:hover,input[type="submit"]:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(143,79,91,.14)!important;}
input,select,textarea{min-height:44px;border-radius:15px!important;border-color:var(--ms-premium-border)!important;background:#fff!important;color:var(--ms-premium-text)!important;box-shadow:none!important;}
textarea{min-height:104px;}
input:focus,select:focus,textarea:focus{outline:none!important;border-color:var(--ms-premium-primary)!important;box-shadow:0 0 0 4px rgba(143,79,91,.12)!important;}
label{letter-spacing:-.01em;}
.table-wrap{overflow:auto!important;-webkit-overflow-scrolling:touch!important;background:#fff!important;}
table{width:100%;border-collapse:separate!important;border-spacing:0!important;}
th{position:sticky;top:0;z-index:2;background:var(--ms-premium-soft)!important;color:var(--ms-premium-primary)!important;font-size:11.5px!important;font-weight:900!important;letter-spacing:.06em!important;text-transform:uppercase!important;}
th,td{border-color:var(--ms-premium-border)!important;}
.badge,.pending,.confirmed,.completed,.cancelled,.good,.warn,.bad,.info,.neutral{border-radius:999px!important;font-weight:900!important;}

.ms-action-icon{display:none;line-height:1;flex:0 0 auto;}
.ms-action-has-icon{white-space:normal;}

/* Better desktop rhythm */
@media (min-width:1181px){
  .main,.layout>.main,.app>.main,.dashboard>.main{padding:32px!important;}
  .topbar{padding:24px 28px!important;margin-bottom:28px!important;}
  .grid{gap:26px!important;}
  .grid-2{gap:24px!important;}
  .panel,.card{padding:26px!important;}
}

/* Tablet: compact rail, more breathing room, no oversized tables. */
@media (max-width:1180px) and (min-width:821px){
  .sidebar,.owner-sidebar{width:108px!important;min-width:108px!important;max-width:108px!important;padding:18px 10px!important;overflow-x:hidden!important;}
  .main,.layout>.main,.app>.main,.dashboard>.main{margin-left:108px!important;width:calc(100% - 108px)!important;padding:24px!important;}
  .sidebar .brand,.owner-sidebar .brand{justify-content:center!important;margin-bottom:18px!important;}
  .sidebar .ms-notify-widget,.owner-sidebar .ms-notify-widget{display:none!important;}
  .sidebar .brand>div:not(.brand-icon),.owner-sidebar .brand>div:not(.brand-icon),.sidebar .logo span,.sidebar .logo .ms-brand-logo-inline span,.sidebar .member-name,.sidebar .menu-label,.owner-sidebar .menu-label{display:none!important;}
  .sidebar .logo{font-size:0!important;display:flex!important;justify-content:center!important;margin:0 0 18px!important;}
  .sidebar .logo::before{content:"S";display:inline-grid;place-items:center;width:48px;height:48px;border-radius:18px;background:linear-gradient(135deg,var(--ms-premium-primary),var(--ms-premium-secondary));color:#fff;font-size:21px;font-weight:950;}
  .sidebar .brand-icon,.owner-sidebar .brand-icon{width:48px!important;height:48px!important;min-width:48px!important;border-radius:18px!important;}
  .sidebar .menu,.owner-sidebar .menu{display:grid!important;gap:8px!important;}
  .sidebar a,.owner-sidebar a,.menu a{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:68px!important;padding:9px 6px!important;margin:0 0 8px!important;border-radius:18px!important;text-align:center!important;}
  .sidebar a .ms-nav-icon,.owner-sidebar a .ms-nav-icon,.menu a .ms-nav-icon{width:30px!important;height:30px!important;min-width:30px!important;font-size:22px!important;}
  .sidebar a .ms-nav-text,.owner-sidebar a .ms-nav-text,.menu a .ms-nav-text{display:block!important;width:100%!important;font-size:10.5px!important;line-height:1.12!important;white-space:normal!important;}
  .stats,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .grid,.grid-2,.form-grid,.form-row,.booking-info,.row,.filter-form,.status-form{grid-template-columns:1fr!important;}
  .calendar-grid{gap:8px!important;}
  .calendar-day{min-height:118px!important;}
}

/* Mobile: premium bottom navigation, single-column content. */
@media (max-width:820px){
  body{padding-bottom:94px!important;}
  .layout,.dashboard,.app{display:flex!important;flex-direction:column!important;min-height:100vh!important;}
  .main,.layout>.main,.app>.main,.dashboard>.main{margin-left:0!important;width:100%!important;max-width:100%!important;padding:16px!important;padding-bottom:112px!important;}
  .sidebar,.owner-sidebar{display:flex!important;position:fixed!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%!important;min-width:0!important;max-width:none!important;height:auto!important;max-height:94px!important;min-height:0!important;padding:8px 9px calc(8px + env(safe-area-inset-bottom))!important;background:rgba(31,27,31,.98)!important;color:#fff!important;border-top:1px solid rgba(255,255,255,.14)!important;border-right:0!important;box-shadow:0 -18px 44px rgba(0,0,0,.28)!important;z-index:9999!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;}
  .sidebar::-webkit-scrollbar,.owner-sidebar::-webkit-scrollbar{display:none;}
  .sidebar .brand,.owner-sidebar .brand,.sidebar .logo,.sidebar .member-name,.sidebar .menu-label,.owner-sidebar .menu-label,.sidebar .ms-notify-widget,.owner-sidebar .ms-notify-widget{display:none!important;}
  .sidebar .menu,.owner-sidebar .menu{display:flex!important;align-items:stretch!important;gap:8px!important;width:max-content!important;min-width:100%!important;margin:0!important;padding:0!important;}
  .sidebar>a,.owner-sidebar>a,.sidebar .menu>a,.owner-sidebar .menu>a,.sidebar .nav>a{display:flex!important;flex:0 0 76px!important;min-width:76px!important;height:66px!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;gap:4px!important;margin:0!important;padding:7px 6px!important;border-radius:17px!important;color:#f8f8f8!important;background:rgba(255,255,255,.065)!important;text-align:center!important;border:1px solid rgba(255,255,255,.07)!important;}
  .sidebar>a:hover,.sidebar>a.active,.owner-sidebar>a:hover,.owner-sidebar>a.active,.sidebar .menu>a:hover,.sidebar .menu>a.active,.owner-sidebar .menu>a:hover,.owner-sidebar .menu>a.active{background:linear-gradient(135deg,var(--ms-premium-primary),var(--ms-premium-secondary))!important;color:#fff!important;border-color:rgba(255,255,255,.28)!important;}
  .sidebar a .ms-nav-icon,.owner-sidebar a .ms-nav-icon,.menu a .ms-nav-icon{width:24px!important;height:24px!important;min-width:24px!important;font-size:20px!important;}
  .sidebar a .ms-nav-text,.owner-sidebar a .ms-nav-text,.menu a .ms-nav-text{display:block!important;width:100%!important;font-size:9.5px!important;line-height:1.05!important;white-space:normal!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .topbar{padding:19px!important;border-radius:22px!important;margin-bottom:18px!important;flex-direction:column!important;align-items:flex-start!important;}
  .topbar h1{font-size:clamp(23px,7vw,30px)!important;}
  .top-actions{width:100%!important;display:grid!important;grid-template-columns:1fr!important;gap:9px!important;}
  .stats,.stats-grid,.hero-stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;overflow:visible!important;}
  .grid,.grid-2,.form-grid,.form-row,.business-fields,.booking-info,.row,.filter-form,.status-form,.feature-grid,.tier-grid,.pricing-grid,.portal-grid,.features-grid,.preview-cards{grid-template-columns:1fr!important;}
  .panel,.card,.stat-card,.stat,.mini-card,.feature-card,.portal-card,.price-card,.tier-card{border-radius:20px!important;padding:18px!important;}
  .stat-card,.stat{padding:15px!important;}
  .stat-card span,.stat span{font-size:11px!important;line-height:1.2!important;}
  .stat-card strong,.stat strong{font-size:clamp(22px,8vw,30px)!important;line-height:1.05!important;}
  .table-wrap{max-width:100%!important;overflow-x:auto!important;}
  table{min-width:720px!important;}
  .calendar-head,.booking-head{flex-direction:column!important;align-items:flex-start!important;}
  .calendar-grid{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;}
  .calendar-weekday{display:none!important;}
  .calendar-day{min-height:auto!important;}
  .btn,.btn-primary,.btn-outline,.btn-light,.btn-soft,.btn-danger,button[type="submit"],input[type="submit"]{width:100%;justify-content:center!important;}
  input,select,textarea{font-size:16px!important;}
  .ms-footer{margin-bottom:6px!important;}
}
@media (max-width:520px){
  .main,.layout>.main,.app>.main,.dashboard>.main{padding:13px!important;padding-bottom:110px!important;}
  .topbar{padding:17px!important;}
  .stats,.stats-grid,.hero-stats{grid-template-columns:1fr!important;}
  .panel,.card,.stat-card,.stat,.mini-card,.feature-card,.portal-card,.price-card,.tier-card{padding:16px!important;border-radius:18px!important;}
  th,td{padding:12px!important;}
}

/* Auth, registration, and public landing pages */
.page{min-height:100vh!important;background:
  radial-gradient(circle at left top, rgba(183,110,121,.16), transparent 34%),
  radial-gradient(circle at right bottom, rgba(216,167,177,.20), transparent 32%),
  var(--ms-premium-bg)!important;}
.page .left,.page .right{min-width:0!important;}
.page .card{background:rgba(255,255,255,.94)!important;border:1px solid var(--ms-premium-border)!important;border-radius:30px!important;box-shadow:0 30px 90px rgba(43,33,38,.14)!important;}
.logo-circle,.logo-mark,.brand-icon,.avatar{box-shadow:0 14px 30px rgba(143,79,91,.20)!important;}
.business-form{gap:18px!important;}
.tier-grid,.business-fields,.features-grid,.portal-grid,.pricing-grid,.preview-cards{gap:18px!important;}
.tier-card,.price-card,.feature-card,.portal-card{height:100%;}
.hero,.features,.pricing,.portal-section,.cta{position:relative;}
.container{max-width:1180px!important;}
.nav{gap:18px!important;}
.nav-links,.nav-actions{min-width:0;}
.hero-grid{align-items:center!important;}
.hero h1{letter-spacing:-.06em!important;}
.hero-card{backdrop-filter:blur(12px)!important;}
.price-card.featured{transform:none!important;box-shadow:0 30px 90px rgba(143,79,91,.20)!important;}
@media (max-width:1024px){
  .page{grid-template-columns:1fr!important;}
  .page .left{padding:36px 28px!important;text-align:center!important;}
  .page .right{padding:28px!important;}
  .hero-grid{grid-template-columns:1fr!important;gap:34px!important;}
  .features-grid,.portal-grid,.pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .nav{height:auto!important;padding:14px 0!important;flex-wrap:wrap!important;}
  .nav-links{order:3;width:100%;justify-content:center!important;gap:16px!important;flex-wrap:wrap!important;}
}
@media (max-width:720px){
  .page .left{padding:28px 18px!important;}
  .page .right{padding:16px!important;}
  .page .card{border-radius:24px!important;padding:22px!important;}
  .roles,.feature-grid,.features-grid,.portal-grid,.pricing-grid,.preview-cards,.hero-stats{grid-template-columns:1fr!important;}
  .billing-choice{grid-template-columns:1fr!important;}
  .nav-actions{width:100%;display:grid!important;grid-template-columns:1fr!important;}
  .nav-links{font-size:13px!important;}
  .hero{padding:54px 0 46px!important;}
  .hero h1{font-size:clamp(36px,12vw,54px)!important;}
  .hero p{font-size:16px!important;}
  .hero-buttons{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;}
  .section-heading h2{font-size:clamp(28px,10vw,42px)!important;}
}

/* Utility polish */
.message,.success,.error,.alert-success,.alert-error,.ms-plan-note,.ms-purchase-alert{border-radius:18px!important;}
.ms-notify-widget{border-radius:20px!important;}
body:not(.ms-enhanced-nav) .sidebar a,body:not(.ms-enhanced-nav) .owner-sidebar a{white-space:normal!important;}


/* Mobile Portal Upgrade - app-style shell, real portal navigation, and card tables */
.ms-mobile-appbar,.ms-mobile-tabbar,.ms-mobile-sheet{display:none;}
.ms-notification-dot,.ms-mobile-count{position:absolute;top:5px;right:8px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#fff;color:var(--ms-premium-primary);display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:950;box-shadow:0 8px 18px rgba(0,0,0,.16);}
.sidebar a,.owner-sidebar a,.menu a{position:relative;}
input[type="checkbox"],input[type="radio"]{width:auto!important;min-height:0!important;accent-color:var(--ms-premium-primary);}

@media (max-width:820px){
  html.ms-mobile-sheet-open,body.ms-mobile-sheet-open{overflow:hidden!important;}
  body.ms-mobile-shell-ready{padding-top:calc(70px + env(safe-area-inset-top))!important;padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;background:linear-gradient(180deg,#fffafa 0%,var(--ms-premium-bg) 42%,#fff 100%)!important;}
  body.ms-mobile-shell-ready .sidebar,body.ms-mobile-shell-ready .owner-sidebar{display:none!important;}
  body.ms-mobile-shell-ready .layout,body.ms-mobile-shell-ready .dashboard,body.ms-mobile-shell-ready .app{display:block!important;min-height:auto!important;}
  body.ms-mobile-shell-ready .main,body.ms-mobile-shell-ready .layout>.main,body.ms-mobile-shell-ready .app>.main,body.ms-mobile-shell-ready .dashboard>.main{margin-left:0!important;width:100%!important;max-width:100%!important;min-height:0!important;padding:14px!important;padding-bottom:18px!important;}
  body.ms-mobile-shell-ready .mobile-menu{display:none!important;}

  body.ms-owner-portal.ms-mobile-shell-ready{padding-bottom:0!important;}
  body.ms-owner-portal.ms-mobile-shell-ready .ms-mobile-tabbar{display:none!important;}
  body.ms-owner-portal.ms-mobile-shell-ready .main,body.ms-owner-portal.ms-mobile-shell-ready .layout>.main,body.ms-owner-portal.ms-mobile-shell-ready .app>.main,body.ms-owner-portal.ms-mobile-shell-ready .dashboard>.main{padding-bottom:18px!important;}

  .ms-mobile-appbar{display:flex!important;position:fixed;top:0;left:0;right:0;z-index:10020;min-height:calc(64px + env(safe-area-inset-top));padding:calc(10px + env(safe-area-inset-top)) 14px 10px;align-items:center;justify-content:space-between;gap:12px;background:rgba(255,255,255,.92);backdrop-filter:blur(22px);border-bottom:1px solid rgba(240,216,220,.92);box-shadow:0 14px 34px rgba(43,33,38,.08);}
  .ms-mobile-appbar-copy{min-width:0;display:flex;flex-direction:column;gap:2px;}
  .ms-mobile-brand{display:block;color:var(--ms-premium-primary);font-size:11px;line-height:1.1;font-weight:950;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:74vw;}
  .ms-mobile-title{display:block;color:var(--ms-premium-text);font-size:18px;line-height:1.12;font-weight:950;letter-spacing:-.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:74vw;}
  .ms-mobile-menu-button{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border:1px solid var(--ms-premium-border)!important;border-radius:16px!important;background:#fff!important;display:inline-flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;padding:0!important;box-shadow:0 12px 24px rgba(143,79,91,.10)!important;}
  .ms-mobile-menu-button span{display:block;width:18px;height:2px;border-radius:999px;background:var(--ms-premium-primary);}

  .ms-mobile-tabbar{display:block!important;position:fixed;left:0;right:0;bottom:0;z-index:10010;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(31,27,31,.96);backdrop-filter:blur(24px);border-top:1px solid rgba(255,255,255,.12);box-shadow:0 -22px 50px rgba(0,0,0,.28);}
  .ms-mobile-tabbar-inner{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;max-width:620px;margin:0 auto;}
  .ms-mobile-tab{position:relative;min-width:0;min-height:58px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.07);color:rgba(255,255,255,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px 4px;text-align:center;text-decoration:none!important;font:inherit;cursor:pointer;}
  .ms-mobile-tab.active{background:linear-gradient(135deg,var(--ms-premium-primary),var(--ms-premium-secondary));color:#fff;border-color:rgba(255,255,255,.26);box-shadow:0 12px 26px rgba(183,110,121,.28);}
  .ms-mobile-tab-icon{font-size:19px;line-height:1;}
  .ms-mobile-tab-label{font-size:9.5px;line-height:1.08;font-weight:900;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .ms-mobile-more-button{appearance:none;-webkit-appearance:none;}

  .ms-mobile-sheet{display:block!important;position:fixed;inset:0;z-index:10030;pointer-events:none;}
  .ms-mobile-sheet-backdrop{position:absolute;inset:0;background:rgba(25,18,22,.48);opacity:0;transition:opacity .2s ease;}
  .ms-mobile-sheet-panel{position:absolute;left:0;right:0;bottom:0;max-height:min(78vh,680px);padding:10px 14px calc(18px + env(safe-area-inset-bottom));background:#fff;border-radius:28px 28px 0 0;box-shadow:0 -28px 70px rgba(0,0,0,.25);transform:translateY(105%);transition:transform .24s ease;overflow-y:auto;-webkit-overflow-scrolling:touch;}
  .ms-mobile-sheet.open{pointer-events:auto;}
  .ms-mobile-sheet.open .ms-mobile-sheet-backdrop{opacity:1;}
  .ms-mobile-sheet.open .ms-mobile-sheet-panel{transform:translateY(0);}
  .ms-mobile-sheet-handle{width:46px;height:5px;border-radius:999px;background:#ead3d8;margin:0 auto 12px;}
  .ms-mobile-sheet-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;}
  .ms-mobile-sheet-head span{display:block;font-size:11px;color:var(--ms-premium-muted);font-weight:950;text-transform:uppercase;letter-spacing:.08em;}
  .ms-mobile-sheet-head strong{display:block;font-size:21px;line-height:1.1;color:var(--ms-premium-text);font-weight:950;letter-spacing:-.04em;}
  .ms-mobile-sheet-close{width:42px!important;height:42px!important;min-height:42px!important;border-radius:15px!important;border:1px solid var(--ms-premium-border)!important;background:var(--ms-premium-soft)!important;color:var(--ms-premium-primary)!important;font-size:28px!important;line-height:1!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;}
  .ms-mobile-sheet-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
  .ms-mobile-sheet-link{position:relative;display:flex!important;align-items:center;gap:10px;min-height:54px;padding:11px 12px;border-radius:18px;background:var(--ms-premium-soft);border:1px solid var(--ms-premium-border);color:var(--ms-premium-text)!important;text-decoration:none!important;}
  .ms-mobile-sheet-link.active{background:linear-gradient(135deg,var(--ms-premium-primary),var(--ms-premium-secondary));color:#fff!important;border-color:transparent;}
  .ms-mobile-sheet-link .ms-mobile-tab-icon{font-size:20px;min-width:24px;text-align:center;}
  .ms-mobile-sheet-link .ms-mobile-tab-label{font-size:13px;line-height:1.15;font-weight:900;white-space:normal;text-align:left;}

  .topbar{border-radius:24px!important;padding:18px!important;margin-bottom:14px!important;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,241,243,.88))!important;}
  .topbar h1{font-size:clamp(22px,7.2vw,30px)!important;line-height:1.05!important;}
  .topbar p{font-size:13px!important;line-height:1.45!important;}
  .top-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%!important;}
  .top-actions .btn,.top-actions a{min-height:42px!important;padding:10px 12px!important;font-size:12px!important;}

  .stats,.stats-grid,.hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin-bottom:14px!important;}
  .stat-card,.stat{padding:15px!important;min-height:96px;display:flex!important;flex-direction:column!important;justify-content:space-between!important;}
  .stat-card span,.stat span{font-size:10.5px!important;text-transform:uppercase!important;letter-spacing:.05em!important;color:var(--ms-premium-muted)!important;}
  .stat-card strong,.stat strong{font-size:clamp(22px,7.5vw,31px)!important;line-height:1!important;word-break:break-word;}
  .grid,.grid-2,.form-grid,.form-row,.business-fields,.booking-info,.row,.filter-form,.status-form,.feature-grid,.tier-grid,.pricing-grid,.portal-grid,.features-grid,.preview-cards,.quick-actions{grid-template-columns:1fr!important;gap:12px!important;}
  .panel,.card,.mini-card,.feature-card,.portal-card,.price-card,.tier-card,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card{border-radius:22px!important;padding:16px!important;margin-bottom:14px!important;}
  .panel h2,.card h2{font-size:19px!important;margin-bottom:12px!important;}
  .btn,.btn-primary,.btn-outline,.btn-light,.btn-soft,.btn-danger,button[type="submit"],input[type="submit"]{width:100%;justify-content:center!important;min-height:44px!important;}

  .btn.ms-action-has-icon,button.ms-action-has-icon,a.action-btn.ms-action-has-icon,.billing-option.ms-action-has-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;line-height:1.15!important;}
  .ms-action-icon{display:inline-flex!important;align-items:center;justify-content:center;width:22px;height:22px;min-width:22px;border-radius:9px;background:rgba(255,255,255,.28);font-size:15px;line-height:1;}
  .btn-outline .ms-action-icon,.btn-light .ms-action-icon,.btn-soft .ms-action-icon,a.action-btn .ms-action-icon,.billing-option .ms-action-icon{background:rgba(143,79,91,.10);}
  .btn-danger .ms-action-icon{background:rgba(255,255,255,.22);}
  table.ms-responsive-table td .btn.ms-action-has-icon,table.ms-responsive-table td button.ms-action-has-icon,table.ms-responsive-table td a.action-btn.ms-action-has-icon{width:100%!important;min-height:42px!important;text-align:center!important;}
  .top-actions .btn.ms-action-has-icon,.quick-actions .btn.ms-action-has-icon{font-size:12.5px!important;}
  .billing-option.ms-action-has-icon{width:auto!important;min-height:42px!important;}
  input,select,textarea{font-size:16px!important;min-height:46px!important;}

  .table-wrap{border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;padding:0!important;}
  table.ms-responsive-table{min-width:0!important;width:100%!important;display:block!important;border-collapse:separate!important;border-spacing:0!important;background:transparent!important;}
  table.ms-responsive-table thead{display:none!important;}
  table.ms-responsive-table tbody{display:block!important;}
  table.ms-responsive-table tr{display:block!important;margin:0 0 12px!important;background:#fff!important;border:1px solid var(--ms-premium-border)!important;border-radius:20px!important;box-shadow:var(--ms-premium-shadow)!important;overflow:hidden!important;}
  table.ms-responsive-table td{display:grid!important;grid-template-columns:minmax(96px,38%) minmax(0,1fr)!important;gap:10px!important;align-items:start!important;width:100%!important;padding:12px 14px!important;border:0!important;border-bottom:1px solid var(--ms-premium-border)!important;text-align:right!important;font-size:13px!important;word-break:break-word!important;color:var(--ms-premium-text)!important;}
  table.ms-responsive-table td:last-child{border-bottom:0!important;}
  table.ms-responsive-table td::before{content:attr(data-label);text-align:left;color:var(--ms-premium-primary);font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.04em;line-height:1.2;}
  table.ms-responsive-table td:empty::after{content:"—";color:var(--ms-premium-muted);}
  table.ms-responsive-table td .btn,table.ms-responsive-table td button,table.ms-responsive-table td input[type="submit"]{margin-top:4px!important;}

  .calendar-grid{grid-template-columns:1fr!important;gap:10px!important;}
  .calendar-weekday{display:none!important;}
  .calendar-day{min-height:auto!important;border-radius:20px!important;}
  .ms-footer{padding-bottom:0!important;margin-bottom:0!important;}
}

@media (max-width:420px){
  body.ms-mobile-shell-ready .main,body.ms-mobile-shell-ready .layout>.main,body.ms-mobile-shell-ready .app>.main{padding:11px!important;}
  .ms-mobile-sheet-links{grid-template-columns:1fr;}
  .top-actions{grid-template-columns:1fr!important;}
  .stats,.stats-grid,.hero-stats{grid-template-columns:1fr!important;}
  table.ms-responsive-table td{grid-template-columns:1fr!important;text-align:left!important;gap:5px!important;}
}

/* One-line layout lock applied globally from the approved homepage pattern.
   Keeps portal top bars and stat grids on a single horizontal row across desktop, tablet, and mobile. */
:root{
  --ms-one-line-stat-min:132px;
  --ms-one-line-stat-max:220px;
}

/* Header / page top bars must stay horizontal. */
.nav,
.topbar,
.ms-mobile-appbar{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:clamp(8px,1.6vw,20px)!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:thin!important;
}

.topbar > *,
.nav > *,
.ms-mobile-appbar > *{
  min-width:0!important;
}

.topbar > :first-child,
.nav .logo,
.ms-mobile-appbar-copy{
  flex:1 1 auto!important;
  min-width:160px!important;
}

.topbar h1,
.topbar p,
.ms-mobile-title,
.ms-mobile-brand{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.top-actions,
.nav-actions,
.hero-buttons,
.billing-toggle{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:clamp(7px,1vw,12px)!important;
  width:auto!important;
  max-width:none!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
}

.top-actions::-webkit-scrollbar,
.nav-actions::-webkit-scrollbar,
.hero-buttons::-webkit-scrollbar,
.billing-toggle::-webkit-scrollbar{
  display:none!important;
}

.top-actions .btn,
.top-actions a,
.nav-actions .btn,
.nav-actions a,
.hero-buttons .btn,
.hero-buttons a,
.billing-toggle .billing-option,
.topbar .btn,
.topbar a.btn{
  width:auto!important;
  min-width:max-content!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
}

/* Stat grids must stay in one horizontal line only. */
.stats,
.stats-grid,
.hero-stats,
.metric-grid,
.kpi-grid,
.summary-grid{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  grid-template-columns:none!important;
  gap:clamp(8px,1.3vw,18px)!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:thin!important;
  scroll-snap-type:x proximity;
}

.stats > *,
.stats-grid > *,
.hero-stats > *,
.metric-grid > *,
.kpi-grid > *,
.summary-grid > *{
  flex:1 0 clamp(var(--ms-one-line-stat-min),18vw,var(--ms-one-line-stat-max))!important;
  min-width:var(--ms-one-line-stat-min)!important;
  max-width:none!important;
  scroll-snap-align:start;
}

.stat-card,
.stat{
  min-height:92px!important;
}

@media(max-width:820px){
  :root{
    --ms-one-line-stat-min:112px;
    --ms-one-line-stat-max:150px;
  }

  .nav,
  .topbar,
  .ms-mobile-appbar{
    padding-left:14px!important;
    padding-right:14px!important;
    flex-direction:row!important;
    align-items:center!important;
  }

  .topbar > :first-child,
  .nav .logo,
  .ms-mobile-appbar-copy{
    min-width:150px!important;
  }

  .topbar p{
    max-width:48vw!important;
    font-size:12.5px!important;
  }

  .top-actions,
  .nav-actions,
  .hero-buttons,
  .billing-toggle{
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    width:auto!important;
  }

  .top-actions .btn,
  .top-actions a,
  .nav-actions .btn,
  .nav-actions a,
  .hero-buttons .btn,
  .hero-buttons a,
  .billing-toggle .billing-option,
  .topbar .btn,
  .topbar a.btn{
    width:auto!important;
    min-height:40px!important;
    padding:9px 12px!important;
    font-size:12px!important;
  }

  .stats,
  .stats-grid,
  .hero-stats,
  .metric-grid,
  .kpi-grid,
  .summary-grid{
    grid-template-columns:none!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    padding-bottom:4px!important;
    margin-bottom:14px!important;
  }

  .stats > *,
  .stats-grid > *,
  .hero-stats > *,
  .metric-grid > *,
  .kpi-grid > *,
  .summary-grid > *{
    flex:0 0 clamp(var(--ms-one-line-stat-min),30vw,var(--ms-one-line-stat-max))!important;
    min-width:var(--ms-one-line-stat-min)!important;
  }

  .stat-card,
  .stat{
    min-height:88px!important;
    padding:12px 10px!important;
    border-radius:16px!important;
  }

  .stat-card span,
  .stat span,
  .stat-card h3{
    font-size:10px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .stat-card strong,
  .stat strong,
  .stat-card h2{
    font-size:clamp(17px,5.2vw,24px)!important;
    line-height:1.05!important;
    word-break:normal!important;
  }
}

@media(max-width:420px){
  .top-actions,
  .nav-actions,
  .hero-buttons,
  .billing-toggle,
  .stats,
  .stats-grid,
  .hero-stats,
  .metric-grid,
  .kpi-grid,
  .summary-grid{
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    grid-template-columns:none!important;
  }
}

/* Stable sidebar lock: prevents the portal navigation from changing position between pages and tablet widths. */
:root{
  --ms-stable-sidebar-width:280px;
}

@media (min-width:821px){
  body{
    padding-top:0!important;
    padding-bottom:0!important;
  }

  .layout,
  .dashboard,
  .app{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    min-height:100vh!important;
  }

  .sidebar,
  .owner-sidebar{
    display:block!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    width:var(--ms-stable-sidebar-width)!important;
    min-width:var(--ms-stable-sidebar-width)!important;
    max-width:var(--ms-stable-sidebar-width)!important;
    height:100vh!important;
    min-height:100vh!important;
    max-height:none!important;
    padding:24px 18px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    z-index:1000!important;
    border-right:1px solid rgba(255,255,255,.10)!important;
    border-top:0!important;
    box-shadow:10px 0 34px rgba(32,24,28,.10)!important;
  }

  .main,
  .layout>.main,
  .app>.main,
  .dashboard>.main{
    margin-left:var(--ms-stable-sidebar-width)!important;
    width:calc(100% - var(--ms-stable-sidebar-width))!important;
    max-width:calc(100% - var(--ms-stable-sidebar-width))!important;
    min-height:100vh!important;
  }

  .sidebar .brand,
  .owner-sidebar .brand{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:12px!important;
    margin:0 0 24px!important;
  }

  .sidebar .brand>div:not(.brand-icon),
  .owner-sidebar .brand>div:not(.brand-icon),
  .sidebar .logo span,
  .sidebar .member-name,
  .sidebar .menu-label,
  .owner-sidebar .menu-label,
  .sidebar .ms-notify-widget,
  .owner-sidebar .ms-notify-widget{
    display:block!important;
  }

  .sidebar .logo{
    display:block!important;
    justify-content:flex-start!important;
    margin:0 0 18px!important;
    font-size:24px!important;
    line-height:1.1!important;
  }

  .sidebar .logo::before{
    content:none!important;
    display:none!important;
  }

  .sidebar .brand-icon,
  .owner-sidebar .brand-icon{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    flex:0 0 44px!important;
  }

  .sidebar .menu,
  .owner-sidebar .menu{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }

  .sidebar a,
  .owner-sidebar a,
  .sidebar .menu a,
  .owner-sidebar .menu a,
  .menu a{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    height:auto!important;
    padding:12px 14px!important;
    margin:0 0 7px!important;
    border-radius:14px!important;
    text-align:left!important;
    white-space:normal!important;
  }

  .sidebar a .ms-nav-icon,
  .owner-sidebar a .ms-nav-icon,
  .menu a .ms-nav-icon{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    font-size:18px!important;
    line-height:1!important;
  }

  .sidebar a .ms-nav-text,
  .owner-sidebar a .ms-nav-text,
  .menu a .ms-nav-text{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    font-size:14px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-align:left!important;
  }
}

@media (max-width:820px){
  body.ms-mobile-shell-ready{
    padding-top:calc(70px + env(safe-area-inset-top))!important;
    padding-bottom:0!important;
  }

  body.ms-mobile-shell-ready .main,
  body.ms-mobile-shell-ready .layout>.main,
  body.ms-mobile-shell-ready .app>.main,
  body.ms-mobile-shell-ready .dashboard>.main{
    padding-bottom:18px!important;
  }

  .ms-mobile-tabbar{
    display:none!important;
  }

  .ms-mobile-sheet-panel{
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    width:min(86vw,320px)!important;
    max-width:320px!important;
    max-height:none!important;
    height:100vh!important;
    padding:18px 14px calc(18px + env(safe-area-inset-bottom))!important;
    border-radius:0 28px 28px 0!important;
    transform:translateX(-105%)!important;
  }

  .ms-mobile-sheet.open .ms-mobile-sheet-panel{
    transform:translateX(0)!important;
  }

  .ms-mobile-sheet-links{
    grid-template-columns:1fr!important;
  }

  .ms-mobile-sheet-link{
    min-height:50px!important;
    justify-content:flex-start!important;
    text-align:left!important;
  }
}


/* Web App Suitability Layer - stable shell, drawer navigation, touch-friendly controls, and safe-area support. */
:root{
  --ms-app-sidebar-width:280px;
  --ms-app-topbar-height:64px;
  --ms-app-mobile-edge:14px;
}
html,body{width:100%;max-width:100%;overflow-x:hidden!important;}
body{overscroll-behavior-y:none;}
.layout,.dashboard,.app{isolation:isolate;}
.main,.layout>.main,.app>.main,.dashboard>.main{min-width:0!important;}
.panel,.card,.table-wrap,.form-card,.profile-card,.booking-card,.member-card,.package-card,.stat-card,.stat{contain:layout paint;}

/* Desktop and tablet are treated like a real web app: one fixed left navigation and one scrollable content canvas. */
@media (min-width:821px){
  .layout,.dashboard,.app{display:flex!important;flex-direction:row!important;min-height:100dvh!important;height:auto!important;}
  .sidebar,.owner-sidebar{
    position:fixed!important;
    inset:0 auto 0 0!important;
    width:var(--ms-app-sidebar-width)!important;
    min-width:var(--ms-app-sidebar-width)!important;
    max-width:var(--ms-app-sidebar-width)!important;
    height:100dvh!important;
    min-height:100dvh!important;
    padding:24px 18px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    z-index:1000!important;
  }
  .main,.layout>.main,.app>.main,.dashboard>.main{
    margin-left:var(--ms-app-sidebar-width)!important;
    width:calc(100% - var(--ms-app-sidebar-width))!important;
    max-width:calc(100% - var(--ms-app-sidebar-width))!important;
    min-height:100dvh!important;
    padding:clamp(22px,2.3vw,32px)!important;
  }
  .topbar{position:sticky!important;top:12px!important;z-index:50!important;}
  .sidebar a,.owner-sidebar a,.menu a{scroll-margin-block:18px!important;}
}

/* Mobile becomes an app shell: fixed app bar + left drawer. No bottom tab bar and no moving sidebar. */
@media (max-width:820px){
  body.ms-mobile-shell-ready{
    padding-top:calc(var(--ms-app-topbar-height) + env(safe-area-inset-top))!important;
    padding-bottom:0!important;
    min-height:100dvh!important;
    overflow-x:hidden!important;
    background:linear-gradient(180deg,#fffafa 0%,var(--ms-premium-bg) 52%,#fff 100%)!important;
  }
  body.ms-mobile-shell-ready .sidebar,
  body.ms-mobile-shell-ready .owner-sidebar{
    display:none!important;
    visibility:hidden!important;
  }
  body.ms-mobile-shell-ready .layout,
  body.ms-mobile-shell-ready .dashboard,
  body.ms-mobile-shell-ready .app{
    display:block!important;
    min-height:100dvh!important;
    height:auto!important;
  }
  body.ms-mobile-shell-ready .main,
  body.ms-mobile-shell-ready .layout>.main,
  body.ms-mobile-shell-ready .app>.main,
  body.ms-mobile-shell-ready .dashboard>.main{
    margin-left:0!important;
    width:100%!important;
    max-width:100%!important;
    min-height:auto!important;
    padding:var(--ms-app-mobile-edge)!important;
    padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;
  }
  .ms-mobile-appbar{
    display:flex!important;
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    z-index:10020!important;
    min-height:calc(var(--ms-app-topbar-height) + env(safe-area-inset-top))!important;
    padding:calc(9px + env(safe-area-inset-top)) var(--ms-app-mobile-edge) 9px!important;
    border-bottom:1px solid rgba(240,216,220,.92)!important;
    background:rgba(255,255,255,.94)!important;
    backdrop-filter:blur(22px)!important;
    -webkit-backdrop-filter:blur(22px)!important;
    box-shadow:0 12px 30px rgba(43,33,38,.08)!important;
  }
  .ms-mobile-tabbar{display:none!important;visibility:hidden!important;}
  .ms-mobile-menu-button{flex:0 0 44px!important;}
  .ms-mobile-sheet{display:block!important;position:fixed!important;inset:0!important;z-index:10030!important;pointer-events:none!important;}
  .ms-mobile-sheet.open{pointer-events:auto!important;}
  .ms-mobile-sheet-backdrop{position:absolute!important;inset:0!important;background:rgba(25,18,22,.52)!important;opacity:0;transition:opacity .2s ease!important;}
  .ms-mobile-sheet.open .ms-mobile-sheet-backdrop{opacity:1!important;}
  .ms-mobile-sheet-panel{
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    width:min(88vw,340px)!important;
    height:100dvh!important;
    max-height:none!important;
    padding:calc(16px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom))!important;
    border-radius:0 28px 28px 0!important;
    background:#fff!important;
    transform:translateX(-105%)!important;
    transition:transform .24s cubic-bezier(.2,.8,.2,1)!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .ms-mobile-sheet.open .ms-mobile-sheet-panel{transform:translateX(0)!important;}
  .ms-mobile-sheet-handle{display:none!important;}
  .ms-mobile-sheet-links{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;}
  .ms-mobile-sheet-link{min-height:48px!important;border-radius:16px!important;}

  /* Mobile page cards should fit the screen instead of creating hidden horizontal overflow. */
  .topbar{
    display:flex!important;
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:12px!important;
    overflow:visible!important;
    position:relative!important;
    top:auto!important;
    padding:16px!important;
    border-radius:22px!important;
  }
  .topbar>*,.topbar>:first-child{min-width:0!important;width:100%!important;}
  .topbar h1,.topbar p{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;}
  .topbar h1{font-size:clamp(22px,7vw,30px)!important;}
  .top-actions{
    width:100%!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:8px!important;
    padding-bottom:2px!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .top-actions .btn,.top-actions a,.top-actions button{flex:0 0 auto!important;width:auto!important;min-width:max-content!important;}

  .stats,.stats-grid,.hero-stats,.metric-grid,.kpi-grid,.summary-grid{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:10px!important;
    padding:2px 2px 8px!important;
    scroll-snap-type:x proximity!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .stats>*,.stats-grid>*,.hero-stats>*,.metric-grid>*,.kpi-grid>*,.summary-grid>*{
    flex:0 0 clamp(132px,42vw,190px)!important;
    min-width:132px!important;
    scroll-snap-align:start!important;
  }
  .grid,.grid-2,.form-grid,.form-row,.business-fields,.booking-info,.row,.filter-form,.status-form,.feature-grid,.tier-grid,.pricing-grid,.portal-grid,.features-grid,.preview-cards,.quick-actions{
    grid-template-columns:1fr!important;
  }
  .panel,.card,.mini-card,.feature-card,.portal-card,.price-card,.tier-card,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card{
    max-width:100%!important;
  }
  input,select,textarea,button,.btn,a.btn{touch-action:manipulation;}
  input,select,textarea{font-size:16px!important;}
  .btn,button.btn,a.btn,button[type="submit"],input[type="submit"]{min-height:44px!important;}
}

@media (display-mode:standalone){
  body{user-select:none;-webkit-user-select:none;}
  input,textarea,[contenteditable="true"]{user-select:text;-webkit-user-select:text;}
}


/* Scroll Unlock Patch - keeps the web app shell stable while allowing normal page scrolling. */
html,
body{
  height:auto!important;
  min-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y pinch-zoom!important;
}
body{
  overscroll-behavior-y:auto!important;
  position:static!important;
}
.layout,
.dashboard,
.app,
.main,
.layout>.main,
.app>.main,
.dashboard>.main,
.page,
.content,
.owner-content,
.member-content,
.staff-content,
.admin-content{
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  touch-action:pan-y pinch-zoom!important;
}
.main,
.layout>.main,
.app>.main,
.dashboard>.main{
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch!important;
}
body.ms-mobile-shell-ready{
  height:auto!important;
  min-height:100dvh!important;
  overflow-y:auto!important;
  position:static!important;
}
body.ms-mobile-shell-ready .layout,
body.ms-mobile-shell-ready .dashboard,
body.ms-mobile-shell-ready .app,
body.ms-mobile-shell-ready .main,
body.ms-mobile-shell-ready .layout>.main,
body.ms-mobile-shell-ready .app>.main,
body.ms-mobile-shell-ready .dashboard>.main{
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}
/* Only lock the page when the drawer/modal is really open. */
html.ms-mobile-sheet-open,
body.ms-mobile-sheet-open,
body.staff-booking-embed-open,
body.ms-modal-open{
  overflow:hidden!important;
  height:100%!important;
  touch-action:none!important;
}
.ms-mobile-sheet-panel,
.staff-booking-embed-modal.open,
.ms-modal:target{
  touch-action:pan-y pinch-zoom!important;
}
.ms-mobile-sheet-panel{
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
@media (min-width:821px){
  .layout,
  .dashboard,
  .app{
    min-height:100dvh!important;
    height:auto!important;
    overflow:visible!important;
  }
  .main,
  .layout>.main,
  .app>.main,
  .dashboard>.main{
    min-height:100dvh!important;
    height:auto!important;
    overflow:visible!important;
  }
}
@media (max-width:820px){
  html,
  body{
    height:auto!important;
    min-height:100%!important;
    overflow-y:auto!important;
  }
  body.ms-mobile-shell-ready{
    padding-top:calc(var(--ms-app-topbar-height) + env(safe-area-inset-top))!important;
    padding-bottom:calc(16px + env(safe-area-inset-bottom))!important;
  }
  body.ms-mobile-shell-ready .main,
  body.ms-mobile-shell-ready .layout>.main,
  body.ms-mobile-shell-ready .app>.main,
  body.ms-mobile-shell-ready .dashboard>.main{
    padding-bottom:calc(28px + env(safe-area-inset-bottom))!important;
  }
}


/* Tablet Sidebar Click Patch - tablets use the real fixed sidebar, phones use the drawer. */
@media (min-width:768px) and (max-width:1180px){
  :root{--ms-tablet-click-sidebar:260px;}

  html,
  body{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    touch-action:pan-y pinch-zoom!important;
  }

  body.ms-mobile-shell-ready{
    padding-top:0!important;
    padding-bottom:0!important;
  }

  .ms-mobile-appbar,
  .ms-mobile-tabbar,
  .ms-mobile-sheet{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  .layout,
  .dashboard,
  .app{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    min-height:100dvh!important;
    height:auto!important;
    overflow:visible!important;
  }

  body.ms-mobile-shell-ready .sidebar,
  body.ms-mobile-shell-ready .owner-sidebar,
  .sidebar,
  .owner-sidebar{
    display:block!important;
    visibility:visible!important;
    pointer-events:auto!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    width:var(--ms-tablet-click-sidebar)!important;
    min-width:var(--ms-tablet-click-sidebar)!important;
    max-width:var(--ms-tablet-click-sidebar)!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:none!important;
    padding:22px 14px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    z-index:30000!important;
    touch-action:pan-y!important;
  }

  .sidebar *,
  .owner-sidebar *{
    pointer-events:auto!important;
  }

  .sidebar a,
  .owner-sidebar a,
  .sidebar .menu a,
  .owner-sidebar .menu a,
  .menu a{
    position:relative!important;
    z-index:1!important;
    pointer-events:auto!important;
    cursor:pointer!important;
    touch-action:manipulation!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    width:100%!important;
    min-height:44px!important;
    padding:12px 13px!important;
    margin:0 0 7px!important;
    border-radius:14px!important;
    text-align:left!important;
  }

  .sidebar a .ms-nav-text,
  .owner-sidebar a .ms-nav-text,
  .menu a .ms-nav-text{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    font-size:13.5px!important;
    line-height:1.22!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  body.ms-mobile-shell-ready .main,
  body.ms-mobile-shell-ready .layout>.main,
  body.ms-mobile-shell-ready .app>.main,
  body.ms-mobile-shell-ready .dashboard>.main,
  .main,
  .layout>.main,
  .app>.main,
  .dashboard>.main{
    margin-left:var(--ms-tablet-click-sidebar)!important;
    width:calc(100% - var(--ms-tablet-click-sidebar))!important;
    max-width:calc(100% - var(--ms-tablet-click-sidebar))!important;
    min-height:100dvh!important;
    padding:20px!important;
    overflow:visible!important;
  }

  .topbar{
    position:sticky!important;
    top:10px!important;
    z-index:100!important;
  }
}

@media (min-width:768px) and (max-width:900px){
  :root{--ms-tablet-click-sidebar:236px;}
  .sidebar a .ms-nav-text,
  .owner-sidebar a .ms-nav-text,
  .menu a .ms-nav-text{font-size:12.8px!important;}
  .sidebar a,
  .owner-sidebar a,
  .sidebar .menu a,
  .owner-sidebar .menu a,
  .menu a{padding-left:11px!important;padding-right:11px!important;}
}

/* H1 Visibility Patch - keep page titles readable after premium/web-app overrides. */
.topbar,
.page-header,
.app-header,
.portal-header{
  color:var(--ms-premium-text)!important;
  position:relative!important;
  overflow:visible!important;
}
.topbar h1,
.topbar h2,
.page-header h1,
.app-header h1,
.portal-header h1,
.main h1:first-child{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  color:var(--ms-premium-text)!important;
  text-shadow:none!important;
  position:relative!important;
  z-index:3!important;
  margin-top:0!important;
  margin-bottom:8px!important;
  min-height:1.15em!important;
}
.topbar p,
.page-header p,
.app-header p,
.portal-header p{
  visibility:visible!important;
  opacity:1!important;
  color:var(--ms-premium-muted)!important;
}
.topbar .top-actions,
.topbar .actions,
.page-header .actions,
.app-header .actions,
.portal-header .actions{
  position:relative!important;
  z-index:4!important;
}
@media (max-width:820px){
  body.ms-mobile-shell-ready .topbar,
  body.ms-mobile-shell-ready .page-header,
  body.ms-mobile-shell-ready .app-header,
  body.ms-mobile-shell-ready .portal-header{
    margin-top:0!important;
  }
  body.ms-mobile-shell-ready .topbar h1,
  body.ms-mobile-shell-ready .page-header h1,
  body.ms-mobile-shell-ready .app-header h1,
  body.ms-mobile-shell-ready .portal-header h1{
    font-size:clamp(23px,7.2vw,31px)!important;
    line-height:1.08!important;
  }
}

/* Owner Portal Mobile Web-App Upgrade - compact icon navigation and app-style touch UI. */
@media (max-width:767px){
  body.ms-owner-portal.ms-mobile-shell-ready{
    padding-top:calc(64px + env(safe-area-inset-top))!important;
    padding-bottom:0!important;
    background:linear-gradient(180deg,#fffafb 0%,var(--ms-premium-bg) 48%,#fff 100%)!important;
  }

  body.ms-owner-portal.ms-mobile-shell-ready .main,
  body.ms-owner-portal.ms-mobile-shell-ready .layout>.main,
  body.ms-owner-portal.ms-mobile-shell-ready .app>.main,
  body.ms-owner-portal.ms-mobile-shell-ready .dashboard>.main{
    padding:12px!important;
    padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;
  }

  body.ms-owner-portal .ms-mobile-appbar{
    min-height:calc(64px + env(safe-area-inset-top))!important;
    padding:calc(8px + env(safe-area-inset-top)) 12px 8px!important;
    gap:10px!important;
    overflow:hidden!important;
  }

  body.ms-owner-portal .ms-mobile-brand{
    max-width:calc(100vw - 82px)!important;
    font-size:10px!important;
    letter-spacing:.07em!important;
  }

  body.ms-owner-portal .ms-mobile-title{
    max-width:calc(100vw - 82px)!important;
    font-size:17px!important;
    line-height:1.08!important;
  }

  body.ms-owner-portal .ms-mobile-menu-button{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    border-radius:15px!important;
  }

  body.ms-owner-portal.ms-mobile-shell-ready .ms-mobile-tabbar{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  body.ms-owner-portal .ms-mobile-tabbar-inner{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:6px!important;
    max-width:520px!important;
    margin:0 auto!important;
  }

  body.ms-owner-portal .ms-mobile-tab{
    min-width:0!important;
    min-height:55px!important;
    height:55px!important;
    padding:5px 3px!important;
    border-radius:17px!important;
    gap:3px!important;
    text-align:center!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
  }

  body.ms-owner-portal .ms-mobile-tab-icon{
    font-size:19px!important;
    line-height:1!important;
  }

  body.ms-owner-portal .ms-mobile-tab-label{
    font-size:9px!important;
    line-height:1.05!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-weight:900!important;
  }

  body.ms-owner-portal .ms-mobile-sheet-panel{
    width:min(88vw,336px)!important;
    max-width:336px!important;
    border-radius:0 26px 26px 0!important;
  }

  body.ms-owner-portal .ms-mobile-sheet-head{
    margin-bottom:12px!important;
  }

  body.ms-owner-portal .ms-mobile-sheet-link{
    min-height:48px!important;
    padding:10px 11px!important;
    border-radius:16px!important;
  }

  body.ms-owner-portal .topbar{
    padding:13px!important;
    border-radius:20px!important;
    margin-bottom:12px!important;
    gap:10px!important;
    background:rgba(255,255,255,.94)!important;
  }

  body.ms-owner-portal .topbar h1{
    font-size:clamp(19px,6vw,24px)!important;
    line-height:1.1!important;
    margin-bottom:4px!important;
  }

  body.ms-owner-portal .topbar p{
    font-size:12px!important;
    line-height:1.35!important;
  }

  body.ms-owner-portal .top-actions{
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:1px 1px 3px!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  body.ms-owner-portal .top-actions::-webkit-scrollbar{display:none!important;}

  body.ms-owner-portal .top-actions .btn.ms-action-has-icon,
  body.ms-owner-portal .top-actions a.btn.ms-action-has-icon,
  body.ms-owner-portal .top-actions button.ms-action-has-icon{
    flex:0 0 62px!important;
    width:62px!important;
    min-width:62px!important;
    max-width:62px!important;
    min-height:54px!important;
    height:54px!important;
    padding:6px 5px!important;
    border-radius:17px!important;
    display:inline-flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    font-size:0!important;
    line-height:1!important;
    white-space:normal!important;
  }

  body.ms-owner-portal .top-actions .btn.ms-action-has-icon .ms-action-icon,
  body.ms-owner-portal .top-actions button.ms-action-has-icon .ms-action-icon{
    display:inline-flex!important;
    width:23px!important;
    height:23px!important;
    min-width:23px!important;
    margin:0!important;
    font-size:16px!important;
    border-radius:10px!important;
  }

  body.ms-owner-portal .top-actions .btn.ms-action-has-icon::after,
  body.ms-owner-portal .top-actions button.ms-action-has-icon::after{
    content:attr(data-ms-action-label);
    display:block;
    width:100%;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:9px;
    line-height:1.05;
    font-weight:900;
  }

  body.ms-owner-portal .stats,
  body.ms-owner-portal .stats-grid,
  body.ms-owner-portal .hero-stats,
  body.ms-owner-portal .metric-grid,
  body.ms-owner-portal .kpi-grid,
  body.ms-owner-portal .summary-grid{
    gap:8px!important;
    margin-bottom:12px!important;
    padding:1px 1px 7px!important;
  }

  body.ms-owner-portal .stats>*,
  body.ms-owner-portal .stats-grid>*,
  body.ms-owner-portal .hero-stats>*,
  body.ms-owner-portal .metric-grid>*,
  body.ms-owner-portal .kpi-grid>*,
  body.ms-owner-portal .summary-grid>*{
    flex:0 0 116px!important;
    min-width:116px!important;
  }

  body.ms-owner-portal .stat-card,
  body.ms-owner-portal .stat{
    min-height:82px!important;
    padding:12px!important;
    border-radius:18px!important;
  }

  body.ms-owner-portal .stat-card span,
  body.ms-owner-portal .stat span{
    font-size:9.5px!important;
    line-height:1.15!important;
  }

  body.ms-owner-portal .stat-card strong,
  body.ms-owner-portal .stat strong{
    font-size:clamp(20px,7vw,25px)!important;
  }

  body.ms-owner-portal .panel,
  body.ms-owner-portal .card,
  body.ms-owner-portal .form-card,
  body.ms-owner-portal .profile-card,
  body.ms-owner-portal .booking-card,
  body.ms-owner-portal .member-card,
  body.ms-owner-portal .package-card{
    padding:14px!important;
    border-radius:20px!important;
    margin-bottom:12px!important;
  }

  body.ms-owner-portal .panel h2,
  body.ms-owner-portal .card h2{
    font-size:17px!important;
    margin:0 0 10px!important;
  }

  body.ms-owner-portal .quick-actions{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:8px!important;
  }

  body.ms-owner-portal .action-group-title{
    grid-column:1 / -1!important;
    margin:8px 0 0!important;
    font-size:10px!important;
    letter-spacing:.06em!important;
  }

  body.ms-owner-portal .action-card{
    min-height:76px!important;
    padding:8px 5px!important;
    border-radius:17px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    text-align:center!important;
    overflow:hidden!important;
  }

  body.ms-owner-portal .action-card .icon{
    font-size:22px!important;
    line-height:1!important;
    margin:0!important;
  }

  body.ms-owner-portal .action-card h3{
    margin:0!important;
    font-size:10.5px!important;
    line-height:1.05!important;
    font-weight:900!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body.ms-owner-portal .action-card p{
    display:none!important;
  }

  body.ms-owner-portal .business-box,
  body.ms-owner-portal .mini-card{
    padding:12px!important;
    border-radius:17px!important;
  }

  body.ms-owner-portal .business-box p,
  body.ms-owner-portal .mini-card p{
    font-size:12px!important;
    line-height:1.35!important;
  }

  body.ms-owner-portal table.ms-responsive-table tr{
    border-radius:18px!important;
    margin-bottom:10px!important;
  }

  body.ms-owner-portal table.ms-responsive-table td{
    grid-template-columns:minmax(82px,34%) minmax(0,1fr)!important;
    padding:10px 12px!important;
    font-size:12.5px!important;
  }

  body.ms-owner-portal input,
  body.ms-owner-portal select,
  body.ms-owner-portal textarea{
    min-height:44px!important;
    font-size:16px!important;
    border-radius:14px!important;
  }
}

@media (max-width:380px){
  body.ms-owner-portal .quick-actions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  body.ms-owner-portal .top-actions .btn.ms-action-has-icon,
  body.ms-owner-portal .top-actions a.btn.ms-action-has-icon,
  body.ms-owner-portal .top-actions button.ms-action-has-icon{
    flex-basis:58px!important;
    width:58px!important;
    min-width:58px!important;
  }
  body.ms-owner-portal .stats>*,
  body.ms-owner-portal .stats-grid>*,
  body.ms-owner-portal .hero-stats>*{
    flex-basis:108px!important;
    min-width:108px!important;
  }
}

/* Owner portal requested: remove bottom sticky icon dock on mobile. */
@media (max-width:820px){
  body.ms-owner-portal.ms-mobile-shell-ready{padding-bottom:0!important;}
  body.ms-owner-portal.ms-mobile-shell-ready .ms-mobile-tabbar{display:none!important;visibility:hidden!important;pointer-events:none!important;}
}

/* ========================================================================
   Professional Portal UI — unified desktop, tablet and mobile experience
   ======================================================================== */
:root{
  --portal-sidebar-width:268px;
  --portal-sidebar-compact:84px;
  --portal-bg:#f6f7f9;
  --portal-surface:rgba(255,255,255,.96);
  --portal-surface-solid:#ffffff;
  --portal-text:#20242b;
  --portal-muted:#68707d;
  --portal-border:rgba(32,36,43,.10);
  --portal-border-strong:rgba(32,36,43,.16);
  --portal-primary:var(--ms-primary,#8f4f5b);
  --portal-primary-soft:color-mix(in srgb,var(--portal-primary) 10%,transparent);
  --portal-sidebar:var(--ms-sidebar,#232326);
  --portal-radius:18px;
  --portal-radius-lg:24px;
  --portal-shadow:0 12px 34px rgba(28,32,39,.07);
  --portal-shadow-hover:0 18px 42px rgba(28,32,39,.11);
}

html,body{background:var(--portal-bg)!important;color:var(--portal-text)!important;overflow-x:hidden!important;}
body{font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif!important;line-height:1.5;}
.layout,.app,.dashboard{display:block!important;min-height:100vh!important;width:100%!important;}

/* Desktop navigation */
.sidebar,.owner-sidebar{
  position:fixed!important;
  inset:0 auto 0 0!important;
  width:var(--portal-sidebar-width)!important;
  height:100dvh!important;
  max-height:100dvh!important;
  padding:20px 14px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  background:var(--portal-sidebar)!important;
  color:#fff!important;
  border:0!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;
  z-index:1100!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(255,255,255,.20) transparent!important;
}
.sidebar::-webkit-scrollbar,.owner-sidebar::-webkit-scrollbar{width:5px!important;}
.sidebar::-webkit-scrollbar-thumb,.owner-sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.20)!important;border-radius:99px!important;}

.sidebar .brand,.owner-sidebar .brand,.sidebar .logo{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:12px!important;
  flex:0 0 auto!important;
  width:100%!important;
  min-height:58px!important;
  margin:0 0 16px!important;
  padding:8px 10px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:#fff!important;
  font-size:20px!important;
  font-weight:800!important;
  white-space:normal!important;
}
.sidebar .brand-icon,.owner-sidebar .brand-icon{
  width:40px!important;height:40px!important;min-width:40px!important;
  border-radius:13px!important;background:rgba(255,255,255,.10)!important;
  border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important;
}
.sidebar .brand strong,.owner-sidebar .brand strong{font-size:15px!important;line-height:1.2!important;color:#fff!important;}
.sidebar .brand span,.owner-sidebar .brand span,.sidebar .member-name{font-size:11px!important;color:rgba(255,255,255,.58)!important;line-height:1.4!important;}
.sidebar .member-name{margin:0 10px 16px!important;padding:0 0 14px!important;border-bottom:1px solid rgba(255,255,255,.10)!important;}

.sidebar .menu,.owner-sidebar .menu{
  display:flex!important;flex-direction:column!important;gap:3px!important;
  width:100%!important;margin:0!important;padding:0!important;overflow:visible!important;
}
.sidebar .menu-label,.owner-sidebar .menu-label{
  display:block!important;margin:18px 10px 7px!important;padding:0!important;
  color:rgba(255,255,255,.42)!important;font-size:10px!important;font-weight:800!important;
  letter-spacing:.12em!important;text-transform:uppercase!important;
}
.sidebar a,.sidebar .menu a,.owner-sidebar a,.owner-sidebar .menu a{
  position:relative!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;
  gap:11px!important;width:100%!important;min-width:0!important;min-height:44px!important;height:auto!important;
  margin:0!important;padding:10px 12px!important;border:1px solid transparent!important;border-radius:12px!important;
  background:transparent!important;color:rgba(255,255,255,.72)!important;text-align:left!important;text-decoration:none!important;
  font-size:13px!important;font-weight:650!important;line-height:1.2!important;white-space:normal!important;box-shadow:none!important;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease!important;
}
.sidebar a:hover,.sidebar .menu a:hover,.owner-sidebar a:hover,.owner-sidebar .menu a:hover{
  background:rgba(255,255,255,.07)!important;color:#fff!important;border-color:rgba(255,255,255,.08)!important;transform:translateX(2px)!important;
}
.sidebar a.active,.sidebar .menu a.active,.owner-sidebar a.active,.owner-sidebar .menu a.active{
  background:rgba(255,255,255,.11)!important;color:#fff!important;border-color:rgba(255,255,255,.13)!important;
  box-shadow:inset 3px 0 0 var(--portal-primary)!important;
}
.ms-nav-icon{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:20px!important;height:20px!important;min-width:20px!important;color:currentColor!important;font-size:0!important;
  background:transparent!important;border:0!important;border-radius:0!important;
}
.ms-nav-icon svg,.ms-action-icon svg,.ms-mobile-tab-icon svg{width:100%!important;height:100%!important;display:block!important;stroke:currentColor!important;}
.ms-nav-text{display:block!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
.ms-notification-dot,.ms-mobile-count{
  margin-left:auto!important;min-width:20px!important;height:20px!important;padding:0 6px!important;border-radius:99px!important;
  background:var(--portal-primary)!important;color:#fff!important;font-size:10px!important;font-weight:800!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
}
.sidebar .ms-notify-widget,.owner-sidebar .ms-notify-widget{
  display:block!important;flex:0 0 auto!important;margin:4px 0 12px!important;padding:10px!important;
  border:1px solid rgba(255,255,255,.09)!important;border-radius:14px!important;background:rgba(255,255,255,.045)!important;
}

.main,.layout>.main,.app>.main,.dashboard>.main{
  margin-left:var(--portal-sidebar-width)!important;
  width:calc(100% - var(--portal-sidebar-width))!important;
  max-width:none!important;min-height:100vh!important;
  padding:clamp(20px,2.4vw,34px)!important;background:var(--portal-bg)!important;
}
.main>*{max-width:1560px;margin-left:auto;margin-right:auto;}

/* Page header */
.topbar{
  display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;justify-content:space-between!important;
  gap:18px!important;width:100%!important;max-width:1560px!important;overflow:visible!important;
  margin:0 auto 22px!important;padding:20px 22px!important;
  color:var(--portal-text)!important;background:var(--portal-surface)!important;
  border:1px solid var(--portal-border)!important;border-radius:var(--portal-radius-lg)!important;
  box-shadow:var(--portal-shadow)!important;backdrop-filter:blur(16px)!important;
}
.topbar>div:first-child{flex:1 1 360px!important;min-width:0!important;}
.topbar h1{margin:0!important;color:var(--portal-text)!important;font-size:clamp(24px,2.3vw,34px)!important;line-height:1.14!important;letter-spacing:-.035em!important;font-weight:800!important;}
.topbar p{max-width:720px!important;margin:6px 0 0!important;color:var(--portal-muted)!important;font-size:13px!important;line-height:1.55!important;}
.top-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;flex-wrap:wrap!important;gap:8px!important;width:auto!important;overflow:visible!important;}

/* Transparent professional buttons */
.btn,.btn-primary,.btn-outline,.btn-light,.btn-soft,.btn-danger,.action-btn,
button:not(.ms-mobile-menu-button):not(.ms-mobile-sheet-close),input[type="submit"],input[type="button"],input[type="reset"],.billing-option{
  appearance:none!important;-webkit-appearance:none!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  width:auto!important;min-width:0!important;min-height:40px!important;height:auto!important;
  padding:9px 14px!important;border:1px solid var(--portal-border-strong)!important;border-radius:11px!important;
  background:transparent!important;color:var(--portal-text)!important;box-shadow:none!important;
  font:inherit!important;font-size:12.5px!important;font-weight:750!important;line-height:1.2!important;text-decoration:none!important;
  cursor:pointer!important;white-space:nowrap!important;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease!important;
}
.btn:hover,.btn-primary:hover,.btn-outline:hover,.btn-light:hover,.btn-soft:hover,.action-btn:hover,
button:not(.ms-mobile-menu-button):not(.ms-mobile-sheet-close):hover,input[type="submit"]:hover,input[type="button"]:hover,.billing-option:hover{
  background:var(--portal-primary-soft)!important;border-color:color-mix(in srgb,var(--portal-primary) 38%,var(--portal-border-strong))!important;
  color:var(--portal-primary)!important;transform:translateY(-1px)!important;
}
.btn-primary{border-color:color-mix(in srgb,var(--portal-primary) 45%,transparent)!important;color:var(--portal-primary)!important;background:var(--portal-primary-soft)!important;}
.btn-danger{color:#b4232d!important;border-color:rgba(180,35,45,.24)!important;background:rgba(180,35,45,.035)!important;}
.btn-danger:hover{background:rgba(180,35,45,.08)!important;border-color:rgba(180,35,45,.34)!important;color:#971a23!important;}
.ms-action-icon{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:17px!important;height:17px!important;min-width:17px!important;padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;color:currentColor!important;font-size:0!important;
}

/* Content surfaces */
.panel,.card,.mini-card,.feature-card,.portal-card,.price-card,.tier-card,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card,.business-box,.stat-card,.stat{
  background:var(--portal-surface-solid)!important;border:1px solid var(--portal-border)!important;
  box-shadow:var(--portal-shadow)!important;color:var(--portal-text)!important;
}
.panel,.card,.feature-card,.portal-card,.price-card,.tier-card,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card{
  border-radius:var(--portal-radius-lg)!important;padding:22px!important;margin-bottom:20px!important;
}
.mini-card,.business-box{border-radius:var(--portal-radius)!important;padding:16px!important;}
.panel h2,.card h2{margin:0 0 16px!important;color:var(--portal-text)!important;font-size:19px!important;letter-spacing:-.02em!important;}
.panel h3,.card h3,.mini-card h3{color:var(--portal-text)!important;}
.muted,.panel p,.card p,.mini-card p{color:var(--portal-muted);}

.stats,.stats-grid,.hero-stats,.metric-grid,.kpi-grid,.summary-grid{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;
  width:100%!important;margin:0 auto 20px!important;padding:0!important;overflow:visible!important;
}
.stats>*,.stats-grid>*,.hero-stats>*,.metric-grid>*,.kpi-grid>*,.summary-grid>*{min-width:0!important;width:auto!important;flex:auto!important;}
.stat-card,.stat{min-height:118px!important;border-radius:20px!important;padding:18px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;}
.stat-card span,.stat span{color:var(--portal-muted)!important;font-size:11px!important;font-weight:750!important;letter-spacing:.055em!important;text-transform:uppercase!important;}
.stat-card strong,.stat strong{margin-top:10px!important;color:var(--portal-primary)!important;font-size:clamp(25px,2.2vw,34px)!important;line-height:1!important;letter-spacing:-.04em!important;}
.grid{grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr)!important;gap:20px!important;}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important;}
.form-grid,.form-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;}

/* Forms */
label{color:var(--portal-text)!important;font-size:12.5px!important;font-weight:750!important;}
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]),select,textarea{
  width:100%!important;min-height:44px!important;padding:10px 12px!important;
  border:1px solid var(--portal-border-strong)!important;border-radius:11px!important;
  background:#fff!important;color:var(--portal-text)!important;box-shadow:none!important;outline:none!important;
  font:inherit!important;font-size:14px!important;transition:border-color .18s ease,box-shadow .18s ease!important;
}
input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--portal-primary) 60%,transparent)!important;box-shadow:0 0 0 3px var(--portal-primary-soft)!important;}

/* Tables */
.table-wrap{width:100%!important;overflow:auto!important;border:1px solid var(--portal-border)!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important;}
table.ms-responsive-table,table{width:100%!important;min-width:680px!important;border-collapse:separate!important;border-spacing:0!important;background:#fff!important;}
thead th,th{position:sticky;top:0;z-index:1;background:#f8f9fb!important;color:var(--portal-muted)!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:.07em!important;text-transform:uppercase!important;}
th,td{padding:13px 14px!important;border-bottom:1px solid var(--portal-border)!important;vertical-align:middle!important;}
tbody tr:last-child td{border-bottom:0!important;}
tbody tr:hover td{background:rgba(32,36,43,.018)!important;}
.badge{border:1px solid currentColor!important;background:transparent!important;padding:5px 9px!important;font-size:11px!important;font-weight:750!important;}

/* Mobile generated shell */
.ms-mobile-appbar{
  display:none!important;position:sticky!important;top:0!important;z-index:1200!important;
  align-items:center!important;justify-content:space-between!important;gap:12px!important;
  width:100%!important;min-height:64px!important;padding:10px 14px!important;
  background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--portal-border)!important;
  color:var(--portal-text)!important;backdrop-filter:blur(18px)!important;box-shadow:0 8px 22px rgba(28,32,39,.055)!important;
  overflow:visible!important;
}
.ms-mobile-brand{display:block!important;color:var(--portal-muted)!important;font-size:10px!important;font-weight:800!important;letter-spacing:.08em!important;text-transform:uppercase!important;}
.ms-mobile-title{display:block!important;color:var(--portal-text)!important;font-size:16px!important;line-height:1.2!important;}
.ms-mobile-menu-button{
  width:42px!important;height:42px!important;min-width:42px!important;padding:0!important;
  border:1px solid var(--portal-border)!important;border-radius:12px!important;background:transparent!important;color:var(--portal-text)!important;
  display:inline-flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;
}
.ms-mobile-menu-button span{display:block!important;width:17px!important;height:1.5px!important;border-radius:2px!important;background:currentColor!important;}
.ms-mobile-tabbar{background:rgba(255,255,255,.95)!important;border-top:1px solid var(--portal-border)!important;box-shadow:0 -10px 26px rgba(28,32,39,.07)!important;backdrop-filter:blur(18px)!important;}
.ms-mobile-tabbar-inner{gap:4px!important;}
.ms-mobile-tab{
  min-height:54px!important;border:0!important;border-radius:12px!important;background:transparent!important;color:var(--portal-muted)!important;
}
.ms-mobile-tab.active{background:var(--portal-primary-soft)!important;color:var(--portal-primary)!important;box-shadow:none!important;}
.ms-mobile-tab-icon{width:20px!important;height:20px!important;font-size:0!important;}
.ms-mobile-tab-label{font-size:9.5px!important;font-weight:750!important;}
.ms-mobile-sheet-panel{background:#fff!important;color:var(--portal-text)!important;border-radius:24px 24px 0 0!important;box-shadow:0 -28px 70px rgba(22,25,30,.18)!important;}
.ms-mobile-sheet-link{background:transparent!important;border:1px solid var(--portal-border)!important;color:var(--portal-text)!important;border-radius:14px!important;}
.ms-mobile-sheet-link.active{background:var(--portal-primary-soft)!important;border-color:color-mix(in srgb,var(--portal-primary) 30%,transparent)!important;color:var(--portal-primary)!important;}
.ms-mobile-sheet-close{background:transparent!important;border:1px solid var(--portal-border)!important;color:var(--portal-text)!important;}

/* Tablet: compact icon rail */
@media (min-width:768px) and (max-width:1199px){
  .sidebar,.owner-sidebar{
    width:var(--portal-sidebar-compact)!important;padding:14px 10px!important;align-items:center!important;
  }
  .sidebar .brand,.owner-sidebar .brand,.sidebar .logo{justify-content:center!important;padding:6px!important;min-height:50px!important;margin-bottom:12px!important;font-size:0!important;}
  .sidebar .brand>div:not(.brand-icon),.owner-sidebar .brand>div:not(.brand-icon),.sidebar .member-name,.sidebar .menu-label,.owner-sidebar .menu-label,.sidebar .ms-notify-widget,.owner-sidebar .ms-notify-widget{display:none!important;}
  .sidebar .menu,.owner-sidebar .menu{gap:5px!important;align-items:center!important;}
  .sidebar a,.sidebar .menu a,.owner-sidebar a,.owner-sidebar .menu a{
    width:52px!important;min-width:52px!important;height:48px!important;min-height:48px!important;padding:0!important;justify-content:center!important;border-radius:13px!important;
  }
  .sidebar a:hover,.sidebar .menu a:hover,.owner-sidebar a:hover,.owner-sidebar .menu a:hover{transform:none!important;}
  .sidebar a.active,.sidebar .menu a.active,.owner-sidebar a.active,.owner-sidebar .menu a.active{box-shadow:inset 0 -3px 0 var(--portal-primary)!important;}
  .ms-nav-icon{width:21px!important;height:21px!important;min-width:21px!important;}
  .ms-nav-text{display:none!important;}
  .ms-notification-dot{position:absolute!important;right:3px!important;top:3px!important;min-width:17px!important;height:17px!important;padding:0 4px!important;font-size:8px!important;}
  .main,.layout>.main,.app>.main,.dashboard>.main{margin-left:var(--portal-sidebar-compact)!important;width:calc(100% - var(--portal-sidebar-compact))!important;padding:22px!important;}
  .stats,.stats-grid,.hero-stats,.metric-grid,.kpi-grid,.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .grid,.grid-2{grid-template-columns:1fr!important;}
}

/* Mobile */
@media (max-width:767px){
  body.ms-mobile-shell-ready{padding-top:0!important;padding-bottom:78px!important;}
  body.ms-owner-portal.ms-mobile-shell-ready{padding-bottom:0!important;}
  .sidebar,.owner-sidebar{display:none!important;}
  .ms-mobile-appbar{display:flex!important;}
  .main,.layout>.main,.app>.main,.dashboard>.main{
    margin-left:0!important;width:100%!important;padding:13px!important;min-height:calc(100vh - 64px)!important;
  }
  .topbar{
    display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;
    gap:12px!important;margin-bottom:14px!important;padding:16px!important;border-radius:18px!important;overflow:visible!important;
  }
  .topbar>div:first-child{flex:auto!important;width:100%!important;}
  .topbar h1{font-size:22px!important;}
  .topbar p{font-size:12px!important;line-height:1.45!important;}
  .top-actions{
    width:100%!important;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;justify-content:flex-start!important;
    gap:7px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:1px 0 4px!important;scrollbar-width:none!important;
  }
  .top-actions::-webkit-scrollbar{display:none!important;}
  .top-actions .btn,.top-actions button,.top-actions a{flex:0 0 auto!important;width:auto!important;min-height:38px!important;padding:8px 11px!important;font-size:11.5px!important;}
  .stats,.stats-grid,.hero-stats,.metric-grid,.kpi-grid,.summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin-bottom:14px!important;overflow:visible!important;
  }
  .stat-card,.stat{min-height:94px!important;padding:13px!important;border-radius:16px!important;}
  .stat-card span,.stat span{font-size:9.5px!important;line-height:1.25!important;}
  .stat-card strong,.stat strong{font-size:23px!important;}
  .grid,.grid-2,.form-grid,.form-row,.business-fields,.booking-info,.row,.filter-form,.status-form,.feature-grid,.tier-grid,.pricing-grid,.portal-grid,.features-grid,.preview-cards,.quick-actions{
    grid-template-columns:1fr!important;gap:11px!important;
  }
  .panel,.card,.feature-card,.portal-card,.price-card,.tier-card,.booking-card,.item-card,.member-card,.package-card,.profile-card,.profile-box,.form-card{
    padding:15px!important;border-radius:18px!important;margin-bottom:13px!important;
  }
  .panel h2,.card h2{font-size:17px!important;margin-bottom:12px!important;}
  .btn,.btn-primary,.btn-outline,.btn-light,.btn-soft,.btn-danger,.action-btn,button:not(.ms-mobile-menu-button):not(.ms-mobile-sheet-close),input[type="submit"],input[type="button"],input[type="reset"],.billing-option{
    width:auto!important;min-height:40px!important;padding:9px 12px!important;font-size:12px!important;
  }
  form>.btn:last-child,form>button[type="submit"]:last-child,.form-actions .btn,.form-actions button{width:100%!important;}
  .table-wrap{border:0!important;background:transparent!important;overflow:visible!important;}
  table.ms-responsive-table{display:block!important;min-width:0!important;background:transparent!important;}
  table.ms-responsive-table thead{display:none!important;}
  table.ms-responsive-table tbody{display:block!important;}
  table.ms-responsive-table tr{
    display:block!important;margin:0 0 10px!important;border:1px solid var(--portal-border)!important;border-radius:16px!important;
    background:#fff!important;box-shadow:0 8px 24px rgba(28,32,39,.055)!important;overflow:hidden!important;
  }
  table.ms-responsive-table td{
    display:grid!important;grid-template-columns:minmax(92px,35%) minmax(0,1fr)!important;gap:9px!important;align-items:start!important;
    width:100%!important;padding:10px 12px!important;border:0!important;border-bottom:1px solid var(--portal-border)!important;
    background:#fff!important;text-align:right!important;font-size:12.5px!important;word-break:break-word!important;
  }
  table.ms-responsive-table td:last-child{border-bottom:0!important;}
  table.ms-responsive-table td::before{content:attr(data-label)!important;text-align:left!important;color:var(--portal-muted)!important;font-size:9.5px!important;font-weight:800!important;letter-spacing:.055em!important;text-transform:uppercase!important;}
  table.ms-responsive-table td .btn,table.ms-responsive-table td button,table.ms-responsive-table td .action-btn{width:100%!important;}
}

@media (max-width:420px){
  .stats,.stats-grid,.hero-stats,.metric-grid,.kpi-grid,.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  table.ms-responsive-table td{grid-template-columns:1fr!important;text-align:left!important;gap:4px!important;}
  .ms-mobile-sheet-links{grid-template-columns:1fr!important;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important;}
}

/* Final mobile conflict resolution for the owner workspace. */
@media (max-width:767px){
  body.ms-owner-portal.ms-mobile-shell-ready{padding-top:0!important;padding-bottom:0!important;}
  body.ms-owner-portal .top-actions .btn.ms-action-has-icon,
  body.ms-owner-portal .top-actions a.btn.ms-action-has-icon,
  body.ms-owner-portal .top-actions button.ms-action-has-icon{
    flex:0 0 auto!important;width:auto!important;min-width:0!important;max-width:none!important;
    height:auto!important;min-height:38px!important;padding:8px 11px!important;border-radius:11px!important;
    display:inline-flex!important;flex-direction:row!important;gap:7px!important;font-size:11.5px!important;white-space:nowrap!important;
  }
  body.ms-owner-portal .top-actions .btn.ms-action-has-icon .ms-action-icon,
  body.ms-owner-portal .top-actions button.ms-action-has-icon .ms-action-icon{
    width:16px!important;height:16px!important;min-width:16px!important;border-radius:0!important;
  }
  body.ms-owner-portal .top-actions .btn.ms-action-has-icon::after,
  body.ms-owner-portal .top-actions button.ms-action-has-icon::after{display:none!important;content:none!important;}
}


/* Compact mobile package lists */
.ms-package-mobile-toggle{display:none;}
@media (max-width:767px){
  table.ms-package-compact-table tr[data-ms-package-row]{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    padding:0!important;
    cursor:pointer!important;
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row]:active{transform:scale(.995)!important;}
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded{
    border-color:rgba(143,79,91,.30)!important;
    box-shadow:0 18px 40px rgba(69,43,51,.12)!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-name{
    grid-column:1/-1!important;
    display:block!important;
    min-width:0!important;
    padding:15px 54px 7px 14px!important;
    border:0!important;
    text-align:left!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-name::before{display:none!important;}
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-name strong{
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:14px!important;
    line-height:1.3!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row]:not(.ms-package-expanded) td.ms-package-name>br,
  table.ms-package-compact-table tr[data-ms-package-row]:not(.ms-package-expanded) td.ms-package-name>small,
  table.ms-package-compact-table tr[data-ms-package-row]:not(.ms-package-expanded) td.ms-package-name>.muted{
    display:none!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-sessions,
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-price{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
    gap:6px!important;
    padding:5px 14px 14px!important;
    border:0!important;
    text-align:left!important;
    white-space:nowrap!important;
    font-size:13px!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-sessions{grid-column:1!important;}
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-price{
    grid-column:2!important;
    justify-content:end!important;
    text-align:right!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-sessions::before,
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-price::before{
    display:inline!important;
    width:auto!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:.05em!important;
    color:var(--ms-premium-muted)!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row]:not(.ms-package-expanded) td.ms-package-price>br,
  table.ms-package-compact-table tr[data-ms-package-row]:not(.ms-package-expanded) td.ms-package-price>small,
  table.ms-package-compact-table tr[data-ms-package-row]:not(.ms-package-expanded) td.ms-package-price>.muted{
    display:none!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row] td.ms-package-detail{
    display:none!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-detail{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:minmax(92px,34%) minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
    padding:11px 14px!important;
    border:0!important;
    border-top:1px solid var(--ms-premium-border)!important;
    text-align:right!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-detail::before{
    display:block!important;
    text-align:left!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-name>br,
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-price>br{
    display:block!important;
  }
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-name>small,
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-name>.muted,
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-price>small,
  table.ms-package-compact-table tr[data-ms-package-row].ms-package-expanded td.ms-package-price>.muted{
    display:inline!important;
  }
  .ms-package-mobile-toggle{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
    z-index:2!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid var(--ms-premium-border)!important;
    border-radius:12px!important;
    background:transparent!important;
    color:var(--ms-premium-primary)!important;
    box-shadow:none!important;
  }
  .ms-package-mobile-toggle::before,
  .ms-package-mobile-toggle::after{
    content:"";
    position:absolute;
    width:8px;
    height:1.5px;
    border-radius:999px;
    background:currentColor;
    transition:transform .18s ease;
  }
  .ms-package-mobile-toggle::before{transform:translateX(-2.5px) rotate(45deg);}
  .ms-package-mobile-toggle::after{transform:translateX(2.5px) rotate(-45deg);}
  tr.ms-package-expanded .ms-package-mobile-toggle::before{transform:translateX(-2.5px) rotate(-45deg);}
  tr.ms-package-expanded .ms-package-mobile-toggle::after{transform:translateX(2.5px) rotate(45deg);}
  .ms-package-mobile-toggle-label{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
}


/* Single mobile navigation control
   Keep only the top-right menu button and remove duplicate mobile navigation icons. */
@media (max-width:820px){
  .ms-mobile-tabbar,
  .mobile-bottom-nav,
  .bottom-navigation,
  .mobile-footer-nav,
  .app-bottom-nav,
  .floating-bottom-nav,
  .bottom-menu,
  .mobile-tabbar,
  .mobile-tabs,
  .tabbar,
  .tab-bar,
  [data-bottom-nav],
  [data-mobile-bottom-nav]{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  body.ms-mobile-shell-ready{
    padding-bottom:0!important;
  }

  .ms-mobile-menu-button{
    display:inline-flex!important;
    visibility:visible!important;
  }
}

/* Mobile app bar is intentionally brand-only; the page H1 remains in content. */
/* Mobile title de-duplication: the app bar shows only the portal brand. */
@media (max-width:767px){
  .ms-mobile-appbar.ms-mobile-appbar-brand-only .ms-mobile-appbar-copy{
    justify-content:center!important;
    gap:0!important;
  }
  .ms-mobile-appbar.ms-mobile-appbar-brand-only .ms-mobile-brand{
    max-width:calc(100vw - 82px)!important;
    color:var(--portal-text,var(--ms-premium-text,#2b2b2b))!important;
    font-size:15px!important;
    line-height:1.2!important;
    letter-spacing:-.01em!important;
    text-transform:none!important;
  }
}