/* ===== BLUEFLOW System-wide Responsive Layer v1.0 ===== */
html,body{max-width:100%;overflow-x:hidden}.app,.main,.content,#view{min-width:0;max-width:100%}.table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.card{min-width:0}.mobile-menu-btn,.mobile-nav-backdrop{display:none}

/* Tablet */
@media(max-width:1200px){
  .content{padding:22px!important}
  .dash-hero,.page-hero{gap:20px!important}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .prodgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid2{grid-template-columns:1fr!important}
  .pos{grid-template-columns:minmax(0,1fr) 330px!important}
  .reward-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .segment-smart-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Mobile application shell */
@media(max-width:900px){
  :root{--bf-appbar-h:68px}
  body.mobile-nav-open{overflow:hidden!important}
  .app{display:block!important;width:100%!important;min-height:calc(100dvh - var(--bf-topbar-h,36px))!important}
  .main{width:100%!important;max-width:100%!important;margin:0!important}
  .side{display:flex!important;flex-direction:column!important;position:fixed!important;left:0!important;top:var(--bf-topbar-h,36px)!important;width:min(84vw,304px)!important;height:calc(100dvh - var(--bf-topbar-h,36px))!important;padding:18px 14px 20px!important;overflow-y:auto!important;overscroll-behavior:contain;z-index:2600!important;transform:translateX(-105%);transition:transform .22s ease,box-shadow .22s ease;box-shadow:none!important;border-right:1px solid var(--bd)!important}
  body.mobile-nav-open .side{transform:translateX(0);box-shadow:22px 0 60px rgba(9,35,58,.24)!important}
  .side .brand{flex:0 0 auto}.side .biz{flex:0 0 auto}.side .nav{flex:0 0 auto;min-height:46px;display:flex;align-items:center;gap:10px;font-size:13px}
  .side .settings-launch{margin-top:auto!important}
  .mobile-nav-backdrop{display:block;position:fixed;inset:var(--bf-topbar-h,36px) 0 0 0;background:rgba(10,27,44,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:2500;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
  body.mobile-nav-open .mobile-nav-backdrop{opacity:1;visibility:visible}
  .mobile-menu-btn{display:grid!important;place-items:center;flex:0 0 42px;width:42px;height:42px;border:1px solid #cfe1ef;border-radius:13px;background:#f7fbff;color:#0879dc;font-size:20px;line-height:1;cursor:pointer;padding:0;box-shadow:0 5px 14px rgba(23,52,82,.06)}
  .bar{width:100%!important;max-width:100%!important;height:var(--bf-appbar-h)!important;padding:0 14px!important;gap:10px!important;overflow:hidden}
  .bar-left{flex:1 1 auto!important;min-width:0!important;max-width:none!important}
  .bar-eyebrow,.bar-context,.bar-page-chip,.bar-shop{display:none!important}
  .bar-title-line{min-width:0!important;max-width:100%!important}
  .bar h2{font-size:18px!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
  .bar .right{flex:0 0 auto!important;min-width:0!important;gap:6px!important;margin-left:0!important}
  .bar #logoutBtn{display:none!important}
  .bar #quickTx{width:44px!important;min-width:44px!important;height:42px!important;padding:0!important;font-size:0!important;border-radius:13px!important}
  .bar #quickTx:after{content:"+";font-size:22px;font-weight:700;line-height:1}
  #themeToggle.app-mode{position:static!important;inset:auto!important;width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;border-radius:13px!important;display:grid!important;place-items:center!important}
  #themeToggle.app-mode .theme-toggle-label{display:none!important}
  #themeToggle.app-mode .theme-toggle-icon{margin:0!important;font-size:18px!important}
  .content{width:100%!important;max-width:100%!important;margin:0!important;padding:18px 16px 28px!important;overflow-x:hidden!important}
  .summary{position:static!important;top:auto!important}

  /* Shared page heroes */
  .dash-hero,.page-hero{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:18px!important;padding:24px 20px!important;border-radius:24px!important;min-height:0!important;width:100%!important;overflow:hidden!important}
  .dash-hero-copy,.page-copy{width:100%!important;max-width:100%!important;min-width:0!important}
  .dash-hero h1,.page-hero h1,.page-copy h1{font-size:clamp(26px,7vw,34px)!important;line-height:1.18!important;letter-spacing:-.6px!important;margin-top:10px!important;overflow-wrap:anywhere}
  .dash-hero p,.page-hero p,.page-copy p{font-size:13.5px!important;line-height:1.7!important;max-width:100%!important}
  .dash-actions,.page-actions,.segment-hero-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:10px!important;align-items:stretch!important}
  .dash-actions .btn,.page-actions .btn,.segment-hero-actions .btn{width:100%!important;min-width:0!important;height:46px!important;padding:0 12px!important;white-space:normal!important}
  .page-kicker,.dash-kicker{max-width:100%!important;white-space:normal!important}

  /* Dashboard */
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;width:100%!important}
  .kpi{padding:16px!important;min-width:0!important;overflow:hidden!important}
  .kpi small,.kpi-meta{font-size:11.5px!important;line-height:1.45!important;overflow-wrap:break-word!important}
  .kpi b{font-size:27px!important;line-height:1.1!important;overflow-wrap:anywhere!important}
  .grid2{grid-template-columns:1fr!important;gap:12px!important}
  .panel{min-width:0!important;padding:16px!important}
  .activity-row,.setup-item{min-width:0!important;gap:10px!important}.activity-info,.setup-text{min-width:0!important}

  /* Customers / product catalog */
  .stats-row{display:flex!important;flex-wrap:wrap!important;gap:8px!important;max-width:100%!important}
  .stat-chip{flex:1 1 145px!important;min-width:0!important;white-space:normal!important}
  .table-card{width:100%!important;overflow:hidden!important}
  .table-card .table-wrap{width:100%!important;overflow-x:auto!important}
  .wallet-table{min-width:720px!important}
  .prodgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .prod{min-width:0!important;overflow:hidden!important}.prod b,.prod .muted{overflow-wrap:anywhere}

  /* POS Light */
  .pos{grid-template-columns:1fr!important;width:100%!important;gap:14px!important}
  .pos-main,.summary{width:100%!important;min-width:0!important;padding:18px!important}
  .pos-selects{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;align-items:start!important}
  .pos-selects>div{width:100%!important;min-width:0!important}
  .product-line{gap:12px!important;align-items:center!important}.product-line>div:first-child{min-width:0!important;flex:1 1 auto!important}.product-line b,.product-line .muted{overflow-wrap:anywhere!important}
  .qty{flex:0 0 auto!important}.qbtn{width:36px!important;height:36px!important}
  .sumrow{gap:12px!important}.sumrow>*{min-width:0!important}.sumrow span:first-child{overflow-wrap:anywhere!important}
  .pos-reward-option{min-width:0!important}.pos-reward-option>div{min-width:0!important}.pos-reward-option b,.pos-reward-option small{overflow-wrap:anywhere!important}
  .pos-empty-guide{grid-template-columns:1fr!important}

  /* Loyalty / Rewards */
  .current-rules-head{flex-direction:column!important;align-items:stretch!important}.rule-actions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important}.rule-actions .btn{width:100%!important}
  .current-rule-grid{grid-template-columns:1fr!important}.history-row{grid-template-columns:1fr!important}
  .reward-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .reward-grid{grid-template-columns:1fr!important}.reward-card{padding:17px!important}
  .reward-actions{display:grid!important;grid-template-columns:1fr 1fr!important}.reward-actions .btn{width:100%!important}
  .redemption-history{max-width:100%!important;overflow:hidden!important}.redemption-history .table-wrap{overflow-x:auto!important}.redemption-history .table{min-width:680px!important}

  /* Segmentation */
  .segment-section-head{align-items:flex-start!important;flex-direction:column!important;gap:10px!important}.segment-smart-grid{grid-template-columns:1fr!important}.segment-card{padding:16px!important}
  .segment-rule-row{grid-template-columns:1fr!important;gap:9px!important}.segment-rule-remove{width:100%!important;height:42px!important}.segment-product-row{grid-template-columns:1fr!important}
  .segment-results{max-width:100%!important;overflow:hidden!important}.segment-results .table-wrap{overflow-x:auto!important}.segment-results .table{min-width:760px!important}
  .smart-list-note{padding:12px!important}

  /* Customer 360 */
  .customer-profile{width:100%!important;min-width:0!important}.customer-profile-hero{padding:20px!important;border-radius:23px!important}
  .customer-profile-top{flex-direction:column!important;gap:16px!important}.customer-identity{align-items:flex-start!important;width:100%!important}.customer-identity>div:last-child{min-width:0!important}
  .customer-identity h1{font-size:25px!important;overflow-wrap:anywhere}.customer-profile-actions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important}.customer-profile-actions .btn{width:100%!important}
  .customer-profile-meta{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}.profile-meta-item{min-width:0!important}
  .customer-profile-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.cp-kpi{padding:16px!important}.cp-kpi b{font-size:25px!important}
  .customer-tabs{width:100%!important;max-width:100%!important;overflow-x:auto!important;display:flex!important;flex-wrap:nowrap!important;scrollbar-width:none}.customer-tabs::-webkit-scrollbar{display:none}.customer-tab{flex:0 0 auto!important}
  .customer-grid,.customer-notes-layout{grid-template-columns:1fr!important}.customer-panel,.note-compose,.note-list{padding:18px!important}
  .customer-detail-grid,.wallet-feature,.customer-reward-grid{grid-template-columns:1fr!important}.customer-history-card .table-wrap{overflow-x:auto!important}.customer-history-card .table{min-width:780px!important}
  .profile-activity-row{grid-template-columns:38px minmax(0,1fr) auto!important}.customer-ledger-row{grid-template-columns:40px minmax(0,1fr) auto!important}

  /* Global modal */
  .modalbg{padding:8px!important;align-items:flex-end!important}.modal{width:100%!important;max-width:100%!important;max-height:calc(100dvh - 16px)!important;border-radius:24px 24px 18px 18px!important;padding:20px 16px calc(20px + env(safe-area-inset-bottom))!important;overscroll-behavior:contain}
  .modal .form2{grid-template-columns:1fr!important}

  /* Settings window */
  .settings-overlay{padding:8px!important;align-items:center!important}.settings-window{width:100%!important;max-width:100%!important;height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important;border-radius:22px!important;overflow:hidden!important}
  .settings-head{padding:16px!important;gap:11px!important}.settings-head-icon{width:42px!important;height:42px!important;flex:0 0 42px!important}.settings-head-copy h2{font-size:19px!important}.settings-head-copy p{font-size:11px!important;line-height:1.45!important}.settings-close{width:40px!important;height:40px!important;flex:0 0 40px!important}
  .settings-body{display:flex!important;flex-direction:column!important;min-height:0!important;overflow:hidden!important}
  .settings-nav{width:100%!important;max-width:100%!important;flex:0 0 auto!important;display:flex!important;gap:6px!important;overflow-x:auto!important;padding:9px 12px!important;border-right:0!important;border-bottom:1px solid #dce8f5!important;scrollbar-width:none}.settings-nav::-webkit-scrollbar{display:none}.settings-nav-label{display:none!important}.settings-nav-btn{flex:0 0 auto!important;width:auto!important;min-width:max-content!important;margin:0!important;padding:9px 11px!important;white-space:nowrap!important}
  .settings-pane{width:100%!important;min-width:0!important;overflow-y:auto!important;padding:18px 16px calc(24px + env(safe-area-inset-bottom))!important}.settings-pane-head{flex-direction:column!important;align-items:flex-start!important;gap:8px!important}.settings-grid2,.settings-summary-grid,.settings-settings-grid,.theme-choice-grid,.import-settings-cards{grid-template-columns:1fr!important}.settings-card{padding:16px!important}.settings-link-card{align-items:flex-start!important;flex-wrap:wrap!important}.settings-link-card .btn{width:100%!important;margin-top:6px!important}.branch-row{grid-template-columns:1fr auto!important;gap:8px!important}.branch-row .settings-mini-btn{grid-column:1/-1!important;width:100%!important}

  /* Import Center */
  .import-overlay{padding:8px!important;place-items:center!important}.import-window{width:100%!important;max-width:100%!important;height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important;border-radius:22px!important}
  .import-head{padding:16px!important;gap:11px!important}.import-head-icon{width:42px!important;height:42px!important;flex:0 0 42px!important}.import-head-copy h2{font-size:20px!important}.import-head-copy p{font-size:11px!important;line-height:1.45!important}.import-close{width:40px!important;height:40px!important;flex:0 0 40px!important}
  .import-steps{padding:10px 14px!important;gap:5px!important}.import-step{justify-content:center!important}.import-step span{display:none!important}
  .import-body{padding:18px 14px calc(22px + env(safe-area-inset-bottom))!important}.import-section-head{flex-direction:column!important;align-items:stretch!important;gap:10px!important}.import-template-btn{max-width:100%!important;width:100%!important;white-space:normal!important;height:auto!important;min-height:42px!important;padding:9px 12px!important;overflow-wrap:anywhere!important}
  .import-type-switch,.import-preview-summary,.import-duplicate-options,.import-settings-cards{grid-template-columns:1fr!important}.import-map-row{grid-template-columns:1fr!important}.import-map-arrow{display:none!important}.import-table-wrap{max-width:100%!important;overflow-x:auto!important}.import-table{min-width:720px!important}
  .import-actions{position:sticky!important;bottom:-1px!important;z-index:5!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:9px!important;margin:18px -14px -22px!important;padding:14px 14px calc(14px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.97)!important;border-top:1px solid #dce8f5!important;backdrop-filter:blur(14px)}
  .import-actions>.btn{width:100%!important}.import-actions-right{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;gap:8px!important}.import-actions-right>*{width:100%!important;min-width:0!important;white-space:normal!important}
  .import-history-row{grid-template-columns:1fr 1fr!important}.import-history-main{grid-column:1/-1!important}

  /* Prevent long text from creating page overflow */
  .page-hero *,.dash-hero *,.card *,.settings-window *,.import-window *{max-width:100%}
  .customer-name,.member-result-main,.bar-left,.page-copy,.dash-hero-copy{min-width:0!important}
}

/* Small phones */
@media(max-width:520px){
  .top-inner{padding:0 8px!important;font-size:9.5px!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.top-inner>span:first-child{overflow:hidden;text-overflow:ellipsis}
  .bar{padding:0 10px!important;gap:7px!important}.mobile-menu-btn,#themeToggle.app-mode,.bar #quickTx{width:40px!important;min-width:40px!important;height:40px!important}.bar h2{font-size:16px!important}
  .content{padding:14px 12px 24px!important}.dash-hero,.page-hero{padding:20px 16px!important;border-radius:21px!important}.dash-hero h1,.page-hero h1,.page-copy h1{font-size:27px!important}
  .dash-actions,.page-actions,.segment-hero-actions{grid-template-columns:1fr!important}.kpis,.reward-kpis,.customer-profile-kpis{grid-template-columns:1fr!important}.prodgrid{grid-template-columns:1fr!important}
  .customer-profile-meta{grid-template-columns:1fr 1fr!important}.customer-profile-actions{grid-template-columns:1fr!important}.customer-identity{gap:11px!important}.customer-avatar-lg{width:52px!important;height:52px!important;flex-basis:52px!important;border-radius:16px!important}.customer-identity h1{font-size:22px!important}.customer-code-line{font-size:12px!important}
  .profile-activity-row{grid-template-columns:34px minmax(0,1fr)!important}.profile-activity-row .pa-value{grid-column:2!important;justify-self:start!important}.customer-ledger-row{grid-template-columns:36px minmax(0,1fr)!important}.cl-delta{grid-column:2!important;text-align:left!important}
  .reward-actions,.rule-actions{grid-template-columns:1fr!important}
  .import-actions-right{grid-template-columns:1fr!important}.import-preview-summary{grid-template-columns:1fr 1fr!important}.import-result-grid{grid-template-columns:1fr 1fr!important}.import-result-grid>*:last-child{grid-column:1/-1!important}
}

/* Auth / onboarding mobile */
@media(max-width:900px){
  .auth{min-height:calc(100dvh - var(--bf-topbar-h,36px))!important;display:grid!important;grid-template-columns:1fr!important;background:linear-gradient(145deg,#edf8ff,#f8fbff)!important;overflow-y:auto!important}.hero{display:none!important}.wrap{width:100%!important;padding:22px 16px 34px!important;place-items:center!important}.authcard{width:min(100%,500px)!important;padding:26px 22px!important;border-radius:25px!important}.auth-head{gap:12px!important}.auth-note{display:none!important}.signup-grid{grid-template-columns:1fr!important}.onboard{padding:16px!important}.oncard{padding:24px 20px!important;border-radius:24px!important}
  #themeToggle.auth-mode{top:calc(var(--bf-topbar-h,36px) + 10px)!important;right:10px!important;max-width:132px!important}
}

/* Dark mode surfaces added by this responsive layer */
@media(max-width:900px){
  html[data-theme="dark"] .mobile-menu-btn{background:#132235;border-color:#2d465c;color:#8bd0ff}
  html[data-theme="dark"] .mobile-nav-backdrop{background:rgba(1,9,17,.62)}
  html[data-theme="dark"] .side{background:#0f1a28!important;border-color:#283d51!important}
  html[data-theme="dark"] .settings-nav{border-color:#293f54!important}
  html[data-theme="dark"] .import-actions{background:rgba(15,26,40,.97)!important;border-color:#293f54!important}
}