/* ==========================================================
   BeautyGrafik — Mobile Premium v1
   Public asset: /public_html/beautygrafik/css/mobile-premium-v1.css
   Scope: panel właściciela + mobilne widoki grafiku / CRM / usług
   ========================================================== */

@media(max-width:850px){
    html[data-bg-theme] .bg-desktop-owner-stage{
        color:var(--bg-theme-text, var(--text))!important;
        background:
            radial-gradient(circle at 96% 0%, color-mix(in srgb, var(--bg-theme-accent-1, var(--accent)) 14%, transparent), transparent 24%),
            radial-gradient(circle at 0% 88%, color-mix(in srgb, var(--bg-theme-accent-2, var(--accent2)) 10%, transparent), transparent 28%),
            linear-gradient(180deg, var(--bg-theme-shell-1, #faf5f1) 0%, var(--bg-theme-shell-2, #f4ede7) 100%)!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage > .container{
        width:100%!important;
        max-width:100%!important;
        padding:14px 12px calc(112px + env(safe-area-inset-bottom))!important;
        overflow-x:hidden!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .footer{
        padding-left:14px!important;
        padding-right:14px!important;
    }

    body:has(.bg-desktop-owner-stage){
        overflow-x:hidden!important;
    }

    body:has(.bg-desktop-owner-stage) .nav{
        position:sticky!important;
        top:0!important;
        z-index:70!important;
        background:color-mix(in srgb, var(--bg-theme-surface, #fff) 92%, transparent)!important;
        border-bottom:1px solid var(--bg-theme-line, var(--line))!important;
        box-shadow:0 14px 34px color-mix(in srgb, var(--bg-theme-shadow, rgba(40,30,20,.12)) 70%, transparent)!important;
        backdrop-filter:blur(18px)!important;
    }

    body:has(.bg-desktop-owner-stage) .nav-inner{
        display:flex!important;
        flex-direction:row!important;
        align-items:center!important;
        justify-content:space-between!important;
        gap:12px!important;
        min-height:64px!important;
        padding:10px 14px!important;
    }

    body:has(.bg-desktop-owner-stage) .brand{
        min-width:0!important;
        font-size:25px!important;
        line-height:1!important;
        color:var(--bg-theme-text, var(--text))!important;
    }

    body:has(.bg-desktop-owner-stage) .brand small{
        margin-top:0!important;
        font-size:9px!important;
        letter-spacing:.095em!important;
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .card,
    html[data-bg-theme] .bg-desktop-owner-stage .tap-card,
    html[data-bg-theme] .bg-desktop-owner-stage .sheet-box,
    html[data-bg-theme] .bg-desktop-owner-stage .modal-content,
    html[data-bg-theme] .bg-desktop-owner-stage .event-sheet,
    html[data-bg-theme] .bg-desktop-owner-stage .today-sheet,
    html[data-bg-theme] .bg-desktop-owner-stage .dashboard-side-card,
    html[data-bg-theme] .bg-desktop-owner-stage .dashboard-notifications-modal{
        background:color-mix(in srgb, var(--bg-theme-surface, var(--card)) 96%, transparent)!important;
        color:var(--bg-theme-text, var(--text))!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        box-shadow:0 18px 42px color-mix(in srgb, var(--bg-theme-shadow, rgba(40,30,20,.11)) 82%, transparent)!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .card{
        padding:18px!important;
        border-radius:28px!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage h1,
    html[data-bg-theme] .bg-desktop-owner-stage h2,
    html[data-bg-theme] .bg-desktop-owner-stage h3,
    html[data-bg-theme] .bg-desktop-owner-stage h4,
    html[data-bg-theme] .bg-desktop-owner-stage strong,
    html[data-bg-theme] .bg-desktop-owner-stage .page-title{
        color:var(--bg-theme-text, var(--text))!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .muted,
    html[data-bg-theme] .bg-desktop-owner-stage small,
    html[data-bg-theme] .bg-desktop-owner-stage .small,
    html[data-bg-theme] .bg-desktop-owner-stage label{
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage input,
    html[data-bg-theme] .bg-desktop-owner-stage select,
    html[data-bg-theme] .bg-desktop-owner-stage textarea{
        min-height:52px!important;
        border-radius:18px!important;
        padding:14px!important;
        background:var(--bg-theme-surface, #fff)!important;
        color:var(--bg-theme-text, var(--text))!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        font-size:16px!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage input:focus,
    html[data-bg-theme] .bg-desktop-owner-stage select:focus,
    html[data-bg-theme] .bg-desktop-owner-stage textarea:focus{
        border-color:var(--bg-theme-focus-border, var(--accent2))!important;
        box-shadow:0 0 0 4px var(--bg-theme-focus, rgba(189,135,91,.16))!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .btn,
    html[data-bg-theme] .bg-desktop-owner-stage button.btn,
    html[data-bg-theme] .bg-desktop-owner-stage a.btn{
        min-height:50px!important;
        border-radius:18px!important;
        font-size:14px!important;
        font-weight:950!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .btn-primary,
    html[data-bg-theme] .bg-desktop-owner-stage button.btn-primary,
    html[data-bg-theme] .bg-desktop-owner-stage a.btn-primary{
        background:linear-gradient(135deg,var(--bg-theme-accent-1, var(--accent)),var(--bg-theme-accent-2, var(--accent2)))!important;
        color:var(--bg-theme-accent-text, #fff)!important;
        border-color:transparent!important;
        box-shadow:0 16px 28px color-mix(in srgb, var(--bg-theme-accent-2, var(--accent2)) 24%, transparent)!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .btn-soft,
    html[data-bg-theme] .bg-desktop-owner-stage button.btn-soft,
    html[data-bg-theme] .bg-desktop-owner-stage a.btn-soft{
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
        color:var(--bg-theme-text, var(--text))!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        box-shadow:none!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .btn-blue,
    html[data-bg-theme] .bg-desktop-owner-stage button.btn-blue,
    html[data-bg-theme] .bg-desktop-owner-stage a.btn-blue{
        background:color-mix(in srgb, var(--bg-theme-accent-1, var(--accent)) 14%, var(--bg-theme-surface, #fff))!important;
        color:var(--bg-theme-text, var(--text))!important;
        border-color:color-mix(in srgb, var(--bg-theme-accent-1, var(--accent)) 32%, var(--bg-theme-line, var(--line)))!important;
    }

    html[data-bg-theme] .bg-desktop-owner-stage .badge,
    html[data-bg-theme] .bg-desktop-owner-stage .pill,
    html[data-bg-theme] .bg-desktop-owner-stage .today-calendar-pill{
        background:var(--bg-theme-pill-bg, #f6ebe5)!important;
        color:var(--bg-theme-pill-text, var(--accent2))!important;
        border-color:color-mix(in srgb, var(--bg-theme-line, var(--line)) 74%, transparent)!important;
    }

    /* Floating mobile navigation */
    html[data-bg-theme] .bottom-nav.bg-owner-mobile-nav{
        left:10px!important;
        right:10px!important;
        bottom:10px!important;
        width:auto!important;
        height:calc(76px + env(safe-area-inset-bottom))!important;
        min-height:76px!important;
        padding:8px 8px calc(8px + env(safe-area-inset-bottom))!important;
        display:grid!important;
        grid-template-columns:repeat(5,minmax(0,1fr))!important;
        gap:6px!important;
        border:1px solid var(--bg-theme-line, var(--line))!important;
        border-radius:30px!important;
        background:color-mix(in srgb, var(--bg-theme-surface, #fff) 94%, transparent)!important;
        box-shadow:0 22px 55px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.18)) 95%, transparent)!important;
        backdrop-filter:blur(20px)!important;
    }

    html[data-bg-theme] .bottom-nav.bg-owner-mobile-nav a{
        position:relative!important;
        display:grid!important;
        grid-template-rows:24px auto!important;
        justify-items:center!important;
        align-content:center!important;
        gap:4px!important;
        min-width:0!important;
        min-height:58px!important;
        padding:7px 4px!important;
        border-radius:22px!important;
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:10px!important;
        font-weight:950!important;
        line-height:1.1!important;
    }

    html[data-bg-theme] .bottom-nav.bg-owner-mobile-nav a.active{
        background:linear-gradient(135deg,var(--bg-theme-accent-1, var(--accent)),var(--bg-theme-accent-2, var(--accent2)))!important;
        color:var(--bg-theme-accent-text, #fff)!important;
        box-shadow:0 14px 26px color-mix(in srgb, var(--bg-theme-accent-2, var(--accent2)) 22%, transparent)!important;
    }

    html[data-bg-theme] .bottom-nav.bg-owner-mobile-nav .nav-ico,
    html[data-bg-theme] .bottom-nav.bg-owner-mobile-nav .nav-ico svg{
        width:22px!important;
        height:22px!important;
    }

    html[data-bg-theme] .bottom-nav.bg-owner-mobile-nav .bg-nav-badge{
        top:4px!important;
        right:10px!important;
        min-width:18px!important;
        height:18px!important;
        border-radius:999px!important;
        padding:0 5px!important;
        background:#c43f4f!important;
        color:#fff!important;
        border:2px solid var(--bg-theme-surface, #fff)!important;
        font-size:9px!important;
        font-weight:950!important;
    }

    /* Trial banner mobile */
    html[data-bg-theme] .bg-trial-banner{
        display:grid!important;
        gap:12px!important;
        margin-bottom:14px!important;
        padding:16px!important;
        border-radius:24px!important;
        border:1px solid color-mix(in srgb, var(--bg-theme-accent-1, var(--accent)) 28%, var(--bg-theme-line, var(--line)))!important;
        background:linear-gradient(135deg,
            color-mix(in srgb, var(--bg-theme-pill-bg, #f6ebe5) 80%, var(--bg-theme-surface, #fff)),
            var(--bg-theme-surface, #fff))!important;
    }

    html[data-bg-theme] .bg-trial-banner strong{
        color:var(--bg-theme-text, var(--text))!important;
        font-size:15px!important;
        line-height:1.35!important;
    }

    html[data-bg-theme] .bg-trial-banner span{
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:13px!important;
        line-height:1.5!important;
    }

    /* Alerts */
    html[data-bg-theme] .bg-desktop-owner-stage .alert{
        margin-bottom:14px!important;
        padding:14px 15px!important;
        border-radius:20px!important;
        font-size:13px!important;
        line-height:1.5!important;
        font-weight:850!important;
    }

    /* Mobile owner dashboard spotlight */
    .bg-mobile-home-spotlight{
        display:grid!important;
        gap:14px!important;
        margin-bottom:16px!important;
        padding:18px!important;
        border:1px solid var(--bg-theme-line, var(--line))!important;
        border-radius:30px!important;
        background:
            radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bg-theme-accent-1, var(--accent)) 17%, transparent), transparent 36%),
            linear-gradient(135deg,var(--bg-theme-surface, #fff),var(--bg-theme-surface-soft, #f7eee9))!important;
        box-shadow:0 20px 42px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.14)) 78%, transparent)!important;
    }

    .bg-mobile-home-top{
        display:flex!important;
        align-items:flex-start!important;
        justify-content:space-between!important;
        gap:12px!important;
    }

    .bg-mobile-home-kicker{
        display:inline-flex!important;
        align-items:center!important;
        min-height:30px!important;
        padding:0 11px!important;
        border-radius:999px!important;
        background:var(--bg-theme-pill-bg, #f6ebe5)!important;
        color:var(--bg-theme-pill-text, var(--accent2))!important;
        font-size:10px!important;
        font-weight:950!important;
        letter-spacing:.06em!important;
        text-transform:uppercase!important;
    }

    .bg-mobile-home-spotlight h1{
        margin:10px 0 0!important;
        font-size:35px!important;
        line-height:.98!important;
        letter-spacing:-.055em!important;
    }

    .bg-mobile-home-date{
        margin-top:6px!important;
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:13px!important;
        line-height:1.45!important;
        font-weight:850!important;
    }

    .bg-mobile-home-bell{
        position:relative!important;
        width:54px!important;
        height:54px!important;
        display:grid!important;
        place-items:center!important;
        border-radius:20px!important;
        border:1px solid var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        color:var(--bg-theme-text, var(--text))!important;
        box-shadow:0 14px 28px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.13)) 72%, transparent)!important;
    }

    .bg-mobile-home-bell svg{
        width:23px!important;
        height:23px!important;
        stroke:currentColor!important;
        fill:none!important;
        stroke-width:2!important;
        stroke-linecap:round!important;
        stroke-linejoin:round!important;
    }

    .bg-mobile-home-bell .dashboard-bell-count{
        top:-4px!important;
        right:-4px!important;
    }

    .bg-mobile-home-stats{
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:9px!important;
    }

    .bg-mobile-home-stat{
        min-height:82px!important;
        display:grid!important;
        align-content:center!important;
        gap:6px!important;
        padding:11px 9px!important;
        border:1px solid var(--bg-theme-line, var(--line))!important;
        border-radius:20px!important;
        background:color-mix(in srgb, var(--bg-theme-surface, #fff) 94%, transparent)!important;
        text-align:left!important;
    }

    .bg-mobile-home-stat span{
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:10px!important;
        line-height:1.15!important;
        font-weight:950!important;
        text-transform:uppercase!important;
        letter-spacing:.045em!important;
    }

    .bg-mobile-home-stat strong{
        color:var(--bg-theme-text, var(--text))!important;
        font-size:22px!important;
        line-height:1!important;
        font-weight:950!important;
        letter-spacing:-.04em!important;
    }

    .bg-mobile-home-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:10px!important;
    }

    .bg-mobile-home-actions .btn:first-child{
        grid-column:1/-1!important;
    }

    .today-top{
        display:none!important;
    }

    .card.today-panel{
        padding:14px!important;
        border-radius:28px!important;
        background:var(--bg-theme-surface, #fff)!important;
    }

    .timeline-card{
        margin:0!important;
        padding:14px!important;
        border-radius:22px!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
        overflow:hidden!important;
    }

    .today-filters{
        display:flex!important;
        gap:8px!important;
        overflow-x:auto!important;
        -webkit-overflow-scrolling:touch!important;
        padding:2px 0 6px!important;
        margin-top:14px!important;
        scrollbar-width:none!important;
    }

    .today-filters::-webkit-scrollbar{
        display:none!important;
    }

    .today-filter{
        flex:0 0 auto!important;
        min-height:40px!important;
        padding:0 14px!important;
        border-radius:999px!important;
        background:var(--bg-theme-surface, #fff)!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:11px!important;
        font-weight:950!important;
    }

    .today-filter.active{
        background:linear-gradient(135deg,var(--bg-theme-accent-1, var(--accent)),var(--bg-theme-accent-2, var(--accent2)))!important;
        color:var(--bg-theme-accent-text, #fff)!important;
        border-color:transparent!important;
    }

    .today-list{
        display:grid!important;
        gap:10px!important;
        margin-top:14px!important;
    }

    .today-row{
        grid-template-columns:64px minmax(0,1fr)!important;
        grid-template-areas:
            'time main'
            'status status'!important;
        gap:10px 12px!important;
        min-height:0!important;
        padding:13px!important;
        border-radius:22px!important;
        border:1px solid var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        box-shadow:0 12px 24px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.10)) 70%, transparent)!important;
    }

    .today-time{grid-area:time!important;font-size:16px!important;}
    .today-main{grid-area:main!important;}
    .today-right{grid-area:status!important;display:flex!important;justify-content:space-between!important;align-items:center!important;gap:10px!important;}
    .today-arrow{display:none!important;}

    .today-service{
        font-size:15px!important;
        line-height:1.25!important;
    }

    .today-client{
        margin-top:5px!important;
        font-size:12px!important;
        line-height:1.4!important;
    }

    .today-status{
        min-height:28px!important;
        padding:0 10px!important;
        border-radius:999px!important;
        font-size:10px!important;
        white-space:nowrap!important;
    }

    .today-price{
        font-size:12px!important;
        text-align:right!important;
    }

    .dashboard-notifications-backdrop.show{
        display:block!important;
    }

    .dashboard-notifications-modal{
        position:fixed!important;
        left:10px!important;
        right:10px!important;
        bottom:10px!important;
        top:auto!important;
        width:auto!important;
        max-width:none!important;
        max-height:calc(88vh - env(safe-area-inset-bottom))!important;
        border-radius:30px!important;
        padding:18px!important;
        overflow:auto!important;
    }

    .dashboard-notifications-head{
        position:sticky!important;
        top:-18px!important;
        z-index:2!important;
        margin:-18px -18px 12px!important;
        padding:18px!important;
        border-bottom:1px solid var(--bg-theme-line, var(--line))!important;
        background:color-mix(in srgb, var(--bg-theme-surface, #fff) 96%, transparent)!important;
        backdrop-filter:blur(12px)!important;
    }

    .dashboard-notification-item,
    .dashboard-notification-priority{
        border-radius:22px!important;
    }

    .sheet-backdrop.show,
    .dashboard-notifications-backdrop.show{
        backdrop-filter:blur(7px)!important;
    }

    .today-sheet,
    .event-sheet,
    .modal-content{
        width:calc(100% - 20px)!important;
        left:10px!important;
        right:10px!important;
        transform:none!important;
        border-radius:30px 30px 18px 18px!important;
        padding:18px!important;
        padding-bottom:calc(20px + env(safe-area-inset-bottom))!important;
    }

    /* Schedule mobile */
    .schedule-mobile{
        display:block!important;
        padding-bottom:118px!important;
    }

    .sg-card{
        padding:15px!important;
        border-radius:28px!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        box-shadow:0 20px 42px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.12)) 78%, transparent)!important;
    }

    .sg-nav{
        width:46px!important;
        height:46px!important;
        border-radius:18px!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
        color:var(--bg-theme-text, var(--text))!important;
    }

    .sg-title{
        color:var(--bg-theme-text, var(--text))!important;
        font-size:24px!important;
    }

    .sg-subtitle{
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:12px!important;
    }

    .sg-summary{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:8px!important;
        margin-top:14px!important;
    }

    .sg-stat{
        min-height:76px!important;
        padding:11px 8px!important;
        border-radius:18px!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
    }

    .sg-stat strong{
        color:var(--bg-theme-text, var(--text))!important;
        font-size:21px!important;
    }

    .sg-stat span{
        color:var(--bg-theme-muted, var(--muted))!important;
        font-size:10px!important;
    }

    .sg-action,
    .sg-month-action-btn{
        min-height:46px!important;
        border-radius:17px!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        color:var(--bg-theme-text, var(--text))!important;
    }

    .sg-action.primary,
    .sg-month-action-btn.primary{
        background:linear-gradient(135deg,var(--bg-theme-accent-1, var(--accent)),var(--bg-theme-accent-2, var(--accent2)))!important;
        color:var(--bg-theme-accent-text, #fff)!important;
        border-color:transparent!important;
    }

    .sg-tabs{
        display:flex!important;
        gap:8px!important;
        overflow-x:auto!important;
        padding-bottom:4px!important;
        scrollbar-width:none!important;
    }

    .sg-tabs::-webkit-scrollbar{
        display:none!important;
    }

    .sg-tab{
        flex:0 0 auto!important;
        min-height:40px!important;
        padding:0 16px!important;
        border-radius:999px!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    .sg-tab.active{
        background:var(--bg-theme-pill-bg, #f6ebe5)!important;
        color:var(--bg-theme-pill-text, var(--accent2))!important;
        border-color:color-mix(in srgb, var(--bg-theme-accent-1, var(--accent)) 28%, var(--bg-theme-line, var(--line)))!important;
    }

    .sg-panel.active,
    .sg-loading,
    .sg-empty,
    .sg-month-info,
    .sg-month-actions{
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    .sg-slot,
    .sg-visit,
    .sg-block,
    .sg-week-row,
    .sg-month-grid{
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        color:var(--bg-theme-text, var(--text))!important;
        border-radius:20px!important;
    }

    .sg-slot{
        grid-template-columns:74px minmax(0,1fr) 40px!important;
    }

    .sg-visit{
        grid-template-columns:70px minmax(0,1fr) 36px!important;
    }

    .sg-week-row{
        grid-template-columns:72px minmax(0,1fr) 32px!important;
    }

    .sg-time,
    .sg-visit-time,
    .sg-week-day strong,
    .sg-week-main strong,
    .sg-slot-main strong,
    .sg-visit-title,
    .sg-block-main strong{
        color:var(--bg-theme-text, var(--text))!important;
    }

    .sg-time span,
    .sg-visit-sub,
    .sg-week-main span,
    .sg-slot-main span,
    .sg-block-main span,
    .sg-month-actions-meta{
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    .sg-slot-plus,
    .sg-open{
        background:var(--bg-theme-pill-bg, #f6ebe5)!important;
        color:var(--bg-theme-pill-text, var(--accent2))!important;
        border-color:var(--bg-theme-line, var(--line))!important;
    }

    .sg-month-head{
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    .sg-month-day{
        background:var(--bg-theme-surface, #fff)!important;
        color:var(--bg-theme-text, var(--text))!important;
    }

    .sg-month-day.selected{
        background:var(--bg-theme-pill-bg, #f6ebe5)!important;
        color:var(--bg-theme-pill-text, var(--accent2))!important;
    }

    .mobile-floating-add{
        right:16px!important;
        bottom:calc(100px + env(safe-area-inset-bottom))!important;
        width:62px!important;
        height:62px!important;
        border-radius:999px!important;
        background:linear-gradient(135deg,var(--bg-theme-accent-1, var(--accent)),var(--bg-theme-accent-2, var(--accent2)))!important;
        color:var(--bg-theme-accent-text, #fff)!important;
        box-shadow:0 22px 38px color-mix(in srgb, var(--bg-theme-accent-2, var(--accent2)) 28%, transparent)!important;
    }

    /* CRM / customers mobile */
    .customers-crm-hero,
    .customers-mobile-shell,
    .service-mobile-hero,
    .services-mobile-page > .card{
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        box-shadow:0 20px 42px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.12)) 76%, transparent)!important;
    }

    .customers-crm-hero,
    .service-mobile-hero{
        padding:18px!important;
        border-radius:30px!important;
    }

    .customer-metrics,
    .service-mobile-stats{
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:8px!important;
        overflow:visible!important;
    }

    .customer-metric,
    .service-mobile-stat{
        min-height:78px!important;
        padding:11px 9px!important;
        border-radius:20px!important;
        background:var(--bg-theme-surface-soft, #f7eee9)!important;
        border:1px solid var(--bg-theme-line, var(--line))!important;
    }

    .customer-card,
    .service-mobile-card{
        border-color:var(--bg-theme-line, var(--line))!important;
        background:var(--bg-theme-surface, #fff)!important;
        border-radius:24px!important;
        padding:14px!important;
        box-shadow:0 14px 28px color-mix(in srgb, var(--bg-theme-shadow, rgba(0,0,0,.10)) 68%, transparent)!important;
    }

    .customer-avatar{
        background:linear-gradient(135deg,var(--bg-theme-accent-1, var(--accent)),var(--bg-theme-accent-2, var(--accent2)))!important;
        color:var(--bg-theme-accent-text, #fff)!important;
    }

    .customer-filter-row{
        display:flex!important;
        gap:8px!important;
        overflow-x:auto!important;
        scrollbar-width:none!important;
        padding-bottom:4px!important;
    }

    .customer-filter-row::-webkit-scrollbar{
        display:none!important;
    }

    .customer-filter-pill{
        flex:0 0 auto!important;
        min-height:38px!important;
        border-radius:999px!important;
        background:var(--bg-theme-surface, #fff)!important;
        border-color:var(--bg-theme-line, var(--line))!important;
        color:var(--bg-theme-muted, var(--muted))!important;
    }

    .customer-filter-pill.active{
        background:var(--bg-theme-pill-bg, #f6ebe5)!important;
        color:var(--bg-theme-pill-text, var(--accent2))!important;
    }

    .customer-sheet-backdrop.show{
        backdrop-filter:blur(7px)!important;
    }

    .customer-sheet{
        left:10px!important;
        right:10px!important;
        width:auto!important;
        padding:18px!important;
        border-radius:30px 30px 18px 18px!important;
        background:var(--bg-theme-surface, #fff)!important;
        border-color:var(--bg-theme-line, var(--line))!important;
    }

    .customer-sheet-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:9px!important;
    }

    .customer-sheet-actions .btn:first-child,
    .customer-sheet-actions .btn:nth-child(4),
    .customer-sheet-actions form:last-child{
        grid-column:1/-1!important;
    }

    .service-mobile-list{
        display:grid!important;
        gap:10px!important;
    }

    .service-mobile-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:9px!important;
    }

    .service-mobile-actions .btn,
    .service-mobile-actions form,
    .service-mobile-actions button{
        width:100%!important;
    }

    /* Support, billing, trial pages on mobile inherit premium shell */
    .support-center-page,
    .support-detail-page,
    .billing-shell,
    .trial-register{
        gap:14px!important;
    }

    .support-hero,
    .support-list-card,
    .support-side-card,
    .support-detail-hero,
    .support-message-card,
    .support-reply-card,
    .trial-register-hero,
    .trial-form-card,
    .trial-plans-card,
    .billing-hero,
    .billing-card{
        border-radius:28px!important;
    }
}

@media(max-width:420px){
    .bg-mobile-home-stats,
    .customer-metrics,
    .service-mobile-stats{
        grid-template-columns:1fr!important;
    }

    .bg-mobile-home-actions,
    .customer-sheet-actions,
    .service-mobile-actions{
        grid-template-columns:1fr!important;
    }

    .bg-mobile-home-actions .btn:first-child,
    .customer-sheet-actions .btn:first-child,
    .customer-sheet-actions .btn:nth-child(4),
    .customer-sheet-actions form:last-child{
        grid-column:auto!important;
    }
}

/* ==========================================================
   BeautyGrafik — Mobile Premium v1.1
   Fix: ucinanie widoków na telefonie / poziomy overflow
   ========================================================== */
@media(max-width:850px){
    html,
    body{
        width:100%!important;
        max-width:100%!important;
        overflow-x:hidden!important;
    }

    .bg-desktop-owner-shell,
    .bg-desktop-owner-stage,
    .bg-desktop-owner-stage > .container,
    .dashboard-layout,
    .today-command,
    .bg-mobile-home-spotlight,
    .card.today-panel,
    .timeline-card{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        box-sizing:border-box!important;
    }

    .bg-desktop-owner-stage > .container > *,
    .today-command > *,
    .bg-mobile-home-spotlight > *,
    .card.today-panel > *{
        max-width:100%!important;
        min-width:0!important;
        box-sizing:border-box!important;
    }

    .bg-mobile-home-top{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
    }

    .bg-mobile-home-top > div:first-child{
        min-width:0!important;
        max-width:calc(100% - 66px)!important;
    }

    .bg-mobile-home-spotlight h1{
        max-width:100%!important;
        overflow-wrap:anywhere!important;
    }

    /*
       Trzy metryki w jednym rzędzie na wąskich telefonach były zbyt ciasne.
       Układ 2 + 1 jest czytelniejszy i nie wypycha sekcji poza ekran.
    */
    .bg-mobile-home-stats{
        width:100%!important;
        max-width:100%!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:10px!important;
    }

    .bg-mobile-home-stat{
        min-width:0!important;
        max-width:100%!important;
        overflow:hidden!important;
    }

    .bg-mobile-home-stat:nth-child(3){
        grid-column:1/-1!important;
    }

    .bg-mobile-home-stat strong{
        max-width:100%!important;
        font-size:clamp(21px,6vw,28px)!important;
        overflow-wrap:anywhere!important;
        word-break:break-word!important;
    }

    .bg-mobile-home-actions{
        width:100%!important;
        max-width:100%!important;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    }

    .bg-mobile-home-actions .btn{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        padding-left:12px!important;
        padding-right:12px!important;
        white-space:normal!important;
        text-align:center!important;
    }

    .timeline-card,
    .timeline-track,
    .timeline-hours,
    .timeline-line{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
    }

    .today-filters{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
    }

    .today-filter{
        max-width:calc(100vw - 56px)!important;
    }

    .today-list,
    .today-row{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
    }

    .bottom-nav.bg-owner-mobile-nav{
        width:auto!important;
        max-width:calc(100vw - 20px)!important;
        box-sizing:border-box!important;
    }
}

@media(max-width:380px){
    .bg-mobile-home-stats{
        grid-template-columns:1fr!important;
    }

    .bg-mobile-home-stat:nth-child(3){
        grid-column:auto!important;
    }

    .bg-mobile-home-actions{
        grid-template-columns:1fr!important;
    }

    .bg-mobile-home-actions .btn:first-child{
        grid-column:auto!important;
    }
}


/* === BeautyGrafik HOTFIX V18.2: widoczny tekst w jasnych przyciskach ===
   Naprawia niewidoczny napis w jasnym przycisku w ciemnej karcie „Szybkie działania”.
   Wersja V18.2 jest do wklejenia w publiczny CSS, np. /public_html/beautygrafik/assets/css/*.css */
.btn-soft,
a.btn-soft,
button.btn-soft,
input.btn-soft,
.bg-btn-soft,
.quick-actions .btn-soft,
.quick-actions-card .btn-soft,
.crm-quick-actions .btn-soft,
.customer-quick-actions .btn-soft,
.dashboard-side-actions .btn-soft,
[class*="quick"] [class*="action"] .btn-soft,
[class*="quick"] [class*="action"] a,
[class*="szybkie"] a,
[class*="szybkie"] button,
.bg-mobile-home-actions a:not(.btn-primary),
.bg-mobile-home-actions button:not(.btn-primary),
.bg-desktop-actions a:not(.btn-primary),
.bg-desktop-actions button:not(.btn-primary),
.today-command a:not(.btn-primary),
.today-command button:not(.btn-primary) {
    color:#2f1824!important;
    text-shadow:none!important;
}

.btn-soft *,
a.btn-soft *,
button.btn-soft *,
.quick-actions .btn-soft *,
.quick-actions-card .btn-soft *,
.crm-quick-actions .btn-soft *,
.customer-quick-actions .btn-soft *,
.dashboard-side-actions .btn-soft *,
.bg-mobile-home-actions a:not(.btn-primary) *,
.bg-mobile-home-actions button:not(.btn-primary) *,
.bg-desktop-actions a:not(.btn-primary) *,
.bg-desktop-actions button:not(.btn-primary) * {
    color:inherit!important;
    text-shadow:none!important;
}

.quick-actions .btn-soft,
.quick-actions-card .btn-soft,
.crm-quick-actions .btn-soft,
.customer-quick-actions .btn-soft,
.dashboard-side-actions .btn-soft,
[class*="quick"] [class*="action"] .btn-soft,
.bg-mobile-home-actions a:not(.btn-primary),
.bg-mobile-home-actions button:not(.btn-primary),
.bg-desktop-actions a:not(.btn-primary),
.bg-desktop-actions button:not(.btn-primary),
.today-command a:not(.btn-primary),
.today-command button:not(.btn-primary) {
    background:rgba(255,255,255,.96)!important;
    border:1px solid rgba(255,255,255,.54)!important;
    box-shadow:0 12px 28px rgba(42,20,30,.10)!important;
}

.btn-primary,
a.btn-primary,
button.btn-primary,
.quick-actions .btn-primary,
.quick-actions-card .btn-primary,
.crm-quick-actions .btn-primary,
.customer-quick-actions .btn-primary,
.dashboard-side-actions .btn-primary,
.bg-mobile-home-actions .btn-primary,
.bg-desktop-actions .btn-primary,
.today-command .btn-primary {
    color:#ffffff!important;
}

.btn-primary *,
a.btn-primary *,
button.btn-primary * {
    color:inherit!important;
}
/* === /BeautyGrafik HOTFIX V18.2 === */