/**
 Theme Name: Euradria
 Theme URI:
 Author: ídeo - Andrea Uliana
 Author URI: http://wwww.1d3o.it
 Description: This is the main Wordpress theme for Website
 Version: 0.216
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    line-height: 1.5;
    overflow-x: hidden;
}

/* Zoom 200% (WCAG 1.4.4): immagini in main senza class responsive-img */
#main-content img:not(.responsive-img) {
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   Mobile-first: struttura e touch target (WCAG 2.5.5)
   ========================================================================== */
/* Safe area per device con notch (viewport-fit=cover) */
@supports (padding: env(safe-area-inset-left)) {
    #main-content {
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
}

/* Container: padding orizzontale su mobile per evitare contenuto attaccato ai bordi */
@media (max-width: 767px) {
    .container {
        padding-left: .5rem;
        padding-right: .5rem;
        min-width: 0;
    }
}

/* Touch target minimo 33x33px per controlli interattivi (WCAG 2.5.5) */
@media (max-width: 767px) {
    #main-content a.c-button,
    #main-content button:not(.visually-hidden),
    #main-content input[type="submit"],
    #main-content input[type="button"],
    #main-content select {
        min-height: 33px;
        min-width: 33px;
    }
    #main-content label:has(input[type="checkbox"]),
    #main-content label:has(input[type="radio"]) {
        min-height: 33px;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
    }
    /* Modal nav e header: touch target 33px su mobile */
    .c-nav-modal a,
    .c-nav-modal .c-button,
    .c-burger,
    .c-nav-mobile__lang a {
        min-height: 33px;
        min-width: 33px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}
@supports not selector(label:has(input)) {
    @media (max-width: 767px) {
        #main-content .c-survey__list label {
            min-height: 33px;
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
        }
    }
}

/* ==========================================================================
   Input su mobile: evitare sovrapposizione icona clear/autofill (X)
   ========================================================================== */
#main-content input[type="text"],
#main-content input[type="search"],
#main-content input[type="email"],
#main-content input[type="tel"],
#main-content input[type="url"],
#main-content textarea {
    box-sizing: border-box;
}
@media (max-width: 767px) {
    #main-content input[type="text"],
    #main-content input[type="search"],
    #main-content input[type="email"],
    #main-content input[type="tel"],
    #main-content input[type="url"],
    #main-content textarea {
        padding-right: 2.5rem;
    }
}
/* Pulsante clear nativo (WebKit): non farlo sovrapporre al testo */
#main-content input[type="search"]::-webkit-search-cancel-button {
    margin-right: 0.25rem;
}
@media (max-width: 767px) {
    #main-content input[type="search"]::-webkit-search-cancel-button {
        margin-right: 0.5rem;
    }
}

.visually-hidden {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0);
    white-space: nowrap; border: 0;
}

/* Screen reader only (WCAG – contenuto per assistive technology) */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.screen-reader-text:focus {
    position: static;
    width: auto;
    height: auto;
    padding: inherit;
    margin: inherit;
    overflow: visible;
    clip: auto;
    white-space: normal;
}

/* ==========================================================================
   Skip link (WCAG 2.4.1 Bypass Blocks)
   ========================================================================== */
.skip-link {
    position: absolute;
    top: -100em;
    left: 0;
    z-index: 100000;
    padding: 0.75rem 1.25rem;
    background: #02357b;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    border-radius: 0 0 4px 0;
    transition: top 0.2s ease;
}
.skip-link:focus {
    top: 0;
    outline: 2px solid #ffc428;
    outline-offset: 2px;
}

/* Nav mobile: menu lingua e submenu, burger */
.c-nav-mobile__lang .menu > li {
    font-size: 1.2rem;
}
.c-nav-mobile__lang .submenu {
    padding: 0.4rem 0.75rem !important;
}

/* Nav modal: riduzione padding e pulsanti / elementi interni */
.c-nav-modal__menus {
    padding: 1rem !important;
}
@media (max-width: 767px) {
    .c-nav-modal__menus {
        padding: 1.25rem !important;
    }
}
.c-nav-modal__menu .main {
    font-size: 1.15rem !important;
    line-height: 1.4rem !important;
    margin-bottom: 0.75rem !important;
}
.c-nav-modal__menu ul {
    max-width: 100%;
}
.c-nav-modal__menu ul li {
    padding: 0.5rem 0 !important;
}
.c-nav-modal__menu ul li svg {
    height: 1rem !important;
    width: 1rem !important;
    margin-right: 0.5rem !important;
}
.c-nav-modal__accordion-header {
    padding: 0.6rem 0 !important;
}
.c-nav-modal__accordion-header h3.main,
.c-nav-modal__accordion-header .h3.main {
    font-size: 1.1rem !important;
    line-height: 1.35rem !important;
}
.c-nav-modal__accordion-header svg {
    height: 1.25rem !important;
    width: 1.25rem !important;
    margin-left: 0.5rem !important;
}
.c-nav-modal__accordion-text {
    padding: 0 0 0.75rem !important;
}
.c-nav-modal__accordion-text ul li {
    margin-bottom: 0.4rem !important;
}
.c-nav-modal__accordion-text ul li a {
    font-size: 0.95rem !important;
    line-height: 1.3rem !important;
}
.c-nav-modal__socials {
    margin: 1rem 0 !important;
}
.c-nav-modal__socials a {
    margin: 0 0.5rem !important;
}
.c-nav-modal__socials svg {
    height: 1.5rem !important;
}
.c-nav-modal__buttons {
    padding: 1rem 1.25rem 1.5rem !important;
}
.c-nav-modal__buttons a {
    margin-bottom: 0.5rem !important;
    font-size: 0.95rem !important;
    padding: 0.4rem 0.75rem !important;
}

/* CTA submit in grassetto */
#main-content button[type="submit"],
#main-content input[type="submit"] {
    font-weight: 700;
}

/* Spazio per header fisso quando il browser scrolla verso un elemento (es. errore di validazione) */
#main-content input,
#main-content select,
#main-content textarea,
#main-content fieldset,
#main-content .survey-form-errors {
    scroll-margin-top: 200px;
}
@media (max-width: 767px) {
    #main-content input,
    #main-content select,
    #main-content textarea,
    #main-content fieldset,
    #main-content .survey-form-errors {
        scroll-margin-top: max(280px, 42vh);
    }
}

/* ==========================================================================
   Focus visible (WCAG 2.4.7) – outline visibile alla navigazione da tastiera
   ========================================================================== */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus,
.c-button:focus,
.c-button-filter:focus,
.btn:focus,
.btn-small:focus,
.btn-large:focus {
    outline: 2px solid #ffc428;
    outline-offset: 2px;
}
/* Nasconde outline al click mouse; mostra solo con tastiera (browser moderni) */
@supports selector(:focus-visible) {
    a:focus,
    button:focus,
    input:focus,
    select:focus,
    textarea:focus,
    [tabindex]:focus,
    .c-button:focus,
    .c-button-filter:focus,
    .btn:focus,
    .btn-small:focus,
    .btn-large:focus {
        outline: none;
    }
    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible,
    [tabindex]:focus-visible,
    .c-button:focus-visible,
    .c-button-filter:focus-visible,
    .btn:focus-visible,
    .btn-small:focus-visible,
    .btn-large:focus-visible {
        outline: 2px solid #ffc428;
        outline-offset: 2px;
    }
}

/* ==========================================================================
   Contrasto link in corpo pagina (WCAG 1.4.3)
   ========================================================================== */

/* Banner contact: i link devono essere bianchi */
.banner.contact .content p>a,
.banner.contact .content p>a:visited {
    color: #fff !important;
}
.banner.contact .content p>a:hover,
.banner.contact .content p>a:focus {
    color: #ffc428 !important;
}

/* Banner contact: overlay per contrasto testo bianco su immagine (WCAG 1.4.3) */
.banner.contact {
    position: relative;
}
.banner.contact::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(2, 53, 123, 0.5);
    z-index: 1;
    pointer-events: none;
}
.banner.contact .content,
.banner.contact .row {
    position: relative;
    z-index: 2;
}

/* Footer: contrasto testo su sfondo (WCAG 1.4.3) – overlay aggiuntivo */
.page-footer {
    position: relative;
}
.page-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(2, 53, 123, 0.35);
    z-index: 0;
    pointer-events: none;
}
.page-footer > .container,
.page-footer .row,
.page-footer .footer-copyright {
    position: relative;
    z-index: 1;
}
.page-footer .footer-copyright {
    color: #fff;
}

/* ==========================================================================
   Hero generiche – overlay per contrasto WCAG 1.4.3 (testo su sfondo immagine)
   ========================================================================== */
.c-hero {
    position: relative;
}
.c-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(2, 53, 123, 0.55);
    z-index: 1;
    pointer-events: none;
}
.c-hero .container,
.c-hero .c-hero__content {
    position: relative;
    z-index: 2;
}

/* ==========================================================================
   Thank-you page – layout compatto, contrasto WCAG (overlay su immagine)
   ========================================================================== */
.c-hero--thanks {
    min-height: 420px;
    padding-bottom: 3rem;
    position: relative;
}
/* Overlay scuro per contrasto testo/immagine (WCAG): mantiene giallo e bianco leggibili */
.c-hero--thanks::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(2, 53, 123, 0.62);
    z-index: 1;
    pointer-events: none;
}
.c-hero--thanks .container,
.c-hero--thanks .c-hero__content--thanks {
    position: relative;
    z-index: 2;
}
.c-hero--thanks .c-hero__content--thanks {
    padding-top: 260px;
    padding-bottom: 2rem;
}
.c-hero--thanks .c-hero__content--thanks h1,
.c-hero--thanks .c-hero__content--thanks .h1 {
    margin-bottom: 1rem;
}
.c-hero--thanks .c-hero__content--thanks p {
    margin-bottom: 1.25rem;
}
.c-hero--thanks .c-hero__content--thanks .c-button {
    margin-top: 1.5rem;
}
.c-hero--thanks .c-hero__content--thanks .c-button + .c-button {
    margin-left: 1rem;
}

/* Hero: paragrafo e CTA ridotta */
.c-hero__content p {
    font-size: 1.4em;
    line-height: 1.2em;
}
.c-hero__content .c-button {
    font-size: 0.95rem;
    padding: 0.4rem 1rem;
    min-width: 160px;
}

@media (max-width: 1920px) {
    .c-hero--thanks {
        min-height: 22vw;
        padding-bottom: 2.5vw;
    }
    .c-hero--thanks .c-hero__content--thanks {
        padding-top: 13.5416666667vw;
        padding-bottom: 2vw;
    }
}
@media (max-width: 767px) {
    .c-hero--thanks {
        min-height: 280px;
        padding-bottom: 2rem;
    }
    .c-hero--thanks .c-hero__content--thanks {
        padding-top: 50vw;
        padding-bottom: 2rem;
    }
    .c-hero--thanks .c-hero__content--thanks h1,
    .c-hero--thanks .c-hero__content--thanks .h1 {
        margin-bottom: 1.5rem;
    }
    .c-hero--thanks .c-hero__content--thanks .c-button {
        margin-top: 1.5rem;
    }
}

/* ==========================================================================
   Mobile landscape: barra e hero bilanciati (ingrandimento ridotto).
   Viewport: (orientation: landscape) + (max-height: 540px) per includere tutti i
   smartphone di ultima generazione (es. iPhone 16 844×390, Galaxy S24, Pixel 9).
   Con max-width: 767px in landscape molti device non rientravano (width > 767).
   ========================================================================== */
@media (orientation: landscape) and (max-height: 540px) {
    /* Barra: dimensioni moderate (non eccessive) */
    body .c-nav-mobile {
        padding-top: 1.75vh !important;
        padding-bottom: 1.75vh !important;
        min-height: 14vh !important;
    }
    body .c-nav-mobile__logos {
        margin-bottom: 1vh !important;
    }
    body .c-nav-mobile__logos img {
        max-height: 4.5vh !important;
        min-height: 24px !important;
    }
    /* Nav: font-size 1–1.2rem, pulsanti/icone max-height 24px */
    body .c-nav-mobile__text {
        font-size: 1.1rem !important;
        line-height: 1.35rem !important;
        width: auto !important;
        max-width: 55% !important;
    }
    body .c-nav-mobile__lang {
        padding: 0.25rem 1rem !important;
        min-height: auto !important;
        max-height: 24px !important;
    }
    body .c-nav-mobile__lang a {
        font-size: 1.05rem !important;
        line-height: 1.2rem !important;
    }
    body .c-nav-mobile__lang svg {
        height: 0.7rem !important;
        max-height: 24px !important;
    }
    body .c-nav-mobile .c-burger {
        min-width: 24px !important;
        min-height: 24px !important;
        width: 24px !important;
        height: 24px !important;
        max-height: 24px !important;
    }
    body .c-nav-mobile .c-burger .burger {
        width: 26px !important;
    }
    body .c-nav-mobile .c-burger .burger span {
        height: 2px !important;
    }
    body .c-nav-mobile .c-button {
        min-height: auto !important;
        max-height: 24px !important;
        padding: 0.25rem 0.75rem !important;
        font-size: 1rem !important;
        line-height: 1.2 !important;
    }
    /* Hero/slide: più padding interno, titolo visibile, testo centrato */
    body .c-hero {
        min-height: 65vh !important;
        padding-bottom: 4vh !important;
    }
    body .c-hero .container {
        max-width: 94% !important;
        width: 94% !important;
    }
    body .c-hero__content {
        padding-top: 26vh !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        max-width: 100% !important;
        width: 100% !important;
        text-align: center !important;
    }
    body .c-hero__content h1,
    body .c-hero__content .h1 {
        max-width: 92% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        font-size: min(3.8vw, 1.95rem) !important;
        line-height: 1.2 !important;
    }
    body .c-hero__content p {
        max-width: 88% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    body .c-hero__content h4,
    body .c-hero__content .h4 {
        margin-left: auto !important;
        margin-right: auto !important;
    }
    /* Slide hero (Splide): padding interno per titolo sempre visibile */
    body .c-hero .splide__slide {
        padding-top: 2vh !important;
        padding-bottom: 2vh !important;
    }
    body .c-hero__content .c-button {
        min-width: 140px !important;
        font-size: 0.9rem !important;
        padding: 0.3rem 0.8rem !important;
    }
    body .c-button svg {
        height: 2rem !important;
    }
    /* Socials modal: stesse dimensioni dei btn hero */
    body .c-nav-modal__socials a {
        padding: 0.3rem 0.8rem !important;
        font-size: 0.9rem !important;
    }
    body .c-nav-modal__socials svg {
        height: 0.9rem !important;
        width: 0.9rem !important;
    }
    body .c-hero--thanks {
        min-height: 60vh !important;
        padding-bottom: 1.5rem !important;
    }
    body .c-hero--thanks .c-hero__content--thanks {
        padding-top: 22vh !important;
        padding-bottom: 1.5rem !important;
        max-width: 100% !important;
    }
    body .c-hero--thanks .c-hero__content--thanks h1,
    body .c-hero--thanks .c-hero__content--thanks .h1 {
        max-width: 92% !important;
        margin-bottom: 0.6rem !important;
    }
    body .c-hero--thanks .c-hero__content--thanks p {
        max-width: 88% !important;
    }
}

/* ==========================================================================
   FASE 1 — Contrasto e indicatori visivi (WCAG 1.4.3, 1.4.1)
   ========================================================================== */

/* 1.4.3 — Paginazione: testo disabilitato #999 su bianco = ~2.85:1 (sotto soglia 4.5:1)
   Sostituire con #767676 (rapporto esatto 4.54:1 su bianco) */
.pagination li.disabled a {
    color: #767676;
}

/* 1.4.3 — Submenu lingua: hover bianco su giallo #ffc428 = 1.56:1 (fallisce)
   Sostituire con blu scuro che ha rapporto 7.77:1 sul giallo */
.c-nav__lang .submenu li a:hover,
.c-nav-mobile__lang .submenu li a:hover {
    color: #02357b !important;
    background-color: transparent;
}

/* 1.4.3 — Menu modale: testo giallo #fec428 su bianco = ~1.5:1 (fallisce)
   Questo elemento ha aria-hidden="true" ma resta visibile sullo schermo */
.c-nav-modal__content .h2 span,
.c-nav-modal__content h2 span {
    color: #02357b;
}

/* 2.4.7 / 1.4.1 — Focus su .chip (chip:focus ha outline:none in application.css) */
.chip:focus {
    outline: 3px solid #02357b !important;
    outline-offset: 2px;
    background-color: #e4e4e4;
    color: rgba(0, 0, 0, 0.87) !important;
}

/* 1.4.1 — Indicatore visivo non-colore per .c-button-filter.active:
   aggiungere bordo oltre al cambio di background-color */
.c-button-filter.active {
    border-color: #02357b;
    font-weight: 700;
}

/* 1.4.1 — Link nel footer: devono essere visivamente distinguibili dal testo circostante */
.page-footer a {
    text-decoration: underline;
}
.page-footer a:hover,
.page-footer a:focus {
    text-decoration: none;
    outline-offset: 2px;
}

/* 1.4.1 — Link nelle card e componenti fuori da .page-content:
   aggiungere underline a link nel testo (non a .btn / .c-button che sono già visivi come bottoni) */
.card .content a:not(.btn):not(.c-button):not(.c-button-filter),
.send-cv a:not(.btn):not(.c-button) {
    text-decoration: underline;
}

/* 1.4.3 — Sidebar collapsible (mobile): link attivi nel collapsible-body */
.sidebar .collapsible-body ul li a.active {
    font-weight: 800;
    text-decoration: underline;
    color: #02357b;
}

/* FASE 2 — Reset stili browser di default su button.c-burger e paginazione (WCAG 4.1.2) */
button.c-burger {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    line-height: 0;
}

.pagination li button {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    font: inherit;
    color: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

