/*
 * Accessibility Improvements for WCAG 2.1 AA Compliance
 * Fototeca Livio Paladin Theme
 */

/* ============================================
   FOCUS INDICATORS - SC 2.4.7 (AA)
   ============================================ */

/* Indicatore di focus visibile per tutti gli elementi interattivi */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
[tabindex]:focus,
.nav-link:focus,
.btn:focus,
.swiper-pagination-bullet:focus {
    outline: 3px solid #005a9c !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.3) !important;
}

/* Focus per pulsanti primari */
.btn-primary:focus {
    outline: 3px solid #ffffff !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5) !important;
}

/* Focus per link nel menu */
.navbar-nav .nav-link:focus {
    outline: 3px solid #ffffff !important;
    outline-offset: 2px !important;
    background-color: rgba(255, 255, 255, 0.1);
}

/* Focus per dropdown items */
.dropdown-item:focus {
    outline: 2px solid #005a9c !important;
    outline-offset: 1px !important;
    background-color: rgba(0, 90, 156, 0.1);
}

/* Dropdown menu - Fix contrasto testo */
#main-header .dropdown-menu .dropdown-item {
    color: #333333 !important;
}

#main-header .dropdown-menu .dropdown-item:hover,
#main-header .dropdown-menu .dropdown-item:focus {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
}

/* Submenu items */
.dropdown-menu .dropdown-item a {
    color: #333333 !important;
}

.dropdown-menu .dropdown-item a:hover,
.dropdown-menu .dropdown-item a:focus {
    color: #000000 !important;
}

/* Language switcher - Miglioramento visibilità bandiere */
#main-header .trp-language-switcher-container .dropdown-menu .dropdown-item {
    background-color: #ffffff !important;
    padding: 0.5rem 1rem !important;
}

#main-header .trp-language-switcher-container .dropdown-menu .dropdown-item:hover,
#main-header .trp-language-switcher-container .dropdown-menu .dropdown-item:focus {
    background-color: rgba(21, 97, 110, 0.15) !important; /* Tonalità chiara del colore header #15616e */
}

/* Assicura che le bandiere siano visibili */
#main-header .trp-language-switcher-container .dropdown-menu {
    background-color: #ffffff !important;
    padding: 0.25rem 0 !important;
}

/* ============================================
   FONT SIZES - SC 1.4.4 & 1.4.5 (AA)
   ============================================ */

/* Conversione da pixel a rem/em per permettere lo zoom del testo */
html {
    font-size: 16px; /* Base font size */
}

body {
    font-size: 1rem; /* 16px */
    line-height: 1.5; /* SC 1.4.12 */
}

h1 {
    font-size: 2.5rem; /* 40px */
    line-height: 1.3;
}

h2 {
    font-size: 2rem; /* 32px */
    line-height: 1.3;
}

h3 {
    font-size: 1.5rem; /* 24px */
    line-height: 1.4;
}

h4 {
    font-size: 1.25rem; /* 20px */
    line-height: 1.4;
}

h5, h6 {
    font-size: 1rem; /* 16px */
    line-height: 1.5;
}

p {
    font-size: 1rem; /* 16px */
    line-height: 1.6; /* SC 1.4.12 - Line spacing */
    margin-bottom: 1em;
}

/* Font size per elementi specifici */
.nav-link {
    font-size: 0.875rem !important; /* 14px */
}

.text-date {
    font-size: 0.875rem; /* 14px */
}

.text-author {
    font-size: 0.875rem; /* 14px */
}

.btn {
    font-size: 1rem; /* 16px */
}

.nav-button {
    font-size: 1.125rem !important; /* 18px */
}

/* ============================================
   CONTRAST RATIOS - SC 1.4.3 (AA)
   ============================================ */

/* Menu principale - Contrasto minimo 4.5:1 su sfondo #15616e */
#main-header .navbar-nav .nav-link,
#main-header .navbar-nav .nav-link.active,
#main-header .navbar-nav .menu-item .nav-link,
.navbar-nav .nav-link[style*="font-size"] {
    color: #ffffff !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

#main-header .navbar-nav .nav-link:hover,
#main-header .navbar-nav .nav-link:focus,
#main-header .navbar-nav .menu-item .nav-link:hover,
#main-header .navbar-nav .menu-item .nav-link:focus {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Pulsanti di navigazione - Contrasto migliorato */
.nav-button {
    color: #1a1a1a !important;
    background-color: #f5f5f5 !important;
    border: 2px solid #666666 !important;
    font-weight: 600 !important;
}

.nav-button:hover,
.nav-button:focus {
    color: #000000 !important;
    background-color: #e8e8e8 !important;
    border-color: #333333 !important;
}

.nav-button.active {
    color: #ffffff !important;
    background-color: #005a9c !important;
    border-color: #004a7f !important;
}

/* Footer - Contrasto testo bianco su sfondo scuro */
footer,
footer *,
footer[role="contentinfo"],
footer[role="contentinfo"] * {
    color: #ffffff !important;
}

footer a,
footer[role="contentinfo"] a,
footer .seguici a,
#mnu-footer a,
#mnu-footer .sub-menu a,
footer a[style*="font-size"],
footer .submenu-footer a,
footer .link-service a,
footer .textFont12 {
    color: #ffffff !important;
    text-decoration: underline !important;
    font-weight: 500 !important;
    /* Garantisce contrasto 4.5:1 anche con font piccoli */
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

footer a:hover,
footer a:focus,
footer[role="contentinfo"] a:hover,
footer[role="contentinfo"] a:focus {
    color: #ffffff !important;
    text-decoration: underline !important;
    background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Seguici nel footer - Contrasto garantito */
.seguici,
.seguici a,
footer .seguici,
footer .seguici a,
.seguici[style*="font-size"] {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* Menu footer - Contrasto migliorato */
#mnu-footer a,
#mnu-footer .sub-menu a,
.submenu-footer a {
    color: #ffffff !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* Testo footer con font piccolo - Contrasto garantito */
footer .textFont12,
footer [class*="textFont"] {
    color: #ffffff !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* Contrasto per link generici */
a {
    color: #005a9c;
    text-decoration: underline;
}

a:hover,
a:focus {
    color: #003d6b;
    text-decoration: underline;
}

/* Contrasto per testo su sfondo scuro */
.back-primary,
.back-primary * {
    color: #ffffff !important;
}

/* Titoli su sfondo scuro - Contrasto garantito */
.back-primary h1,
.back-primary h2,
.back-primary h3,
.back-primary h4,
.back-primary h5,
.back-primary h6,
.text-search h3,
.cont-search h3 {
    color: #ffffff !important;
    font-weight: 600 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

/* Titoli H3 nelle card - Contrasto garantito */
.card-title,
.card-body h3,
h3.card-title {
    color: #1a1a1a !important;
    font-weight: 600 !important;
}

/* Pagina Percorsi Narrativi - Miglioramenti contrasto */
.page-narrazioni .card-title,
.page-percorsi-narrativi .card-title {
    color: #1a1a1a !important;
    font-weight: 700 !important;
    font-size: 1.125rem !important;
}

/* Homepage - Box "Chi Siamo" - Padding ridotto per allineamento */
.box-bottom-index {
    padding: 1.5rem !important;
}

/* Pagina Catalogo - Select ordinamento accessibile */
.select-input label.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Link nelle card - Contrasto garantito */
.card a,
a.card {
    color: inherit !important;
    text-decoration: none !important;
}

.card a:hover,
a.card:hover {
    text-decoration: none !important;
}

.card a:focus,
a.card:focus {
    outline: 3px solid #005a9c !important;
    outline-offset: 2px !important;
}

/* ============================================
   LINE SPACING - SC 1.4.12 (AA)
   ============================================ */

/* Spaziatura tra righe e paragrafi */
.lh-big,
.card-text {
    line-height: 1.6 !important;
}

.text-search p,
.box-bottom-index p,
.box-bottom-index-bib p {
    line-height: 1.6 !important;
    margin-bottom: 1em;
}

/* ============================================
   ARIA LABELS & SEMANTIC HTML
   ============================================ */

/* Nascondere visivamente ma mantenere per screen reader */
.sr-only,
.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-width: 0;
}

.sr-only-focusable:focus,
.screen-reader-text:focus {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
    white-space: normal;
}

/* ============================================
   LINK VISIBILITY - SC 1.4.1 (A)
   ============================================ */

/* Assicurarsi che i link siano visibili anche senza colore */
a:not(.btn):not(.navbar-brand) {
    text-decoration: underline;
}

a:not(.btn):not(.navbar-brand):hover,
a:not(.btn):not(.navbar-brand):focus {
    text-decoration: underline;
    font-weight: 500;
}

/* Link nelle card - Fix colore blu visibile */
.link-box3 {
    text-decoration: none !important;
    border-bottom: none !important;
}

.link-box3:hover,
.link-box3:focus {
    text-decoration: none !important;
    border-bottom: none !important;
}

/* Assicura che il testo del link mantenga il colore del tema */
.card-content .card.nth-col1 .link-box3,
.card-content .card.nth-col1 .link-box3 span {
    color: var(--col-primary) !important;
}

.card-content .card.nth-col2 .link-box3,
.card-content .card.nth-col2 .link-box3 span {
    color: var(--col-btn-primary) !important;
}

.card-content .card.nth-col3 .link-box3,
.card-content .card.nth-col3 .link-box3 span {
    color: #183659 !important;
}

/* ============================================
   BUTTON ACCESSIBILITY
   ============================================ */

/* Pulsanti con area di click adeguata */
button,
.btn,
a.btn {
    min-height: 44px;
    min-width: 44px;
    padding: 0.5rem 1rem;
}

/* Fix btn-search - Ripristina dimensioni e forma originali */
.btn-search {
    min-height: auto !important;
    min-width: 80px !important;
    width: 80px !important;
    height: 80% !important;
    padding: 13px !important;
    background-size: 2em !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border: none !important;
    border-radius: 2em !important;
}

/* Home: container con posizionamento relativo */
.home-content.input-group {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

/* Home: pulsante a destra dentro l'area bianca con margine dal bordo */
div.input-group.home-content .btn.btn-search,
.input-group.home-content button.btn-search,
.home-content.input-group .btn-search,
.home-content .btn-search {
    position: absolute !important;
    right: 10px !important;
    left: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
}

/* Altre pagine: pulsante a sinistra */
.form-row .input-group .btn-search {
    left: 0 !important;
    right: auto !important;
}

/* Altre pagine: input con padding a sinistra per il pulsante */
.form-row .input-group .input-search {
    padding-left: 90px !important;
    padding-right: 12px !important;
}

/* Home: input con padding minimo a sinistra - DEVE ESSERE DOPO le altre pagine */
.home-content .input-search,
.home-content input[type="search"],
.home-content .form-control.input-search,
div.input-group.home-content .input-search {
    padding-right: 100px !important;
    padding-left: 12px !important;
    width: 100% !important;
    color: #000000 !important; /* Testo nero visibile */
}

/* Placeholder visibile sulla home */
.home-content .input-search::placeholder,
.home-content input[type="search"]::placeholder {
    color: #6c757d !important; /* Grigio per il placeholder */
    opacity: 1 !important;
}

/* Stato disabled visibile */
button:disabled,
.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================
   FORM ACCESSIBILITY
   ============================================ */

/* Label visibili per i form */
input[type="search"],
input[type="text"],
input[type="email"],
textarea,
select {
    font-size: 1rem;
    line-height: 1.5;
    padding: 0.5rem;
    border: 2px solid #666;
}

input[type="search"]:focus,
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus {
    border-color: #005a9c;
    outline: 3px solid rgba(0, 90, 156, 0.3);
    outline-offset: 2px;
}

/* ============================================
   SKIP LINKS
   ============================================ */

.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #005a9c;
    color: white;
    padding: 8px;
    text-decoration: none;
    z-index: 100000;
}

.skip-link:focus {
    top: 0;
    outline: 3px solid #ffffff;
}

/* ============================================
   LOGO HEADER - Non deve rimpicciolirsi con lo scroll
   ============================================ */

/* Mantieni dimensioni fisse del logo durante lo scroll */
.navbar-brand img {
    max-height: 3.75rem !important;
    height: 3.75rem !important;
}

/* Impedisci le classi JavaScript di modificare il logo */
.navbar-brand img.maxHeight-18,
.navbar-brand img.maxHeight-29,
.navbar-brand img.maxHeight-50 {
    max-height: 3.75rem !important;
    height: 3.75rem !important;
}

/* ============================================
   WCAG 2.1 (A) - SC 1.1.1 & 1.3.1 FIXES
   ============================================ */

/* Assicura che le icone SVG decorative siano nascoste agli screen reader */
svg[role="img"] {
    /* Le icone con role="img" devono avere aria-label */
    display: inline-block;
}

/* Nasconde icone puramente decorative */
img[role="presentation"],
svg[aria-hidden="true"] {
    /* Correttamente nascosto agli screen reader */
    pointer-events: none;
}

/* Migliora la semantica delle regioni ARIA */
[role="banner"],
[role="main"],
[role="contentinfo"],
[role="navigation"],
[role="search"],
[role="tablist"],
[role="tabpanel"] {
    /* Regioni ARIA correttamente identificate */
    position: relative;
}

/* ============================================
   WCAG 2.1 (A) - SC 2.5.3 Label in Name
   ============================================ */

/* 
 * SC 2.5.3 - Tech F96: aria-label deve corrispondere al testo visibile
 * 
 * PROBLEMI RILEVATI nella pagina Percorsi Narrativi (da correggere nei template PHP/HTML):
 * 
 * 1. PULSANTE RICERCA (linea 683 page-narrazioni.php):
 *    - Attuale: aria-label="Button_submit"
 *    - Corretto: aria-label="Cerca" o "Cerca tra i percorsi"
 *    - File: page-narrazioni.php o template-parts/search-form.php
 * 
 * 2. IMMAGINI CARD (linee 742, 750, 758, etc.):
 *    - Attuale: alt="pt" (troppo generico)
 *    - Corretto: alt="Immagine percorso: [TITOLO]" o alt="" se decorativa
 *    - File: page-narrazioni.php (nel loop delle card)
 * 
 * 3. COOKIE BANNER (linea 212):
 *    - Plugin Complianz GDPR - aria-label="close-dialog"
 *    - Fuori dal controllo del tema, richiede aggiornamento plugin
 * 
 * 4. DIV CON ARIA-LABEL:
 *    - La maggior parte degli errori su <div> sono falsi positivi del validatore
 *    - I <div> non dovrebbero avere aria-label a meno che non siano interattivi
 * 
 * NOTA: Gli errori SC 2.5.3 sui <div> non interattivi possono essere ignorati.
 * Gli screen reader non annunciano aria-label su elementi non interattivi.
 */

/* Migliora la visibilità dei pulsanti e link per conformità 2.5.3 */
/* NOTA: Non applicare min-height/width generici per evitare conflitti layout */

/* Pulsanti icon-only specifici devono avere dimensioni adeguate per touch target */
.seguici-logo,
.icon-hamburger {
    min-height: 44px !important;
    min-width: 44px !important;
}

/* Il btn-search mantiene le sue dimensioni specifiche definite sopra */

/* ============================================
   RESPONSIVE ACCESSIBILITY
   ============================================ */

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

/* Zoom del testo fino al 200% */
@media (min-width: 1280px) {
    html {
        font-size: 18px;
    }
}

/* ============================================
   SWIPER ACCESSIBILITY
   ============================================ */

.swiper-pagination-bullet {
    min-width: 12px;
    min-height: 12px;
}

.swiper-pagination-bullet:focus {
    outline: 2px solid #005a9c !important;
    outline-offset: 2px !important;
}

/* ============================================
   IMAGE ACCESSIBILITY
   ============================================ */

img {
    max-width: 100%;
    height: auto;
}

/* Assicurarsi che le immagini decorative abbiano alt="" */
img:not([alt]) {
    border: 3px solid red; /* Solo per debug - rimuovere in produzione */
}

/* ============================================
   TABLE ACCESSIBILITY (se presenti)
   ============================================ */

table {
    border-collapse: collapse;
    width: 100%;
}

th,
td {
    padding: 0.75rem;
    text-align: left;
    border: 1px solid #ddd;
}

th {
    background-color: #f5f5f5;
    font-weight: 600;
}

/* ============================================
   COOKIE BANNER ACCESSIBILITY
   ============================================ */

.cmplz-cookiebanner button:focus {
    outline: 3px solid #005a9c !important;
    outline-offset: 2px !important;
}

.cmplz-btn:focus {
    outline: 3px solid #ffffff !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5) !important;
}

/* ============================================
   PAGE DETTAGLIO - Storia e Missione
   WCAG 2.1 AA Compliance
   ============================================ */

/* H1 con stile H3 per mantenere l'aspetto visivo */
.h3-style {
    font-size: 1.5rem; /* 24px - dimensione h3 */
    line-height: 1.4;
    font-weight: 600;
}

/* Contenuto pagina - Spaziatura e leggibilità - SC 1.4.4 & 1.4.12 */
.page-content p {
    font-size: 1rem; /* 16px */
    line-height: 1.6; /* SC 1.4.12 - Line spacing minimo 1.5 */
    margin-bottom: 1em;
    letter-spacing: 0.02em; /* SC 1.4.12 - Letter spacing */
}

/* Immagini nel contenuto - Accessibilità */
.page-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem auto;
}

/* Strong/Bold text - Contrasto garantito - SC 1.4.3 */
.page-content strong,
.page-content b {
    font-weight: 700;
    color: #1a1a1a; /* Contrasto 4.5:1 su sfondo bianco */
}

/* Link nel contenuto - Contrasto 4.5:1 - SC 1.4.3 */
.page-content a {
    color: #005a9c;
    text-decoration: underline;
    font-weight: 500;
}

.page-content a:hover,
.page-content a:focus {
    color: #003d6b;
    background-color: rgba(0, 90, 156, 0.1);
    outline: 2px solid #005a9c;
    outline-offset: 2px;
}

/* Bordo contenuto - Responsive */
@media (min-width: 768px) {
    .border-about {
        padding: 3rem;
    }
}

/* ============================================
   PAGE SAMIRA CARDCUSTOM ESTESA - Scheda dettaglio
   WCAG 2.1 AA Compliance
   ============================================ */

/* Contrasto colori - SC 1.4.3 - Testo rosso su bianco */
.page-template-page-samira-cardcustom-estesa .semi-b[style*="color: red"],
.page-template-page-samira-cardcustom-estesa span.semi-b[style*="color: red"] {
    color: #c70000 !important; /* Rosso scuro - contrasto 4.5:1 */
    font-weight: 700 !important;
}

/* Pulsanti condivisione - Area click adeguata - SC 2.5.5 */
.page-template-page-samira-cardcustom-estesa .btn-share,
.page-template-page-samira-cardcustom-estesa .btn-print {
    min-height: 44px;
    min-width: 44px;
}

/* ============================================
   PAGE ORGANIGRAMMA - Organigramma
   WCAG 2.1 AA Compliance
   ============================================ */

/* SC 1.4.4/1.4.5 - Font size in unità relative invece di pixel */
.page-organigramma-paladin .wp-block-post-title,
.page-organigramma-paladin h2.wp-block-post-title {
    font-size: 1.25rem !important; /* 20px equivalente */
}

.page-organigramma-paladin .lazyblock-settore-ateneo-ZX2rUa p,
.page-organigramma-paladin .entry-content p {
    font-size: 1rem !important; /* 16px equivalente */
}

/* SC 1.3.1 - Tech H42 - Correzione struttura heading */
.page-organigramma-paladin h3.wp-block-heading {
    /* WordPress genera h3 dopo h1, convertiamo visivamente a h2 */
    font-size: 1.5rem;
    font-weight: 600;
}

/* ============================================
   PAGE BIBLIOTECA - Biblioteca Livio Paladin
   WCAG 2.1 AA Compliance
   ============================================ */

/* SC 1.4.12 - Tech C21 - Line spacing adeguato */
.page-biblioteca .page-content,
.page-biblioteca .cs-content,
.page-biblioteca #testo p {
    line-height: 1.5 !important;
    letter-spacing: 0.12em;
}

/* SC 1.4.4/1.4.5 - Font size in unità relative */
.page-biblioteca .page-content p,
.page-biblioteca #testo p {
    font-size: 1rem !important; /* 16px equivalente */
}

/* ============================================
   HOMEPAGE FOOTER FIX
   ============================================ */

/* Fix footer nascosto sulla homepage a causa delle animazioni Locomotive Scroll */
.page-template-page-hp footer,
.page-template-page-hp footer[role="contentinfo"],
.page-template-page-hp footer *,
.home footer,
.home footer[role="contentinfo"],
.home footer * {
    opacity: 1 !important;
    visibility: visible !important;
}


