/**
 * Papadioti Accessibility - WCAG 2.1 AA Fixes
 * =============================================
 * Αυτό το αρχείο διορθώνει θέματα προσβασιμότητας χωρίς να αλλάζει
 * την εμφάνιση του site για τους βλέποντες χρήστες.
 */

/* =========================================
   1. SCREEN READER ONLY (Visually Hidden)
   ========================================= */
.papa11y-sr-only,
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Screen reader only, but visible on focus (for skip links) */
.papa11y-sr-only-focusable:focus,
.papa11y-sr-only-focusable:active {
    position: fixed !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 999999 !important;
    width: auto !important;
    height: auto !important;
    padding: 16px 24px !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: normal !important;
    background: #1a1a2e !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border: 3px solid #e94560 !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
    outline: none !important;
}


/* =========================================
   2. FOCUS INDICATORS (WCAG 2.4.7)
   ========================================= */

/* Universal focus style - visible, high contrast */
*:focus {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
}

/* Remove only for mouse users */
*:focus:not(:focus-visible) {
    outline: none !important;
}

/* Keyboard-only focus (modern browsers) */
*:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 6px rgba(233, 69, 96, 0.25) !important;
}

/* Links */
a:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
    border-radius: 3px;
}

/* Buttons */
button:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible,
.btn:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 6px rgba(233, 69, 96, 0.25) !important;
}

/* Form inputs */
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 0 !important;
    border-color: #e94560 !important;
    box-shadow: 0 0 0 4px rgba(233, 69, 96, 0.2) !important;
}

/* Navigation items */
nav a:focus-visible,
.menu a:focus-visible,
.nav a:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
    background: rgba(233, 69, 96, 0.1) !important;
    border-radius: 4px;
}

/* Close buttons in modals */
.close:focus-visible,
[aria-label="Κλείσιμο"]:focus-visible,
button[class*="close"]:focus-visible {
    outline: 3px solid #ffffff !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.4) !important;
}

/* ── ESPA POPUP / LIGHTBOX CONTROLS (Contrast fix) ──
   The popup buttons (Close, Previous, Next, Toggle Full-screen, 
   Zoom In/Out) have white text on white background = 1:1 ratio.
   Force dark text or dark background on these controls. */

/* CMP popup banner controls */
.cmp-popup-banner-wrap button,
.cmp-popup-banner-grid button,
.cmp-popup-banner-wrap a,
.cmp-popup-banner-grid a,
[class*="cmp-popup"] button,
[class*="cmp-popup"] a {
    color: #333333 !important;
    background-color: rgba(0, 0, 0, 0.08) !important;
    border: 1px solid #666666 !important;
    border-radius: 4px !important;
    padding: 4px 10px !important;
    min-width: 32px !important;
    min-height: 32px !important;
}

[class*="cmp-popup"] button:hover,
[class*="cmp-popup"] a:hover {
    background-color: rgba(0, 0, 0, 0.15) !important;
    color: #111111 !important;
}

/* Generic lightbox / gallery controls on white backgrounds */
button[class*="close"],
button[class*="Close"],
button[class*="prev"],
button[class*="next"],
button[class*="zoom"],
button[class*="fullscreen"],
button[class*="toggle"] {
    color: #333333 !important;
}

/* If these controls are on a dark overlay, keep them white */
[class*="overlay"] button,
[class*="modal"][style*="background"] button,
.mfp-wrap button,
.fancybox-container button {
    color: #ffffff !important;
}

/* Social icons */
a[aria-label*="Instagram"]:focus-visible,
a[aria-label*="Facebook"]:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 4px !important;
    border-radius: 50%;
}

/* Back to top button */
/* Back to top button - fix contrast */
a[href="#top"],
.back-to-top,
[class*="back-to-top"],
[class*="scroll-top"],
[class*="scrolltop"],
[class*="to-top"],
[id*="back-to-top"],
[id*="scroll-top"] {
    background-color: rgba(0, 0, 0, 0.7) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

a[href="#top"]:hover,
.back-to-top:hover,
[class*="back-to-top"]:hover,
[class*="scroll-top"]:hover,
[class*="to-top"]:hover {
    background-color: rgba(0, 0, 0, 0.9) !important;
    color: #ffffff !important;
}

a[href="#top"]:focus-visible,
.back-to-top:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
}


/* =========================================
   3. CONTRAST FIXES (WCAG 1.4.3)
   ========================================= */

/* ── DARK FOOTER: text must be light for contrast ── */

/* Footer container - the footer has a dark/black background,
   so ALL text must be light enough for 4.5:1 ratio.
   #ffffff on #1a1a1a = 15.4:1 ✓
   #e0e0e0 on #1a1a1a = 11.9:1 ✓
   #f5a5b3 on #1a1a1a = 6.9:1  ✓ (for accent links) */
footer,
footer p,
footer span,
footer li,
footer strong,
footer b,
footer h3,
footer h4,
footer div,
footer address,
.footer,
.site-footer,
.site-footer p,
.site-footer span,
.site-footer div,
.site-footer strong,
.site-footer b {
    color: #e0e0e0 !important;
}

/* Footer headings - brighter */
footer h1, footer h2, footer h3, footer h4, footer h5,
.site-footer h1, .site-footer h2, .site-footer h3 {
    color: #ffffff !important;
}

/* Footer links - visible on dark bg */
footer a,
footer a:visited,
.site-footer a,
.site-footer a:visited {
    color: #f5a5b3 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
}

footer a:hover,
footer a:focus,
.site-footer a:hover,
.site-footer a:focus {
    color: #ffffff !important;
    text-decoration-thickness: 2px !important;
}

/* Footer operating hours - ensure readability */
footer strong + br,
footer strong {
    color: #ffffff !important;
}

/* Footer "Κλειστά" text */
footer *:last-child {
    color: #e0e0e0 !important;
}

/* "Powered by" / copyright text at very bottom */
footer .copyright,
footer [class*="copyright"],
footer [class*="footer-bottom"],
footer small {
    color: #bdbdbd !important;
}

/* ── LIGHT SECTIONS: muted text needs more contrast ── */
.text-muted,
.text-secondary,
.text-light {
    color: #595959 !important;
}

/* ── SOCIAL MEDIA ICONS ── */
/* JS replaces broken font icons with inline SVGs. 
   These styles ensure proper sizing and color. */

/* Social link containers */
a.papa11y-social-fixed {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    min-height: 40px !important;
    text-decoration: none !important;
}

/* SVG icon wrapper */
.papa11y-social-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

.papa11y-social-icon svg {
    width: 22px !important;
    height: 22px !important;
}

/* Footer (dark bg) — light icons */
footer .papa11y-social-icon svg,
.site-footer .papa11y-social-icon svg {
    stroke: #e0e0e0 !important;
    fill: none !important;
}

footer a[href*="facebook.com"] .papa11y-social-icon svg,
.site-footer a[href*="facebook.com"] .papa11y-social-icon svg {
    fill: #e0e0e0 !important;
    stroke: none !important;
}

footer a.papa11y-social-fixed:hover .papa11y-social-icon svg,
.site-footer a.papa11y-social-fixed:hover .papa11y-social-icon svg {
    stroke: #ffffff !important;
}

footer a[href*="facebook.com"].papa11y-social-fixed:hover .papa11y-social-icon svg,
.site-footer a[href*="facebook.com"].papa11y-social-fixed:hover .papa11y-social-icon svg {
    fill: #ffffff !important;
    stroke: none !important;
}

/* Header (light bg) — dark icons */
header .papa11y-social-icon svg,
.site-header .papa11y-social-icon svg {
    stroke: #424242 !important;
    fill: none !important;
}

header a[href*="facebook.com"] .papa11y-social-icon svg,
.site-header a[href*="facebook.com"] .papa11y-social-icon svg {
    fill: #424242 !important;
    stroke: none !important;
}

header a.papa11y-social-fixed:hover .papa11y-social-icon svg,
.site-header a.papa11y-social-fixed:hover .papa11y-social-icon svg {
    stroke: #e94560 !important;
}

header a[href*="facebook.com"].papa11y-social-fixed:hover .papa11y-social-icon svg,
.site-header a[href*="facebook.com"].papa11y-social-fixed:hover .papa11y-social-icon svg {
    fill: #e94560 !important;
    stroke: none !important;
}

/* Header Instagram — no extra border, the SVG icon draws its own */
header a[href*="instagram.com"].papa11y-social-fixed,
.site-header a[href*="instagram.com"].papa11y-social-fixed {
    border: none !important;
    padding: 0 !important;
}

/* Also remove any existing theme borders on social links */
a[href*="instagram.com"],
a[href*="facebook.com"] {
    border: none !important;
    box-shadow: none !important;
    outline-offset: 2px !important;
}

/* Only show border on keyboard focus */
a[href*="instagram.com"]:focus-visible,
a[href*="facebook.com"]:focus-visible {
    outline: 3px solid #e94560 !important;
}

/* Text over images - add overlay */
.papa11y-text-overlay {
    position: relative;
}

.papa11y-text-overlay::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.papa11y-text-overlay > * {
    position: relative;
    z-index: 2;
}

/* ── HERO / SLIDER TEXT ON IMAGES ──
   The tagline "Γιατί η πίτα θέλει τέχνη..." has color rgba(255,255,255,0.4)
   which gives 1:1 contrast ratio. Force fully opaque white. */

/* Target by tag type on any slideshow/hero/banner section */
.hero em, .hero i,
.slider em, .slider i,
[class*="hero"] em, [class*="hero"] i,
[class*="slide"] em, [class*="slide"] i,
[class*="banner"] em, [class*="banner"] i,
[class*="carousel"] em, [class*="carousel"] i {
    text-shadow: 
        0 0 10px rgba(0, 0, 0, 0.9),
        0 0 20px rgba(0, 0, 0, 0.7),
        0 2px 4px rgba(0, 0, 0, 0.8) !important;
    color: #ffffff !important;
}

/* FORQY theme specific: .fy-section--slideshow contains the tagline */
.fy-section--slideshow em,
.fy-section--slideshow i,
.fy-section--slideshow p,
.fy-section--slideshow span,
.fy-section--slideshow h1,
.fy-section--slideshow h2,
.fy-section--slideshow h3,
.fy-section--slideshow .fy-slideshow-text,
.fy-section--slideshow [class*="text"],
.fy-section--slideshow [class*="caption"],
.fy-section--slideshow [class*="title"],
.fy-section--slideshow [class*="subtitle"],
.fy-section--slideshow [class*="tagline"],
.fy-section--slideshow [class*="quote"] {
    color: #ffffff !important;
    text-shadow: 
        0 0 10px rgba(0, 0, 0, 0.9),
        0 0 20px rgba(0, 0, 0, 0.7),
        0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

/* Nuclear: ANY element with semi-transparent white text anywhere on the page.
   This catches rgba(255,255,255,0.4) or any opacity-reduced white. 
   The JS handler below will find and fix these dynamically. */

/* Any heading/text over background images */
[style*="background-image"] h1,
[style*="background-image"] h2,
[style*="background-image"] h3,
[style*="background-image"] p,
[style*="background-image"] em,
[style*="background-image"] span {
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8) !important;
}

/* Italic tagline - ensure readability */
em, i {
    color: inherit;
}

/* Placeholder text contrast */
::placeholder {
    color: #767676 !important;
    opacity: 1 !important;
}

::-webkit-input-placeholder {
    color: #767676 !important;
}

::-moz-placeholder {
    color: #767676 !important;
}


/* =========================================
   4. LINK DISTINCTION (WCAG 1.4.1)
   ========================================= */

/* Remove gray background behind images (theme lazy-load placeholders) */
img,
img[data-src],
img[data-lazy-src],
img[loading="lazy"],
.lazy,
[class*="lazy"] img,
figure img,
.wp-post-image,
[class*="product"] img,
[class*="menu-item"] img,
[class*="gallery"] img,
[class*="slide"] img,
[class*="fy-"] img {
    background-color: transparent !important;
    background: transparent !important;
}

/* Links in body text must have underline, not just color */
article a,
.entry-content a,
main p a,
.content a:not(.btn):not(.button):not([class*="menu"]):not([class*="nav"]) {
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 2px !important;
}

article a:hover,
.entry-content a:hover,
main p a:hover,
.content a:not(.btn):not(.button):not([class*="menu"]):not([class*="nav"]):hover {
    text-decoration-thickness: 2px !important;
}


/* =========================================
   5. FORM ACCESSIBILITY (WCAG 3.3.x)
   ========================================= */

/* Required field indicator */
label[for] .papa11y-required,
.papa11y-required {
    color: #c62828 !important;
    font-weight: bold;
}

/* Error states */
.papa11y-field-error input,
.papa11y-field-error textarea,
.papa11y-field-error select {
    border: 2px solid #c62828 !important;
    background: #fff5f5 !important;
}

.papa11y-error-message {
    color: #c62828 !important;
    font-size: 13px !important;
    margin-top: 4px !important;
    font-weight: 600;
}

.papa11y-error-message::before {
    content: '⚠ ';
}

/* Success state */
.papa11y-form-success {
    background: #e8f5e9 !important;
    color: #2e7d32 !important;
    padding: 12px 16px !important;
    border: 1px solid #2e7d32 !important;
    border-radius: 4px !important;
    font-weight: 600;
    margin-bottom: 16px;
}


/* =========================================
   6. MODAL / POPUP ACCESSIBILITY
   ========================================= */

/* Modal backdrop for focus trap visibility */
.papa11y-modal-open {
    overflow: hidden !important;
}

/* Focus trap sentinel (invisible but focusable) */
.papa11y-focus-sentinel {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
}


/* =========================================
   7. OPERATING HOURS - SEMANTIC TABLE
   ========================================= */

.papa11y-hours-table {
    width: 100%;
    border-collapse: collapse;
}

.papa11y-hours-table th,
.papa11y-hours-table td {
    padding: 4px 8px;
    text-align: left;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    font-size: 14px;
}

.papa11y-hours-table th {
    font-weight: 700;
    width: 50%;
}

.papa11y-hours-table tr.papa11y-closed td {
    color: #c62828;
    font-style: italic;
}


/* =========================================
   8. SKIP LINKS ENHANCEMENT
   ========================================= */

/* Enhance existing skip links */
a[href="#navigation"],
a[href="#content"],
a[href="#footer"] {
    position: absolute !important;
    left: -9999px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    z-index: 999999 !important;
}

a[href="#navigation"]:focus,
a[href="#content"]:focus,
a[href="#footer"]:focus {
    position: fixed !important;
    top: 10px !important;
    left: 10px !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    padding: 14px 22px !important;
    background: #1a1a2e !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border: 3px solid #e94560 !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}


/* =========================================
   9. ANIMATION / MOTION (WCAG 2.3.3)
   ========================================= */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* =========================================
   10. HIGH CONTRAST MODE SUPPORT
   ========================================= */

@media (forced-colors: active) {
    *:focus-visible {
        outline: 3px solid CanvasText !important;
    }
    
    a {
        text-decoration: underline !important;
    }
}


/* =========================================
   11. ACCESSIBILITY STATEMENT FOOTER LINK
   ========================================= */

.papa11y-footer-statement {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-top: 10px;
}

.papa11y-footer-statement a {
    color: #1565c0 !important;
    text-decoration: underline !important;
    font-weight: 600;
}

.papa11y-footer-statement a:hover {
    color: #e94560 !important;
}

.papa11y-footer-statement a:focus-visible {
    outline: 3px solid #e94560 !important;
    outline-offset: 2px !important;
}


/* =========================================
   12. PRODUCT CATEGORIES - NON-COLOR INDICATORS
   ========================================= */

/* Ensure category tags are not color-only */
.papa11y-category-tag {
    border: 2px solid currentColor !important;
    padding: 2px 8px !important;
    border-radius: 3px !important;
    font-weight: 600 !important;
    font-size: 12px !important;
}