/* ============================================================
   WCAG 2.1 Accessibility Overrides — Frotrasporti
   ============================================================ */

/* ----------------------------------------------------------
   Testo corpo — contrasto e dimensione (WCAG 1.4.3 + 1.4.4)

   Il tema imposta: color #888 (contrasto 3.5:1 su bianco → FAIL)
                    font-size 14px (sotto il baseline raccomandato)

   Contrasti risultanti dopo la correzione:
     #4a4a4a su #ffffff  →  9.7 : 1  (requisito AA: 4.5:1) ✓
     #232323 su #ffffff  → 15.7 : 1  (titoli — invariato)  ✓
   ---------------------------------------------------------- */
body,
p,
li,
address,
.desc,
.widget-about .text p {
    color: #4a4a4a !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
}

/* I titoli mantengono la loro dimensione relativa corretta */
h1, h2, h3, h4, h5, h6 {
    color: #232323 !important;
}

/* Eccezioni: titoli su sfondo colorato mantengono il bianco */
.wprt-action-box .heading,
#featured-title .featured-title-heading,
.tp-caption {
    color: #ffffff !important;
}

/* ----------------------------------------------------------
   Footer — testo su sfondo scuro (#232323)
   #d0d0d0 su #232323 = contrasto 7.5:1 (WCAG AA+) ✓
   ---------------------------------------------------------- */
#footer-widgets .widget .widget-title,
#footer-widgets h2,
#footer-widgets h3 {
    color: #d0d0d0 !important;
}

#footer .widget-about .text,
#footer .widget-about .text p,
#footer .widget-about address,
#footer .widget-about address span,
#footer .widget-about address div,
#footer .widget-about p,
#bottom .copyright {
    color: #d0d0d0 !important;
}

/* Testo secondario (es. menu mobile, meta) — almeno 4.5:1 */
#main-nav-mobi ul > li > a {
    color: #cccccc !important; /* su sfondo #252525: contrasto 6.5:1 ✓ */
}

/* ----------------------------------------------------------
   Servizi home — nessun effetto hover (box non cliccabili)
   ---------------------------------------------------------- */
#row-services-2 .wprt-content-box,
#row-services-2 .wprt-icon-box {
    cursor: default !important;
}

#row-services-2 .wprt-icon-box:hover .icon-wrap {
    background-color: #ffffff !important;
    color: #ed1c24 !important;
    border: none !important;
}

#row-services-2 .wprt-icon-box:hover .icon-wrap:after {
    opacity: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
    border: none !important;
}

/* ----------------------------------------------------------
   Top bar — icona email via ::after (uniforme a phone/address)
   ---------------------------------------------------------- */
#top-bar .top-bar-content .content.email:after {
    content: "\f0e0"; /* fa-envelope */
}

/* ----------------------------------------------------------
   Top bar — colore testi link (#232323 al posto del rosso)
   ---------------------------------------------------------- */
#top-bar .top-bar-content .content {
    color: #232323 !important;
}

#top-bar .top-bar-content .content:hover,
#top-bar .top-bar-content .content:focus {
    color: #ed1c24 !important;
}

/* ----------------------------------------------------------
   Skip-to-content link
   Visually hidden until focused via keyboard
   ---------------------------------------------------------- */
.skip-link {
    position: absolute;
    top: -100%;
    left: 0;
    z-index: 99999;
    padding: 12px 20px;
    background: #232323;
    color: #ffffff;
    font-size: 14px;
    font-family: Poppins, sans-serif;
    font-weight: 600;
    text-decoration: none;
    border-bottom-right-radius: 4px;
    white-space: nowrap;
}
.skip-link:focus {
    top: 0;
}

/* ----------------------------------------------------------
   Screen-reader only utility
   Nasconde visivamente ma mantiene accessibilità
   ---------------------------------------------------------- */
.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;
}

/* ----------------------------------------------------------
   Focus ring visibile
   Il tema imposta "a { outline: 0 }" quindi serve !important
   per garantire la visibilità su tutti gli elementi interattivi
   ---------------------------------------------------------- */
*:focus-visible {
    outline: 3px solid #ed1c24 !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 5px rgba(237, 28, 36, 0.18) !important;
}

/* Rimuovi outline solo per click del mouse, mantienilo per tastiera */
*:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}

/* Voci menu navigazione: evidenziazione esplicita al focus */
#main-nav ul li a:focus-visible,
#main-nav-mobi ul li a:focus-visible,
.widget-navigation-list a:focus-visible {
    outline: 3px solid #ed1c24 !important;
    outline-offset: 3px !important;
    color: #ed1c24 !important;
    text-decoration: underline !important;
}

/* ----------------------------------------------------------
   Mobile nav button — accessibile da tastiera
   ---------------------------------------------------------- */
button.mobile-button {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 8px;
    line-height: 1;
}
button.mobile-button:focus-visible {
    outline: 3px solid #ed1c24;
    outline-offset: 2px;
}

/* ----------------------------------------------------------
   Filtri portfolio — accessibili da tastiera
   ---------------------------------------------------------- */
#project-filter .cbp-filter-item {
    cursor: pointer;
}
#project-filter .cbp-filter-item:focus-visible {
    outline: 3px solid #ed1c24;
    outline-offset: 2px;
}

/* ----------------------------------------------------------
   Link "apre in nuova scheda" — indicatore visivo
   ---------------------------------------------------------- */
a[target="_blank"]::after {
    content: "";
    display: inline-block;
    width: 0.8em;
    height: 0.8em;
    margin-left: 4px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='currentColor' d='M10 0H6v1.5h2.44L3.72 6.22l1.06 1.06L9.5 2.56V5H11V1a1 1 0 0 0-1-1zM1.5 1.5H5V0H1a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V7h-1.5v3.5h-9z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
    opacity: 0.7;
}
/* Evita doppio indicatore sui link con solo icona */
a[target="_blank"].no-ext-icon::after {
    display: none;
}

/* ----------------------------------------------------------
   Prodotti — link lightbox che copre l'intera card immagine
   ---------------------------------------------------------- */
.project-item .effect-default {
    position: relative;
}
.cbp-full-area {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: block;
    cursor: pointer;
}

/* ----------------------------------------------------------
   Prodotti — testo hover overlay immagini
   Il tema imposta globalmente h1,h2,h3 { color: #232323 }.
   I titoli nelle card sono stati corretti da h2 a h3
   per la gerarchia WCAG. Forzare il bianco con selettore
   preciso + !important per battere il reset del tema.
   ---------------------------------------------------------- */
.project-item .effect-default .text h3,
.project-item .effect-default .text > div h3,
.project-item .effect-default .text div h3 {
    color: #ffffff !important;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 5px;
}

/* Sicurezza aggiuntiva: tutti i testi dentro .text ereditano bianco */
.project-item .effect-default .text,
.project-item .effect-default .text * {
    color: #ffffff !important;
}

/* ----------------------------------------------------------
   Footer — link tel/mailto
   Il tema imposta a:hover { color: #232323 } che sul
   footer (background #232323) li rende invisibili.
   Default: bianco | Hover: rosso brand
   ---------------------------------------------------------- */
#footer .widget-about a[href^="tel:"],
#footer .widget-about a[href^="mailto:"] {
    color: #ffffff !important;
    text-decoration: none;
    transition: color ease .238s;
}

#footer .widget-about a[href^="tel:"]:hover,
#footer .widget-about a[href^="tel:"]:focus,
#footer .widget-about a[href^="mailto:"]:hover,
#footer .widget-about a[href^="mailto:"]:focus {
    color: #ed1c24 !important;
    text-decoration: underline;
}