/**
 * ACCESSIBILITY FIXES - SIN ANIMACIONES NO COMPUESTAS
 * Solo usa !important en propiedades que NO causan reflow
 * Propiedades seguras: opacity, transform, color (en ciertos contextos)
 */

/* ===================================
   VARIABLES
   =================================== */
:root {
    --color-primary: #d4007a;
    --color-primary-dark: #8b2566;
    --color-text-dark: #1a1a1a;
    --color-text: #2d2d2d;
    --color-text-light: #4a4a4a;
    --color-background: #fafafa;
    --color-white: #ffffff;
}

/* ===================================
   COLORES - Estos SÍ pueden usar !important
   =================================== */

/* Menú móvil */
#mobile-menu-title,
.mobile-menu-title,
.mobile-menu-header h2 {
    color: #1a1a1a !important;
}

.mobile-menu-panel,
#mobile-menu-panel {
    color: #2d2d2d !important;
}

.mobile-menu-panel h2,
.mobile-menu-panel h3 {
    color: #1a1a1a !important;
}

.mobile-menu-panel p {
    color: #4a4a4a !important;
}

.mobile-menu-list a {
    color: #2d2d2d !important;
}

.mobile-menu-list a:hover,
.mobile-menu-list a:focus {
    color: #8b2566 !important;
}

/* Botones */
.btn-primary,
a.btn-primary,
button.btn-primary {
    background-color: #8b2566 !important;
    color: #ffffff !important;
    border-color: #8b2566 !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #6b1d50 !important;
    border-color: #6b1d50 !important;
    color: #ffffff !important;
}

.btn-secondary,
a.btn-secondary {
    background-color: transparent !important;
    color: #8b2566 !important;
    border-color: #8b2566 !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: #8b2566 !important;
    color: #ffffff !important;
}

/* Footer botones */
.site-footer .btn-secondary,
footer .btn-secondary {
    background-color: transparent !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
}

.site-footer .btn-secondary:hover,
footer .btn-secondary:hover {
    background-color: #ffffff !important;
    color: #2d2d2d !important;
}

/* Why-us section */
.why-us-section h3,
.why-us-item h3 {
    color: #1a1a1a !important;
}

.why-us-section p,
.why-us-item p {
    color: #4a4a4a !important;
}

/* Testimonials */
.testimonial-card cite {
    color: #8b2566 !important;
}

.testimonial-card p {
    color: #4a4a4a !important;
}

.testimonial-card h3 {
    color: #1a1a1a !important;
}

/* Footer */
.site-footer,
footer {
    background-color: #2d2d2d !important;
    color: #f5f5f5 !important;
}

.site-footer h2,
.site-footer h3,
.site-footer h4,
footer h2,
footer h3,
footer h4 {
    color: #ffffff !important;
}

.site-footer p,
.site-footer li,
footer p,
footer li {
    color: #f5f5f5 !important;
}

.site-footer strong,
footer strong {
    color: #ffffff !important;
}

.site-footer a:not(.btn),
footer a:not(.btn) {
    color: #ffffff !important;
}

.site-footer a:not(.btn):hover,
footer a:not(.btn):hover {
    color: #ffc0e0 !important;
}

.footer-bottom {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
}

/* Texto general */
body {
    color: #2d2d2d !important;
}

h1, h2, h3, h4, h5, h6 {
    color: #1a1a1a !important;
}

p {
    color: #4a4a4a !important;
}

/* Enlaces */
a {
    color: #8b2566 !important;
}

a:hover,
a:focus {
    color: #6b1d50 !important;
}

/* Navegación */
.main-navigation a {
    color: #2d2d2d !important;
}

.main-navigation a:hover,
.main-navigation .current-menu-item a {
    color: #8b2566 !important;
}

/* Formularios */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
    border-color: #4a4a4a !important;
    color: #2d2d2d !important;
    background-color: #ffffff !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: #8b2566 !important;
}

label {
    color: #2d2d2d !important;
}

::placeholder {
    color: #6a6a6a !important;
}

/* Hero */
.hero-title {
    color: #1a1a1a !important;
}

.hero-subtitle {
    color: #2d2d2d !important;
}

.hero-description {
    color: #4a4a4a !important;
}

/* Servicios */
.service-title {
    color: #1a1a1a !important;
}

.service-price {
    color: #8b2566 !important;
}

/* WPML */
.wpml-ls-link {
    color: #2d2d2d !important;
}

.wpml-ls-link:hover {
    color: #8b2566 !important;
}

/* ===================================
   TAMAÑOS - SIN !important para evitar reflow
   =================================== */

/* Estas reglas NO usan !important */
@media (max-width: 768px) {
    a,
    button,
    .btn {
        min-height: 48px;
        min-width: 48px;
    }
    
    body {
        font-size: 16px;
    }
    
    p, li, span {
        font-size: 16px;
        line-height: 1.6;
    }
}

/* ===================================
   OUTLINE - Seguro con !important
   =================================== */

button:focus,
a:focus,
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid #8b2566 !important;
    outline-offset: 2px !important;
}

/* ===================================
   ALTO CONTRASTE
   =================================== */

@media (prefers-contrast: high) {
    body {
        color: #000000 !important;
        background-color: #ffffff !important;
    }
    
    .btn-primary {
        background-color: #000000 !important;
        color: #ffffff !important;
        border-color: #000000 !important;
    }
}

/* ===================================
   REDUCIR MOVIMIENTO
   =================================== */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }
}