:root{--bg:#f5f7f8;--surface:#fff;--surface-2:#f0f4f2;--text:#17221d;--muted:#66756d;--line:#dce5e0;--primary:#138a5b;--primary-dark:#0d6c47;--primary-soft:#e9f7f0;--danger:#c53b3b;--danger-soft:#fff0f0;--warning:#9a6a00;--warning-soft:#fff7dc;--info:#2865a5;--info-soft:#edf5ff;--shadow:0 14px 40px rgba(24,50,37,.08);--radius:18px;--sidebar:264px}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}body{margin:0;min-height:100vh}a{color:inherit}button,input,select,textarea{font:inherit}.icon{width:21px;height:21px;flex:0 0 21px}.app-body{background:var(--bg)}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:40;transition:transform .25s ease}.brand{height:72px;display:flex;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid var(--line)}.brand img,.auth-brand img{width:43px;height:43px;object-fit:contain}.brand div,.auth-brand div{display:flex;flex-direction:column;line-height:1}.brand strong,.auth-brand strong{font-size:18px}.brand span,.auth-brand span{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:6px}.sidebar-close{display:none;margin-left:auto}.shop-context{margin:16px 14px 8px;padding:14px;border-radius:15px;background:var(--primary-soft);display:flex;flex-direction:column;gap:3px;min-width:0}.shop-context span,.shop-context small{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.shop-context strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-nav{padding:10px 12px;display:flex;flex-direction:column;gap:5px;overflow:auto}.nav-link{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:12px;text-decoration:none;color:#405047;font-size:14px;font-weight:650;transition:.18s}.nav-link:hover{background:var(--surface-2);color:var(--text)}.nav-link.active{background:var(--primary);color:#fff}.nav-link.danger{color:var(--danger);background:var(--danger-soft)}.sidebar-footer{margin-top:auto;padding:14px}.app-main{min-height:100vh;margin-left:var(--sidebar)}.topbar{height:72px;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:0 24px;display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:25}.icon-button{width:42px;height:42px;border:0;border-radius:12px;background:var(--surface-2);color:var(--text);display:none;align-items:center;justify-content:center;cursor:pointer}.topbar-title{display:flex;flex-direction:column}.topbar-title strong{font-size:17px}.topbar-title span{font-size:12px;color:var(--muted)}.user-menu{margin-left:auto;display:flex;align-items:center;gap:11px}.user-copy{text-align:right;display:flex;flex-direction:column;max-width:220px}.user-copy strong,.user-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-copy span{font-size:12px;color:var(--muted)}.avatar{width:42px;height:42px;border-radius:13px;background:var(--primary);color:#fff;display:grid;place-items:center;font-weight:800}.content{padding:26px;max-width:1500px;margin:0 auto}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}.page-header h1{font-size:26px;line-height:1.2;margin:0 0 6px}.page-header p{margin:0;color:var(--muted);max-width:760px}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.btn{border:1px solid transparent;border-radius:12px;padding:10px 16px;min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:750;cursor:pointer;transition:.18s}.btn .icon{width:18px;height:18px}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{background:#fff;border-color:var(--line);color:var(--text)}.btn-danger{background:var(--danger-soft);color:var(--danger)}.btn-warning{background:var(--warning-soft);color:var(--warning)}.btn-small{min-height:35px;padding:7px 10px;font-size:12px;border-radius:10px}.grid{display:grid;gap:18px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 5px 22px rgba(29,51,40,.035);padding:20px}.card h2,.card h3{margin:0}.card-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.metric{display:flex;flex-direction:column;gap:7px}.metric-label{color:var(--muted);font-size:13px;font-weight:650}.metric-value{font-size:28px;font-weight:850;line-height:1.1}.metric-foot{color:var(--muted);font-size:12px}.metric-icon{width:46px;height:46px;border-radius:14px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center}.metric-card{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.hero-card{background:linear-gradient(135deg,#0c6f4a,#15a26c);color:#fff;border:0}.hero-card .metric-label,.hero-card .metric-foot{color:rgba(255,255,255,.8)}.hero-card .metric-icon{background:rgba(255,255,255,.15);color:#fff}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:750}.field small{font-size:12px;color:var(--muted)}.input,.select,.textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--text);padding:11px 13px;outline:none;transition:.18s}.input,.select{min-height:45px}.textarea{min-height:100px;resize:vertical}.input:focus,.select:focus,.textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(19,138,91,.12)}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}.table{width:100%;border-collapse:collapse;min-width:780px;background:#fff}.table th,.table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;white-space:nowrap}.table th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;background:#f8faf9}.table tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:var(--surface-2);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.badge.success{background:var(--primary-soft);color:var(--primary-dark)}.badge.danger{background:var(--danger-soft);color:var(--danger)}.badge.warning{background:var(--warning-soft);color:var(--warning)}.alert{border-radius:14px;padding:13px 15px;margin-bottom:18px;border:1px solid var(--line);background:#fff}.alert.success{background:var(--primary-soft);border-color:#cbead9;color:var(--primary-dark)}.alert.error,.alert.danger{background:var(--danger-soft);border-color:#ffd1d1;color:var(--danger)}.alert.warning{background:var(--warning-soft);border-color:#f1df9f;color:#765200}.alert.info{background:var(--info-soft);border-color:#cfe2fa;color:#234f7d}.empty-state{padding:38px 20px;text-align:center;color:var(--muted)}.shop-card{display:flex;flex-direction:column;gap:18px}.shop-card-head{display:flex;justify-content:space-between;gap:15px}.shop-card h3{font-size:20px}.shop-meta{display:grid;gap:8px;color:var(--muted);font-size:13px}.shop-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}.section{margin-top:24px}.split{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.7fr);gap:20px}.progress{height:9px;background:var(--surface-2);border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:var(--primary);border-radius:999px}.sidebar-overlay{display:none}.auth-body{background:#f7f9fb}.auth-layout{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(410px,.92fr)}.auth-visual{display:grid;place-items:center;padding:35px;background:linear-gradient(145deg,#eef7ff,#f5fff9)}.auth-visual img{width:min(100%,820px);max-height:92vh;object-fit:contain}.auth-panel{display:grid;place-items:center;background:#fff;padding:30px}.auth-card{width:min(100%,500px)}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:30px}.auth-card h1{font-size:32px;margin:0 0 10px}.auth-card>p{color:var(--muted);margin:0 0 24px;line-height:1.65}.auth-footer{text-align:center;color:var(--muted);font-size:13px;margin-top:20px}.auth-footer a{color:var(--primary);font-weight:800;text-decoration:none}.error-page{background:#f7faf8}.error-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);align-items:center;gap:25px;padding:35px}.error-illustration{width:100%;max-height:88vh;object-fit:contain}.error-copy{max-width:500px}.error-copy h1{font-size:38px;margin:0 0 12px}.error-copy p{color:var(--muted);line-height:1.7}.error-copy small{color:var(--muted)}.mobile-only{display:none}@media(max-width:1100px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.split{grid-template-columns:1fr}.auth-layout{grid-template-columns:1fr}.auth-visual{display:none}}@media(max-width:820px){.sidebar{transform:translateX(-100%)}body.sidebar-open .sidebar{transform:translateX(0)}.sidebar-close{display:flex}.sidebar-overlay{display:block;position:fixed;inset:0;background:rgba(9,24,16,.48);z-index:35;opacity:0;pointer-events:none;transition:.2s}body.sidebar-open .sidebar-overlay{opacity:1;pointer-events:auto}.app-main{margin-left:0}.topbar{padding:0 14px}.topbar>.icon-button{display:flex}.content{padding:18px}.user-copy{display:none}.page-header{flex-direction:column}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.mobile-only{display:block}}@media(max-width:520px){.content{padding:14px}.card{padding:16px;border-radius:16px}.page-header h1{font-size:23px}.auth-panel{padding:22px}.auth-card h1{font-size:27px}.actions{width:100%}.actions .btn{flex:1}.error-shell{grid-template-columns:1fr;padding:18px}.error-copy{text-align:center}.error-copy h1{font-size:29px}.error-illustration{max-height:48vh}.metric-value{font-size:24px}}

/* Auth v2 - responsive, simple et moderne */
.auth-body{min-height:100vh;background:radial-gradient(circle at 12% 12%,rgba(19,138,91,.14),transparent 32%),radial-gradient(circle at 90% 8%,rgba(24,50,37,.08),transparent 28%),linear-gradient(135deg,#f4fbf7,#f8fafc 48%,#eef7f2);overflow-x:hidden}.auth-layout{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(380px,.94fr);gap:0}.auth-visual{display:flex;align-items:center;justify-content:center;padding:clamp(24px,4vw,54px);position:relative}.auth-visual-card{width:min(100%,760px);min-height:min(760px,88vh);border:1px solid rgba(255,255,255,.78);border-radius:34px;background:rgba(255,255,255,.62);box-shadow:0 30px 90px rgba(16,62,42,.14);backdrop-filter:blur(18px);padding:28px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;position:relative}.auth-visual-card:before{content:"";position:absolute;inset:-22% -18% auto auto;width:420px;height:420px;background:rgba(19,138,91,.12);border-radius:50%;filter:blur(2px)}.auth-brand-hero{position:relative;z-index:1;margin:0}.auth-brand-mobile{margin-bottom:24px}.auth-illustration{position:relative;z-index:1;width:min(100%,590px);max-height:56vh;object-fit:contain;align-self:center;filter:drop-shadow(0 22px 35px rgba(14,68,44,.14))}.auth-benefits{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.auth-benefits div{background:rgba(255,255,255,.76);border:1px solid rgba(220,229,224,.76);border-radius:18px;padding:14px;box-shadow:0 10px 26px rgba(24,50,37,.06)}.auth-benefits strong{display:block;font-size:13px}.auth-benefits span{display:block;margin-top:5px;color:var(--muted);font-size:11px;line-height:1.35}.auth-panel{display:flex;align-items:center;justify-content:center;padding:clamp(18px,4vw,54px);background:rgba(255,255,255,.8);backdrop-filter:blur(14px)}.auth-card{width:min(100%,520px);padding:clamp(22px,3.4vw,38px);border:1px solid rgba(220,229,224,.92);border-radius:30px;background:#fff;box-shadow:0 24px 70px rgba(24,50,37,.1)}.auth-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:var(--primary-soft);color:var(--primary-dark);font-size:12px;font-weight:850;margin-bottom:14px}.auth-card h1{font-size:clamp(28px,4.2vw,42px);line-height:1.05;letter-spacing:-.04em;margin:0 0 12px;color:#102119}.auth-card>p{font-size:15px;line-height:1.7;color:var(--muted);margin:0 0 24px}.auth-form{gap:17px}.auth-input{min-height:52px;border-radius:15px;padding:13px 15px;background:#fbfdfc}.auth-input::placeholder{color:#9ba8a1}.label-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.label-row a{font-size:12px;font-weight:850;text-decoration:none;color:var(--primary)}.password-field{position:relative}.password-field .input{padding-right:54px}.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;border-radius:12px;background:transparent;color:#718178;display:grid;place-items:center;cursor:pointer;transition:.18s}.password-toggle:hover{background:var(--primary-soft);color:var(--primary-dark)}.password-toggle .eye{width:21px;height:21px}.password-toggle .eye-closed{display:none}.password-toggle.is-visible .eye-open{display:none}.password-toggle.is-visible .eye-closed{display:block}.btn-auth{min-height:52px;width:100%;border-radius:15px;font-size:15px;box-shadow:0 14px 26px rgba(19,138,91,.22)}.username-preview{border:1px dashed #c7ded1;background:#f7fcf9;color:#4d5f55;border-radius:14px;padding:11px 13px;font-size:12px;line-height:1.45}.username-preview strong{color:var(--primary-dark);font-weight:900}.auth-footer{margin-top:22px;text-align:center;color:var(--muted);font-size:14px}.auth-footer a{color:var(--primary);font-weight:900;text-decoration:none}.auth-footer a:hover{text-decoration:underline}@media(max-width:1120px){.auth-layout{grid-template-columns:1fr}.auth-visual{display:none}.auth-panel{min-height:100vh}.auth-card{width:min(100%,560px)}}@media(max-width:620px){.auth-body{background:#fff}.auth-panel{padding:14px;align-items:stretch}.auth-card{min-height:calc(100vh - 28px);border-radius:24px;padding:22px 18px;box-shadow:none;border-color:#eef3f0}.auth-brand-mobile{margin-bottom:18px}.auth-card h1{font-size:30px}.auth-card>p{font-size:14px;margin-bottom:20px}.form-grid.auth-form{grid-template-columns:1fr}.field.full{grid-column:auto}.label-row{align-items:flex-start;flex-direction:column;gap:5px}.auth-input{min-height:50px}.auth-footer{font-size:13px}}

/* Auth premium mobile v3 - surcharge visuelle */
.auth-body{min-height:100vh;background:radial-gradient(circle at 15% 12%,rgba(17,163,106,.26),transparent 28%),radial-gradient(circle at 88% 16%,rgba(9,37,26,.16),transparent 30%),linear-gradient(135deg,#ecfff5 0%,#f7fbf8 42%,#eef8f2 100%)!important;overflow-x:hidden}.auth-card{position:relative;overflow:hidden;border-radius:34px!important;box-shadow:0 28px 85px rgba(9,37,26,.13)!important}.auth-card:before{content:"";position:absolute;top:0;left:0;right:0;height:7px;background:linear-gradient(90deg,#11a36a,#0b7c52,#98e3bd)}.auth-mobile-hero{display:none}.auth-input{border-radius:18px!important;box-shadow:0 8px 20px rgba(9,37,26,.035)!important}.auth-input:focus{transform:translateY(-1px);box-shadow:0 0 0 5px rgba(17,163,106,.14),0 12px 26px rgba(9,37,26,.06)!important}.btn-auth{border-radius:18px!important;background:linear-gradient(135deg,#12a86d,#08784d)!important;box-shadow:0 18px 34px rgba(17,163,106,.28)!important}@media(max-width:680px){.auth-body{background:radial-gradient(circle at 14% 0%,rgba(38,217,137,.28),transparent 34%),radial-gradient(circle at 90% 14%,rgba(255,255,255,.14),transparent 26%),linear-gradient(160deg,#06291d 0%,#0a4b33 47%,#f2fbf6 47.2%,#fff 100%)!important}.auth-panel{background:transparent!important;padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom))!important;align-items:stretch!important}.auth-card{min-height:calc(100vh - 28px)!important;border-radius:30px!important;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.91))!important;box-shadow:0 26px 70px rgba(2,24,15,.25)!important;border:1px solid rgba(255,255,255,.72)!important;padding:18px!important}.auth-card:before{display:none}.auth-brand-mobile{display:flex!important;margin-bottom:14px!important}.auth-mobile-hero{display:grid!important;grid-template-columns:82px minmax(0,1fr)!important;gap:13px!important;align-items:center!important;min-height:116px!important;margin:0 0 18px!important;padding:14px!important;border-radius:26px!important;color:#fff!important;background:radial-gradient(circle at 88% 8%,rgba(255,255,255,.22),transparent 25%),linear-gradient(135deg,#0f9d67,#063d2a)!important;box-shadow:0 20px 45px rgba(7,82,53,.25)!important;overflow:hidden!important;position:relative!important}.auth-mobile-hero:after{content:"";position:absolute;width:160px;height:160px;right:-66px;bottom:-88px;border-radius:50%;background:rgba(255,255,255,.12)}.auth-mobile-hero img{width:82px!important;height:82px!important;object-fit:contain!important;position:relative;z-index:1;filter:drop-shadow(0 10px 16px rgba(0,0,0,.15))}.auth-mobile-hero strong{display:block;position:relative;z-index:1;font-size:16px;line-height:1.25;letter-spacing:-.02em}.auth-mobile-hero span{display:inline-flex;position:relative;z-index:1;margin-top:8px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.16);color:rgba(255,255,255,.92);font-size:11px;font-weight:900}.auth-card h1{font-size:clamp(29px,9vw,38px)!important}.auth-card>p{font-size:13.5px!important;line-height:1.58!important}.form-grid.auth-form{grid-template-columns:1fr!important;gap:14px!important}.field.full{grid-column:auto!important}.input,.auth-input{min-height:52px!important;border-radius:17px!important;background:#fff!important;border-color:#ddebe4!important}.btn-auth{min-height:54px!important;border-radius:18px!important}}

/* =========================================================
   Auth spacing fix + dashboards premium responsive v4
   ========================================================= */
@media (max-width: 680px) {
    .auth-form .label-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-items: start !important;
        justify-content: start !important;
        gap: 9px !important;
        margin-bottom: 10px !important;
    }

    .auth-form .label-row label {
        line-height: 1.2 !important;
    }

    .auth-form .label-row a {
        justify-self: start !important;
        display: inline-flex !important;
        align-items: center !important;
        min-height: 34px !important;
        padding: 8px 12px !important;
        border-radius: 999px !important;
        background: #eefbf4 !important;
        border: 1px solid rgba(17, 163, 106, .16) !important;
        color: #08784d !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        box-shadow: 0 8px 18px rgba(8, 120, 77, .08) !important;
    }
}

.app-body {
    background:
        radial-gradient(circle at top left, rgba(17,163,106,.13), transparent 34%),
        radial-gradient(circle at 88% 12%, rgba(13,108,71,.10), transparent 28%),
        linear-gradient(180deg, #f7fbf8 0%, #f3f7f5 100%);
}

.content {
    padding-bottom: 34px;
}

.dashboard-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 22px;
    align-items: stretch;
    margin-bottom: 22px;
    padding: clamp(22px, 4vw, 34px);
    border-radius: 30px;
    border: 1px solid rgba(255,255,255,.74);
    background:
        radial-gradient(circle at 16% 22%, rgba(255,255,255,.21), transparent 28%),
        linear-gradient(135deg, #08402d 0%, #0e8055 52%, #14ad73 100%);
    box-shadow: 0 24px 75px rgba(8, 64, 45, .23);
    color: #fff;
}

.dashboard-hero:before,
.dashboard-hero:after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.dashboard-hero:before {
    width: 300px;
    height: 300px;
    right: -110px;
    top: -130px;
    background: rgba(255,255,255,.13);
}

.dashboard-hero:after {
    width: 210px;
    height: 210px;
    left: 45%;
    bottom: -150px;
    background: rgba(255,255,255,.08);
}

.hero-copy,
.hero-panel,
.hero-date-card {
    position: relative;
    z-index: 1;
}

.hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 31px;
    padding: 7px 12px;
    margin-bottom: 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.19);
    color: rgba(255,255,255,.92);
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.hero-copy h1 {
    margin: 0;
    font-size: clamp(30px, 5vw, 52px);
    line-height: .98;
    letter-spacing: -.05em;
}

.hero-copy p {
    max-width: 650px;
    margin: 16px 0 0;
    color: rgba(255,255,255,.82);
    font-size: 15px;
    line-height: 1.7;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-top: 23px;
}

.btn-light {
    background: #fff;
    color: #0a4b33;
    border-color: rgba(255,255,255,.95);
    box-shadow: 0 13px 30px rgba(0,0,0,.13);
}

.btn-light:hover {
    transform: translateY(-1px);
}

.btn-ghost-light {
    background: rgba(255,255,255,.13);
    color: #fff;
    border-color: rgba(255,255,255,.22);
}

.btn-ghost-light:hover {
    background: rgba(255,255,255,.20);
}

.hero-panel,
.hero-date-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 230px;
    padding: 20px;
    border-radius: 24px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.18);
    backdrop-filter: blur(12px);
}

.hero-panel-top span,
.hero-date-card label {
    display: block;
    color: rgba(255,255,255,.75);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.hero-panel-top strong {
    display: block;
    margin-top: 7px;
    font-size: 24px;
}

.hero-countdown {
    display: flex;
    align-items: end;
    gap: 10px;
    margin-top: 18px;
}

.hero-countdown strong {
    font-size: 54px;
    line-height: .9;
    letter-spacing: -.05em;
}

.hero-countdown span {
    padding-bottom: 5px;
    color: rgba(255,255,255,.76);
    font-weight: 750;
}

.hero-progress {
    height: 10px;
    margin: 18px 0 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.18);
}

.hero-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #fff;
}

.hero-panel small {
    color: rgba(255,255,255,.76);
}

.hero-date-card .input {
    margin: 14px 0 12px;
    color: #102119;
    border: 0;
    background: rgba(255,255,255,.93);
}

.dash-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.dash-stat-card {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    min-height: 155px;
    padding: 20px;
    border-radius: 24px;
    border: 1px solid rgba(220,229,224,.92);
    background: rgba(255,255,255,.92);
    box-shadow: 0 15px 48px rgba(24,50,37,.07);
}

.dash-stat-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, rgba(17,163,106,.95), rgba(152,227,189,.8));
}

.dash-stat-card.primary {
    border: 0;
    color: #fff;
    background: linear-gradient(135deg, #0a4b33, #11a36a);
}

.dash-stat-card.primary:before {
    background: rgba(255,255,255,.26);
}

.dash-stat-card span {
    display: block;
    color: #66756d;
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.dash-stat-card.primary span,
.dash-stat-card.primary small {
    color: rgba(255,255,255,.76);
}

.dash-stat-card strong {
    display: block;
    margin-top: 12px;
    font-size: clamp(23px, 3vw, 32px);
    line-height: 1.04;
    letter-spacing: -.04em;
}

.dash-stat-card .status-text {
    font-size: 24px;
    text-transform: capitalize;
}

.dash-stat-card small {
    display: block;
    margin-top: 9px;
    color: #7a8a82;
    font-size: 12px;
    line-height: 1.35;
}

.dash-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    border-radius: 17px;
    color: #08784d;
    background: #eaf9f2;
}

.primary .dash-icon {
    color: #fff;
    background: rgba(255,255,255,.15);
}

.dash-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(310px, .75fr);
    gap: 20px;
    align-items: start;
}

.dash-main-column,
.dash-side-column {
    display: grid;
    gap: 20px;
}

.dash-card {
    overflow: hidden;
    border: 1px solid rgba(220,229,224,.92);
    border-radius: 26px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 18px 55px rgba(24,50,37,.075);
    padding: clamp(18px, 2.4vw, 24px);
}

.dash-card-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.dash-card-head h2 {
    margin: 0;
    font-size: 19px;
    letter-spacing: -.02em;
}

.dash-card-head p {
    margin: 6px 0 0;
    color: #66756d;
    font-size: 13px;
    line-height: 1.5;
}

.quick-action-grid,
.module-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}

.quick-action,
.module-card {
    min-height: 142px;
    padding: 17px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-radius: 20px;
    border: 1px solid #e4eee8;
    background: linear-gradient(180deg, #fff, #f8fcfa);
    text-decoration: none;
    transition: .18s ease;
}

.quick-action:hover,
.module-card:hover,
.shop-row-card:hover {
    transform: translateY(-2px);
    border-color: rgba(17,163,106,.30);
    box-shadow: 0 18px 40px rgba(24,50,37,.09);
}

.quick-action span,
.module-card span {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    color: #08784d;
    background: #eaf9f2;
}

.quick-action strong,
.module-card strong {
    font-size: 15px;
}

.quick-action small,
.module-card small {
    color: #66756d;
    line-height: 1.35;
}

.premium-empty {
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: 36px 18px;
    text-align: center;
    border-radius: 22px;
    background: #f7fcf9;
    border: 1px dashed #c7ded1;
}

.premium-empty > div {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 20px;
    color: #08784d;
    background: #eaf9f2;
}

.premium-empty p {
    max-width: 430px;
    margin: 0;
    color: #66756d;
    line-height: 1.6;
}

.shop-list-premium {
    display: grid;
    gap: 12px;
}

.shop-row-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 15px;
    border-radius: 20px;
    border: 1px solid #e4eee8;
    background: #fff;
    transition: .18s ease;
}

.shop-row-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #08784d;
    background: #eaf9f2;
}

.shop-row-body {
    min-width: 0;
}

.shop-row-body h3 {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
}

.shop-row-body p {
    margin: 5px 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #66756d;
    font-size: 13px;
}

.shop-row-body span {
    display: inline-flex;
    margin-top: 7px;
    color: #7a8a82;
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.shop-row-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

.subscription-card .wide,
.btn.wide {
    width: 100%;
}

.subscription-status {
    padding: 16px;
    border-radius: 20px;
    background: #eaf9f2;
    border: 1px solid #d4f0e1;
}

.subscription-status span {
    display: block;
    color: #08784d;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.subscription-status strong {
    display: block;
    margin-top: 7px;
    font-size: 20px;
}

.quota-box {
    display: grid;
    gap: 10px;
    margin: 15px 0;
    padding: 15px;
    border-radius: 18px;
    background: #f8fcfa;
}

.quota-box div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.quota-box span {
    color: #66756d;
}

.activity-list-premium {
    display: grid;
    gap: 12px;
}

.activity-item-premium {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.activity-dot {
    width: 10px;
    height: 10px;
    margin-top: 6px;
    border-radius: 999px;
    background: #11a36a;
    box-shadow: 0 0 0 5px #eaf9f2;
}

.activity-item-premium strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.activity-item-premium small,
.activity-empty {
    display: block;
    margin-top: 3px;
    color: #66756d;
    font-size: 12px;
}

.rate-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.rate-strip article {
    padding: 17px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid #dce5e0;
    box-shadow: 0 12px 35px rgba(24,50,37,.055);
}

.rate-strip span {
    color: #66756d;
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.rate-strip strong {
    display: block;
    margin-top: 9px;
    font-size: clamp(22px, 3vw, 30px);
    letter-spacing: -.04em;
}

.rate-strip small {
    display: block;
    margin-top: 8px;
    color: #66756d;
    line-height: 1.4;
}

.timeline-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.timeline-steps div {
    padding: 16px;
    border-radius: 18px;
    background: #f8fcfa;
    border: 1px solid #e4eee8;
}

.timeline-steps span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin-bottom: 11px;
    border-radius: 12px;
    color: #fff;
    background: #11a36a;
    font-weight: 900;
}

.timeline-steps strong {
    display: block;
}

.timeline-steps small {
    display: block;
    margin-top: 6px;
    color: #66756d;
    line-height: 1.4;
}

.info-list {
    display: grid;
    gap: 12px;
}

.info-list div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 13px;
    border-radius: 16px;
    background: #f8fcfa;
}

.info-list span {
    color: #66756d;
}

.info-list strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mobile-quickbar {
    display: none;
}

.dashboard-alert {
    margin-top: -6px;
}

@media (max-width: 1200px) {
    .dash-stats,
    .quick-action-grid,
    .module-grid,
    .timeline-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dash-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    .content {
        padding: 18px 14px 96px;
    }

    .topbar {
        height: 64px;
        border-bottom-color: rgba(220,229,224,.75);
    }

    .topbar-title strong {
        font-size: 15px;
    }

    .avatar {
        width: 38px;
        height: 38px;
        border-radius: 13px;
    }

    .dashboard-hero {
        grid-template-columns: 1fr;
        border-radius: 26px;
        padding: 22px;
    }

    .hero-copy h1 {
        font-size: 34px;
    }

    .hero-copy p {
        font-size: 13.5px;
        line-height: 1.6;
    }

    .hero-actions .btn,
    .hero-date-card .btn {
        width: 100%;
    }

    .hero-panel,
    .hero-date-card {
        min-height: auto;
    }

    .dash-stats,
    .rate-strip {
        grid-template-columns: 1fr;
    }

    .dash-stat-card {
        min-height: 128px;
        border-radius: 22px;
    }

    .quick-action-grid,
    .module-grid,
    .timeline-steps {
        grid-template-columns: 1fr;
    }

    .quick-action,
    .module-card {
        min-height: auto;
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr);
        align-items: center;
        column-gap: 13px;
    }

    .quick-action small,
    .module-card small {
        grid-column: 2;
    }

    .shop-row-card {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    .shop-row-icon {
        width: 46px;
        height: 46px;
    }

    .shop-row-actions {
        grid-column: 1 / -1;
        justify-content: space-between;
    }

    .dash-card-head.with-action {
        display: grid;
    }

    .dash-card-head.with-action .btn {
        justify-self: start;
    }

    .mobile-quickbar {
        position: fixed;
        left: 12px;
        right: 12px;
        bottom: max(12px, env(safe-area-inset-bottom));
        z-index: 30;
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 1fr;
        gap: 6px;
        padding: 8px;
        border: 1px solid rgba(220,229,224,.90);
        border-radius: 24px;
        background: rgba(255,255,255,.94);
        box-shadow: 0 22px 60px rgba(10, 55, 36, .22);
        backdrop-filter: blur(16px);
    }

    .mobile-quickbar a {
        min-height: 54px;
        display: grid;
        place-items: center;
        gap: 3px;
        color: #405047;
        text-decoration: none;
        font-size: 11px;
        font-weight: 850;
        border-radius: 17px;
    }

    .mobile-quickbar a:hover {
        background: #eaf9f2;
        color: #08784d;
    }

    .mobile-quickbar .icon {
        width: 19px;
        height: 19px;
    }
}

@media (max-width: 430px) {
    .content {
        padding-left: 12px;
        padding-right: 12px;
    }

    .dashboard-hero {
        padding: 18px;
        border-radius: 24px;
    }

    .hero-copy h1 {
        font-size: 30px;
    }

    .dash-card,
    .dash-stat-card,
    .rate-strip article {
        border-radius: 20px;
    }

    .dash-stat-card strong {
        font-size: 25px;
    }

    .mobile-quickbar a span {
        font-size: 10px;
    }
}

/* =========================================================
   Profile, dashboard layout and activity journal premium v5
   ========================================================= */
.profile-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 360px);
    gap: 20px;
    align-items: stretch;
    margin-bottom: 22px;
    padding: clamp(22px, 4vw, 34px);
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 15% 22%, rgba(255,255,255,.18), transparent 28%),
        radial-gradient(circle at 96% 8%, rgba(255,255,255,.14), transparent 26%),
        linear-gradient(135deg, #08291e 0%, #0b724c 58%, #13a76d 100%);
    box-shadow: 0 24px 75px rgba(8, 64, 45, .22);
}

.profile-hero:before {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    right: -92px;
    bottom: -130px;
    border-radius: 999px;
    background: rgba(255,255,255,.11);
}

.profile-hero-copy,
.profile-hero-card {
    position: relative;
    z-index: 1;
}

.profile-hero h1 {
    margin: 0;
    font-size: clamp(31px, 5vw, 54px);
    line-height: 1;
    letter-spacing: -.055em;
}

.profile-hero p {
    max-width: 660px;
    margin: 15px 0 0;
    color: rgba(255,255,255,.80);
    line-height: 1.7;
}

.profile-hero-card {
    display: grid;
    align-content: center;
    justify-items: start;
    gap: 14px;
    min-height: 210px;
    padding: 22px;
    border-radius: 25px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.13);
    backdrop-filter: blur(14px);
}

.profile-avatar-large {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    color: #0a4b33;
    background: #fff;
    box-shadow: 0 18px 35px rgba(0,0,0,.15);
    font-size: 28px;
    font-weight: 950;
}

.profile-hero-card span {
    display: block;
    color: rgba(255,255,255,.72);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.profile-hero-card strong {
    display: block;
    margin-top: 7px;
    font-size: 25px;
    letter-spacing: -.03em;
}

.profile-hero-card small {
    display: block;
    margin-top: 6px;
    color: rgba(255,255,255,.72);
}

.profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    gap: 20px;
    align-items: start;
}

.profile-form-card,
.profile-security-card {
    border-radius: 28px;
}

.profile-form {
    gap: 17px;
}

.locked-input {
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px dashed #c7ded1;
    color: #0b1f17;
    background: linear-gradient(180deg, #f8fcfa, #eefbf4);
}

.locked-input span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    color: #08784d;
    background: #fff;
}

.locked-input strong {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.locked-input small {
    margin: 0;
    padding: 7px 10px;
    border-radius: 999px;
    color: #08784d;
    background: #dff7eb;
    font-size: 11px;
    font-weight: 900;
}

.profile-password-field .password-toggle {
    right: 10px;
}

.profile-submit-row .btn {
    min-height: 52px;
    border-radius: 18px;
}

.profile-security-card {
    position: sticky;
    top: 88px;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(17,163,106,.13), transparent 35%),
        #fff;
}

.security-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    border-radius: 20px;
    color: #08784d;
    background: #eaf9f2;
}

.profile-security-card h2 {
    margin: 0 0 8px;
    font-size: 21px;
}

.profile-security-card p {
    margin: 0;
    color: #66756d;
    line-height: 1.6;
}

.profile-info-list {
    display: grid;
    gap: 11px;
    margin-top: 18px;
}

.profile-info-list div {
    padding: 13px;
    border-radius: 16px;
    background: #f8fcfa;
    border: 1px solid #e4eee8;
}

.profile-info-list span {
    display: block;
    color: #66756d;
    font-size: 12px;
    font-weight: 850;
}

.profile-info-list strong {
    display: block;
    margin-top: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dash-management-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(300px, .75fr);
    gap: 20px;
    align-items: stretch;
    margin-bottom: 20px;
}

.dash-management-grid > .dash-card {
    height: 100%;
}

.dashboard-subscription-inline {
    display: flex;
    flex-direction: column;
}

.dashboard-subscription-inline .quota-box {
    flex: 1;
}

.compact-head {
    margin-bottom: 14px;
}

.shops-wide-card,
.activity-dashboard-card {
    margin-bottom: 20px;
}

.shop-list-wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.activity-empty-premium {
    padding: 20px;
    border-radius: 20px;
    color: #66756d;
    background: #f8fcfa;
    border: 1px dashed #c7ded1;
    text-align: center;
}

.activity-mini-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
}

.activity-mini-item {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 13px;
    align-items: start;
    padding: 15px;
    border-radius: 20px;
    border: 1px solid #e4eee8;
    background: linear-gradient(180deg, #fff, #f8fcfa);
}

.activity-mini-item p {
    margin: 5px 0 0;
    color: #66756d;
    line-height: 1.5;
    font-size: 13px;
}

.activity-mini-item small {
    display: block;
    margin-top: 8px;
    color: #87948e;
    font-size: 12px;
}

.activity-mini-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #08784d;
    background: #eaf9f2;
}

.activity-mini-item.success .activity-mini-icon { color: #08784d; background: #eaf9f2; }
.activity-mini-item.warning .activity-mini-icon { color: #a56600; background: #fff3d7; }
.activity-mini-item.danger .activity-mini-icon { color: #b42318; background: #fee4e2; }
.activity-mini-item.info .activity-mini-icon { color: #155eef; background: #e8efff; }

.activity-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 390px);
    gap: 22px;
    align-items: end;
    margin-bottom: 20px;
    padding: clamp(22px, 4vw, 34px);
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 14% 18%, rgba(255,255,255,.18), transparent 26%),
        linear-gradient(135deg, #09251a 0%, #0a6b47 58%, #14ad73 100%);
    box-shadow: 0 24px 75px rgba(8, 64, 45, .22);
}

.activity-hero h1 {
    margin: 0;
    font-size: clamp(31px, 5vw, 54px);
    line-height: 1;
    letter-spacing: -.055em;
}

.activity-hero p {
    max-width: 720px;
    margin: 15px 0 0;
    color: rgba(255,255,255,.80);
    line-height: 1.7;
}

.activity-filter {
    padding: 17px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.13);
    backdrop-filter: blur(14px);
}

.activity-filter label {
    display: block;
    margin-bottom: 10px;
    color: rgba(255,255,255,.78);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.activity-filter div {
    display: flex;
    gap: 10px;
}

.activity-filter .input {
    color: #0b1f17;
    background: #fff;
    border: 0;
}

.activity-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
    margin-bottom: 20px;
}

.activity-summary-grid article {
    padding: 19px;
    border-radius: 23px;
    border: 1px solid rgba(220,229,224,.92);
    background: rgba(255,255,255,.94);
    box-shadow: 0 15px 48px rgba(24,50,37,.07);
}

.activity-summary-grid span {
    display: block;
    color: #66756d;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.activity-summary-grid strong {
    display: block;
    margin-top: 8px;
    font-size: 36px;
    letter-spacing: -.05em;
}

.activity-summary-grid small {
    color: #66756d;
}

.activity-timeline-card {
    padding: clamp(18px, 2.4vw, 24px);
    border-radius: 28px;
    border: 1px solid rgba(220,229,224,.92);
    background: rgba(255,255,255,.94);
    box-shadow: 0 18px 55px rgba(24,50,37,.075);
}

.activity-timeline {
    display: grid;
    gap: 16px;
}

.activity-detail-item {
    position: relative;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.activity-detail-item:before {
    content: "";
    position: absolute;
    left: 45px;
    top: 58px;
    bottom: -18px;
    width: 2px;
    background: #e4eee8;
}

.activity-detail-item:last-child:before {
    display: none;
}

.activity-time {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 4px;
    justify-items: center;
    padding: 12px 8px;
    border-radius: 18px;
    color: #08784d;
    background: #eaf9f2;
    border: 1px solid #d4f0e1;
}

.activity-time strong {
    font-size: 14px;
}

.activity-time span {
    color: #66756d;
    font-size: 11px;
    font-weight: 800;
}

.activity-detail-body {
    padding: 18px;
    border-radius: 22px;
    border: 1px solid #e4eee8;
    background: linear-gradient(180deg, #fff, #f8fcfa);
}

.activity-detail-head {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: start;
}

.activity-detail-body h3 {
    margin: 9px 0 0;
    font-size: 19px;
    letter-spacing: -.02em;
}

.activity-detail-body p {
    margin: 10px 0 0;
    color: #526158;
    line-height: 1.65;
}

.activity-pill {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .03em;
    background: #eef3f0;
    color: #405047;
}

.activity-pill.success { color: #08784d; background: #dff7eb; }
.activity-pill.warning { color: #a56600; background: #fff3d7; }
.activity-pill.danger { color: #b42318; background: #fee4e2; }
.activity-pill.info { color: #155eef; background: #e8efff; }

.activity-meta-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 15px;
}

.activity-meta-grid div {
    min-width: 0;
    padding: 12px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #e4eee8;
}

.activity-meta-grid span {
    display: block;
    color: #66756d;
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.activity-meta-grid strong {
    display: block;
    margin-top: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.activity-technical-details {
    margin-top: 14px;
    border-radius: 16px;
    background: #f8fcfa;
    border: 1px dashed #c7ded1;
}

.activity-technical-details summary {
    cursor: pointer;
    padding: 12px 14px;
    color: #08784d;
    font-weight: 900;
}

.activity-technical-details div {
    padding: 0 14px 12px;
}

.activity-technical-details p {
    margin: 8px 0 0;
    font-size: 13px;
}

@media (min-width: 1201px) {
    .dash-management-grid {
        grid-template-columns: minmax(0, 1.7fr) minmax(320px, .72fr);
    }
}

@media (max-width: 1200px) {
    .profile-layout,
    .profile-hero,
    .dash-management-grid,
    .activity-hero {
        grid-template-columns: 1fr;
    }

    .profile-security-card {
        position: static;
    }

    .shop-list-wide,
    .activity-mini-list {
        grid-template-columns: 1fr;
    }

    .activity-meta-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .profile-hero,
    .activity-hero {
        border-radius: 25px;
        padding: 21px;
    }

    .profile-hero h1,
    .activity-hero h1 {
        font-size: 34px;
    }

    .profile-hero-card {
        min-height: auto;
    }

    .activity-filter div {
        display: grid;
    }

    .activity-summary-grid {
        grid-template-columns: 1fr;
    }

    .activity-detail-item {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .activity-detail-item:before {
        display: none;
    }

    .activity-time {
        justify-items: start;
        grid-auto-flow: column;
        justify-content: start;
        width: fit-content;
        padding-inline: 12px;
    }

    .activity-meta-grid {
        grid-template-columns: 1fr;
    }

    .locked-input {
        display: grid;
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .locked-input small {
        grid-column: 1 / -1;
        width: fit-content;
    }
}

@media (max-width: 430px) {
    .profile-hero,
    .activity-hero {
        padding: 18px;
        border-radius: 23px;
    }

    .profile-hero h1,
    .activity-hero h1 {
        font-size: 30px;
    }

    .profile-form-card,
    .profile-security-card,
    .activity-timeline-card {
        border-radius: 22px;
    }

    .activity-detail-body {
        padding: 15px;
        border-radius: 19px;
    }
}

/* =========================================================
   Mes boutiques — premium responsive update
   ========================================================= */
.shops-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(280px, .62fr);
    gap: 22px;
    align-items: stretch;
    margin-bottom: 20px;
    padding: clamp(22px, 3vw, 34px);
    border-radius: 34px;
    color: #fff;
    background:
        radial-gradient(circle at 14% 22%, rgba(255,255,255,.24), transparent 28%),
        radial-gradient(circle at 88% 10%, rgba(255,255,255,.13), transparent 32%),
        linear-gradient(135deg, #09251a 0%, #0c6f4a 47%, #13a66d 100%);
    box-shadow: 0 28px 80px rgba(5, 42, 27, .18);
}

.shops-hero:before,
.shops-hero:after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.shops-hero:before {
    width: 260px;
    height: 260px;
    right: -95px;
    top: -105px;
    background: rgba(255,255,255,.12);
}

.shops-hero:after {
    width: 180px;
    height: 180px;
    left: 38%;
    bottom: -105px;
    background: rgba(255,255,255,.10);
}

.shops-hero-copy,
.shops-hero-panel {
    position: relative;
    z-index: 1;
}

.shops-hero-copy h1 {
    margin: 10px 0 12px;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.02;
    letter-spacing: -.04em;
}

.shops-hero-copy p {
    max-width: 780px;
    margin: 0;
    color: rgba(255,255,255,.82);
    line-height: 1.72;
    font-size: 15px;
}

.shops-hero .hero-actions {
    margin-top: 24px;
}

.shops-hero-panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    min-height: 235px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 26px;
    background: rgba(255,255,255,.14);
    backdrop-filter: blur(18px);
}

.shops-hero-panel .hero-panel-top {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.shops-hero-panel span,
.shops-hero-panel small {
    color: rgba(255,255,255,.76);
}

.shops-hero-panel .hero-panel-top span {
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .11em;
}

.shops-hero-panel .hero-panel-top strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 17px;
}

.shops-counter {
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.shops-counter strong {
    font-size: clamp(48px, 7vw, 70px);
    line-height: .9;
    letter-spacing: -.05em;
}

.shops-counter span {
    padding-bottom: 7px;
    line-height: 1.35;
    font-weight: 750;
}

.shops-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.shops-summary-card {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    min-height: 138px;
    padding: 20px;
    border-radius: 24px;
    border: 1px solid #e4eee8;
    background: linear-gradient(180deg, #fff, #f8fcfa);
    box-shadow: 0 12px 34px rgba(29,51,40,.05);
}

.shops-summary-card.primary {
    color: #fff;
    border: 0;
    background: linear-gradient(135deg, #0c6f4a, #13a66d);
}

.shops-summary-card span {
    display: block;
    color: #66756d;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.shops-summary-card.primary span,
.shops-summary-card.primary small {
    color: rgba(255,255,255,.8);
}

.shops-summary-card strong {
    display: block;
    max-width: 240px;
    margin-top: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 31px;
    line-height: 1.08;
    letter-spacing: -.03em;
}

.shops-summary-card small {
    display: block;
    margin-top: 6px;
    color: #66756d;
    line-height: 1.4;
}

.summary-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    border-radius: 16px;
    color: #08784d;
    background: #eaf9f2;
}

.shops-summary-card.primary .summary-icon {
    color: #fff;
    background: rgba(255,255,255,.16);
}

.shops-layout {
    display: grid;
    grid-template-columns: minmax(320px, .74fr) minmax(0, 1.55fr);
    gap: 20px;
    align-items: start;
}

.shops-form-card,
.shops-list-card {
    border: 1px solid #e4eee8;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 16px 45px rgba(29,51,40,.06);
}

.shops-form-card {
    position: sticky;
    top: 94px;
    padding: 22px;
    overflow: hidden;
}

.shops-form-card:before {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    top: -120px;
    right: -100px;
    border-radius: 999px;
    background: rgba(19,138,91,.10);
    pointer-events: none;
}

.form-card-icon {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    position: relative;
    z-index: 1;
    margin-bottom: 16px;
    border-radius: 19px;
    color: #08784d;
    background: #eaf9f2;
}

.shops-form-card .card-header,
.shops-clean-form {
    position: relative;
    z-index: 1;
}

.shops-form-card .card-header p,
.shops-list-card .dash-card-head p {
    margin: 6px 0 0;
    color: #66756d;
    line-height: 1.5;
}

.shops-clean-form {
    grid-template-columns: 1fr;
}

.shops-clean-form .input-lg {
    min-height: 52px;
    font-size: 15px;
    font-weight: 650;
}

.shops-clean-form .textarea {
    min-height: 120px;
}

.shops-form-actions .btn {
    width: 100%;
}

.shops-list-card {
    padding: 22px;
}

.shops-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.shop-tile {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 282px;
    padding: 18px;
    border: 1px solid #e4eee8;
    border-radius: 25px;
    background:
        radial-gradient(circle at 100% 0%, rgba(19,138,91,.10), transparent 28%),
        linear-gradient(180deg, #fff, #f8fcfa);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.shop-tile:hover {
    transform: translateY(-3px);
    border-color: rgba(17,163,106,.34);
    box-shadow: 0 22px 45px rgba(24,50,37,.10);
}

.shop-tile-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.shop-tile-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 19px;
    color: #08784d;
    background: #eaf9f2;
}

.shop-tile-body {
    min-width: 0;
    flex: 1;
}

.shop-tile-body h3 {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 21px;
    line-height: 1.2;
    letter-spacing: -.02em;
}

.shop-tile-body p {
    display: -webkit-box;
    min-height: 43px;
    margin: 9px 0 0;
    overflow: hidden;
    color: #66756d;
    line-height: 1.55;
    font-size: 14px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.shop-code-pill {
    display: inline-flex;
    max-width: 100%;
    margin-top: 13px;
    padding: 7px 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 999px;
    color: #08784d;
    background: #eaf9f2;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.shop-tile-footer {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #edf3ef;
    color: #7a8a82;
}

.shop-tile-footer small {
    font-weight: 650;
}

.shop-tile-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.shop-tile-actions form {
    margin: 0;
}

.shop-tile-actions .btn-primary {
    flex: 1 1 110px;
}

.shops-empty-state {
    min-height: 340px;
    align-content: center;
}

@media (max-width: 1220px) {
    .shops-hero,
    .shops-layout {
        grid-template-columns: 1fr;
    }

    .shops-form-card {
        position: static;
    }

    .shops-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 920px) {
    .shops-card-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .shops-hero {
        margin-left: -2px;
        margin-right: -2px;
        padding: 22px;
        border-radius: 26px;
    }

    .shops-hero-copy h1 {
        font-size: 32px;
    }

    .shops-hero-copy p {
        font-size: 14px;
        line-height: 1.65;
    }

    .shops-hero .hero-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .shops-hero-panel {
        min-height: 190px;
        padding: 18px;
        border-radius: 22px;
    }

    .shops-summary-grid {
        grid-template-columns: 1fr;
    }

    .shops-summary-card {
        min-height: 120px;
        padding: 18px;
        border-radius: 22px;
    }

    .shops-summary-card strong {
        font-size: 27px;
        max-width: 190px;
    }

    .shops-form-card,
    .shops-list-card {
        padding: 17px;
        border-radius: 23px;
    }

    .shops-list-card .dash-card-head.with-action {
        align-items: stretch;
    }

    .shops-list-card .dash-card-head.with-action .btn {
        width: 100%;
    }

    .shop-tile {
        min-height: 0;
        padding: 16px;
        border-radius: 22px;
    }

    .shop-tile-body h3 {
        white-space: normal;
        font-size: 19px;
    }

    .shop-tile-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .shop-tile-actions .btn,
    .shop-tile-actions form,
    .shop-tile-actions button {
        width: 100%;
    }
}

/* =========================================================
   Taux du jour simplifié — USD vers FC uniquement
   ========================================================= */
.rates-simple-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 360px);
    gap: 22px;
    align-items: end;
    margin-bottom: 22px;
    padding: clamp(22px, 4vw, 36px);
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 8% 12%, rgba(255,255,255,.24), transparent 28%),
        radial-gradient(circle at 90% 10%, rgba(95, 255, 185, .22), transparent 30%),
        linear-gradient(135deg, #06251b 0%, #0b5c3c 48%, #13a66d 100%);
    box-shadow: 0 24px 70px rgba(5, 57, 37, .22);
}

.rates-simple-hero::after {
    content: '';
    position: absolute;
    right: -70px;
    bottom: -95px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255,255,255,.12);
}

.rates-simple-hero > * {
    position: relative;
    z-index: 1;
}

.rates-simple-hero h1 {
    margin: 8px 0 10px;
    max-width: 760px;
    font-size: clamp(30px, 5vw, 58px);
    line-height: .96;
    letter-spacing: -.055em;
}

.rates-simple-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255,255,255,.82);
    font-weight: 650;
    line-height: 1.7;
}

.rates-date-filter {
    display: grid;
    gap: 10px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 24px;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(14px);
}

.rates-date-filter label {
    color: rgba(255,255,255,.86);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.rates-date-filter > div {
    display: flex;
    gap: 10px;
}

.rates-date-filter .input {
    min-width: 0;
    background: rgba(255,255,255,.96);
}

.rates-simple-layout {
    display: grid;
    grid-template-columns: minmax(260px, 430px) minmax(0, 1fr);
    gap: 20px;
    align-items: stretch;
    margin-bottom: 22px;
}

.rate-live-card {
    position: relative;
    overflow: hidden;
    min-height: 260px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(22px, 3vw, 34px);
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 18%, rgba(255,255,255,.22), transparent 27%),
        linear-gradient(145deg, #0aa869, #08784d 56%, #053925 100%);
    box-shadow: 0 22px 60px rgba(8, 120, 77, .24);
}

.rate-live-card::after {
    content: '';
    position: absolute;
    width: 180px;
    height: 180px;
    right: -60px;
    bottom: -70px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
}

.rate-live-card > * {
    position: relative;
    z-index: 1;
}

.rate-live-icon {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    margin-bottom: 22px;
    border-radius: 20px;
    background: rgba(255,255,255,.18);
}

.rate-live-icon .icon {
    width: 28px;
    height: 28px;
}

.rate-live-card span,
.rate-live-card small {
    color: rgba(255,255,255,.82);
    font-weight: 800;
}

.rate-live-card strong {
    display: block;
    margin: 9px 0;
    font-size: clamp(38px, 6vw, 64px);
    line-height: .95;
    letter-spacing: -.06em;
}

.rates-form-card {
    padding: clamp(20px, 3vw, 30px);
    border-radius: 30px;
}

.form-card-title {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.form-card-title h2 {
    margin: 0 0 5px;
    font-size: clamp(21px, 3vw, 30px);
    letter-spacing: -.04em;
}

.form-card-title p {
    margin: 0;
    color: #66756d;
    font-weight: 650;
}

.rates-one-form {
    display: grid;
    gap: 16px;
}

.money-input-wrap {
    position: relative;
}

.money-input-wrap .input {
    padding-right: 58px;
    font-size: 18px;
    font-weight: 900;
}

.money-input-wrap span {
    position: absolute;
    right: 17px;
    top: 50%;
    transform: translateY(-50%);
    color: #7a8a82;
    font-size: 13px;
    font-weight: 900;
}

.btn-wide {
    width: 100%;
    justify-content: center;
}

.rates-history-card {
    border-radius: 30px;
}

.rates-history-table td strong {
    color: #08784d;
    font-size: 15px;
}

.rate-row-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}

.text-right {
    text-align: right;
}

.rate-strip-single {
    grid-template-columns: 1fr;
}

.rate-strip-single article {
    background:
        radial-gradient(circle at 95% 10%, rgba(17, 163, 106, .14), transparent 28%),
        #fff;
}

@media (max-width: 920px) {
    .rates-simple-hero,
    .rates-simple-layout {
        grid-template-columns: 1fr;
    }

    .rate-live-card {
        min-height: 210px;
    }
}

@media (max-width: 620px) {
    .rates-simple-hero {
        padding: 20px;
        border-radius: 26px;
    }

    .rates-simple-hero h1 {
        font-size: 33px;
    }

    .rates-date-filter > div {
        display: grid;
    }

    .rates-date-filter .btn,
    .rates-one-form .btn,
    .rates-one-form a.btn {
        width: 100%;
    }

    .rate-live-card,
    .rates-form-card,
    .rates-history-card {
        border-radius: 24px;
    }

    .rate-live-card strong {
        font-size: 42px;
    }

    .rate-row-actions {
        justify-content: flex-start;
    }
}

/* Shop activity premium, clear and mobile-first v1 */
.shop-activity-page,
.shop-activity-page * {
    min-width: 0;
}

.shop-activity-page {
    overflow-x: hidden;
}

.shop-activity-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 520px);
    gap: 22px;
    align-items: end;
    margin-bottom: 18px;
    padding: clamp(22px, 4vw, 36px);
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 12% 18%, rgba(255,255,255,.18), transparent 26%),
        radial-gradient(circle at 88% 8%, rgba(255,255,255,.16), transparent 28%),
        linear-gradient(135deg, #071f16 0%, #0a6b47 58%, #14a66e 100%);
    box-shadow: 0 24px 76px rgba(8, 64, 45, .22);
}

.shop-activity-hero::after {
    content: "";
    position: absolute;
    right: -85px;
    bottom: -110px;
    width: 270px;
    height: 270px;
    border-radius: 999px;
    background: rgba(255,255,255,.13);
}

.shop-activity-hero > * {
    position: relative;
    z-index: 1;
}

.shop-activity-hero h1 {
    margin: 5px 0 10px;
    font-size: clamp(34px, 5vw, 62px);
    line-height: .96;
    letter-spacing: -.06em;
}

.shop-activity-hero p {
    margin: 0;
    color: rgba(255,255,255,.82);
    font-weight: 750;
    line-height: 1.5;
}

.shop-activity-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 11px;
    align-items: end;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 26px;
    background: rgba(255,255,255,.13);
    backdrop-filter: blur(14px);
}

.shop-activity-filter .field {
    gap: 6px;
}

.shop-activity-filter label {
    color: rgba(255,255,255,.82);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.shop-activity-filter .input,
.shop-activity-filter .select {
    border: 0;
    background: #fff;
    box-shadow: 0 8px 18px rgba(0,0,0,.06);
}

.shop-activity-filter .btn-light,
.btn-light {
    background: #fff;
    color: #08784d;
    border-color: rgba(255,255,255,.9);
    box-shadow: 0 10px 24px rgba(0,0,0,.10);
}

.shop-activity-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.shop-activity-stats article {
    padding: 18px;
    border-radius: 24px;
    border: 1px solid rgba(220,229,224,.92);
    background:
        radial-gradient(circle at 100% 0%, rgba(17,163,106,.09), transparent 36%),
        rgba(255,255,255,.95);
    box-shadow: 0 16px 44px rgba(24,50,37,.07);
}

.shop-activity-stats span,
.shop-activity-changes span {
    display: block;
    color: #66756d;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.shop-activity-stats strong {
    display: block;
    margin-top: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: clamp(25px, 3vw, 36px);
    line-height: 1;
    letter-spacing: -.05em;
}

.shop-activity-stats small {
    display: block;
    margin-top: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #66756d;
}

.shop-activity-module-strip {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 3px 2px 14px;
    margin-bottom: 4px;
    scrollbar-width: thin;
}

.shop-activity-chip {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 8px 13px;
    border-radius: 999px;
    text-decoration: none;
    border: 1px solid #dce9e3;
    background: #fff;
    box-shadow: 0 8px 20px rgba(24,50,37,.05);
}

.shop-activity-chip span {
    color: #405047;
    font-size: 13px;
    font-weight: 850;
}

.shop-activity-chip strong {
    display: grid;
    place-items: center;
    min-width: 26px;
    height: 26px;
    padding-inline: 8px;
    border-radius: 999px;
    color: #08784d;
    background: #eaf9f2;
    font-size: 12px;
}

.shop-activity-chip.active {
    border-color: rgba(17,163,106,.35);
    color: #fff;
    background: linear-gradient(135deg, #0f9d67, #08784d);
}

.shop-activity-chip.active span,
.shop-activity-chip.active strong {
    color: #fff;
}

.shop-activity-chip.active strong {
    background: rgba(255,255,255,.16);
}

.shop-activity-card {
    padding: clamp(17px, 2.4vw, 24px);
    border-radius: 30px;
    border: 1px solid rgba(220,229,224,.92);
    background: rgba(255,255,255,.95);
    box-shadow: 0 18px 55px rgba(24,50,37,.075);
}

.shop-activity-timeline {
    display: grid;
    gap: 15px;
}

.shop-activity-item {
    position: relative;
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.shop-activity-item::before {
    content: "";
    position: absolute;
    left: 40px;
    top: 58px;
    bottom: -16px;
    width: 2px;
    background: #e4eee8;
}

.shop-activity-item:last-child::before {
    display: none;
}

.shop-activity-time {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 4px;
    justify-items: center;
    padding: 12px 8px;
    border-radius: 18px;
    color: #08784d;
    background: #eaf9f2;
    border: 1px solid #d4f0e1;
}

.shop-activity-time strong {
    font-size: 15px;
    letter-spacing: -.02em;
}

.shop-activity-time span {
    color: #66756d;
    font-size: 11px;
    font-weight: 900;
}

.shop-activity-body {
    overflow: hidden;
    padding: 17px;
    border-radius: 24px;
    border: 1px solid #e4eee8;
    background: linear-gradient(180deg, #fff, #f8fcfa);
}

.shop-activity-head {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}

.shop-activity-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #08784d;
    background: #eaf9f2;
}

.shop-activity-icon.emoney { color: #0b65c2; background: #e8f1ff; }
.shop-activity-icon.cash { color: #8a5a00; background: #fff3d7; }
.shop-activity-icon.change { color: #6941c6; background: #f1ecff; }
.shop-activity-icon.rates { color: #08784d; background: #eaf9f2; }
.shop-activity-icon.users { color: #155eef; background: #e8efff; }
.shop-activity-icon.shops { color: #08784d; background: #eaf9f2; }

.shop-activity-module {
    display: inline-flex;
    width: fit-content;
    padding: 5px 9px;
    border-radius: 999px;
    color: #08784d;
    background: #eaf9f2;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.shop-activity-body h3 {
    margin: 8px 0 0;
    overflow-wrap: anywhere;
    font-size: 19px;
    letter-spacing: -.03em;
}

.shop-activity-desc {
    margin: 12px 0 0;
    color: #526158;
    line-height: 1.58;
    overflow-wrap: anywhere;
}

.shop-activity-changes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.shop-activity-changes div {
    overflow: hidden;
    padding: 12px;
    border-radius: 17px;
    background: #fff;
    border: 1px solid #e4eee8;
}

.shop-activity-changes strong {
    display: block;
    margin-top: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}

.shop-activity-changes small {
    display: block;
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #66756d;
    font-size: 11px;
}

.shop-activity-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.shop-activity-meta span {
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 999px;
    color: #526158;
    background: #eef5f1;
    font-size: 12px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-activity-meta .icon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
}

.shop-activity-details {
    margin-top: 13px;
    border-radius: 17px;
    border: 1px dashed #c8ded2;
    background: #f8fcfa;
}

.shop-activity-details summary {
    cursor: pointer;
    padding: 12px 14px;
    color: #08784d;
    font-weight: 950;
}

.shop-activity-details-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 0 14px 12px;
}

.shop-activity-details p {
    margin: 0;
    overflow-wrap: anywhere;
    color: #526158;
    font-size: 13px;
    line-height: 1.5;
}

.shop-activity-details pre {
    margin: 0 14px 14px;
    max-width: 100%;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    padding: 12px;
    border-radius: 14px;
    color: #405047;
    background: #fff;
    border: 1px solid #e4eee8;
    font-size: 12px;
}

@media (max-width: 1180px) {
    .shop-activity-hero,
    .shop-activity-filter {
        grid-template-columns: 1fr;
    }

    .shop-activity-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .shop-activity-changes,
    .shop-activity-details-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .shop-activity-hero {
        padding: 21px;
        border-radius: 26px;
    }

    .shop-activity-hero h1 {
        font-size: 38px;
    }

    .shop-activity-filter .btn,
    .shop-activity-filter .input,
    .shop-activity-filter .select {
        width: 100%;
    }

    .shop-activity-stats,
    .shop-activity-changes,
    .shop-activity-details-grid {
        grid-template-columns: 1fr;
    }

    .shop-activity-item {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .shop-activity-item::before {
        display: none;
    }

    .shop-activity-time {
        width: fit-content;
        grid-auto-flow: column;
        justify-items: start;
        justify-content: start;
        padding-inline: 12px;
    }

    .shop-activity-head {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .shop-activity-head .activity-pill {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .shop-activity-icon {
        width: 44px;
        height: 44px;
        border-radius: 15px;
    }

    .shop-activity-body {
        border-radius: 22px;
        padding: 15px;
    }

    .shop-activity-card {
        border-radius: 24px;
    }
}

@media (max-width: 430px) {
    .shop-activity-hero {
        padding: 18px;
        border-radius: 23px;
    }

    .shop-activity-hero h1 {
        font-size: 33px;
    }

    .shop-activity-filter {
        padding: 13px;
        border-radius: 20px;
    }

    .shop-activity-stats article {
        padding: 15px;
        border-radius: 20px;
    }

    .shop-activity-body h3 {
        font-size: 18px;
    }
}