/* Estilos do frontend para WP Accessibility Fixer - acessibilidade + correções específicas */

/* Apenas melhorar foco para acessibilidade */
*:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
}

/* Melhorar foco em elementos específicos */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
}

/* Melhorar foco em elementos com role */
[role="button"]:focus,
[role="link"]:focus,
[role="tab"]:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
}

/* Melhorar foco nos títulos */
h1:focus,
h2:focus,
h3:focus,
h4:focus,
h5:focus,
h6:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
}

/* Correções específicas para links que dependem apenas da cor */
.wpaf-color-dependent-link {
    text-decoration: underline !important;
    border-bottom: 1px solid currentColor !important;
}

.wpaf-color-dependent-link:hover,
.wpaf-color-dependent-link:focus {
    text-decoration: underline !important;
    border-bottom: 2px solid currentColor !important;
}

/* Garantir que links tenham indicadores visuais além da cor */
a:not([class*="no-underline"]):not([class*="text-decoration-none"]) {
    text-decoration: underline;
}

/* Links sem underline devem ter outros indicadores */
a[class*="no-underline"],
a[class*="text-decoration-none"] {
    border-bottom: 1px solid currentColor;
    font-weight: bold;
}

a[class*="no-underline"]:hover,
a[class*="text-decoration-none"]:hover,
a[class*="no-underline"]:focus,
a[class*="text-decoration-none"]:focus {
    border-bottom: 2px solid currentColor;
    text-decoration: underline !important;
}

/* Correções específicas para elementos Elementor com baixo contraste */
.elementor-button[data-wpaf-contrast-checked="true"] {
    background-color: #0073aa !important;
    color: #ffffff !important;
    border: 2px solid #005177 !important;
}

.elementor-button[data-wpaf-contrast-checked="true"]:hover,
.elementor-button[data-wpaf-contrast-checked="true"]:focus {
    background-color: #005177 !important;
    color: #ffffff !important;
}

/* Correções para links com baixo contraste */
a[data-wpaf-contrast-checked="true"] {
    color: #0066cc !important;
    text-decoration: underline !important;
}

a[data-wpaf-contrast-checked="true"]:visited {
    color: #551a8b !important;
}

a[data-wpaf-contrast-checked="true"]:hover,
a[data-wpaf-contrast-checked="true"]:focus {
    color: #004499 !important;
    text-decoration: underline !important;
}

/* Correções para textos com baixo contraste */
.wpaf-low-contrast-text {
    color: #000000 !important;
    background-color: #ffffff !important;
}

.wpaf-low-contrast-text a {
    color: #0066cc !important;
    text-decoration: underline !important;
}

/* Elementos com contraste ajustado dinamicamente */
.wpaf-dynamic-contrast {
    transition: color 0.3s ease !important;
}

.wpaf-dynamic-contrast:hover {
    opacity: 0.8 !important;
}

/* Indicador mínimo para elementos com problemas (apenas para debug) */
.wpaf-contrast-warning {
    position: relative;
}

.wpaf-contrast-warning::before {
    content: "⚠️";
    position: absolute;
    top: -5px;
    right: -5px;
    background: #ff6b6b;
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    z-index: 1000;
}

/* Skip links para navegação por teclado */
.wpaf-skip-link {
    position: absolute;
    top: -40px;
    left: 6px;
    background: #000;
    color: #fff;
    padding: 8px;
    text-decoration: none;
    z-index: 100000;
}

.wpaf-skip-link:focus {
    top: 6px;
}

/* Elementos ocultos visualmente mas acessíveis */
.wpaf-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}