/* ============================================================
   ARCOP · AJUSTES VISUALES · SIMPLEMEDIA
   Corrige herencias de color y contraste del tema global.
   ============================================================ */

/* Base */
.arcop-home,
.arcop-interna{
    background:#ffffff;
    color:#111111;
}

.arcop-home .arcop-panel,
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark),
.arcop-interna .arcop-panel,
.arcop-interna .arcop-page-heading,
.arcop-interna .arcop-result,
.arcop-interna .arcop-gestion-card,
.arcop-interna .arcop-toolbar,
.arcop-interna .arcop-solicitudes-panel,
.arcop-interna .arcop-ticket-panel{
    color:#111111;
}

/* Kicker / volantas fuera del hero */
.arcop-home .arcop-heading .global-kicker,
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) .global-kicker,
.arcop-interna .global-kicker,
.arcop-result .global-kicker{
    color:var(--sm-pink) !important;
}

/* Home: bloque lateral claro */
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark){
    background:#f7f7f7;
    border-color:#e4e4e4;
    color:#111111;
}

.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) h3,
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) strong,
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) li,
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) div{
    color:#111111;
}

.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) p,
.arcop-home .arcop-sidebar-block:not(.arcop-sidebar-block--dark) span{
    color:#666666;
    opacity:1;
}

.arcop-home .arcop-rights-list{
    gap:0;
}

.arcop-home .arcop-rights-list li{
    padding:14px 0;
    border-top:1px solid #e5e5e5;
}

.arcop-home .arcop-rights-list li:first-child{
    padding-top:0;
    border-top:0;
}

.arcop-home .arcop-rights-list i{
    color:var(--sm-pink);
}

.arcop-home .arcop-sidebar-block--dark p,
.arcop-home .arcop-sidebar-block--dark span{
    color:rgba(255,255,255,.78);
    opacity:1;
}

/* Hero: asegurar enlace legible */
.arcop-hero .global-text-link--light,
.arcop-hero .global-text-link--light span,
.arcop-hero .global-text-link--light i{
    color:#ffffff !important;
}

.arcop-hero .global-text-link--light:hover,
.arcop-hero .global-text-link--light:hover span,
.arcop-hero .global-text-link--light:hover i{
    color:var(--sm-pink) !important;
}

/* Títulos y copy de internas */
.arcop-interna h1,
.arcop-interna h2,
.arcop-interna h3,
.arcop-interna h4,
.arcop-interna h5,
.arcop-interna h6,
.arcop-interna strong,
.arcop-interna b,
.arcop-interna .arcop-toolbar a,
.arcop-interna .arcop-dashboard-tab,
.arcop-interna .arcop-dashboard-tab.is-active,
.arcop-interna .arcop-gestion-card,
.arcop-interna .arcop-gestion-card h2,
.arcop-interna .arcop-gestion-link,
.arcop-interna label,
.arcop-interna th,
.arcop-interna td{
    color:#111111;
}

.arcop-interna p,
.arcop-interna li,
.arcop-interna small,
.arcop-interna .arcop-page-heading p,
.arcop-interna .arcop-gestion-card p,
.arcop-interna .arcop-result p,
.arcop-interna .arcop-alert,
.arcop-interna .arcop-alert p{
    color:#666666;
}

.arcop-interna .table td,
.arcop-interna .table th{
    border-color:#e6e6e6;
}

.arcop-home .form-control::placeholder,
.arcop-interna .form-control::placeholder,
.arcop-interna textarea::placeholder{
    color:#999999;
    opacity:1;
}

/* Focus y botones */
.arcop-home .arcop-button--primary,
.arcop-interna .arcop-button--primary{
    background:#111111;
    border-color:#111111;
    color:#ffffff;
}

.arcop-home .arcop-button--primary:hover,
.arcop-interna .arcop-button--primary:hover{
    background:var(--sm-pink);
    border-color:var(--sm-pink);
    color:#ffffff;
}

.arcop-home .arcop-button--primary i,
.arcop-interna .arcop-button--primary i{
    color:inherit;
}


/* ============================================================
   ARCOP · ALINEACIÓN CON EL ESTÁNDAR VISUAL SIMPLEMEDIA
   El sitio usa Bootstrap .container como eje de composición.
   El kit ARCOP llegó con .container-fluid + .global-container,
   pero .global-container no existe en el CSS global del sitio.
   Estas reglas reproducen exactamente los anchos de .container.
   ============================================================ */

.arcop-hero .global-container,
.arcop-home .global-container,
.arcop-interna .global-container{
    width:100%;
    margin-right:auto;
    margin-left:auto;
}

/* Mismo ritmo vertical de .sm-section */
.arcop-home.global-section,
.arcop-interna.global-section{
    padding-top:7.8125rem;
    padding-bottom:7.8125rem;
}

/* El hero mantiene fondo a pantalla completa, pero el contenido
   queda alineado al mismo eje del resto de SimpleMedia. */
.arcop-hero-content{
    max-width:760px;
}

/* Kicker visual coherente con el lenguaje de SimpleMedia */
.arcop-home .global-kicker,
.arcop-interna .global-kicker{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
    color:var(--sm-pink) !important;
    font-size:.75rem;
    font-weight:800;
    letter-spacing:.12em;
    line-height:1.35;
    text-transform:uppercase;
}

/* Evita que los paneles se sientan pegados al borde del contenedor */
.arcop-home .row,
.arcop-interna .row{
    --bs-gutter-x:2rem;
}

@media (min-width:576px){
    .arcop-hero .global-container,
    .arcop-home .global-container,
    .arcop-interna .global-container{
        max-width:540px;
    }
}

@media (min-width:768px){
    .arcop-hero .global-container,
    .arcop-home .global-container,
    .arcop-interna .global-container{
        max-width:720px;
    }
}

@media (min-width:992px){
    .arcop-hero .global-container,
    .arcop-home .global-container,
    .arcop-interna .global-container{
        max-width:960px;
    }
}

@media (min-width:1200px){
    .arcop-hero .global-container,
    .arcop-home .global-container,
    .arcop-interna .global-container{
        max-width:1140px;
    }
}

@media (min-width:1400px){
    .arcop-hero .global-container,
    .arcop-home .global-container,
    .arcop-interna .global-container{
        max-width:1320px;
    }
}

@media (max-width:991.98px){
    .arcop-home.global-section,
    .arcop-interna.global-section{
        padding-top:5.625rem;
        padding-bottom:5.625rem;
    }
}

@media (max-width:575.98px){
    .arcop-home.global-section,
    .arcop-interna.global-section{
        padding-top:4.6875rem;
        padding-bottom:4.6875rem;
    }

    .arcop-home .row,
    .arcop-interna .row{
        --bs-gutter-x:1.5rem;
    }
}