/* =====================================================
   ÁREA DE CLIENTE - CHAMOY SPORT
   Estilos aislados para cliente/
===================================================== */

.client-dashboard-shell{
    display:grid;
    grid-template-columns:245px minmax(0,1fr);
    gap:22px;
    width:min(1580px,calc(100% - 40px));
    margin:0 auto;
    padding:28px 0 44px;
}

.client-dashboard-main{
    display:grid;
    gap:18px;
    min-width:0;
}

/* SIDEBAR */
.client-sidebar-modern{
    position:sticky;
    top:96px;
    align-self:start;
    padding:14px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.client-sidebar-brand{
    padding:4px 4px 14px;
    border-bottom:1px solid var(--theme-border);
}

.client-sidebar-modern .brand-mark{
    display:flex;
    align-items:center;
    gap:10px;
}

.client-sidebar-modern .brand-mark>span{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:11px;
    color:#fff;
    background:linear-gradient(135deg,#6d28d9,#312e81);
    font-weight:900;
}

.client-sidebar-modern .brand-mark div{
    display:grid;
    gap:2px;
}

.client-sidebar-modern .brand-mark strong{
    color:var(--theme-text);
    font-size:.95rem;
}

.client-sidebar-modern .brand-mark small{
    color:var(--theme-text-soft);
    font-size:.72rem;
}

.client-sidebar-modern nav{
    display:grid;
    gap:5px;
    margin-top:14px;
}

.client-sidebar-label{
    padding:5px 10px 7px;
    color:var(--theme-text-muted);
    font-size:.67rem;
    font-weight:900;
    letter-spacing:.10em;
}

.client-sidebar-modern nav a{
    position:relative;
    display:grid;
    grid-template-columns:20px minmax(0,1fr) 18px;
    align-items:center;
    gap:10px;
    min-height:42px;
    padding:0 10px;
    border-radius:10px;
    color:var(--theme-text-soft);
    font-size:.86rem;
    font-weight:800;
    transition:background .18s ease,color .18s ease,transform .18s ease;
}

.client-sidebar-modern nav a:hover{
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
}

.client-sidebar-modern nav a.is-active{
    color:#ddd6fe;
    background:rgba(124,58,237,.16);
}

.client-sidebar-modern nav a>svg:first-child{
    width:18px;
    height:18px;
}

.client-nav-marker{
    width:16px;
    height:16px;
    justify-self:end;
}

.client-sidebar-separator{
    height:1px;
    margin:8px 4px;
    background:var(--theme-border);
}

.client-sidebar-modern .client-logout-link{
    color:#fca5a5;
}

.client-sidebar-modern .client-logout-link:hover{
    color:#fecaca;
    background:rgba(239,68,68,.08);
}

/* TOPBAR */
.client-topbar-modern{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    min-height:138px;
    padding:24px 26px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:
        radial-gradient(circle at 88% 12%,rgba(139,92,246,.12),transparent 16rem),
        var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.client-topbar-copy h1{
    margin:2px 0 8px;
    color:var(--theme-text);
    font-size:clamp(1.9rem,3vw,2.65rem);
    line-height:1;
}

.client-topbar-copy>p:not(.eyebrow){
    max-width:660px;
    margin:0;
    color:var(--theme-text-soft);
    line-height:1.55;
}

.client-topbar-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.client-profile-shortcut{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:52px;
    padding:7px 11px 7px 7px;
    border:1px solid var(--theme-border);
    border-radius:12px;
    color:var(--theme-text);
    background:var(--theme-card-soft);
}

.client-profile-shortcut>span{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:10px;
    color:#fff;
    background:#5b21b6;
    font-weight:900;
}

.client-profile-shortcut div{
    display:grid;
    gap:2px;
}

.client-profile-shortcut small{
    color:var(--theme-text-soft);
    font-size:.68rem;
}

.client-profile-shortcut strong{
    color:var(--theme-text);
    font-size:.8rem;
}

.client-bell{
    position:relative;
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border:1px solid var(--theme-border);
    border-radius:12px;
    color:#c4b5fd;
    background:var(--theme-card-soft);
}

.client-bell>svg{
    width:20px;
    height:20px;
}

.client-bell>span{
    position:absolute;
    top:-6px;
    right:-6px;
    display:grid;
    place-items:center;
    min-width:20px;
    height:20px;
    padding:0 5px;
    border:2px solid var(--theme-card);
    border-radius:999px;
    color:#fff;
    background:#7c3aed;
    font-size:.66rem;
    font-weight:900;
}

/* ESTADÍSTICAS */
.client-stats-modern{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}

.client-stat-card{
    position:relative;
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 18px;
    align-items:center;
    gap:12px;
    min-height:118px;
    padding:16px;
    border:1px solid var(--theme-border);
    border-radius:14px;
    color:var(--theme-text);
    background:var(--theme-card);
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.client-stat-card:hover{
    transform:translateY(-2px);
    border-color:var(--theme-border-hover);
    box-shadow:0 14px 30px rgba(0,0,0,.10);
}

.client-stat-icon{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:12px;
    color:#c4b5fd;
    background:rgba(124,58,237,.14);
}

.client-stat-icon svg{
    width:21px;
    height:21px;
}

.client-stat-card div{
    min-width:0;
}

.client-stat-card small{
    display:block;
    color:var(--theme-text-soft);
    font-size:.72rem;
    font-weight:800;
    text-transform:uppercase;
}

.client-stat-card strong{
    display:block;
    margin:4px 0 3px;
    overflow:hidden;
    color:var(--theme-text);
    font-size:1.55rem;
    line-height:1;
    text-overflow:ellipsis;
}

.client-stat-card div>span{
    display:block;
    color:var(--theme-text-muted);
    font-size:.73rem;
}

.client-stat-arrow{
    width:16px;
    height:16px;
    color:var(--theme-text-muted);
}

.client-stat-membership{
    border-color:rgba(139,92,246,.28);
    background:
        linear-gradient(135deg,rgba(124,58,237,.08),transparent 70%),
        var(--theme-card);
}

/* CONTENIDO PRINCIPAL */
.client-dashboard-grid{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
    gap:16px;
    align-items:start;
}

.client-orders-panel,
.client-quick-panel{
    padding:20px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.client-panel-heading{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
}

.client-panel-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.2rem;
}

.client-panel-heading>a{
    color:#a78bfa;
    font-size:.78rem;
    font-weight:900;
}

.client-orders-list{
    display:grid;
}

.client-order-row{
    display:grid;
    grid-template-columns:minmax(120px,1fr) 110px 110px 18px;
    align-items:center;
    gap:12px;
    min-height:62px;
    padding:0 4px;
    border-bottom:1px solid var(--theme-border);
    color:var(--theme-text);
}

.client-order-row:last-child{
    border-bottom:0;
}

.client-order-row:hover{
    background:var(--theme-hover);
}

.client-order-id{
    display:flex;
    align-items:center;
    gap:9px;
}

.client-order-id svg{
    width:18px;
    height:18px;
    color:#a78bfa;
}

.client-order-total{
    color:var(--theme-text);
    font-weight:900;
}

.client-order-status{
    justify-self:start;
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:0 9px;
    border-radius:999px;
    color:#c4b5fd;
    background:rgba(124,58,237,.11);
    font-size:.7rem;
    font-weight:900;
    text-transform:uppercase;
}

.client-order-status.status-pagado,
.client-order-status.status-aprobado,
.client-order-status.status-completado{
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.client-order-status.status-pendiente{
    color:#fde68a;
    background:rgba(245,158,11,.10);
}

.client-order-status.status-rechazado,
.client-order-status.status-cancelado{
    color:#fca5a5;
    background:rgba(239,68,68,.10);
}

.client-order-arrow{
    width:17px;
    height:17px;
    color:var(--theme-text-muted);
}

.client-empty-state{
    display:grid;
    place-items:center;
    min-height:250px;
    padding:26px;
    text-align:center;
}

.client-empty-state>span{
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    margin-bottom:10px;
    border-radius:15px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.client-empty-state p{
    max-width:420px;
    margin:7px 0 18px;
    color:var(--theme-text-soft);
}

.client-quick-links{
    display:grid;
    gap:8px;
}

.client-quick-links>a{
    display:grid;
    grid-template-columns:40px minmax(0,1fr) 18px;
    align-items:center;
    gap:11px;
    min-height:64px;
    padding:10px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    color:var(--theme-text);
    background:var(--theme-card-soft);
    transition:border-color .18s ease,background .18s ease,transform .18s ease;
}

.client-quick-links>a:hover{
    transform:translateX(2px);
    border-color:var(--theme-border-hover);
    background:var(--theme-hover);
}

.client-quick-links>a>span{
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:10px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.client-quick-links>a>span svg{
    width:18px;
    height:18px;
}

.client-quick-links strong,
.client-quick-links small{
    display:block;
}

.client-quick-links strong{
    color:var(--theme-text);
    font-size:.84rem;
}

.client-quick-links small{
    margin-top:2px;
    color:var(--theme-text-soft);
    font-size:.7rem;
}

.client-quick-links>a>svg{
    width:16px;
    height:16px;
    color:var(--theme-text-muted);
}

/* TEMA CLARO */
html[data-theme="light"] .client-sidebar-modern nav a{
    color:#475569;
}

html[data-theme="light"] .client-sidebar-modern nav a.is-active{
    color:#4a2aa3;
    background:#f3f0ff;
}

html[data-theme="light"] .client-sidebar-modern nav a:hover{
    color:#4a2aa3;
    background:#f8f7ff;
}

html[data-theme="light"] .client-stat-icon,
html[data-theme="light"] .client-quick-links>a>span,
html[data-theme="light"] .client-empty-state>span{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .client-orders-panel,
html[data-theme="light"] .client-quick-panel,
html[data-theme="light"] .client-sidebar-modern,
html[data-theme="light"] .client-topbar-modern{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

/* RESPONSIVE */
@media(max-width:1180px){
    .client-dashboard-shell{
        grid-template-columns:220px minmax(0,1fr);
    }

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

    .client-dashboard-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:900px){
    .client-dashboard-shell{
        grid-template-columns:1fr;
        width:min(100% - 24px,1580px);
    }

    .client-sidebar-modern{
        position:static;
    }

    .client-sidebar-modern nav{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .client-sidebar-label,
    .client-sidebar-separator{
        grid-column:1 / -1;
    }
}

@media(max-width:680px){
    .client-topbar-modern{
        align-items:flex-start;
        flex-direction:column;
    }

    .client-topbar-actions{
        width:100%;
    }

    .client-profile-shortcut{
        flex:1;
    }

    .client-stats-modern{
        grid-template-columns:1fr 1fr;
    }

    .client-order-row{
        grid-template-columns:minmax(0,1fr) auto;
        gap:8px 12px;
        padding:12px 4px;
    }

    .client-order-total{
        justify-self:end;
    }

    .client-order-status{
        grid-column:1;
    }

    .client-order-arrow{
        grid-column:2;
        grid-row:2;
        justify-self:end;
    }
}

@media(max-width:520px){
    .client-dashboard-shell{
        width:min(100% - 20px,1580px);
        padding-top:18px;
    }

    .client-sidebar-modern nav{
        grid-template-columns:1fr;
    }

    .client-sidebar-label,
    .client-sidebar-separator{
        grid-column:auto;
    }

    .client-stats-modern{
        grid-template-columns:1fr;
    }

    .client-stat-card{
        min-height:100px;
    }

    .client-topbar-modern{
        padding:20px;
    }

    .client-profile-shortcut div{
        display:none;
    }
}
/* =====================================================
   FAVORITOS - ÁREA CLIENTE
   Pegar al final de assets/css/cuenta.css
===================================================== */

.favorites-panel{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.favorites-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}

.favorites-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.65rem;
}

.favorites-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.88rem;
}

.favorites-count{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:36px;
    padding:0 12px;
    border:1px solid var(--theme-border);
    border-radius:999px;
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
    font-size:.8rem;
    font-weight:900;
}

.favorites-count svg{
    width:16px;
    height:16px;
    fill:currentColor;
}

/* GRID */
.favorites-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
}

/* CARD */
.favorite-card{
    position:relative;
    min-width:0;
    overflow:hidden;
    border:1px solid var(--theme-border);
    border-radius:14px;
    background:var(--theme-card-soft);
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.favorite-card:hover{
    transform:translateY(-3px);
    border-color:var(--theme-border-hover);
    box-shadow:0 16px 34px rgba(0,0,0,.12);
}

.favorite-card-link{
    display:block;
    color:inherit;
}

.favorite-card-image{
    display:grid;
    place-items:center;
    aspect-ratio:1.32 / 1;
    overflow:hidden;
    background:var(--theme-bg-soft);
}

.favorite-card-image img{
    width:100%;
    height:100%;
    padding:14px;
    object-fit:contain;
    transition:transform .22s ease;
}

.favorite-card:hover .favorite-card-image img{
    transform:scale(1.025);
}

.favorite-card-body{
    padding:14px;
}

.favorite-card-body h3{
    display:-webkit-box;
    min-height:42px;
    margin:0 0 14px;
    overflow:hidden;
    color:var(--theme-text);
    font-size:.95rem;
    line-height:1.4;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}

.favorite-card-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding-top:12px;
    border-top:1px solid var(--theme-border);
}

.favorite-card-footer strong{
    color:var(--theme-text);
    font-size:1rem;
}

.favorite-card-footer>span{
    display:grid;
    place-items:center;
    width:32px;
    height:32px;
    border-radius:9px;
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
    transition:background .18s ease,color .18s ease;
}

.favorite-card-footer svg{
    width:16px;
    height:16px;
}

.favorite-card:hover .favorite-card-footer>span{
    color:#fff;
    background:#7c3aed;
}

/* BOTÓN CORAZÓN */
.favorite-remove-form{
    position:absolute;
    top:10px;
    right:10px;
    z-index:3;
    margin:0;
}

.favorite-remove-button{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid rgba(255,255,255,.16);
    border-radius:11px;
    color:#fff;
    background:rgba(15,23,42,.72);
    box-shadow:0 8px 18px rgba(0,0,0,.18);
    backdrop-filter:blur(10px);
    transition:
        transform .18s ease,
        color .18s ease,
        background .18s ease,
        border-color .18s ease;
}

.favorite-remove-button svg{
    width:18px;
    height:18px;
    fill:currentColor;
}

.favorite-remove-button:hover{
    transform:scale(1.05);
    color:#fff;
    border-color:rgba(239,68,68,.45);
    background:#dc2626;
}

/* VACÍO */
.favorites-empty{
    display:grid;
    place-items:center;
    min-height:340px;
    padding:30px;
    text-align:center;
}

.favorites-empty>span{
    display:grid;
    place-items:center;
    width:62px;
    height:62px;
    margin-bottom:12px;
    border-radius:18px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.favorites-empty>span svg{
    width:27px;
    height:27px;
}

.favorites-empty h3{
    margin:0;
    color:var(--theme-text);
}

.favorites-empty p{
    max-width:430px;
    margin:8px 0 18px;
    color:var(--theme-text-soft);
}

/* PAGINACIÓN */
.favorites-pagination{
    margin-top:22px;
}

/* LIGHT */
html[data-theme="light"] .favorites-panel{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

html[data-theme="light"] .favorite-card{
    background:#fff;
}

html[data-theme="light"] .favorite-card-image{
    background:#f8fafc;
}

html[data-theme="light"] .favorites-count{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .favorite-card-footer>span{
    color:#5b21b6;
    background:#f3f0ff;
}

/* RESPONSIVE */
@media(max-width:1200px){
    .favorites-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:820px){
    .favorites-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:520px){
    .favorites-heading{
        align-items:flex-start;
        flex-direction:column;
    }

    .favorites-grid{
        grid-template-columns:1fr;
    }

    .favorite-card-image{
        aspect-ratio:1.45 / 1;
    }
}

/* =====================================================
   MIS DESCARGAS - ÁREA CLIENTE
   VERSIÓN ACTUALIZADA CON MINIATURA DEL PRODUCTO
===================================================== */

.downloads-panel{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

/* =====================================================
   CABECERA
===================================================== */

.downloads-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}

.downloads-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.65rem;
}

.downloads-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.88rem;
    line-height:1.5;
}

.downloads-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:36px;
    padding:0 12px;
    border:1px solid var(--theme-border);
    border-radius:999px;
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
    font-size:.8rem;
    font-weight:900;
}

.downloads-count svg{
    width:16px;
    height:16px;
}

/* =====================================================
   LISTA DE DESCARGAS
===================================================== */

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

/* =====================================================
   CARD
===================================================== */

.download-card{
    display:grid;
    grid-template-columns:110px minmax(0,1fr) auto;
    align-items:center;
    gap:16px;

    min-height:118px;
    padding:14px;

    border:1px solid var(--theme-border);
    border-radius:14px;

    background:var(--theme-card-soft);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.download-card:hover{
    transform:translateY(-2px);
    border-color:var(--theme-border-hover);
    box-shadow:0 14px 30px rgba(0,0,0,.10);
}

/* =====================================================
   IMAGEN DEL PRODUCTO
===================================================== */

.download-card-image{
    display:grid;
    place-items:center;

    width:110px;
    height:88px;

    overflow:hidden;

    border:1px solid var(--theme-border);
    border-radius:12px;

    background:var(--theme-bg-soft);

    transition:
        border-color .18s ease,
        transform .18s ease;
}

.download-card-image:hover{
    border-color:var(--theme-border-hover);
}

.download-card-image img{
    display:block;

    width:100%;
    height:100%;

    padding:6px;

    object-fit:contain;

    transition:transform .22s ease;
}

.download-card:hover .download-card-image img{
    transform:scale(1.04);
}

/* =====================================================
   INFORMACIÓN
===================================================== */

.download-card-info{
    min-width:0;
}

.download-card-info small{
    display:block;

    margin-bottom:5px;

    color:#a78bfa;

    font-size:.69rem;
    font-weight:900;

    letter-spacing:.03em;
    text-transform:uppercase;
}

.download-card-info h3{
    margin:0;

    overflow:hidden;

    color:var(--theme-text);

    font-size:1rem;
    line-height:1.35;

    text-overflow:ellipsis;
    white-space:nowrap;
}

/* =====================================================
   FECHA + DESCARGAS
===================================================== */

.download-card-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:12px;

    margin-top:9px;
}

.download-card-meta span{
    display:inline-flex;
    align-items:center;

    gap:5px;

    color:var(--theme-text-soft);

    font-size:.74rem;
}

.download-card-meta svg{
    width:14px;
    height:14px;

    color:#a78bfa;
}

/* =====================================================
   BOTÓN DESCARGAR
===================================================== */

.download-card-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:7px;

    min-width:142px;
    min-height:42px;

    white-space:nowrap;
}

.download-card-button svg{
    width:16px;
    height:16px;
}

/* =====================================================
   ESTADO VACÍO
===================================================== */

.downloads-empty{
    display:grid;
    place-items:center;

    min-height:340px;

    padding:30px;

    text-align:center;
}

.downloads-empty>span{
    display:grid;
    place-items:center;

    width:62px;
    height:62px;

    margin-bottom:12px;

    border-radius:18px;

    color:#c4b5fd;

    background:rgba(124,58,237,.12);
}

.downloads-empty>span svg{
    width:28px;
    height:28px;
}

.downloads-empty h3{
    margin:0;

    color:var(--theme-text);

    font-size:1.15rem;
}

.downloads-empty p{
    max-width:430px;

    margin:8px 0 18px;

    color:var(--theme-text-soft);

    line-height:1.55;
}

/* =====================================================
   PAGINACIÓN
===================================================== */

.downloads-pagination{
    margin-top:22px;
}

/* =====================================================
   MODO CLARO
===================================================== */

html[data-theme="light"] .downloads-panel{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

html[data-theme="light"] .download-card{
    background:#ffffff;
}

html[data-theme="light"] .download-card:hover{
    box-shadow:0 14px 30px rgba(15,23,42,.08);
}

html[data-theme="light"] .download-card-image{
    background:#f8fafc;
}

html[data-theme="light"] .downloads-count{
    color:#5b21b6;

    border-color:rgba(124,58,237,.15);

    background:#f3f0ff;
}

html[data-theme="light"] .download-card-info small{
    color:#7c3aed;
}

html[data-theme="light"] .download-card-meta svg{
    color:#7c3aed;
}

html[data-theme="light"] .downloads-empty>span{
    color:#5b21b6;

    background:#f3f0ff;
}

/* =====================================================
   MODO OSCURO
===================================================== */

html[data-theme="dark"] .download-card{
    background:var(--theme-card-soft);
}

html[data-theme="dark"] .download-card-image{
    background:#0b1018;
}

html[data-theme="dark"] .downloads-count{
    color:#ddd6fe;

    border-color:rgba(167,139,250,.30);

    background:rgba(124,58,237,.14);
}

/* =====================================================
   TABLET
===================================================== */

@media(max-width:820px){

    .download-card{
        grid-template-columns:92px minmax(0,1fr);
        gap:14px;
    }

    .download-card-image{
        width:92px;
        height:76px;
    }

    .download-card-button{
        grid-column:1 / -1;

        width:100%;

        margin-top:2px;
    }
}

/* =====================================================
   CELULAR
===================================================== */

@media(max-width:520px){

    .downloads-panel{
        padding:18px;
    }

    .downloads-heading{
        align-items:flex-start;
        flex-direction:column;

        gap:12px;
    }

    .download-card{
        grid-template-columns:82px minmax(0,1fr);

        gap:12px;

        padding:12px;
    }

    .download-card-image{
        width:82px;
        height:70px;
    }

    .download-card-info h3{
        white-space:normal;

        display:-webkit-box;

        overflow:hidden;

        -webkit-box-orient:vertical;
        -webkit-line-clamp:2;
    }

    .download-card-meta{
        align-items:flex-start;
        flex-direction:column;

        gap:5px;

        margin-top:7px;
    }

    .download-card-button{
        grid-column:1 / -1;

        width:100%;
    }
}
/* =====================================================
   SEGURIDAD - ÁREA CLIENTE
   Pegar al final de assets/css/cuenta.css
===================================================== */

.security-layout{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);
    gap:16px;
    align-items:start;
}

/* CARD PRINCIPAL */
.security-card{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.security-heading{
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin-bottom:22px;
}

.security-heading-icon{
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:14px;
    color:#c4b5fd;
    background:rgba(124,58,237,.13);
}

.security-heading-icon svg{
    width:24px;
    height:24px;
}

.security-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.55rem;
}

.security-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.86rem;
    line-height:1.5;
}

/* ERRORES */
.security-errors{
    display:grid;
    gap:5px;
    margin-bottom:18px;
    padding:14px;
    border:1px solid rgba(239,68,68,.28);
    border-radius:12px;
    background:rgba(239,68,68,.07);
}

.security-errors-title{
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:2px;
    color:#fca5a5;
}

.security-errors-title svg{
    width:18px;
    height:18px;
}

.security-errors p{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.8rem;
}

/* FORMULARIO */
.security-form{
    display:grid;
    gap:16px;
}

.security-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.security-field{
    display:grid;
    gap:7px;
}

.security-field>span{
    color:var(--theme-text);
    font-size:.86rem;
    font-weight:800;
}

.security-password-wrap{
    position:relative;
}

.security-password-wrap input{
    width:100%;
    min-height:48px;
    padding:10px 46px 10px 13px;
    outline:0;
    border:1px solid var(--theme-border);
    border-radius:10px;
    color:var(--theme-text);
    background:var(--theme-input);
    transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

.security-password-wrap input::placeholder{
    color:var(--theme-text-muted);
}

.security-password-wrap input:focus{
    border-color:rgba(139,92,246,.65);
    box-shadow:0 0 0 3px rgba(139,92,246,.12);
}

.security-eye{
    position:absolute;
    top:50%;
    right:8px;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    padding:0;
    transform:translateY(-50%);
    border:0;
    border-radius:8px;
    color:var(--theme-text-soft);
    background:transparent;
    cursor:pointer;
}

.security-eye:hover{
    color:#a78bfa;
    background:var(--theme-hover);
}

.security-eye svg{
    width:17px;
    height:17px;
}

/* REQUISITOS */
.security-requirements{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 14px;
    padding:12px 14px;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-card-soft);
}

.security-requirements span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:var(--theme-text-soft);
    font-size:.74rem;
    font-weight:700;
}

.security-requirements svg{
    width:14px;
    height:14px;
    color:#a78bfa;
}

.security-submit{
    justify-self:start;
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-width:230px;
    min-height:44px;
}

.security-submit svg{
    width:16px;
    height:16px;
}

/* COLUMNA DERECHA */
.security-side{
    display:grid;
    gap:12px;
}

.security-session-card,
.security-tip-card{
    padding:18px;
    border:1px solid var(--theme-border);
    border-radius:14px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.security-session-card{
    display:grid;
    gap:14px;
}

.security-side-title{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:11px;
    align-items:center;
}

.security-side-title>span{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:11px;
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.security-side-title svg{
    width:19px;
    height:19px;
}

.security-side-title small{
    display:block;
    margin-bottom:2px;
    color:var(--theme-text-soft);
    font-size:.7rem;
}

.security-side-title strong{
    color:var(--theme-text);
    font-size:.9rem;
}

.security-active-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    width:max-content;
    min-height:30px;
    padding:0 10px;
    border:1px solid rgba(34,197,94,.22);
    border-radius:999px;
    color:#86efac;
    background:rgba(34,197,94,.08);
    font-size:.7rem;
    font-weight:900;
}

.security-active-badge svg{
    width:14px;
    height:14px;
}

.security-session-card>p{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.8rem;
    line-height:1.55;
}

/* CONSEJO */
.security-tip-card{
    display:grid;
    grid-template-columns:24px minmax(0,1fr);
    gap:10px;
}

.security-tip-card>svg{
    width:21px;
    height:21px;
    color:#a78bfa;
}

.security-tip-card strong{
    color:var(--theme-text);
    font-size:.82rem;
}

.security-tip-card p{
    margin:4px 0 0;
    color:var(--theme-text-soft);
    font-size:.76rem;
    line-height:1.5;
}

/* TEMA CLARO */
html[data-theme="light"] .security-card,
html[data-theme="light"] .security-session-card,
html[data-theme="light"] .security-tip-card{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

html[data-theme="light"] .security-heading-icon{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .security-active-badge{
    color:#15803d;
}

html[data-theme="light"] .security-side-title>span{
    color:#15803d;
    background:#f0fdf4;
}

html[data-theme="light"] .security-errors-title{
    color:#b91c1c;
}

/* RESPONSIVE */
@media(max-width:1000px){
    .security-layout{
        grid-template-columns:1fr;
    }

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

@media(max-width:680px){
    .security-form-grid{
        grid-template-columns:1fr;
    }

    .security-side{
        grid-template-columns:1fr;
    }
}

@media(max-width:520px){
    .security-card,
    .security-session-card,
    .security-tip-card{
        padding:18px;
    }

    .security-heading{
        grid-template-columns:46px minmax(0,1fr);
    }

    .security-heading-icon{
        width:46px;
        height:46px;
    }

    .security-submit{
        width:100%;
        min-width:0;
    }

    .security-requirements{
        align-items:flex-start;
        flex-direction:column;
    }
}
/* =====================================================
   SOPORTE - ÁREA CLIENTE
   Pegar al final de assets/css/cuenta.css
===================================================== */

.support-layout{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(290px,.55fr);
    gap:16px;
    align-items:start;
}

/* FORMULARIO */
.support-form-card{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.support-heading{
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin-bottom:22px;
}

.support-heading-icon{
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    border-radius:15px;
    color:#c4b5fd;
    background:rgba(124,58,237,.13);
}

.support-heading-icon svg{
    width:25px;
    height:25px;
}

.support-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.6rem;
}

.support-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.86rem;
    line-height:1.5;
}

/* ERRORES */
.support-errors{
    display:grid;
    gap:5px;
    margin-bottom:18px;
    padding:14px;
    border:1px solid rgba(239,68,68,.28);
    border-radius:12px;
    background:rgba(239,68,68,.07);
}

.support-errors>div{
    display:flex;
    align-items:center;
    gap:8px;
    color:#fca5a5;
}

.support-errors svg{
    width:18px;
    height:18px;
}

.support-errors p{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.8rem;
}

/* CAMPOS */
.support-form{
    display:grid;
    gap:15px;
}

.support-field{
    display:grid;
    gap:7px;
}

.support-field>span{
    color:var(--theme-text);
    font-size:.86rem;
    font-weight:800;
}

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

.support-input-wrap>svg{
    position:absolute;
    top:50%;
    left:13px;
    z-index:1;
    width:17px;
    height:17px;
    transform:translateY(-50%);
    color:#a78bfa;
    pointer-events:none;
}

.support-input-wrap input,
.support-input-wrap select{
    width:100%;
    min-height:48px;
    padding:10px 13px 10px 42px;
    outline:0;
    border:1px solid var(--theme-border);
    border-radius:10px;
    color:var(--theme-text);
    background:var(--theme-input);
    font:inherit;
    transition:border-color .18s ease,box-shadow .18s ease;
}

.support-input-wrap input::placeholder{
    color:var(--theme-text-muted);
}

.support-input-wrap input:focus,
.support-input-wrap select:focus,
.support-textarea-wrap textarea:focus{
    border-color:rgba(139,92,246,.65);
    box-shadow:0 0 0 3px rgba(139,92,246,.12);
}

.support-textarea-wrap{
    position:relative;
}

.support-textarea-wrap textarea{
    display:block;
    width:100%;
    min-height:175px;
    padding:13px 13px 34px;
    resize:vertical;
    outline:0;
    border:1px solid var(--theme-border);
    border-radius:10px;
    color:var(--theme-text);
    background:var(--theme-input);
    font:inherit;
    line-height:1.55;
}

.support-textarea-wrap textarea::placeholder{
    color:var(--theme-text-muted);
}

.support-counter{
    position:absolute;
    right:11px;
    bottom:9px;
    color:var(--theme-text-muted);
    font-size:.7rem;
}

.support-counter strong{
    color:#a78bfa;
}

/* PIE FORM */
.support-form-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-top:2px;
}

.support-form-footer>span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:var(--theme-text-soft);
    font-size:.73rem;
}

.support-form-footer>span svg{
    width:15px;
    height:15px;
    color:#a78bfa;
}

.support-submit{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-width:190px;
    min-height:44px;
}

.support-submit svg{
    width:16px;
    height:16px;
}

/* LATERAL */
.support-side{
    display:grid;
    gap:12px;
}

.support-help-card,
.support-response-card{
    padding:18px;
    border:1px solid var(--theme-border);
    border-radius:14px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.support-side-heading h3{
    margin:0;
    color:var(--theme-text);
    font-size:1.05rem;
}

.support-help-list{
    display:grid;
    gap:8px;
    margin-top:14px;
}

.support-help-list>div{
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    gap:10px;
    align-items:center;
    min-height:58px;
    padding:8px;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-card-soft);
}

.support-help-list>div>span{
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:10px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.support-help-list svg{
    width:18px;
    height:18px;
}

.support-help-list strong,
.support-help-list small{
    display:block;
}

.support-help-list strong{
    color:var(--theme-text);
    font-size:.82rem;
}

.support-help-list small{
    margin-top:2px;
    color:var(--theme-text-soft);
    font-size:.7rem;
}

/* RESPUESTA */
.support-response-card{
    display:grid;
    grid-template-columns:24px minmax(0,1fr);
    gap:10px;
}

.support-response-card>svg{
    width:21px;
    height:21px;
    color:#a78bfa;
}

.support-response-card small,
.support-response-card strong{
    display:block;
}

.support-response-card small{
    color:var(--theme-text-soft);
    font-size:.7rem;
}

.support-response-card strong{
    margin-top:2px;
    color:var(--theme-text);
    font-size:.86rem;
}

.support-response-card p{
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.74rem;
    line-height:1.5;
}

/* HISTORIAL */
.support-history{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.support-history-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:16px;
}

.support-history-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.35rem;
}

.support-history-heading>span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:34px;
    padding:0 11px;
    border:1px solid var(--theme-border);
    border-radius:999px;
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
    font-size:.76rem;
    font-weight:900;
}

.support-history-heading>span svg{
    width:15px;
    height:15px;
}

.support-ticket-list{
    display:grid;
    gap:8px;
}

.support-ticket{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    min-height:68px;
    padding:10px 12px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    background:var(--theme-card-soft);
}

.support-ticket-icon{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:11px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.support-ticket-icon svg{
    width:19px;
    height:19px;
}

.support-ticket-main{
    min-width:0;
}

.support-ticket-main>div{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:7px;
}

.support-ticket-main strong{
    color:var(--theme-text);
    font-size:.86rem;
}

.support-ticket-main span{
    display:inline-flex;
    align-items:center;
    min-height:23px;
    padding:0 7px;
    border-radius:999px;
    color:#a78bfa;
    background:rgba(124,58,237,.09);
    font-size:.64rem;
    font-weight:800;
}

.support-ticket-main small{
    display:block;
    margin-top:4px;
    color:var(--theme-text-muted);
    font-size:.68rem;
}

.support-ticket-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 9px;
    border-radius:999px;
    color:#fde68a;
    background:rgba(245,158,11,.10);
    font-size:.68rem;
    font-weight:900;
    text-transform:uppercase;
}

.support-ticket-status.status-cerrado,
.support-ticket-status.status-resuelto,
.support-ticket-status.status-respondido{
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.support-ticket-status.status-rechazado{
    color:#fca5a5;
    background:rgba(239,68,68,.10);
}

.support-history-empty{
    display:grid;
    place-items:center;
    min-height:220px;
    padding:25px;
    text-align:center;
}

.support-history-empty>span{
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    margin-bottom:10px;
    border-radius:15px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.support-history-empty svg{
    width:24px;
    height:24px;
}

.support-history-empty strong{
    color:var(--theme-text);
}

.support-history-empty p{
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.8rem;
}

.support-pagination{
    margin-top:20px;
}

/* LIGHT */
html[data-theme="light"] .support-form-card,
html[data-theme="light"] .support-help-card,
html[data-theme="light"] .support-response-card,
html[data-theme="light"] .support-history{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

html[data-theme="light"] .support-heading-icon,
html[data-theme="light"] .support-help-list>div>span,
html[data-theme="light"] .support-ticket-icon,
html[data-theme="light"] .support-history-empty>span{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .support-ticket,
html[data-theme="light"] .support-help-list>div{
    background:#fff;
}

html[data-theme="light"] .support-history-heading>span{
    color:#5b21b6;
    background:#f3f0ff;
}

/* RESPONSIVE */
@media(max-width:1000px){
    .support-layout{
        grid-template-columns:1fr;
    }

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

@media(max-width:720px){
    .support-side{
        grid-template-columns:1fr;
    }

    .support-form-footer{
        align-items:flex-start;
        flex-direction:column;
    }

    .support-submit{
        width:100%;
    }
}

@media(max-width:560px){
    .support-form-card,
    .support-help-card,
    .support-response-card,
    .support-history{
        padding:18px;
    }

    .support-heading{
        grid-template-columns:46px minmax(0,1fr);
    }

    .support-heading-icon{
        width:46px;
        height:46px;
    }

    .support-ticket{
        grid-template-columns:40px minmax(0,1fr);
    }

    .support-ticket-icon{
        width:40px;
        height:40px;
    }

    .support-ticket-status{
        grid-column:2;
        justify-self:start;
    }
}
/* =====================================================
   PERFIL - ÁREA CLIENTE
   Pegar al final de assets/css/cuenta.css
===================================================== */

.profile-layout{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(290px,.55fr);
    gap:16px;
    align-items:start;
}

/* CARD PRINCIPAL */
.profile-card{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.profile-heading{
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin-bottom:22px;
}

.profile-heading-icon{
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    border-radius:15px;
    color:#c4b5fd;
    background:rgba(124,58,237,.13);
}

.profile-heading-icon svg{
    width:25px;
    height:25px;
}

.profile-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.6rem;
}

.profile-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.86rem;
    line-height:1.5;
}

/* ERRORES */
.profile-errors{
    display:grid;
    gap:5px;
    margin-bottom:18px;
    padding:14px;
    border:1px solid rgba(239,68,68,.28);
    border-radius:12px;
    background:rgba(239,68,68,.07);
}

.profile-errors>div{
    display:flex;
    align-items:center;
    gap:8px;
    color:#fca5a5;
}

.profile-errors svg{
    width:18px;
    height:18px;
}

.profile-errors p{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.8rem;
}

/* FORMULARIO */
.profile-form{
    display:grid;
    gap:18px;
}

.profile-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.profile-field{
    display:grid;
    gap:7px;
}

.profile-field>span{
    color:var(--theme-text);
    font-size:.86rem;
    font-weight:800;
}

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

.profile-input-wrap>svg{
    position:absolute;
    top:50%;
    left:13px;
    z-index:1;
    width:17px;
    height:17px;
    transform:translateY(-50%);
    color:#a78bfa;
    pointer-events:none;
}

.profile-input-wrap input{
    width:100%;
    min-height:48px;
    padding:10px 13px 10px 42px;
    outline:0;
    border:1px solid var(--theme-border);
    border-radius:10px;
    color:var(--theme-text);
    background:var(--theme-input);
    font:inherit;
    transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

.profile-input-wrap input::placeholder{
    color:var(--theme-text-muted);
}

.profile-input-wrap input:focus{
    border-color:rgba(139,92,246,.65);
    box-shadow:0 0 0 3px rgba(139,92,246,.12);
}

.profile-form-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

.profile-form-footer>span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:var(--theme-text-soft);
    font-size:.73rem;
}

.profile-form-footer>span svg{
    width:15px;
    height:15px;
    color:#a78bfa;
}

.profile-submit{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-width:190px;
    min-height:44px;
}

.profile-submit svg{
    width:16px;
    height:16px;
}

/* COLUMNA LATERAL */
.profile-side{
    display:grid;
    gap:12px;
}

.profile-summary-card{
    padding:20px;
    border:1px solid var(--theme-border);
    border-radius:14px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.profile-avatar{
    display:grid;
    place-items:center;
    width:68px;
    height:68px;
    margin-bottom:13px;
    border-radius:18px;
    color:#fff;
    background:linear-gradient(135deg,#7c3aed,#312e81);
    font-size:1.5rem;
    font-weight:900;
    box-shadow:0 12px 28px rgba(124,58,237,.20);
}

.profile-summary-copy{
    display:grid;
    gap:3px;
}

.profile-summary-copy strong{
    overflow:hidden;
    color:var(--theme-text);
    font-size:1rem;
    text-overflow:ellipsis;
}

.profile-summary-copy span{
    overflow:hidden;
    color:var(--theme-text-soft);
    font-size:.76rem;
    text-overflow:ellipsis;
}

/* PROGRESO */
.profile-progress{
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid var(--theme-border);
}

.profile-progress-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:8px;
}

.profile-progress-head span{
    color:var(--theme-text-soft);
    font-size:.73rem;
    font-weight:700;
}

.profile-progress-head strong{
    color:#a78bfa;
    font-size:.78rem;
}

.profile-progress-track{
    height:7px;
    overflow:hidden;
    border-radius:999px;
    background:var(--theme-card-soft);
}

.profile-progress-track>span{
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#7c3aed,#a78bfa);
}

/* DATOS LATERALES */
.profile-summary-list{
    display:grid;
    gap:8px;
    margin-top:18px;
}

.profile-summary-list>div{
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    gap:10px;
    align-items:center;
    min-height:56px;
    padding:8px;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-card-soft);
}

.profile-summary-list>div>span{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:9px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.profile-summary-list svg{
    width:17px;
    height:17px;
}

.profile-summary-list small,
.profile-summary-list strong{
    display:block;
}

.profile-summary-list small{
    color:var(--theme-text-soft);
    font-size:.67rem;
}

.profile-summary-list strong{
    margin-top:2px;
    overflow:hidden;
    color:var(--theme-text);
    font-size:.76rem;
    text-overflow:ellipsis;
}

/* SEGURIDAD */
.profile-security-link{
    display:grid;
    grid-template-columns:42px minmax(0,1fr) 18px;
    gap:11px;
    align-items:center;
    min-height:68px;
    padding:12px;
    border:1px solid var(--theme-border);
    border-radius:14px;
    color:var(--theme-text);
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}

.profile-security-link:hover{
    transform:translateY(-2px);
    border-color:var(--theme-border-hover);
    background:var(--theme-hover);
}

.profile-security-link>span{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:11px;
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.profile-security-link>span svg{
    width:19px;
    height:19px;
}

.profile-security-link small,
.profile-security-link strong{
    display:block;
}

.profile-security-link small{
    color:var(--theme-text-soft);
    font-size:.68rem;
}

.profile-security-link strong{
    margin-top:2px;
    color:var(--theme-text);
    font-size:.82rem;
}

.profile-security-link>svg{
    width:16px;
    height:16px;
    color:var(--theme-text-muted);
}

/* LIGHT */
html[data-theme="light"] .profile-card,
html[data-theme="light"] .profile-summary-card,
html[data-theme="light"] .profile-security-link{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

html[data-theme="light"] .profile-heading-icon,
html[data-theme="light"] .profile-summary-list>div>span{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .profile-summary-list>div{
    background:#fff;
}

html[data-theme="light"] .profile-security-link>span{
    color:#15803d;
    background:#f0fdf4;
}

/* RESPONSIVE */
@media(max-width:1000px){
    .profile-layout{
        grid-template-columns:1fr;
    }

    .profile-side{
        grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);
    }
}

@media(max-width:720px){
    .profile-form-grid{
        grid-template-columns:1fr;
    }

    .profile-side{
        grid-template-columns:1fr;
    }

    .profile-form-footer{
        align-items:flex-start;
        flex-direction:column;
    }

    .profile-submit{
        width:100%;
    }
}

@media(max-width:520px){
    .profile-card,
    .profile-summary-card{
        padding:18px;
    }

    .profile-heading{
        grid-template-columns:46px minmax(0,1fr);
    }

    .profile-heading-icon{
        width:46px;
        height:46px;
    }
}
/* =====================================================
   PEDIDOS + DETALLE + MEMBRESÍA - ÁREA CLIENTE
   Pegar al final de assets/css/cuenta.css
===================================================== */

/* =====================================================
   MI MEMBRESÍA
===================================================== */

.membership-client-panel{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.membership-client-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}

.membership-client-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.65rem;
}

.membership-client-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.86rem;
}

.membership-client-heading .button{
    display:inline-flex;
    gap:7px;
}

.membership-client-heading .button svg{
    width:16px;
    height:16px;
}

/* ACTIVA */
.membership-active-card{
    padding:20px;
    border:1px solid rgba(139,92,246,.28);
    border-radius:14px;
    background:
        radial-gradient(circle at 90% 10%,rgba(139,92,246,.12),transparent 20rem),
        var(--theme-card-soft);
}

.membership-active-main{
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    gap:15px;
    align-items:start;
}

.membership-active-icon{
    display:grid;
    place-items:center;
    width:62px;
    height:62px;
    border-radius:17px;
    color:#fff;
    background:linear-gradient(135deg,#7c3aed,#4c1d95);
    box-shadow:0 12px 28px rgba(124,58,237,.22);
}

.membership-active-icon svg{
    width:28px;
    height:28px;
}

.membership-active-copy h3,
.membership-pending-copy h3,
.membership-empty-card h3{
    margin:3px 0 7px;
    color:var(--theme-text);
    font-size:1.45rem;
}

.membership-active-copy>p:last-child,
.membership-pending-copy>p:last-of-type{
    margin:0;
    color:var(--theme-text-soft);
    line-height:1.55;
}

.membership-active-copy>p:last-child strong{
    color:var(--theme-text);
}

.membership-state-badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:28px;
    margin-bottom:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.67rem;
    font-weight:900;
}

.membership-state-badge svg{
    width:14px;
    height:14px;
}

.membership-state-badge.is-active{
    color:#86efac;
    border:1px solid rgba(34,197,94,.22);
    background:rgba(34,197,94,.08);
}

.membership-state-badge.is-pending{
    color:#fde68a;
    border:1px solid rgba(245,158,11,.24);
    background:rgba(245,158,11,.08);
}

.membership-active-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:20px;
}

.membership-active-stats>div{
    min-height:74px;
    padding:13px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    background:var(--theme-card);
}

.membership-active-stats span{
    display:block;
    margin-bottom:5px;
    color:var(--theme-text-soft);
    font-size:.69rem;
    font-weight:800;
    text-transform:uppercase;
}

.membership-active-stats strong{
    color:var(--theme-text);
    font-size:1rem;
}

.membership-usage{
    margin-top:16px;
    padding:14px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    background:var(--theme-card);
}

.membership-usage-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:9px;
}

.membership-usage-head span{
    color:var(--theme-text-soft);
    font-size:.76rem;
    font-weight:800;
}

.membership-usage-head strong{
    color:var(--theme-text);
    font-size:.78rem;
}

.membership-usage-track{
    height:8px;
    overflow:hidden;
    border-radius:999px;
    background:var(--theme-card-soft);
}

.membership-usage-track>span{
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#7c3aed,#a78bfa);
}

.membership-usage small{
    display:block;
    margin-top:7px;
    color:var(--theme-text-muted);
    font-size:.68rem;
}

.membership-client-actions{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:9px;
    margin-top:18px;
}

.membership-client-actions .button{
    display:inline-flex;
    gap:7px;
}

.membership-client-actions svg{
    width:16px;
    height:16px;
}

/* PENDIENTE */
.membership-pending-card{
    display:grid;
    grid-template-columns:58px minmax(0,1fr) auto;
    gap:15px;
    align-items:center;
    padding:18px;
    border:1px solid rgba(245,158,11,.24);
    border-radius:14px;
    background:rgba(245,158,11,.05);
}

.membership-pending-icon{
    display:grid;
    place-items:center;
    width:58px;
    height:58px;
    border-radius:15px;
    color:#fde68a;
    background:rgba(245,158,11,.12);
}

.membership-pending-icon svg{
    width:25px;
    height:25px;
}

.membership-pending-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px 14px;
    margin-top:10px;
}

.membership-pending-meta span{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:var(--theme-text-soft);
    font-size:.73rem;
}

.membership-pending-meta svg{
    width:14px;
    height:14px;
}

/* SIN PLAN */
.membership-empty-card{
    display:grid;
    place-items:center;
    min-height:330px;
    padding:30px;
    text-align:center;
}

.membership-empty-card>span{
    display:grid;
    place-items:center;
    width:66px;
    height:66px;
    margin-bottom:12px;
    border-radius:18px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.membership-empty-card>span svg{
    width:30px;
    height:30px;
}

.membership-empty-card p{
    max-width:560px;
    margin:0 0 18px;
    color:var(--theme-text-soft);
    line-height:1.6;
}

/* =====================================================
   MIS PEDIDOS
===================================================== */

.orders-client-panel{
    padding:22px;
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.orders-client-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}

.orders-client-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.65rem;
}

.orders-client-heading>div>p:not(.eyebrow){
    margin:6px 0 0;
    color:var(--theme-text-soft);
    font-size:.86rem;
}

.orders-client-count{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:36px;
    padding:0 12px;
    border:1px solid var(--theme-border);
    border-radius:999px;
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
    font-size:.78rem;
    font-weight:900;
}

.orders-client-count svg{
    width:16px;
    height:16px;
}

.orders-client-list{
    display:grid;
    gap:9px;
}

.orders-client-row{
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 130px 110px 18px;
    gap:12px;
    align-items:center;
    min-height:76px;
    padding:10px 12px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    color:var(--theme-text);
    background:var(--theme-card-soft);
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}

.orders-client-row:hover{
    transform:translateY(-1px);
    border-color:var(--theme-border-hover);
    background:var(--theme-hover);
}

.orders-client-icon{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:11px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.orders-client-icon svg{
    width:19px;
    height:19px;
}

.orders-client-info strong{
    display:block;
    color:var(--theme-text);
    font-size:.86rem;
}

.orders-client-info span{
    display:inline-flex;
    align-items:center;
    gap:5px;
    margin-top:4px;
    color:var(--theme-text-soft);
    font-size:.7rem;
}

.orders-client-info svg{
    width:13px;
    height:13px;
}

.orders-client-price small,
.orders-client-price strong{
    display:block;
}

.orders-client-price small{
    color:var(--theme-text-soft);
    font-size:.66rem;
}

.orders-client-price strong{
    margin-top:2px;
    color:var(--theme-text);
    font-size:.88rem;
}

.orders-client-status,
.order-detail-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 9px;
    border-radius:999px;
    color:#fde68a;
    background:rgba(245,158,11,.10);
    font-size:.67rem;
    font-weight:900;
    text-transform:uppercase;
}

.orders-client-status.status-pagado,
.orders-client-status.status-completado,
.orders-client-status.status-procesando,
.order-detail-status.status-pagado,
.order-detail-status.status-completado,
.order-detail-status.status-procesando{
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.orders-client-status.status-cancelado,
.orders-client-status.status-rechazado,
.order-detail-status.status-cancelado,
.order-detail-status.status-rechazado{
    color:#fca5a5;
    background:rgba(239,68,68,.10);
}

.orders-client-arrow{
    width:17px;
    height:17px;
    color:var(--theme-text-muted);
}

.orders-client-empty{
    display:grid;
    place-items:center;
    min-height:330px;
    text-align:center;
}

.orders-client-empty>span{
    display:grid;
    place-items:center;
    width:62px;
    height:62px;
    margin-bottom:12px;
    border-radius:17px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.orders-client-empty>span svg{
    width:27px;
    height:27px;
}

.orders-client-empty h3{
    margin:0;
    color:var(--theme-text);
}

.orders-client-empty p{
    margin:7px 0 18px;
    color:var(--theme-text-soft);
}

.orders-client-pagination{
    margin-top:20px;
}

/* =====================================================
   DETALLE DE PEDIDO
===================================================== */

.order-detail-layout{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(290px,.55fr);
    gap:16px;
    align-items:start;
}

.order-detail-card,
.order-summary-side,
.order-history-modern,
.order-detail-missing{
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.order-detail-card{
    padding:22px;
}

.order-detail-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding-bottom:18px;
    border-bottom:1px solid var(--theme-border);
}

.order-detail-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.65rem;
}

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

.order-detail-meta span{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:var(--theme-text-soft);
    font-size:.72rem;
}

.order-detail-meta svg{
    width:14px;
    height:14px;
    color:#a78bfa;
}

/* PAGO */
.order-payment-card{
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:11px;
    margin-top:16px;
    padding:13px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    background:var(--theme-card-soft);
}

.order-payment-icon{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:11px;
    color:#fde68a;
    background:rgba(245,158,11,.10);
}

.order-payment-icon svg{
    width:20px;
    height:20px;
}

.order-payment-card.status-aprobado .order-payment-icon,
.order-payment-card.status-pagado .order-payment-icon{
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.order-payment-card.status-rechazado .order-payment-icon{
    color:#fca5a5;
    background:rgba(239,68,68,.10);
}

.order-payment-card small,
.order-payment-card strong{
    display:block;
}

.order-payment-card small{
    color:var(--theme-text-soft);
    font-size:.67rem;
}

.order-payment-card strong{
    margin-top:2px;
    color:var(--theme-text);
    font-size:.86rem;
    text-transform:capitalize;
}

.order-payment-card p{
    margin:5px 0 0;
    color:var(--theme-text-soft);
    font-size:.75rem;
    line-height:1.5;
}

/* ITEMS */
.order-detail-items{
    margin-top:22px;
}

.order-section-title h3{
    margin:0;
    color:var(--theme-text);
    font-size:1.05rem;
}

.order-product-row,
.order-plan-row{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) auto;
    gap:11px;
    align-items:center;
    min-height:66px;
    margin-top:9px;
    padding:10px;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-card-soft);
}

.order-item-icon{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:10px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.order-item-icon svg{
    width:19px;
    height:19px;
}

.order-product-row small,
.order-product-row strong,
.order-plan-row small,
.order-plan-row strong{
    display:block;
}

.order-product-row small,
.order-plan-row small{
    color:var(--theme-text-soft);
    font-size:.66rem;
}

.order-product-row strong,
.order-plan-row strong{
    margin-top:2px;
    color:var(--theme-text);
    font-size:.82rem;
}

.order-detail-note{
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin:11px 0 0;
    padding:11px;
    border-radius:9px;
    color:#fde68a;
    background:rgba(245,158,11,.08);
    font-size:.75rem;
    line-height:1.5;
}

.order-detail-note svg{
    flex:0 0 auto;
    width:16px;
    height:16px;
}

.order-detail-note.is-danger{
    color:#fca5a5;
    background:rgba(239,68,68,.08);
}

.order-items-empty{
    margin-top:10px;
    padding:14px;
    border:1px dashed var(--theme-border);
    border-radius:10px;
    color:var(--theme-text-soft);
    text-align:center;
    font-size:.8rem;
}

/* TOTAL */
.order-detail-total{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-top:18px;
    padding:16px 0 0;
    border-top:1px solid var(--theme-border);
}

.order-detail-total span{
    color:var(--theme-text-soft);
    font-weight:800;
}

.order-detail-total strong{
    color:var(--theme-text);
    font-size:1.35rem;
}

.order-detail-actions{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:9px;
    margin-top:18px;
}

.order-detail-actions .button{
    display:inline-flex;
    gap:7px;
}

.order-detail-actions svg{
    width:16px;
    height:16px;
}

/* LATERAL */
.order-detail-side{
    display:grid;
    gap:12px;
}

.order-summary-side,
.order-history-modern{
    padding:18px;
}

.order-summary-side>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:11px 0;
    border-bottom:1px solid var(--theme-border);
}

.order-summary-side>div:last-child{
    border-bottom:0;
}

.order-summary-side span{
    color:var(--theme-text-soft);
    font-size:.75rem;
}

.order-summary-side strong{
    color:var(--theme-text);
    font-size:.8rem;
    text-align:right;
}

.order-summary-side .is-total strong{
    color:#a78bfa;
    font-size:1rem;
}

/* HISTORIAL */
.order-history-list{
    display:grid;
    gap:0;
    margin-top:13px;
}

.order-history-event{
    position:relative;
    display:grid;
    grid-template-columns:16px minmax(0,1fr);
    gap:10px;
    padding-bottom:17px;
}

.order-history-event:not(:last-child)::before{
    content:"";
    position:absolute;
    top:14px;
    left:5px;
    width:1px;
    height:calc(100% - 4px);
    background:var(--theme-border);
}

.order-history-dot{
    position:relative;
    z-index:1;
    width:11px;
    height:11px;
    margin-top:4px;
    border:2px solid var(--theme-card);
    border-radius:50%;
    background:#8b5cf6;
    box-shadow:0 0 0 2px rgba(139,92,246,.22);
}

.order-history-event strong,
.order-history-event span{
    display:block;
}

.order-history-event strong{
    color:var(--theme-text);
    font-size:.78rem;
    text-transform:capitalize;
}

.order-history-event span{
    margin-top:2px;
    color:var(--theme-text-muted);
    font-size:.66rem;
}

.order-history-event p{
    margin:5px 0 0;
    color:var(--theme-text-soft);
    font-size:.72rem;
    line-height:1.5;
}

/* PEDIDO NO ENCONTRADO */
.order-detail-missing{
    display:grid;
    place-items:center;
    min-height:380px;
    padding:30px;
    text-align:center;
}

.order-detail-missing>span{
    display:grid;
    place-items:center;
    width:66px;
    height:66px;
    margin-bottom:12px;
    border-radius:18px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.order-detail-missing svg{
    width:29px;
    height:29px;
}

.order-detail-missing h2{
    margin:0;
    color:var(--theme-text);
}

.order-detail-missing p{
    margin:7px 0 18px;
    color:var(--theme-text-soft);
}

/* =====================================================
   LIGHT
===================================================== */

html[data-theme="light"] .membership-client-panel,
html[data-theme="light"] .orders-client-panel,
html[data-theme="light"] .order-detail-card,
html[data-theme="light"] .order-summary-side,
html[data-theme="light"] .order-history-modern,
html[data-theme="light"] .order-detail-missing{
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

html[data-theme="light"] .membership-active-card,
html[data-theme="light"] .membership-active-stats>div,
html[data-theme="light"] .membership-usage,
html[data-theme="light"] .orders-client-row,
html[data-theme="light"] .order-payment-card,
html[data-theme="light"] .order-product-row,
html[data-theme="light"] .order-plan-row{
    background:#fff;
}

html[data-theme="light"] .orders-client-icon,
html[data-theme="light"] .order-item-icon,
html[data-theme="light"] .membership-empty-card>span,
html[data-theme="light"] .orders-client-empty>span,
html[data-theme="light"] .order-detail-missing>span{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .orders-client-count{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .membership-state-badge.is-active{
    color:#15803d;
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media(max-width:1050px){
    .membership-active-stats{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

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

    .order-detail-side{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:820px){
    .orders-client-row{
        grid-template-columns:44px minmax(0,1fr) auto;
    }

    .orders-client-price{
        grid-column:2;
    }

    .orders-client-status{
        grid-column:3;
        grid-row:1 / span 2;
    }

    .orders-client-arrow{
        display:none;
    }

    .membership-pending-card{
        grid-template-columns:52px minmax(0,1fr);
    }

    .membership-pending-card>.button{
        grid-column:1 / -1;
        width:100%;
    }
}

@media(max-width:680px){
    .membership-client-heading,
    .orders-client-heading{
        align-items:flex-start;
        flex-direction:column;
    }

    .membership-active-stats{
        grid-template-columns:1fr 1fr;
    }

    .order-detail-side{
        grid-template-columns:1fr;
    }

    .order-detail-actions,
    .membership-client-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .order-detail-actions .button,
    .membership-client-actions .button{
        width:100%;
    }
}

@media(max-width:520px){
    .membership-client-panel,
    .orders-client-panel,
    .order-detail-card,
    .order-summary-side,
    .order-history-modern{
        padding:18px;
    }

    .membership-active-main{
        grid-template-columns:50px minmax(0,1fr);
    }

    .membership-active-icon{
        width:50px;
        height:50px;
    }

    .membership-active-stats{
        grid-template-columns:1fr;
    }

    .orders-client-row{
        grid-template-columns:42px minmax(0,1fr);
    }

    .orders-client-price{
        grid-column:2;
    }

    .orders-client-status{
        grid-column:2;
        grid-row:auto;
        justify-self:start;
    }

    .order-detail-heading{
        flex-direction:column;
    }

    .order-product-row,
    .order-plan-row{
        grid-template-columns:42px minmax(0,1fr);
    }

    .order-product-row>strong:last-child,
    .order-plan-row>strong:last-child{
        grid-column:2;
        margin-top:5px;
    }
}