/* WINCO_PREMIUM_GLOBAL_V2 */

:root{
    --w-bg:#050708;
    --w-bg-2:#080c0f;
    --w-surface:rgba(255,255,255,.036);
    --w-surface-2:rgba(255,255,255,.024);
    --w-line:rgba(255,255,255,.075);
    --w-line-soft:rgba(255,255,255,.052);
    --w-text:#f8fafc;
    --w-muted:rgba(226,232,240,.58);
    --w-muted-2:rgba(226,232,240,.38);
    --w-green:#25d366;
    --w-green-soft:rgba(37,211,102,.105);
    --w-radius-lg:28px;
    --w-radius-md:20px;
    --w-radius-sm:14px;
    --w-width:1480px;
}

html{
    background:#050708;
}

body{
    background:
        radial-gradient(circle at 16% -10%, rgba(37,211,102,.075), transparent 30%),
        radial-gradient(circle at 86% 0%, rgba(59,130,246,.040), transparent 28%),
        linear-gradient(180deg, #050708 0%, #070a0d 48%, #050708 100%) !important;
    color:var(--w-text) !important;
    text-rendering:geometricPrecision;
}

main,
.app-main,
.client-app-main,
.page-shell,
.app-shell,
.content,
.main-content,
.dashboard,
.dashboard-shell,
.operation-shell,
.crm-shell,
.agenda-shell,
.container,
.container-xl,
.wrapper{
    max-width:var(--w-width) !important;
    width:min(var(--w-width), calc(100vw - 32px)) !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

@media(min-width:1500px){
    main,
    .app-main,
    .client-app-main,
    .page-shell,
    .app-shell,
    .content,
    .main-content,
    .dashboard,
    .dashboard-shell,
    .operation-shell,
    .crm-shell,
    .agenda-shell,
    .container,
    .container-xl,
    .wrapper{
        max-width:1540px !important;
        width:min(1540px, calc(100vw - 56px)) !important;
    }
}

h1, h2, h3{
    letter-spacing:-.055em !important;
}

h1{
    font-size:clamp(34px, 4vw, 58px) !important;
    line-height:.96 !important;
}

h2{
    font-size:clamp(24px, 2.1vw, 34px) !important;
}

p{
    color:var(--w-muted) !important;
}

.card,
.panel,
.box,
.glass,
.metric-card,
.quick-card,
.operation-card,
.lead-card,
.settings-card,
.billing-card,
.media-card,
.feature-card,
.pricing-card,
.client-card,
.stat-card,
.dashboard-card,
.landing-card,
.hero-card,
section[class*="card"],
div[class*="card"]{
    border-radius:var(--w-radius-lg) !important;
    border:1px solid var(--w-line) !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.018)) !important;
    box-shadow:
        0 22px 70px rgba(0,0,0,.20),
        inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.card,
.panel,
.box,
.glass,
.metric-card,
.quick-card,
.operation-card,
.lead-card,
.settings-card,
.billing-card,
.media-card,
.feature-card,
.pricing-card,
.client-card,
.stat-card,
.dashboard-card,
.landing-card,
.hero-card{
    padding:clamp(16px, 1.45vw, 24px) !important;
}

button,
.btn,
a.btn,
.button{
    border-radius:var(--w-radius-sm) !important;
    box-shadow:none !important;
    font-weight:850 !important;
}

button:not(.danger):not(.delete):not(.remove),
.btn:not(.danger):not(.delete):not(.remove),
a.btn:not(.danger):not(.delete):not(.remove),
.button:not(.danger):not(.delete):not(.remove){
    border:1px solid rgba(255,255,255,.085) !important;
    background:rgba(255,255,255,.042) !important;
    color:rgba(248,250,252,.88) !important;
}

button:hover,
.btn:hover,
a.btn:hover,
.button:hover{
    transform:translateY(-1px);
    border-color:rgba(37,211,102,.18) !important;
    background:rgba(255,255,255,.065) !important;
}

button[type="submit"],
.btn-primary,
.primary,
.cta,
.cta-primary{
    background:rgba(37,211,102,.115) !important;
    border:1px solid rgba(37,211,102,.22) !important;
    color:#bbf7d0 !important;
}

input,
select,
textarea{
    border-radius:var(--w-radius-sm) !important;
    background:rgba(0,0,0,.22) !important;
    border:1px solid rgba(255,255,255,.085) !important;
    color:var(--w-text) !important;
    box-shadow:none !important;
    outline:none !important;
}

input:focus,
select:focus,
textarea:focus{
    border-color:rgba(37,211,102,.26) !important;
    box-shadow:0 0 0 3px rgba(37,211,102,.055) !important;
}

.pill,
.badge,
.status,
.status-pill,
.tag,
.chip{
    border:1px solid rgba(255,255,255,.075) !important;
    background:rgba(255,255,255,.035) !important;
    color:rgba(248,250,252,.82) !important;
}

.pill.active,
.badge.active,
.status.active,
.status-pill.active,
.status-pill.ok,
.status-pill.online,
.tag.active,
.chip.active{
    border-color:rgba(37,211,102,.22) !important;
    background:rgba(37,211,102,.095) !important;
    color:#bbf7d0 !important;
}

table{
    width:100%;
    border-collapse:separate !important;
    border-spacing:0 8px !important;
}

th{
    color:var(--w-muted-2) !important;
    font-size:11px !important;
    text-transform:uppercase;
    letter-spacing:.11em;
    font-weight:900 !important;
    border:0 !important;
}

td{
    background:rgba(255,255,255,.026) !important;
    border-top:1px solid rgba(255,255,255,.052) !important;
    border-bottom:1px solid rgba(255,255,255,.052) !important;
    color:rgba(248,250,252,.86) !important;
}

tr td:first-child{
    border-left:1px solid rgba(255,255,255,.052) !important;
    border-radius:14px 0 0 14px !important;
}

tr td:last-child{
    border-right:1px solid rgba(255,255,255,.052) !important;
    border-radius:0 14px 14px 0 !important;
}

.grid,
.cards-grid,
.operations-grid,
.dashboard-grid,
.metrics-grid,
.features-grid,
.pricing-grid{
    gap:14px !important;
}

@media(min-width:1180px){
    .operations-grid,
    .cards-grid,
    .features-grid{
        grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)) !important;
    }

    .metrics-grid,
    .dashboard-grid{
        grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)) !important;
    }
}

@media(max-width:720px){
    main,
    .app-main,
    .client-app-main,
    .page-shell,
    .app-shell,
    .content,
    .main-content,
    .dashboard,
    .dashboard-shell,
    .operation-shell,
    .crm-shell,
    .agenda-shell,
    .container,
    .container-xl,
    .wrapper{
        width:calc(100vw - 24px) !important;
    }
}