/* CLENA BEAUTY PRO | MOBILE DESIGN SYSTEM | 2026-10-15
   Visual-only stylesheet. Existing IDs, Supabase actions and desktop rules stay intact.
   Loaded after the legacy style blocks to provide a single authoritative mobile surface. */

.clena-mobile-sidebar-quick{display:none}
@media (min-width:761px) and (max-width:1100px){
  .sidebar{z-index:430!important}
  .sidebar-backdrop{z-index:420!important}
  .topbar{z-index:110!important}
  .clena-mobile-sidebar-quick{display:grid;gap:6px;padding:12px 4px 0;margin-top:12px;border-top:1px solid rgba(255,255,255,.12)}
  .clena-mobile-sidebar-quick button{display:flex;align-items:center;gap:11px;width:100%;min-height:46px;padding:10px 12px;border:0;border-radius:12px;background:transparent;color:#e5d8ee;text-align:left;font-size:13px;font-weight:700}
  .clena-mobile-sidebar-quick button i{font-size:19px}
}
@media (max-width:760px){
  :root{
    --mb-bg:#f7f5f9;
    --mb-card:#fff;
    --mb-ink:#251a2d;
    --mb-muted:#6f6476;
    --mb-border:rgba(65,37,75,.105);
    --mb-shadow:0 7px 24px rgba(44,22,56,.045);
    --mb-radius:18px;
    --mb-side:clamp(11px,3.35vw,17px);
    --mb-top:66px;
    --mb-nav:70px;
  }
  html,body{width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:clip!important}
  html{font-size:16px!important;scroll-behavior:auto!important}
  body{background:var(--mb-bg)!important;color:var(--mb-ink)!important;font-size:14px!important;line-height:1.48!important;padding-bottom:calc(var(--mb-nav) + 18px + env(safe-area-inset-bottom))!important}
  body.clena-input-active{padding-bottom:18px!important}
  .app-shell,.workspace,.content,.editor-section{width:100%!important;min-width:0!important;max-width:100%!important}
  .workspace{margin:0!important;padding:0!important;min-height:100dvh!important;background:var(--mb-bg)!important}
  .content{padding:15px var(--mb-side) 22px!important;margin:0!important;min-height:0!important}
  .editor-section{animation:none!important}
  .editor-section.is-active{animation:none!important}
  .editor-section>*{max-width:100%}
  .panel,.item-card,.stats-grid article,.report-kpis article,.table-wrap,.calendar-shell,.day-agenda,.finance-summary-card,.finance-month-card{box-shadow:var(--mb-shadow)!important;border-color:var(--mb-border)!important}
  .panel{min-width:0!important;padding:15px!important;border-radius:var(--mb-radius)!important;background:var(--mb-card)!important}
  .two-col,.three-col{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:11px!important}
  .form-stack{gap:13px!important}
  .form-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  .form-grid>.full,.full{grid-column:1/-1!important}
  .field{min-width:0!important;gap:6px!important}
  .field>span,.field>b{font-size:12.5px!important;line-height:1.35!important;color:#403448!important;font-weight:800!important}
  .field small{font-size:11.5px!important;line-height:1.5!important;color:var(--mb-muted)!important}
  .field input,.field select,.field textarea,.toolbar input,.toolbar select,.slug-input,.calendar-filters input,.calendar-filters select,.quick-status select{
    min-width:0!important;max-width:100%!important;width:100%!important;
    min-height:47px!important;padding:10px 12px!important;
    background:#fff!important;border:1px solid #e7dfea!important;border-radius:12px!important;
    color:var(--mb-ink)!important;font-size:16px!important;line-height:1.3!important;
    outline:none!important;box-shadow:none!important;
  }
  .field textarea{min-height:105px!important;resize:vertical!important}
  .field input:focus,.field select:focus,.field textarea:focus,.toolbar input:focus,.toolbar select:focus,.calendar-filters input:focus,.calendar-filters select:focus{
    border-color:var(--primary)!important;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)!important;
  }
  button,input,select,textarea{touch-action:manipulation}
  button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:3px solid rgba(var(--primary-rgb),.32)!important;outline-offset:3px!important}
  .primary-btn,.secondary-btn,.danger-btn{min-width:0!important;min-height:45px!important;padding:10px 13px!important;border-radius:12px!important;font-size:12.5px!important;font-weight:800!important;line-height:1.25!important;letter-spacing:0!important;white-space:normal!important;box-shadow:none!important;transform:none!important}
  .primary-btn{background:var(--primary)!important;color:#fff!important}
  .secondary-btn{background:#f6f0f8!important;border:1px solid #e9dbef!important;color:#62367a!important}
  .primary-btn:active,.secondary-btn:active{filter:brightness(.94)}
  .icon-btn{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border-radius:13px!important;display:grid!important;place-items:center!important}
  .text-btn{font-size:12px!important;font-weight:800!important}
  .badge{padding:5px 8px!important;border-radius:999px!important;font-size:10px!important;line-height:1.15!important;letter-spacing:.025em!important}
  .eyebrow,.panel-head small,.modal-card header small{font-size:9.5px!important;letter-spacing:.1em!important;font-weight:800!important}
  .helper-box,.warning-box,.danger-box{padding:12px!important;font-size:12px!important;line-height:1.55!important;border-radius:13px!important;overflow-wrap:anywhere}
  .empty-state{padding:26px 15px!important;border-radius:14px!important;font-size:12.5px!important}
  .empty-state p{font-size:12.5px!important;line-height:1.5!important}
  .toggle-row{width:100%!important;min-width:0!important;gap:13px!important;padding:13px!important;min-height:60px!important;border:1px solid var(--mb-border)!important;border-radius:14px!important;background:#fff!important}
  .toggle-row>span{min-width:0!important}
  .toggle-row span b{font-size:13px!important;line-height:1.32!important;color:#32253a!important}
  .toggle-row span small{font-size:11.5px!important;line-height:1.4!important;color:var(--mb-muted)!important}
  .toggle-row input[type=checkbox]{width:22px!important;height:22px!important;min-width:22px!important;flex:0 0 auto!important;accent-color:var(--primary)!important}

  /* Navigation, safe areas, and application chrome */
  .topbar{
    position:sticky!important;top:0!important;z-index:110!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;align-items:center!important;min-height:var(--mb-top)!important;
    padding:max(9px,env(safe-area-inset-top)) var(--mb-side) 9px!important;
    background:rgba(255,255,255,.97)!important;
    border-bottom:1px solid #eee8f0!important;
    box-shadow:0 3px 17px rgba(29,13,36,.035)!important;
    -webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important;
  }
  .topbar-title{display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;align-items:center!important;gap:10px!important;width:100%!important;max-width:none!important;min-width:0!important}
  .topbar-title>div{min-width:0!important}
  .topbar-title small,.save-state,.topbar-actions>.secondary-btn{display:none!important}
  .topbar h1{font-size:17px!important;font-weight:850!important;letter-spacing:-.045em!important;line-height:1.2!important;margin:0!important;color:#261b2e!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  #mobileMenu{display:grid!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border:1px solid #ebdfef!important;border-radius:13px!important;background:#f8f3fa!important;color:#6d3b87!important;font-size:19px!important}
  .topbar-actions{display:flex!important;align-items:center!important;gap:7px!important;min-width:0!important;position:relative!important}
  #saveAllButton{display:grid!important;place-items:center!important;width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;padding:0!important;font-size:0!important;border-radius:13px!important}
  #saveAllButton i{font-size:19px!important;margin:0!important}
  .profile-pill{display:flex!important;align-items:center!important;justify-content:center!important;width:43px!important;min-width:43px!important;height:44px!important;padding:4px!important;border:1px solid #e8dded!important;border-radius:13px!important;background:#f6f0f8!important;gap:0!important}
  .profile-pill span{width:30px!important;height:30px!important;border-radius:10px!important;background:rgba(var(--primary-rgb),.11)!important;color:var(--primary)!important;font-size:13px!important}
  .profile-pill i{display:none!important}
  .profile-menu{display:block;z-index:160!important;top:51px!important;right:0!important;width:185px!important;padding:7px!important;border-radius:14px!important;background:#fff!important;border:1px solid #eadfeb!important;box-shadow:0 15px 36px rgba(28,12,41,.17)!important}
  .profile-menu.is-hidden{display:none!important}
  .profile-menu button{min-height:44px!important;font-size:13px!important;color:#493655!important}
  .sidebar{z-index:430!important;width:min(315px,88vw)!important;min-width:0!important;max-width:88vw!important;height:100dvh!important;max-height:100dvh!important;padding:max(16px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom))!important;overflow:hidden!important;background:#1c1125!important;border-right:1px solid #ffffff13!important;box-shadow:18px 0 60px rgba(20,8,28,.3)!important;transform:translate3d(-103%,0,0)!important;transition:transform .22s ease!important}
  .sidebar.is-open{transform:translate3d(0,0,0)!important}
  .sidebar-backdrop{z-index:420!important;background:rgba(20,8,28,.63)!important;backdrop-filter:blur(3px)!important}
  .sidebar-backdrop.is-open{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
  .brand{font-size:19px!important;letter-spacing:-.04em!important;padding:2px 6px 18px!important;color:#fff!important}
  .brand-mark{width:39px!important;height:39px!important;border-radius:13px!important}
  .business-mini{padding:12px!important;margin-bottom:12px!important;border-radius:15px!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.12)!important}
  .business-mini strong{font-size:13px!important;color:#fff!important}
  .business-mini small{font-size:11px!important;color:#d4bfdc!important}
  .section-nav{display:flex!important;flex-direction:column!important;gap:3px!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding:2px 1px 8px!important;scrollbar-width:thin!important}
  .nav-item{min-height:46px!important;width:100%!important;padding:10px 12px!important;border-radius:12px!important;font-size:13px!important;color:#d4c4dc!important;gap:11px!important}
  .nav-item i{font-size:19px!important;flex:0 0 22px!important}
  .nav-item span{min-width:0!important}
  .nav-item.is-active{background:rgba(var(--primary-rgb),.35)!important;color:#fff!important}
  .nav-item small{background:rgba(255,255,255,.12)!important;color:#fff!important}
  .clena-mobile-sidebar-quick{display:grid!important;gap:4px!important;padding:11px 2px 0!important;border-top:1px solid rgba(255,255,255,.12)!important;margin-top:8px!important}
  .clena-mobile-sidebar-quick button{display:flex!important;align-items:center!important;gap:12px!important;width:100%!important;min-height:43px!important;padding:8px 11px!important;border:0!important;border-radius:11px!important;background:transparent!important;color:#e5d8ee!important;text-align:left!important;font-size:12.5px!important;font-weight:750!important}
  .clena-mobile-sidebar-quick button i{font-size:19px!important}
  .clena-mobile-sidebar-quick button:active{background:rgba(255,255,255,.08)!important}
  .mobile-bottom-nav{display:grid!important;z-index:130!important;position:fixed!important;left:9px!important;right:9px!important;bottom:max(8px,env(safe-area-inset-bottom))!important;width:auto!important;height:var(--mb-nav)!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important;padding:6px!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:21px!important;background:rgba(29,17,38,.97)!important;box-shadow:0 15px 40px rgba(23,10,32,.22)!important;backdrop-filter:blur(16px)!important}
  .mobile-bottom-nav button{min-width:0!important;min-height:55px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;padding:4px 1px!important;border-radius:15px!important;font-size:10px!important;line-height:1.05!important;font-weight:750!important;letter-spacing:-.01em!important;color:#c1b0cb!important}
  .mobile-bottom-nav button i{font-size:20px!important;line-height:1!important;margin:0!important}
  .mobile-bottom-nav button span{font-size:10px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .mobile-bottom-nav button.is-active{background:linear-gradient(145deg,var(--primary),#653080)!important;color:#fff!important;box-shadow:0 4px 12px rgba(var(--primary-rgb),.2)!important}
  .mobile-bottom-nav.is-hidden,body.clena-input-active .mobile-bottom-nav{display:none!important}

  /* Section titles and actions */
  .section-header{display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-items:start!important;gap:10px!important;margin:0 0 13px!important}
  .section-header>div{min-width:0!important}
  .section-header h2{font-size:22px!important;line-height:1.16!important;letter-spacing:-.045em!important;margin:4px 0 5px!important;color:var(--mb-ink)!important;font-weight:850!important}
  .section-header p{font-size:12.5px!important;line-height:1.5!important;color:var(--mb-muted)!important;margin:0!important}
  .section-header .eyebrow{font-size:9.5px!important;width:auto!important;min-height:0!important}
  .section-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%!important;overflow:visible!important;padding:0!important}
  .section-actions>*{flex:none!important;min-width:0!important;width:100%!important}
  .screen-services .section-header,.screen-resources .section-header,.screen-availability .section-header{grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;column-gap:10px!important}
  .screen-services .section-header>button,.screen-resources .section-header>button,.screen-availability .section-header>button{grid-column:2!important;grid-row:1!important;justify-self:end!important;width:46px!important;min-width:46px!important;max-width:46px!important;height:46px!important;min-height:46px!important;padding:0!important;display:grid!important;place-items:center!important;font-size:0!important;border-radius:14px!important}
  .screen-services .section-header>button i,.screen-resources .section-header>button i,.screen-availability .section-header>button i{font-size:21px!important}
  .screen-finance .section-header>.primary-btn{min-height:46px!important;width:100%!important}
  .screen-reports .section-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .screen-reports .section-actions button{min-width:0!important;min-height:43px!important;font-size:12px!important;white-space:nowrap!important;padding:9px 8px!important}

  /* Dashboard */
  .overview-premium .hero-card{display:block!important;position:relative!important;min-height:0!important;padding:22px 19px!important;border:0!important;border-radius:22px!important;background:radial-gradient(circle at 95% 8%,rgba(255,255,255,.20),transparent 32%),linear-gradient(130deg,#2a1935 0%,#5d2a78 55%,var(--primary) 100%)!important;box-shadow:0 13px 32px rgba(52,20,70,.13)!important;color:#fff!important}
  .overview-premium .hero-card:after{width:140px!important;height:140px!important;top:-75px!important;right:-50px!important;opacity:.35!important}
  .overview-premium .hero-card .eyebrow{color:#ebd9f3!important;font-size:10px!important}
  .overview-premium .hero-card h2{max-width:100%!important;font-size:23px!important;line-height:1.12!important;letter-spacing:-.045em!important;margin:10px 0!important;color:#fff!important}
  .overview-premium .hero-card p{max-width:100%!important;font-size:12.5px!important;line-height:1.58!important;margin:0!important;color:#efe2f4!important}
  .overview-premium .hero-visual{display:none!important}
  .overview-premium .hero-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:17px!important}
  .overview-premium .hero-actions>*{width:100%!important;min-width:0!important;min-height:45px!important;padding:9px!important;font-size:11.5px!important;border-radius:12px!important}
  .overview-premium .hero-actions .primary-btn{background:#fff!important;color:#5b3171!important}
  .overview-premium .hero-actions .secondary-btn{background:rgba(255,255,255,.1)!important;color:#fff!important;border:1px solid rgba(255,255,255,.3)!important}
  .stats-grid,.overview-premium .stats-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin:13px 0!important}
  .stats-grid article,.overview-premium .stats-grid article{min-width:0!important;min-height:92px!important;padding:12px!important;display:flex!important;gap:8px!important;border:1px solid var(--mb-border)!important;border-radius:17px!important;background:#fff!important;align-items:center!important}
  .stats-grid article>span{width:35px!important;height:35px!important;min-width:35px!important;border-radius:12px!important;font-size:17px!important;background:rgba(var(--primary-rgb),.09)!important;color:var(--primary)!important}
  .stats-grid article>div{min-width:0!important;overflow-wrap:anywhere!important}
  .stats-grid small,.overview-premium .stats-grid small{font-size:11px!important;line-height:1.28!important;color:var(--mb-muted)!important}
  .stats-grid strong,.overview-premium .stats-grid strong{font-size:21px!important;line-height:1.2!important;margin-top:4px!important;letter-spacing:-.035em!important;color:var(--mb-ink)!important}
  .overview-premium .two-col{gap:11px!important}
  .panel-head{display:flex!important;align-items:center!important;gap:11px!important}
  .panel-head>div{min-width:0!important}
  .panel-head h3{font-size:16px!important;line-height:1.2!important;margin:5px 0 0!important;letter-spacing:-.025em!important}
  .panel-head>strong{font-size:17px!important}
  .progress{height:10px!important;border-radius:100px!important;margin:15px 0!important;background:#eee6f1!important}
  .checklist{gap:7px!important}
  .check-item{min-height:39px!important;padding:10px 11px!important;gap:10px!important;font-size:12px!important;border-radius:11px!important;background:#faf8fb!important}

  /* Identity, media and structured forms */
  .screen-business .media-grid{display:grid!important;grid-template-columns:minmax(0,1fr) 118px!important;gap:10px!important;align-items:start!important}
  .screen-business .image-uploader{min-height:151px!important;border-radius:15px!important;background:#fbf9fc!important}
  .screen-business .image-uploader span{min-height:151px!important;padding:10px!important;font-size:12px!important;line-height:1.35!important}
  .screen-business .image-uploader i{font-size:25px!important}
  .screen-business .image-uploader b{font-size:12px!important}
  .screen-business .image-uploader small{font-size:10px!important;line-height:1.35!important}
  .screen-business .image-uploader.square{width:100%!important;max-width:100%!important;min-height:0!important;aspect-ratio:1!important;justify-self:stretch!important}
  .screen-business .image-uploader.square span{min-height:117px!important}
  .screen-business .media-actions{width:100%!important;display:flex!important;gap:0!important}
  .screen-business .media-actions button{width:100%!important;min-height:37px!important;padding:5px 2px!important;font-size:10.5px!important;justify-content:center!important}
  .screen-business .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:11px!important}
  .screen-business .form-grid .full,.screen-business .form-grid .field:nth-child(1){grid-column:1/-1!important}
  .screen-business .form-grid .field:nth-child(2){grid-column:1/-1!important}
  .screen-rules>.panel.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .screen-rules>.panel.form-grid .full{grid-column:1/-1!important}
  .screen-rules>.panel.form-grid .toggle-row{grid-column:1/-1!important}
  .screen-rules>.panel.form-grid input[type=number]{min-height:48px!important}

  /* Lists, toolbar, and cards */
  .toolbar,.toolbar.wrap{width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin-bottom:12px!important;overflow:visible!important}
  .toolbar>*,.toolbar.wrap>*{min-width:0!important;max-width:100%!important;width:100%!important}
  .toolbar .search,.toolbar.wrap .search{grid-column:1/-1!important;min-width:0!important;width:100%!important}
  .search{min-width:0!important;max-width:100%!important;width:100%!important}
  .search i{left:14px!important;top:15px!important;font-size:17px!important;color:#93849b!important}
  .search input,.toolbar .search input{padding-left:41px!important}
  .screen-services .toolbar{grid-template-columns:minmax(0,1fr) 128px!important}
  .screen-services .toolbar .search{grid-column:1!important}
  .screen-services .toolbar input,.screen-services .toolbar select,.screen-resources .toolbar input,.screen-resources .toolbar select{min-height:46px!important;font-size:14px!important}
  .screen-resources .toolbar{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .screen-resources .toolbar .search{grid-column:1/-1!important}
  .card-list{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;width:100%!important}
  .item-card{width:100%!important;min-width:0!important;display:grid!important;grid-template-columns:46px minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;align-items:center!important;gap:5px 10px!important;padding:12px!important;border-radius:17px!important;overflow:visible!important}
  .item-card .thumb{grid-column:1!important;grid-row:1/span 2!important;width:46px!important;height:46px!important;min-width:46px!important;border-radius:13px!important;font-size:19px!important}
  .item-main{grid-column:2!important;grid-row:1!important;min-width:0!important;max-width:100%!important}
  .item-main h4{font-size:13.5px!important;line-height:1.32!important;font-weight:850!important;margin:0 0 4px!important;overflow-wrap:anywhere!important}
  .item-main p,.item-main small{font-size:11.5px!important;line-height:1.45!important;color:var(--mb-muted)!important;white-space:normal!important;overflow-wrap:anywhere!important}
  .item-main p{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;margin-bottom:3px!important}
  .item-card>.badge{grid-column:2!important;grid-row:2!important;justify-self:start!important;align-self:center!important}
  .item-card>.item-actions{grid-column:3!important;grid-row:1/span 2!important;align-self:center!important;justify-self:end!important}
  .item-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:5px!important;min-width:0!important}
  .item-actions button{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;border-radius:11px!important;background:#f7f3fa!important;color:#6b5476!important;display:grid!important;place-items:center!important;font-size:16px!important}
  .item-actions button.is-danger{color:#b7435a!important;background:#fff3f5!important}
  .screen-services #serviceList .item-card,.screen-resources #resourceList .item-card{grid-template-columns:46px minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;align-items:center!important}
  .screen-services #serviceList .item-main,.screen-resources #resourceList .item-main{grid-column:2!important;grid-row:1!important}
  .screen-services #serviceList .badge,.screen-resources #resourceList .badge{grid-column:2!important;grid-row:2!important;justify-self:start!important}
  .screen-services #serviceList .item-actions,.screen-resources #resourceList .item-actions{grid-column:3!important;grid-row:1/span 2!important;justify-self:end!important}
  .screen-availability #blockList .item-card,.overview-premium #recentAppointments .item-card{grid-template-rows:auto!important}
  .screen-availability #blockList .item-card .item-actions{grid-row:1!important}
  .overview-premium #recentAppointments .item-card .item-main,.screen-availability #blockList .item-card .item-main{grid-row:1!important}

  /* Availability and payments */
  .screen-availability .two-col,.screen-payments .two-col{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  .week-list{gap:9px!important}
  .day-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:8px 11px!important;padding:13px!important;border-radius:14px!important;background:#fff!important}
  .day-row>strong{grid-column:1!important;grid-row:1!important;font-size:13.5px!important}
  .day-row>label{grid-column:2!important;grid-row:1!important;display:flex!important;align-items:center!important;gap:7px!important;font-size:11.5px!important;white-space:nowrap!important}
  .day-row .day-open{width:20px!important;height:20px!important;accent-color:var(--primary)!important}
  .day-row>.day-times{grid-column:1/-1!important;grid-row:2!important}
  .day-times{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .day-times label{font-size:10px!important;line-height:1.3!important}
  .day-times input{min-height:45px!important;min-width:0!important;padding:8px!important;border-radius:11px!important;font-size:16px!important;border:1px solid #e7dfea!important}
  .payment-mode-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .payment-mode-grid label{min-width:0!important}
  .payment-mode-grid label span{height:100%!important;min-height:116px!important;padding:13px!important;border-radius:15px!important;align-content:start!important;gap:6px!important}
  .payment-mode-grid label b{font-size:12.5px!important;line-height:1.2!important}
  .payment-mode-grid label small{font-size:11px!important;line-height:1.3!important}
  .payment-mode-grid i{font-size:22px!important;color:var(--primary)!important}
  .payment-mode-grid label input:checked+span{background:rgba(var(--primary-rgb),.07)!important;border-color:var(--primary)!important;box-shadow:0 0 0 2px rgba(var(--primary-rgb),.12)!important}
  .screen-payments .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .screen-payments .panel>.form-stack{min-width:0!important}

  /* Client records */
  .screen-customers .screen-top-actions{margin:0 0 10px!important}
  .screen-customers .customer-new-btn{min-height:45px!important;width:100%!important}
  .screen-customers .customer-toolbar{margin-bottom:10px!important}
  .screen-customers .customer-toolbar input{font-size:16px!important}
  .screen-customers .customer-list-wrap{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
  .screen-customers .customer-table,.screen-customers .customer-table tbody{display:block!important;width:100%!important}
  .screen-customers .customer-table thead{display:none!important}
  .screen-customers .customer-table tr.customer-row{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(90px,auto)!important;grid-template-rows:auto auto auto auto!important;align-items:start!important;gap:9px!important;margin:0 0 10px!important;padding:14px!important;border-radius:18px!important;border:1px solid var(--mb-border)!important;background:#fff!important;box-shadow:var(--mb-shadow)!important}
  .screen-customers .customer-table td{min-width:0!important;max-width:100%!important;padding:0!important;margin:0!important;position:static!important;border:0!important;width:auto!important;white-space:normal!important}
  .screen-customers .customer-main-cell{grid-column:1!important;grid-row:1!important}
  .screen-customers .customer-actions-cell{grid-column:2!important;grid-row:1!important;justify-self:end!important}
  .screen-customers .customer-edit-btn{width:43px!important;height:43px!important;min-width:43px!important;border-radius:12px!important;color:var(--primary)!important;background:rgba(var(--primary-rgb),.09)!important}
  .screen-customers .customer-status-cell{grid-column:1!important;grid-row:2!important}
  .screen-customers .customer-contact-cell{grid-column:1/-1!important;grid-row:3!important;padding:10px 0!important;border-top:1px solid #f1ecf2!important;border-bottom:1px solid #f1ecf2!important}
  .screen-customers .customer-contact-stack{gap:7px!important}
  .screen-customers .customer-contact-stack span{font-size:12px!important;overflow-wrap:anywhere!important}
  .screen-customers .customer-contact-stack small{font-size:11.5px!important}
  .screen-customers .customer-appointments-cell{grid-column:1!important;grid-row:4!important}
  .screen-customers .customer-absences-cell{grid-column:2!important;grid-row:4!important;min-width:0!important}
  .screen-customers .customer-stat-cell{display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:43px!important;padding:9px 11px!important;background:#faf8fb!important;border-radius:12px!important}
  .screen-customers .customer-mobile-label{font-size:10px!important;line-height:1.3!important}
  .screen-customers .customer-stat-cell strong{font-size:17px!important}
  .screen-customers .customer-avatar-mini{width:42px!important;height:42px!important;border-radius:12px!important}
  .screen-customers .customer-identity{gap:11px!important}
  .screen-customers .customer-identity strong{font-size:14px!important;line-height:1.3!important}
  .screen-customers .customer-identity small{font-size:11px!important}

  /* Calendar and daily operation */
  .screen-appointments .screen-top-actions{display:grid!important;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)!important;gap:9px!important;margin:0 0 12px!important}
  .screen-appointments .agenda-top-actions button{min-width:0!important;min-height:45px!important;width:100%!important;font-size:12px!important;white-space:nowrap!important}
  .agenda-overview,.screen-appointments .agenda-overview{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin:0 0 12px!important}
  .agenda-metric,.screen-appointments .agenda-metric{min-width:0!important;min-height:84px!important;padding:12px!important;border-radius:16px!important;gap:8px!important;background:#fff!important}
  .agenda-metric>span{width:33px!important;height:33px!important;min-width:33px!important;border-radius:11px!important;font-size:16px!important}
  .agenda-metric div{min-width:0!important;overflow-wrap:anywhere!important}
  .agenda-metric small,.screen-appointments .agenda-metric small{font-size:11px!important;line-height:1.3!important;color:var(--mb-muted)!important}
  .agenda-metric strong,.screen-appointments .agenda-metric strong{display:block!important;font-size:17px!important;line-height:1.2!important;letter-spacing:-.035em!important;margin-top:4px!important}
  .calendar-shell,.screen-appointments .calendar-shell{min-width:0!important;width:100%!important;border-radius:19px!important;overflow:hidden!important;background:#fff!important}
  .calendar-toolbar{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:11px!important;padding:13px!important;background:#fff!important}
  .calendar-nav{display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;gap:8px!important;align-items:center!important;width:100%!important;min-width:0!important}
  .calendar-nav-btn{width:44px!important;height:44px!important;border-radius:12px!important}
  .calendar-title-wrap{min-width:0!important;text-align:center!important}
  .calendar-title-wrap small{font-size:10px!important;color:#817389!important}
  .calendar-title-wrap h3{font-size:17px!important;letter-spacing:-.035em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .calendar-filters{width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .calendar-filters>*{width:100%!important;min-width:0!important;max-width:100%!important}
  .calendar-filters select{min-height:45px!important;padding:9px 10px!important;font-size:13px!important}
  .calendar-filters .calendar-search{grid-column:1/-1!important;width:100%!important}
  .calendar-search input{min-height:45px!important;padding-left:41px!important;font-size:16px!important}
  .calendar-weekdays{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;background:#faf7fb!important}
  .calendar-weekdays span{padding:9px 0!important;font-size:10px!important;letter-spacing:0!important;color:#7a6c82!important;text-transform:none!important}
  .calendar-grid{width:100%!important;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:1px!important}
  .calendar-day,.screen-appointments .calendar-day{min-width:0!important;min-height:65px!important;max-height:94px!important;padding:5px 3px!important;gap:4px!important;overflow:hidden!important;touch-action:manipulation!important}
  .calendar-day-head{gap:2px!important}
  .calendar-day-number{width:24px!important;height:24px!important;font-size:11px!important;border-radius:9px!important}
  .calendar-count{min-width:17px!important;width:auto!important;height:17px!important;padding:0 4px!important;font-size:9px!important}
  .calendar-events{gap:3px!important;margin-top:auto!important}
  .calendar-event,.screen-appointments .calendar-event{display:block!important;width:100%!important;height:5px!important;min-height:5px!important;padding:0!important;border:0!important;border-radius:999px!important;font-size:0!important;overflow:hidden!important}
  .calendar-event b,.calendar-event span{display:none!important}
  .calendar-more,.calendar-filtered{display:block!important;font-size:9px!important;line-height:1.15!important;padding:1px 0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .calendar-day.is-today{box-shadow:inset 0 0 0 1.5px rgba(var(--primary-rgb),.5)!important}
  .calendar-day.is-selected{background:rgba(var(--primary-rgb),.095)!important;box-shadow:inset 0 0 0 2px var(--primary)!important}
  .calendar-day.is-selected .calendar-day-number{font-weight:900!important}
  .day-agenda{margin-top:12px!important;padding:14px!important;border-radius:19px!important;scroll-margin-top:80px!important}
  .day-agenda-head{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;margin-bottom:13px!important}
  .day-agenda-head h3{font-size:17px!important;line-height:1.3!important;margin:4px 0!important;letter-spacing:-.02em!important}
  .day-agenda-head p{font-size:12px!important;line-height:1.45!important;color:var(--mb-muted)!important}
  .day-agenda-head .secondary-btn{width:100%!important;min-height:44px!important}
  .agenda-day-list{gap:9px!important}
  .agenda-appointment-card,.screen-appointments .agenda-appointment-card{display:grid!important;grid-template-columns:62px minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:10px!important;align-items:start!important;padding:13px!important;border:1px solid var(--mb-border)!important;border-left:4px solid var(--primary)!important;border-radius:15px!important;background:#fff!important}
  .appointment-time{padding-right:9px!important;border-right:1px solid #eee6f0!important}
  .appointment-time strong{font-size:15px!important}
  .appointment-time small{font-size:11px!important}
  .appointment-meta{min-width:0!important}
  .appointment-customer-line{display:flex!important;align-items:flex-start!important;gap:7px!important}
  .appointment-customer-line>div{min-width:0!important}
  .appointment-customer-line h4{font-size:14px!important;line-height:1.3!important;overflow-wrap:anywhere!important}
  .appointment-customer-line p,.appointment-meta p{font-size:11.5px!important;line-height:1.4!important;overflow-wrap:anywhere!important}
  .appointment-meta small{font-size:11.5px!important;line-height:1.4!important}
  .appointment-flags{gap:5px!important;margin-top:7px!important}
  .whatsapp-purple{width:41px!important;height:41px!important;min-width:41px!important;min-height:41px!important;border-radius:12px!important;font-size:20px!important}
  .agenda-appointment-actions{grid-column:1/-1!important;grid-row:2!important;display:grid!important;grid-template-columns:minmax(0,1fr) 45px!important;gap:9px!important;align-items:end!important;margin-top:3px!important}
  .quick-status span{font-size:10px!important}
  .quick-status select{min-height:44px!important;font-size:14px!important}
  .agenda-edit-btn{width:45px!important;height:45px!important;min-width:45px!important;min-height:45px!important;padding:0!important;border-radius:12px!important;display:grid!important;place-items:center!important;font-size:17px!important}
  .agenda-edit-btn span{display:none!important}

  /* Finance: amounts must never be sacrificed for compactness */
  .screen-finance .finance-section-header{grid-template-columns:minmax(0,1fr)!important}
  .screen-finance .finance-summary-shell{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;margin-bottom:12px!important}
  .screen-finance .finance-month-card{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;min-width:0!important;min-height:78px!important;gap:12px!important;align-items:center!important;padding:14px!important;border-radius:17px!important}
  .screen-finance .finance-summary-icon{width:38px!important;height:38px!important;min-width:38px!important;border-radius:12px!important;font-size:18px!important}
  .screen-finance .finance-month-copy{min-width:0!important;width:100%!important}
  .screen-finance .finance-month-copy small{font-size:11px!important}
  .screen-finance .finance-month-control{min-width:0!important;width:100%!important}
  .screen-finance .finance-month-control input[type=month]{width:100%!important;min-width:0!important;min-height:45px!important;height:45px!important;padding:8px 10px!important;font-size:16px!important;border-radius:11px!important}
  .screen-finance .finance-summary-cards{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;padding:0!important}
  .screen-finance .finance-summary-card{display:flex!important;align-items:flex-start!important;min-height:105px!important;min-width:0!important;padding:13px!important;gap:8px!important;border-radius:17px!important}
  .screen-finance .finance-summary-card>div{min-width:0!important;overflow-wrap:anywhere!important}
  .screen-finance .finance-summary-card.balance{grid-column:1/-1!important;min-height:91px!important}
  .screen-finance .finance-summary-card small{font-size:11px!important;line-height:1.25!important}
  .screen-finance .finance-summary-card strong{display:block!important;font-size:16px!important;line-height:1.2!important;letter-spacing:-.035em!important;white-space:normal!important;overflow-wrap:anywhere!important;margin-top:5px!important}
  .screen-finance .finance-summary-card.balance strong{font-size:21px!important}
  .screen-finance .finance-summary-card div>span{font-size:11px!important;line-height:1.4!important}
  .screen-finance .finance-filterbar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;padding:12px!important;border-radius:17px!important;margin-bottom:12px!important}
  .screen-finance .finance-search{grid-column:1/-1!important;height:46px!important}
  .screen-finance .finance-select{min-width:0!important;height:46px!important}
  .screen-finance .finance-search input,.screen-finance .finance-select select{min-width:0!important;font-size:14px!important;min-height:46px!important}
  .screen-finance .finance-list-premium{gap:9px!important}
  .screen-finance .finance-list-premium .finance-entry{display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;grid-template-rows:auto auto auto!important;gap:7px 10px!important;align-items:start!important;min-width:0!important;width:100%!important;padding:14px!important;border-radius:18px!important;overflow:visible!important}
  .screen-finance .finance-list-premium .finance-icon{grid-column:1!important;grid-row:1!important;width:42px!important;height:42px!important;border-radius:13px!important}
  .screen-finance .finance-list-premium .finance-main{grid-column:2/4!important;grid-row:1!important;min-width:0!important}
  .screen-finance .finance-list-premium .finance-main h4{font-size:14px!important;line-height:1.3!important;margin:0 0 4px!important;overflow-wrap:anywhere!important}
  .screen-finance .finance-list-premium .finance-main p,.screen-finance .finance-list-premium .finance-main small{font-size:11.5px!important;line-height:1.5!important;overflow-wrap:anywhere!important}
  .screen-finance .finance-list-premium .finance-value{grid-column:2!important;grid-row:2!important;text-align:left!important;min-width:0!important}
  .screen-finance .finance-list-premium .finance-value strong{font-size:18px!important;line-height:1.2!important;letter-spacing:-.025em!important;white-space:normal!important;overflow-wrap:anywhere!important}
  .screen-finance .finance-list-premium .finance-value small{font-size:11px!important}
  .screen-finance .finance-list-premium .finance-due{grid-column:2!important;grid-row:3!important;min-width:0!important}
  .screen-finance .finance-list-premium .finance-due small,.screen-finance .finance-list-premium .finance-due strong{font-size:11.5px!important;line-height:1.35!important}
  .screen-finance .finance-list-premium .item-actions{grid-column:3!important;grid-row:2/span 2!important;align-self:end!important;justify-content:flex-end!important}

  /* Reports: legible charts and readable currency */
  .screen-reports .report-filter{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;align-items:end!important;padding:13px!important;margin-bottom:12px!important;border-radius:17px!important}
  .screen-reports .report-filter .field{min-width:0!important}
  .screen-reports .report-filter input[type=date]{min-width:0!important;width:100%!important;padding:9px 7px!important;font-size:13px!important}
  .screen-reports .report-filter .primary-btn{grid-column:1/-1!important;min-height:45px!important;width:100%!important}
  .report-kpis,.screen-reports .report-kpis{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin-bottom:12px!important}
  .report-kpis article,.screen-reports .report-kpis article{min-height:94px!important;min-width:0!important;padding:12px!important;border-radius:17px!important;gap:8px!important;align-items:center!important;background:#fff!important}
  .report-kpis article>span{width:33px!important;height:33px!important;min-width:33px!important;border-radius:11px!important;font-size:17px!important}
  .report-kpis article>div{min-width:0!important;overflow-wrap:anywhere!important}
  .report-kpis small,.screen-reports .report-kpis small{font-size:11px!important;line-height:1.3!important}
  .report-kpis strong,.screen-reports .report-kpis strong{font-size:16px!important;line-height:1.25!important;letter-spacing:-.03em!important;margin-top:5px!important;overflow-wrap:anywhere!important}
  .screen-reports .two-col{grid-template-columns:minmax(0,1fr)!important;gap:11px!important}
  .screen-reports .bar-chart{margin-top:16px!important;gap:14px!important}
  .screen-reports .bar-row{grid-template-columns:85px minmax(0,1fr) 60px!important;gap:9px!important;align-items:center!important}
  .screen-reports .bar-row span,.screen-reports .bar-row strong{font-size:11.5px!important;line-height:1.3!important;overflow-wrap:anywhere!important}
  .bar-track{height:12px!important;border-radius:999px!important}
  .screen-reports .ranking-list{gap:9px!important}
  .screen-reports .rank-row{grid-template-columns:35px minmax(0,1fr) auto!important;min-width:0!important;gap:10px!important;padding:11px!important;border-radius:13px!important}
  .screen-reports .rank-row>span{width:35px!important;height:35px!important}
  .screen-reports .rank-row strong{font-size:13px!important;line-height:1.3!important}
  .screen-reports .rank-row small{font-size:11px!important}

  /* Public page and preview */
  .screen-publish .two-col{grid-template-columns:minmax(0,1fr)!important;gap:13px!important}
  .screen-publish .slug-input{display:flex!important;align-items:center!important;padding:0!important;border-radius:12px!important;min-height:47px!important}
  .screen-publish .slug-input>span{flex:0 0 auto!important;padding:11px 9px!important;white-space:nowrap!important;font-size:12px!important}
  .screen-publish .slug-input input{flex:1 1 auto!important;width:100%!important;min-width:0!important;border:0!important;border-radius:0!important;padding:10px 9px!important}
  .screen-publish .clena-public-share-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;overflow:visible!important}
  .screen-publish .clena-public-share-actions>*{flex:none!important;min-width:0!important;width:100%!important}
  .screen-publish .clena-public-share-actions>*:first-child{grid-column:1/-1!important}
  .screen-publish .clena-share-helper{font-size:12px!important;line-height:1.5!important}
  .screen-publish .phone-preview{width:min(390px,100%)!important;max-width:100%!important;margin:0 auto!important;padding:8px!important;border-radius:23px!important}
  .screen-publish .preview-content{min-height:460px!important;border-radius:18px!important}
  .screen-publish .real-preview-iframe{height:540px!important;max-width:100%!important}

  /* Auth and welcome, including devices with a short height */
  .auth-gate{width:100%!important;min-height:100dvh!important;overflow-y:auto!important;background:linear-gradient(180deg,#faf8fb,#f1e9f5)!important}
  .auth-form-panel{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:safe center!important;min-height:100dvh!important;padding:max(20px,env(safe-area-inset-top)) 13px max(20px,env(safe-area-inset-bottom))!important}
  .auth-card{width:min(440px,100%)!important;max-width:440px!important;margin:0 auto!important;padding:22px 18px!important;border-radius:23px!important;border:1px solid #e9e0ee!important;background:#fff!important;box-shadow:0 18px 52px rgba(46,24,56,.09)!important}
  .auth-mini-logo{width:57px!important;height:57px!important;border-radius:18px!important}
  .auth-card h2{font-size:24px!important;line-height:1.15!important}
  .auth-card-head p{font-size:12.5px!important}
  .auth-form{gap:12px!important}
  .auth-field>span{font-size:12px!important}
  .auth-input{min-height:49px!important;border-radius:13px!important}
  .auth-input input{font-size:16px!important}
  .auth-password-btn{min-width:44px!important;height:44px!important}
  .auth-submit{min-height:49px!important;border-radius:13px!important}
  .auth-row,.auth-switch{font-size:12px!important}
  .auth-security,.auth-verification-note{font-size:11px!important;line-height:1.45!important}

  /* Modal, keyboard, preview drawer, toast */
  .modal{display:flex!important;align-items:flex-end!important;justify-content:center!important;position:fixed!important;inset:0!important;z-index:1100!important;padding:0!important;overflow:hidden!important}
  .modal.is-hidden{display:none!important}
  .modal-backdrop{background:rgba(22,11,30,.66)!important;backdrop-filter:blur(3px)!important}
  .modal-card,.modal-card[data-modal=service],.modal-card[data-modal=appointment]{position:relative!important;display:flex!important;flex-direction:column!important;width:100%!important;min-width:0!important;max-width:100%!important;max-height:min(93dvh,calc(var(--clena-visible-h,100dvh) - 5px))!important;margin:0!important;border-radius:24px 24px 0 0!important;border:1px solid #eee4ef!important;border-bottom:0!important;background:#fff!important;box-shadow:0 -17px 55px rgba(24,9,34,.27)!important;overflow:hidden!important;transform:none!important;animation:none!important}
  .modal-card:before{content:""!important;position:absolute!important;top:8px!important;left:50%!important;transform:translateX(-50%)!important;width:42px!important;height:5px!important;border-radius:999px!important;background:#e6dbe9!important;z-index:12!important}
  .modal:not(.is-hidden) .modal-card{animation:none!important}
  .modal-card>header{position:relative!important;flex:0 0 auto!important;min-height:67px!important;padding:20px 14px 12px!important;border-bottom:1px solid #f0eaf2!important;background:#fff!important;z-index:10!important}
  .modal-card>header h2{font-size:18px!important;line-height:1.2!important;letter-spacing:-.03em!important;white-space:normal!important;margin:4px 0 0!important}
  .modal-card>header small{font-size:10px!important}
  .modal-card>header .icon-btn{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important}
  .modal-card #modalBody{display:block!important;flex:1 1 auto!important;min-height:0!important;width:100%!important;padding:14px!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-y!important}
  #modalBody .clena-modal-form{display:flex!important;flex-direction:column!important;gap:13px!important;min-height:100%!important}
  #modalBody .form-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:11px!important}
  #modalBody .form-grid .full{grid-column:1/-1!important}
  #modalBody .field input,#modalBody .field select,#modalBody .field textarea{font-size:16px!important;min-height:47px!important}
  #modalBody .field textarea{min-height:96px!important}
  #modalBody .service-form-section{padding:13px!important;border:1px solid var(--mb-border)!important;border-radius:16px!important;background:#fff!important}
  #modalBody .service-section-head{gap:11px!important;padding-bottom:11px!important;margin-bottom:12px!important}
  #modalBody .service-section-head strong{font-size:13px!important}
  #modalBody .service-section-head small{font-size:11.5px!important;line-height:1.45!important}
  #modalBody .service-toggle-grid{grid-template-columns:1fr!important;gap:9px!important}
  #modalBody .modal-footer{position:sticky!important;bottom:-14px!important;z-index:14!important;display:grid!important;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)!important;gap:9px!important;align-items:center!important;width:calc(100% + 28px)!important;margin:16px -14px -14px!important;padding:12px 14px calc(12px + env(safe-area-inset-bottom))!important;border-top:1px solid #ede4f0!important;background:rgba(255,255,255,.985)!important;backdrop-filter:blur(10px)!important;box-shadow:0 -10px 24px rgba(36,15,48,.04)!important}
  #modalBody .modal-footer>*{min-width:0!important;width:100%!important;min-height:47px!important;font-size:12px!important;padding:9px!important}
  .drawer{position:fixed!important;z-index:1120!important;inset:0!important;max-height:100dvh!important;overflow:hidden!important}
  .drawer aside{width:100%!important;max-width:100%!important;height:100dvh!important;max-height:100dvh!important;overflow-y:auto!important;background:#f8f5fa!important}
  .drawer aside>header{padding:max(13px,env(safe-area-inset-top)) 14px 12px!important;min-height:61px!important}
  .drawer aside>header h3{font-size:17px!important;letter-spacing:-.03em!important}
  .drawer .phone-preview{width:calc(100% - 24px)!important;max-width:400px!important;margin:13px auto calc(20px + env(safe-area-inset-bottom))!important;border-radius:24px!important;padding:8px!important}
  .drawer .preview-content{min-height:420px!important}
  .drawer .real-preview-iframe{width:100%!important;height:calc(100dvh - 162px)!important;min-height:420px!important}
  .toast-region{z-index:1300!important;left:12px!important;right:12px!important;width:auto!important;max-width:none!important;bottom:calc(var(--mb-nav) + 19px + env(safe-area-inset-bottom))!important}
  body.clena-input-active .toast-region{bottom:13px!important}
  .toast{min-height:45px!important;padding:12px 14px!important;border-radius:13px!important;font-size:12px!important}
  .install-pill{z-index:150!important;right:13px!important;bottom:calc(var(--mb-nav) + 21px + env(safe-area-inset-bottom))!important;max-width:calc(100vw - 26px)!important}
  body.clena-input-active .install-pill{display:none!important}
  .page-loader,.fatal-state{min-height:100dvh!important;padding:20px!important}
  .fatal-card{padding:22px!important;border-radius:19px!important}
}
@media (max-width:360px){
  .topbar{gap:7px!important}
  .topbar-title{gap:7px!important}
  .topbar h1{font-size:16px!important}
  .topbar-actions{gap:5px!important}
  .profile-pill{width:40px!important;min-width:40px!important}
  .content{padding-left:10px!important;padding-right:10px!important}
  .stats-grid article,.agenda-metric,.report-kpis article{padding:10px!important}
  .stats-grid article>span,.agenda-metric>span,.report-kpis article>span{width:30px!important;height:30px!important;min-width:30px!important}
  .stats-grid strong{font-size:18px!important}
  .screen-business .media-grid{grid-template-columns:minmax(0,1fr) 100px!important}
  .screen-business .image-uploader.square span{min-height:100px!important}
  .screen-services .toolbar{grid-template-columns:minmax(0,1fr) 108px!important}
  .item-card{grid-template-columns:42px minmax(0,1fr) auto!important;gap:5px 7px!important;padding:10px!important}
  .item-card .thumb{width:42px!important;height:42px!important;min-width:42px!important}
  .item-actions button{width:35px!important;height:35px!important;min-width:35px!important;min-height:35px!important}
  .screen-services #serviceList .item-card,.screen-resources #resourceList .item-card{grid-template-columns:42px minmax(0,1fr) auto!important}
  .screen-customers .customer-table tr.customer-row{grid-template-columns:minmax(0,1fr) minmax(78px,auto)!important;padding:12px!important}
  .screen-reports .bar-row{grid-template-columns:73px minmax(0,1fr) 50px!important;gap:6px!important}
  .screen-reports .bar-row span,.screen-reports .bar-row strong{font-size:10.5px!important}
  .screen-finance .finance-summary-card{padding:10px!important;gap:6px!important}
  .screen-finance .finance-summary-icon{width:31px!important;min-width:31px!important;height:31px!important;font-size:16px!important}
  .screen-finance .finance-summary-card strong{font-size:14px!important}
  .mobile-bottom-nav button span{font-size:9px!important}
}
@media (max-width:760px) and (max-height:680px){
  .auth-form-panel{justify-content:flex-start!important}
  .auth-card{padding:16px!important}
  .modal-card,.modal-card[data-modal=service],.modal-card[data-modal=appointment]{max-height:min(97dvh,calc(var(--clena-visible-h,100dvh) - 3px))!important}
  .modal-card>header{min-height:58px!important}
}

/* ============================================================================
   CLENA MOBILE HIGH-CONTRAST PASS | 2026-10-15
   Keep finance text readable after changing its original dark parent to white
   cards. Strengthen every operational state without hiding disabled semantics.
   All changes remain scoped to the phone layout.
   ============================================================================ */
@media (max-width:760px){
  :root{
    --mb-ink:#261b2e;
    --mb-muted:#5f5069;
    --mb-muted-strong:#4d4055;
    --mb-brand-safe:#692e86;
    --mb-border:#ddd1e2;
    --mb-bg:#f6f3f8;
  }
  body,.workspace,.content{color:var(--mb-ink)!important}
  .panel,.item-card,.table-wrap,.day-agenda,.calendar-shell,.finance-filterbar,
  .finance-entry,.report-kpis article,.stats-grid article,.agenda-metric{
    border-color:#ddd1e2!important;
  }
  .section-header p,.panel p,.item-main p,.item-main small,
  .field small,.toggle-row small,.check-item,.day-agenda-head p,
  .stats-grid small,.agenda-metric small,.report-kpis small{
    color:var(--mb-muted)!important;
  }
  .eyebrow,.panel-head small,.modal-card header small,
  .screen-appointments .day-agenda-head .eyebrow,
  .screen-finance .finance-month-copy small{
    color:var(--mb-muted-strong)!important;
  }
  .section-header .eyebrow{
    color:var(--mb-brand-safe)!important;
    background:#f1e4f5!important;
    border:1px solid #e5d0eb!important;
  }
  .overview-premium .hero-card .eyebrow{
    background:rgba(255,255,255,.14)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    color:#f7eaf9!important;
  }
  .overview-premium .hero-card p{color:#f8eefa!important}
  .panel-head h3,.section-header h2,.item-main h4,
  .appointment-customer-line h4,.customer-identity strong,
  .screen-finance .finance-main h4,.screen-reports .rank-row strong,
  .screen-reports .report-kpis strong,.stats-grid strong,
  .agenda-metric strong{
    color:var(--mb-ink)!important;
  }
  .helper-box{color:#4b4155!important;background:#f2f6fd!important;border-color:#cbd6e8!important}
  .warning-box{color:#854510!important;background:#fff3dc!important;border-color:#f2ce8c!important}
  .danger-box{color:#922d3e!important;background:#fff0f1!important;border-color:#f1bec4!important}
  .auth-security,.auth-verification-note,.auth-card-head p,
  .auth-switch,.auth-row,.real-preview-empty,.real-preview-empty span,
  .screen-publish .clena-share-helper small,.service-section-head small{
    color:var(--mb-muted)!important;
  }
  .screen-publish .clena-share-helper strong{color:var(--mb-ink)!important}
  .screen-publish .clena-share-helper>i,
  .real-preview-empty i{color:var(--mb-brand-safe)!important}
  .real-preview-label,.screen-publish .real-preview-label{
    background:#f0e3f4!important;
    color:#602877!important;
    border:1px solid #e0c9e8!important;
    font-size:10.5px!important;
  }

  /* Forms and filters: placeholders are useful instructions, not invisible text */
  input::placeholder,textarea::placeholder,
  .toolbar input::placeholder,.finance-search input::placeholder,
  .calendar-filters input::placeholder,.auth-input input::placeholder,
  #modalBody input::placeholder,#modalBody textarea::placeholder{
    color:#75657f!important;
    opacity:1!important;
  }
  .field input,.field select,.field textarea,.toolbar input,.toolbar select,
  .calendar-filters select,.calendar-filters input,.quick-status select,
  .finance-search input,.finance-select select,#modalBody .field input,
  #modalBody .field select,#modalBody .field textarea{
    color:var(--mb-ink)!important;
    border-color:#d9cddf!important;
  }
  .field>span,.field>b,.auth-field>span{color:#45364e!important}
  .search i,.finance-search>i,.finance-select>i:first-child,
  .finance-select-arrow{color:#65536d!important}
  .slug-status.ok{color:#146637!important}
  .slug-status.error{color:#a12e43!important}
  .screen-business .image-uploader{border-color:#bba8c5!important;background:#f9f5fb!important}
  .screen-business .image-uploader span,.screen-business .image-uploader b{color:#513d5a!important}
  .screen-business .image-uploader small{color:#685675!important}
  .screen-business .image-uploader i{color:var(--mb-brand-safe)!important}

  /* Accessible brand treatment even if a business selected a pale brand color */
  .primary-btn,#saveAllButton,.mobile-bottom-nav button.is-active,
  .overview-premium .hero-card .primary-btn:active{
    background:var(--mb-brand-safe)!important;
    color:#fff!important;
  }
  .overview-premium .hero-actions .primary-btn{
    background:#fff!important;
    color:#54246c!important;
  }
  .primary-btn:disabled,.secondary-btn:disabled,.danger-btn:disabled{
    opacity:.8!important;
    cursor:not-allowed!important;
    filter:none!important;
    background:#e5deea!important;
    border:1px solid #cfc2d7!important;
    color:#594c62!important;
  }
  .secondary-btn,.text-btn,.profile-pill span,
  .profile-menu button,.screen-customers .customer-edit-btn{
    color:var(--mb-brand-safe)!important;
  }
  .profile-menu button{background:#fff!important}
  #mobileMenu{color:var(--mb-brand-safe)!important}
  .sidebar .nav-item{color:#e0d3e7!important}
  .sidebar .nav-item i{color:#d8c3e2!important}
  .sidebar .nav-item.is-active,
  .sidebar .nav-item.is-active i{color:#fff!important}
  .sidebar .nav-item.is-active{
    background:rgba(151,88,185,.30)!important;
    box-shadow:inset 3px 0 0 #d994ea!important;
  }
  .sidebar .business-mini small{color:#e2d2e9!important}
  .mobile-bottom-nav button:not(.is-active){color:#e0d2e9!important}
  .mobile-bottom-nav button.is-active{
    background:var(--mb-brand-safe)!important;
    box-shadow:0 5px 17px rgba(30,14,40,.3)!important;
  }
  .mobile-bottom-nav button span,.mobile-bottom-nav button i{color:inherit!important}

  /* Status chips must remain distinct from active data and be easy to read */
  .badge{background:#e4f5ea!important;color:#175f3a!important;border:1px solid #bbe2ca!important}
  .badge.off{background:#e9edf1!important;color:#414858!important;border-color:#d2d8e1!important}
  .badge.pending{background:#fff0ca!important;color:#8c4c09!important;border-color:#efcf90!important}
  .badge.info{background:#e7f0ff!important;color:#1c4d93!important;border-color:#cadbf8!important}
  .badge.done{background:#e2f6eb!important;color:#126038!important;border-color:#b9e4c8!important}
  .day-row.is-closed{
    opacity:1!important;
    background:#f3f0f5!important;
    border-color:#d7cbdd!important;
  }
  .day-row.is-closed strong,.day-row.is-closed label{color:#52435b!important}
  .day-row.is-closed .day-times input{background:#fdfbfe!important;color:#655570!important}
  .day-row.is-closed .day-open{accent-color:#667184!important}
  .day-row:not(.is-closed)>strong{color:#2b1f33!important}

  /* FINANCE: this was the main white-on-white regression */
  #section-finance .finance-summary-shell{
    background:transparent!important;
    color:var(--mb-ink)!important;
  }
  #section-finance .finance-month-card{
    background:#fff!important;
    color:var(--mb-ink)!important;
    border:1px solid #ddd1e2!important;
    box-shadow:0 6px 20px rgba(39,20,52,.055)!important;
  }
  #section-finance .finance-month-copy small{
    color:#4c4057!important;
    font-weight:850!important;
  }
  #section-finance .finance-month-card>.finance-summary-icon{
    background:#f0e5f5!important;
    color:var(--mb-brand-safe)!important;
  }
  #section-finance .finance-month-control input[type=month]{
    background:#fff!important;
    color:#281d31!important;
    border:1px solid #d6c8dd!important;
    color-scheme:light!important;
    box-shadow:none!important;
  }
  #section-finance .finance-summary-card:not(.balance){
    background:#fff!important;
    color:var(--mb-ink)!important;
    border:1px solid #ddd1e2!important;
    box-shadow:0 6px 20px rgba(39,20,52,.05)!important;
  }
  #section-finance .finance-summary-card:not(.balance) strong{
    color:#231a29!important;
    text-shadow:none!important;
  }
  #section-finance .finance-summary-card:not(.balance) small,
  #section-finance .finance-summary-card:not(.balance) div>span{
    color:#53445d!important;
    opacity:1!important;
  }
  #section-finance .finance-summary-card.receivable .finance-summary-icon{
    background:#dcf6e8!important;
    color:#166039!important;
  }
  #section-finance .finance-summary-card.payable .finance-summary-icon{
    background:#ffe6e9!important;
    color:#9a263c!important;
  }
  #section-finance .finance-summary-card.balance{
    background:linear-gradient(125deg,#54246f,#72338a)!important;
    border:1px solid #623079!important;
    color:#fff!important;
    box-shadow:0 9px 25px rgba(69,28,93,.16)!important;
  }
  #section-finance .finance-summary-card.balance strong{
    color:#fff!important;
    text-shadow:none!important;
  }
  #section-finance .finance-summary-card.balance small,
  #section-finance .finance-summary-card.balance div>span{
    color:#f5e9f7!important;
    opacity:1!important;
  }
  #section-finance .finance-summary-card.balance .finance-summary-icon{
    background:rgba(255,255,255,.19)!important;
    color:#fff!important;
  }
  #section-finance .finance-list-premium .finance-entry{background:#fff!important;color:var(--mb-ink)!important}
  #section-finance .finance-list-premium .finance-entry .finance-value strong{color:#281b30!important}
  #section-finance .finance-list-premium .finance-entry.receivable .finance-icon{
    color:#176a42!important;background:#e0f7e9!important;
  }
  #section-finance .finance-list-premium .finance-entry.payable .finance-icon{
    color:#a02c42!important;background:#ffeaed!important;
  }
  #section-finance .finance-list-premium .finance-main p,
  #section-finance .finance-list-premium .finance-main small,
  #section-finance .finance-list-premium .finance-due small{
    color:#5d4f66!important;
  }

  /* Agenda: old pale event backgrounds were rendered as tiny, nearly invisible bars */
  .screen-appointments .calendar-weekdays span{color:#54475e!important;font-weight:850!important}
  .screen-appointments .calendar-day-number{color:#352640!important}
  .screen-appointments .calendar-day.is-empty{background:#f0ecf3!important}
  .screen-appointments .calendar-count{background:#e6d9ec!important;color:#57246d!important}
  .screen-appointments .calendar-count.has-pending{background:#ffe8af!important;color:#7d4205!important}
  .screen-appointments .calendar-event{box-shadow:none!important;opacity:1!important}
  .screen-appointments .calendar-event.event-pending{background:#b76408!important}
  .screen-appointments .calendar-event.event-confirmed{background:#6e3894!important}
  .screen-appointments .calendar-event.event-completed{background:#19784d!important}
  .screen-appointments .calendar-event.event-cancelled,
  .screen-appointments .calendar-event.event-no_show{background:#657080!important}
  .screen-appointments .calendar-more{color:var(--mb-brand-safe)!important}
  .screen-appointments .calendar-filtered{color:#665576!important}
  .screen-appointments .day-agenda-head .eyebrow{color:var(--mb-brand-safe)!important}
  .screen-appointments .appointment-time small,
  .screen-appointments .appointment-meta small{color:var(--mb-muted)!important}

  /* Reporting: labels, charts and status colors */
  .screen-reports .report-kpis article{background:#fff!important;color:var(--mb-ink)!important}
  .screen-reports .report-kpis article>span,
  .overview-premium .stats-grid article>span,
  .screen-appointments .agenda-metric>span{
    background:#f0e5f6!important;
    color:var(--mb-brand-safe)!important;
  }
  .screen-reports .bar-row span{color:#53455d!important}
  .screen-reports .bar-row strong{color:#291c32!important}
  .screen-reports .bar-track{background:#e1d7e6!important}
  .screen-reports .bar-track i{background:linear-gradient(90deg,#62267e,#9140a8)!important}
  .screen-reports .rank-row{background:#f8f5fa!important}
  .screen-reports .rank-row>span{background:#eadcee!important;color:#61287e!important}
  .screen-reports .rank-row small{color:#5f5069!important}
  .screen-reports .rank-row strong{color:#241b2e!important}
}
