/* ============================================================
   Skin Remedy Clinic CRM - Experience Premium v4
   Patch 3B: premium depth + operational density + usability
   ============================================================ */

.sr-crm-body{
    --ux-ink:#172117;
    --ux-olive:#2b3d25;
    --ux-olive-2:#34492e;
    --ux-olive-deep:#1d2e1d;
    --ux-gold:#cba76b;
    --ux-gold-deep:#9b7540;
    --ux-paper:#fffdf9;
    --ux-cream:#f7f1e6;
    --ux-line:rgba(43,61,37,.11);
    --ux-muted:#74786e;
    --ux-shadow:
        0 24px 54px rgba(29,46,29,.09),
        0 5px 14px rgba(29,46,29,.045);
    --ux-shadow-float:
        0 29px 58px rgba(29,46,29,.13),
        0 8px 18px rgba(29,46,29,.06);
    background:
        radial-gradient(circle at 79% -8%,rgba(207,171,108,.13),transparent 34rem),
        linear-gradient(180deg,#faf7f1 0%,#f4efe6 100%)!important;
}

/* ---------- Sidebar refinement ---------- */

.sr-crm-sidebar{
    border-right:1px solid rgba(234,215,178,.13)!important;
    box-shadow:
        14px 0 44px rgba(20,31,18,.16),
        inset -1px 0 0 rgba(255,255,255,.035)!important;
}

.sr-crm-sidebar::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        radial-gradient(circle at 15% 0,rgba(233,213,170,.12),transparent 18rem),
        linear-gradient(105deg,rgba(255,255,255,.035),transparent 34%);
}

.sr-crm-side-link{
    position:relative!important;
    border:1px solid transparent!important;
    transition:
        transform .18s ease,
        background .18s ease,
        border-color .18s ease,
        box-shadow .18s ease!important;
}

.sr-crm-side-link:hover{
    transform:translateX(3px)!important;
    border-color:rgba(229,208,165,.10)!important;
    background:rgba(255,255,255,.055)!important;
    box-shadow:
        0 8px 18px rgba(9,16,8,.10),
        inset 0 1px 0 rgba(255,255,255,.04)!important;
}

.sr-crm-side-link.is-active{
    transform:translateX(2px)!important;
    border-color:rgba(153,111,53,.18)!important;
    background:
        radial-gradient(circle at 8% 0,rgba(255,255,255,.72),transparent 9rem),
        linear-gradient(145deg,#f7edd9,#e1c796)!important;
    box-shadow:
        0 14px 25px rgba(15,23,13,.18),
        inset 0 1px 0 rgba(255,255,255,.92),
        inset 0 -1px 0 rgba(132,96,48,.08)!important;
}

.sr-crm-side-icon{
    position:relative!important;
    overflow:hidden!important;
    box-shadow:
        0 8px 14px rgba(5,12,5,.15),
        inset 0 2px 1px rgba(255,255,255,.12),
        inset 0 -2px 4px rgba(0,0,0,.10)!important;
}

.sr-crm-side-icon::after{
    content:"";
    position:absolute;
    inset:2px 5px auto 5px;
    height:33%;
    border-radius:999px;
    background:linear-gradient(180deg,rgba(255,255,255,.20),transparent);
    pointer-events:none;
}

.sr-crm-side-link.is-active .sr-crm-side-icon{
    box-shadow:
        0 8px 15px rgba(108,78,36,.20),
        inset 0 2px 1px rgba(255,255,255,.96),
        inset 0 -3px 6px rgba(142,104,52,.10)!important;
}

/* ---------- Global premium surfaces ---------- */

.sr-crm-body :where(
    .sr-command-hero-copy,
    .sr-command-focus-card,
    .sr-command-kpi,
    .sr-command-panel,
    .sr-v15-panel,
    .sr-v15-inbox-hero,
    .sr-v18-club-crm-hero,
    .sr-role-hero,
    .sr-role-card,
    .sr-ops-card,
    .sr-ops-metrics article,
    .sr-crm-appointments-premium-v3 .sr-appointment-hero,
    .sr-crm-appointments-premium-v3 .sr-appointment-card
){
    position:relative;
    isolation:isolate;
}

.sr-crm-body :where(
    .sr-command-kpi,
    .sr-command-panel,
    .sr-v15-panel,
    .sr-role-card,
    .sr-ops-card,
    .sr-ops-metrics article
)::before{
    content:"";
    position:absolute;
    z-index:-1;
    inset:1px 1px auto 1px;
    height:38%;
    border-radius:inherit;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,.52),transparent);
    opacity:.72;
}

@media(hover:hover){
    .sr-crm-body :where(
        .sr-command-kpi,
        .sr-command-panel,
        .sr-v15-panel,
        .sr-role-card,
        .sr-ops-card,
        .sr-v18-club-metrics>a,
        .sr-v15-inbox-metrics>article
    ){
        transition:
            transform .18s ease,
            box-shadow .18s ease,
            border-color .18s ease!important;
    }

    .sr-crm-body :where(
        .sr-command-kpi,
        .sr-role-card,
        .sr-v18-club-metrics>a,
        .sr-v15-inbox-metrics>article
    ):hover{
        transform:translateY(-4px)!important;
        border-color:rgba(171,130,70,.19)!important;
        box-shadow:var(--ux-shadow-float)!important;
    }
}

/* ---------- Dashboard: compact operational command centre ---------- */

.sr-command-shell{
    width:min(100%,1600px)!important;
    padding:22px 30px 64px!important;
}

.sr-command-topline{
    align-items:center!important;
    margin-bottom:14px!important;
}

.sr-command-topline h1{
    font-size:clamp(34px,3vw,48px)!important;
}

.sr-command-topline>div:first-child>p:last-child{
    margin-top:7px!important;
    font-size:12px!important;
    line-height:1.55!important;
}

.sr-command-date,
.sr-command-secure-pill{
    min-height:46px!important;
}

.sr-command-hero{
    grid-template-columns:minmax(0,1.55fr) minmax(270px,.42fr)!important;
    gap:14px!important;
    margin-bottom:14px!important;
}

.sr-command-hero-copy,
.sr-command-focus-card{
    min-height:220px!important;
    border-radius:24px!important;
}

.sr-command-hero-copy{
    padding:27px 32px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-command-welcome{
    padding:6px 9px!important;
    font-size:8px!important;
}

.sr-command-hero-copy h2{
    max-width:760px!important;
    margin:13px 0 10px!important;
    font-size:clamp(40px,3.7vw,58px)!important;
    line-height:.96!important;
}

.sr-command-hero-copy>p{
    max-width:710px!important;
    font-size:12px!important;
    line-height:1.55!important;
}

.sr-command-workspace-chips{
    margin-top:17px!important;
}

.sr-command-focus-card{
    padding:22px!important;
    box-shadow:
        0 26px 48px rgba(24,39,22,.16),
        inset 0 1px 0 rgba(255,255,255,.08)!important;
}

.sr-command-focus-card>strong{
    font-size:56px!important;
}

.sr-command-focus-card>p{
    margin:7px 0 14px!important;
}

.sr-command-kpi-grid{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:10px!important;
    margin-bottom:20px!important;
}

.sr-command-kpi{
    min-height:108px!important;
    grid-template-columns:42px minmax(0,1fr) 14px!important;
    gap:10px!important;
    padding:14px!important;
    border-radius:18px!important;
}

.sr-command-kpi-icon{
    width:42px!important;
    height:42px!important;
    border-radius:13px!important;
}

.sr-command-kpi-icon svg{
    width:19px!important;
    height:19px!important;
}

.sr-command-kpi strong{
    font-size:27px!important;
}

.sr-command-kpi p{
    font-size:8px!important;
}

.sr-command-reception-suite{
    margin:20px 0!important;
}

.sr-command-section-head{
    margin-bottom:11px!important;
}

.sr-command-section-head h2{
    font-size:22px!important;
}

.sr-command-section-head>div>p:last-child{
    margin-top:5px!important;
    font-size:10px!important;
}

.sr-command-reception-grid{
    grid-template-columns:1.06fr 1fr .66fr!important;
    gap:11px!important;
}

.sr-command-today-panel,
.sr-command-booking-panel,
.sr-command-quick-panel{
    min-height:255px!important;
}

.sr-command-panel{
    border-radius:20px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-command-panel-head{
    padding:16px 17px 11px!important;
}

.sr-command-panel-head h3{
    font-size:18px!important;
}

.sr-command-empty{
    min-height:115px!important;
    padding:14px!important;
}

.sr-command-empty.is-small{
    min-height:105px!important;
}

.sr-command-empty-icon{
    width:36px!important;
    height:36px!important;
    border-radius:12px!important;
}

.sr-command-quick-actions{
    gap:6px!important;
    padding:0 11px 11px!important;
}

.sr-command-quick-actions a{
    min-height:45px!important;
    border-radius:12px!important;
}

.sr-command-quick-actions a>span{
    width:27px!important;
    height:27px!important;
    border-radius:9px!important;
}

.sr-command-work-grid{
    gap:11px!important;
    margin:20px 0!important;
}

.sr-command-attention-row{
    min-height:53px!important;
}

.sr-command-admin-strip{
    margin:20px 0!important;
    border-radius:18px!important;
    box-shadow:
        0 19px 34px rgba(27,43,24,.16),
        inset 0 1px 0 rgba(255,255,255,.07)!important;
}

.sr-command-latest-panel{
    margin-top:20px!important;
}

/* ---------- Leads: less landing page, more working inbox ---------- */

.sr-crm-leads-body .sr-v15-shell{
    padding-top:22px!important;
    padding-bottom:64px!important;
}

.sr-crm-leads-body .sr-v15-inbox-hero{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:end!important;
    gap:24px!important;
    margin-bottom:16px!important;
    padding:24px 28px!important;
    border-radius:24px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-crm-leads-body .sr-v15-inbox-hero h1{
    margin:5px 0 7px!important;
    font-size:clamp(38px,3.5vw,54px)!important;
    line-height:1!important;
}

.sr-crm-leads-body .sr-v15-inbox-hero p{
    max-width:760px!important;
    font-size:13px!important;
    line-height:1.6!important;
}

.sr-crm-leads-body .sr-v15-inbox-metrics{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:10px!important;
    margin-bottom:14px!important;
}

.sr-crm-leads-body .sr-v15-inbox-metrics>article{
    min-height:92px!important;
    padding:15px 17px!important;
    border-radius:17px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-crm-leads-body .sr-v15-inbox-metrics span{
    font-size:9px!important;
}

.sr-crm-leads-body .sr-v15-inbox-metrics strong{
    margin-top:8px!important;
    font-size:29px!important;
}

.sr-crm-leads-body .sr-v15-panel{
    border-radius:20px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-crm-leads-body :where(
    .sr-v15-search-panel,
    .sr-v16-queue-panel,
    .sr-v15-records-panel
){
    margin-top:12px!important;
}

/* ---------- Membership: compact operational verification ---------- */

.sr-v18-crm-club .sr-v15-shell{
    padding-top:22px!important;
    padding-bottom:64px!important;
}

.sr-v18-crm-club .sr-v18-club-crm-hero{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:24px!important;
    align-items:end!important;
    margin-bottom:16px!important;
    padding:24px 28px!important;
    border-radius:24px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-v18-crm-club .sr-v18-club-crm-hero h1{
    max-width:850px!important;
    margin:5px 0 7px!important;
    font-size:clamp(38px,3.5vw,54px)!important;
    line-height:1!important;
}

.sr-v18-crm-club .sr-v18-club-crm-hero p{
    max-width:900px!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.6!important;
}

.sr-v18-crm-club .sr-v18-club-metrics{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:10px!important;
    margin-bottom:14px!important;
}

.sr-v18-crm-club .sr-v18-club-metrics>*{
    min-height:100px!important;
    border-radius:18px!important;
    padding:16px 18px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-v18-crm-club .sr-v18-club-metrics span{
    font-size:9px!important;
}

.sr-v18-crm-club .sr-v18-club-metrics strong{
    margin-top:8px!important;
    font-size:31px!important;
}

.sr-v18-crm-club .sr-v18-application-panel{
    border-radius:22px!important;
    box-shadow:var(--ux-shadow)!important;
}

/* ---------- Roles: stronger hierarchy, less wall-of-text feel ---------- */

.sr-role-shell{
    padding-top:22px!important;
    padding-bottom:64px!important;
}

.sr-role-hero{
    margin-bottom:16px!important;
    padding:22px 26px!important;
    border-radius:23px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-role-hero h1{
    font-size:clamp(38px,3.5vw,54px)!important;
}

.sr-role-grid{
    gap:13px!important;
}

.sr-role-card{
    border-radius:20px!important;
    padding:20px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-role-card header h2{
    font-size:26px!important;
}

.sr-role-card>p{
    min-height:0!important;
    margin:8px 0 12px!important;
    font-size:11px!important;
    line-height:1.55!important;
}

.sr-role-inherits{
    margin-top:9px!important;
}

.sr-role-permissions{
    gap:10px!important;
    margin-top:12px!important;
}

.sr-role-permissions section{
    border-radius:14px!important;
}

.sr-role-permissions section>span{
    min-height:44px!important;
    padding:8px 10px!important;
}

.sr-role-permissions section>span small{
    opacity:.62!important;
    font-size:8px!important;
}

/* ---------- Staff: clarity and tighter identity management ---------- */

.sr-staff-v3-shell{
    padding-top:22px!important;
}

.sr-staff-v3-workspace{
    gap:14px!important;
}

.sr-staff-v3-invite,
.sr-staff-v3-directory{
    padding:20px!important;
    border-radius:23px!important;
}

.sr-staff-v3-row{
    gap:12px!important;
    padding:13px!important;
    border-radius:17px!important;
}

.sr-staff-v3-tools{
    margin-bottom:11px!important;
}

.sr-staff-v3-avatar{
    width:40px!important;
    height:40px!important;
    flex-basis:40px!important;
}

/* ---------- Appointments: stronger command-panel feel ---------- */

.sr-crm-appointments-premium-v3 .sr-appointment-shell{
    padding-top:22px!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-hero,
.sr-crm-appointments-premium-v3 .sr-appointment-hero--compact{
    gap:16px!important;
    margin-bottom:12px!important;
    padding:22px 25px!important;
    border-radius:23px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-hero h1{
    font-size:clamp(38px,3.6vw,55px)!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-hero aside{
    min-height:120px!important;
    border-radius:18px!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-toolbar{
    margin-bottom:12px!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-grid{
    gap:13px!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-card{
    padding:19px!important;
    border-radius:22px!important;
    box-shadow:var(--ux-shadow)!important;
}

.sr-crm-appointments-premium-v3 .sr-appointment-card-head{
    margin-bottom:13px!important;
}

/* ---------- Focus, inputs, table usability ---------- */

.sr-crm-body :where(a,button,input,select,textarea):focus-visible{
    outline:3px solid rgba(192,151,86,.28)!important;
    outline-offset:2px!important;
}

.sr-crm-body :where(input,select,textarea){
    transition:
        border-color .16s ease,
        box-shadow .16s ease,
        background .16s ease!important;
}

.sr-crm-body table tbody tr{
    transition:background .16s ease!important;
}

.sr-crm-body table tbody tr:hover{
    background:rgba(238,231,216,.42)!important;
}

/* ---------- Responsive ---------- */

@media(max-width:1500px){
    .sr-command-kpi-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }
}

@media(max-width:1280px){
    .sr-command-reception-grid{
        grid-template-columns:1fr 1fr!important;
    }

    .sr-command-quick-panel{
        grid-column:1/-1!important;
        min-height:auto!important;
    }

    .sr-command-quick-actions{
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
    }

    .sr-crm-leads-body .sr-v15-inbox-metrics{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }

    .sr-v18-crm-club .sr-v18-club-metrics{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }
}

@media(max-width:980px){
    .sr-command-shell{
        padding-left:18px!important;
        padding-right:18px!important;
    }

    .sr-command-hero{
        grid-template-columns:1fr!important;
    }

    .sr-command-focus-card{
        min-height:190px!important;
    }

    .sr-command-quick-actions{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    .sr-crm-leads-body .sr-v15-inbox-hero,
    .sr-v18-crm-club .sr-v18-club-crm-hero{
        grid-template-columns:1fr!important;
        align-items:start!important;
    }
}

@media(max-width:720px){
    .sr-command-kpi-grid,
    .sr-crm-leads-body .sr-v15-inbox-metrics,
    .sr-v18-crm-club .sr-v18-club-metrics{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    .sr-command-reception-grid{
        grid-template-columns:1fr!important;
    }

    .sr-command-quick-panel{
        grid-column:auto!important;
    }

    .sr-command-hero-copy{
        padding:23px 20px!important;
    }

    .sr-command-hero-copy h2{
        font-size:clamp(38px,10.5vw,50px)!important;
    }

    .sr-crm-leads-body .sr-v15-inbox-hero,
    .sr-v18-crm-club .sr-v18-club-crm-hero,
    .sr-role-hero{
        padding:20px!important;
    }
}

@media(max-width:520px){
    .sr-command-shell{
        padding-left:12px!important;
        padding-right:12px!important;
    }

    .sr-command-kpi-grid,
    .sr-crm-leads-body .sr-v15-inbox-metrics,
    .sr-v18-crm-club .sr-v18-club-metrics{
        grid-template-columns:1fr 1fr!important;
        gap:8px!important;
    }

    .sr-command-kpi{
        grid-template-columns:38px minmax(0,1fr)!important;
    }

    .sr-command-kpi>i{
        display:none!important;
    }

    .sr-command-quick-actions{
        grid-template-columns:1fr!important;
    }
}

@media(prefers-reduced-motion:reduce){
    .sr-crm-body *,
    .sr-crm-body *::before,
    .sr-crm-body *::after{
        scroll-behavior:auto!important;
    }
}
