/*
 Theme Name:   Esben n/naka Accessible
 Theme URI:    https://n-naka.com
 Description:  Child theme of Esben with accessibility fixes for WCAG compliance.
               Fixes: Logo alt text (44b), and other accessibility improvements.
 Author:       n/naka
 Author URI:   https://n-naka.com
 Template:     esben
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  esben-nnaka-accessible
*/

/* 
 * Accessibility Fixes Log:
 * ------------------------
 * 2024-12-06: Initial creation
 *   - 44b: Fixed logo alt text to use descriptive text instead of generic "logo"
 *   - 44d: Added aria-labels to external links (via JS)
 *   - 44a: Changed accordion h4 to h2 for proper heading hierarchy (via JS)
 *   - 44h: Added button role to accordion triggers (via JS)
 *   - 44i: Added aria-expanded state to accordions (via JS)
 *
 * Add any custom CSS below this line
 */

/* ==========================================================================
   44a Fix: Preserve h4 styling when accordion headings are changed to h2
   ========================================================================== */

/**
 * WPBakery accordion headings are changed from h4 to h2 via JavaScript
 * for proper heading hierarchy. This CSS ensures they retain the original
 * h4 visual styling.
 */
.vc_tta.vc_general h2.vc_tta-panel-title {
    /* Original h4 font styles */
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    
    /* Original h4 spacing */
    margin: 0;
    line-height: 1;
    
    /* Original heading color and transform */
    color: #212121;
    text-transform: uppercase;
    
    /* Reset any h2-specific browser defaults */
    padding: 0;
    background: transparent;
    border: 0;
    vertical-align: baseline;
    outline: 0;
}

/* ==========================================================================
   WCAG 2.2 2.5.8 Fix: Target Size (Minimum)
   Skip links must be at least 24x24 CSS pixels
   ========================================================================== */

a.skip-link,
a.skip-link[href=".edgtf-page-footer"] {
    min-height: 24px !important;
    min-width: 24px !important;
    padding: 8px 12px !important;
    display: inline-block !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   WCAG 2.2 AA 2.4.7 Fix: Focus Visible
   RevSlider links have outline:none which removes focus indicator
   ========================================================================== */

/* RevSlider links - restore focus outline */
.rs-layer:focus,
.rs-layer:focus-visible {
    outline: 2px solid #fff !important;
    outline-offset: 2px !important;
}

/* Skip links focus visibility */
.skip-link:focus,
.skip-link:focus-visible {
    outline: 2px solid #333 !important;
    outline-offset: 2px !important;
}

/* Footer accessibility statement link - restore focus outline */
a[href*="accessibility-statement"]:focus,
a[href*="accessibility-statement"]:focus-visible {
    outline: 2px solid #6b8e23 !important;
    outline-offset: 2px !important;
}

/* ==========================================================================
   WCAG 2.4.7 Fix: Comprehensive Focus Visibility
   Ensure ALL focusable elements have visible focus indicators
   ========================================================================== */

/* Global focus styles for all interactive elements */
.a11y-focus-visible a:focus,
.a11y-focus-visible button:focus,
.a11y-focus-visible input:focus,
.a11y-focus-visible select:focus,
.a11y-focus-visible textarea:focus,
.a11y-focus-visible [tabindex]:focus {
    outline: 2px solid #6b8e23 !important;
    outline-offset: 2px !important;
}

/* White outline for elements on dark backgrounds */
.a11y-focus-visible .edgtf-page-footer a:focus,
.a11y-focus-visible footer a:focus,
.a11y-focus-visible .rs-layer:focus {
    outline: 2px solid #fff !important;
    outline-offset: 2px !important;
}

/* Accordion panel focus */
.a11y-focus-visible .vc_tta-panel-title a:focus {
    outline: 2px solid #6b8e23 !important;
    outline-offset: 2px !important;
}

/* ==========================================================================
   Additional Focus Fixes for specific elements flagged by PowerMapper
   ========================================================================== */

/* Logo link focus */
a[itemprop="url"]:focus,
.edgtf-logo-wrapper a:focus,
.edgtf-position-left a:focus {
    outline: 2px solid #6b8e23 !important;
    outline-offset: 2px !important;
}

/* Navigation menu links focus */
.edgtf-main-menu > ul > li > a:focus,
.edgtf-main-menu a:focus,
.menu-item a:focus,
a[role="button"]:focus {
    outline: 2px solid #6b8e23 !important;
    outline-offset: 2px !important;
}

/* Universal focus override - catch any remaining elements */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus,
[role="button"]:focus {
    outline: 2px solid #6b8e23 !important;
    outline-offset: 2px !important;
}