/*
Theme Name: SICTOM
Template: astra
Version: 1.0.0
Description: Thème enfant Astra avec RGAA, ACF Pro et optimisations d'accessibilité.
Author: D-FUZION
Author URI: https://d-fuzion.com
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sictom
*/


/* === HEAD / HEADER === */

main header {
    max-width: 1440px;
}
.ast-breadcrumbs-wrapper {
    max-width: 1440px;
    margin: auto;
}
.single .ast-breadcrumbs-wrapper {
    padding: 0 30px;
  }
.ast-breadcrumbs .trail-browse a, .ast-breadcrumbs .trail-items a, .ast-breadcrumbs .trail-items li a, .ast-breadcrumbs .trail-item {
    text-transform: uppercase;
    font-size: .8rem;
}
.ast-page-builder-template .entry-header, .page-template-page-plan-du-site nav {
    margin-top: 1em;
    padding: 0 30px;
}
@media (min-width: 545px) {
    .ast-page-builder-template .comments-area, .single.ast-page-builder-template .entry-header, .single.ast-page-builder-template .post-navigation, .single.ast-page-builder-template .ast-single-related-posts-container {
      max-width: 1440px;
    }
}
.header-widget-area[data-section="sidebar-widgets-header-widget-1"] {
    padding: 0;
  }
#block-8 p {
    margin-bottom: 28px;
  }
dfz-popup-trigger {
    max-width: 30px;
    min-width: 24px !important;
  }
.dfz-popup-icon-svg {fill:var(--ast-global-color-1); height: 20px; }
body .ast-search-box.full-screen .ast-search-wrapper .search-form {
    width: 100%;
  }
.page-template-page-actus .ast-single-post-featured-section img, .page-template-page-agenda .ast-single-post-featured-section img, .single-post .ast-single-post-featured-section img, .single-agenda .ast-single-post-featured-section img {
    max-height: 130px;
}

@media (min-width: 768px) {

    /* .ast-breadcrumbs-wrapper, .ast-page-builder-template .entry-header, .page-template-page-plan-du-site nav {
        padding: 0 20px;
    } */
    .ast-page-builder-template .entry-header {margin-bottom: 3em;}
    body .ast-search-box.full-screen .ast-search-wrapper .search-form {
        width: 70%;
      }

}
@media (min-width: 1024px) {
    main header {
        padding: 0 10px;
    }
}
@media (min-width: 1440px) {

    .ast-breadcrumbs-wrapper, .ast-page-builder-template .entry-header, .page-template-page-plan-du-site nav {
        padding: 0 15px;
    }
    .single .ast-breadcrumbs-wrapper {
        padding: 0 20px;
      }

}
.site-content .ast-article-image-container--full {
    margin-left: calc( -50vw + 50%);
    margin-right: calc( -50vw + 50%);
    max-width: 100vw;
    width: 100vw;
  }


/* === HOME === */

.home-content > header {
    display: none;
}
.actus-home h2 {font-size: clamp(1.85rem, 4vw, 2.7rem)!important}
.organigramme h2 {font-size: clamp(1.85rem, 4vw, 2.3rem)!important}
.agenda-home h2 {font-size: clamp(1.5rem, 4vw, 2.7rem);}

@media (min-width:1024px) {
    .agenda-home > div {transform: translateX(100px);}
}
@media (min-width:1300px) {
    .agenda-home > div {transform: translateX(200px);}
}


/* === NAVIGATION === */

.main-navigation ul { 
    gap: 5px;
}
.main-header-menu > .menu-item {
    border-radius: 50px; 
    border: 0; 
    padding: .25em;
}
.main-header-menu > .menu-item > a {
    text-transform: uppercase
}


@media (min-width: 1024px) {

    #masthead .main-header-menu > .menu-item:hover {
        background-color: #003b48
    }
    #masthead .main-header-menu > .menu-item:hover > a {
        color: #fff
    }
    
    #masthead .btn-menu {
        border-radius: 50px; 
        background-color: rgb(0, 136, 164); 
        border: 0; 
        padding: .5em.25em; 
    }
    #masthead .btn-menu:hover {
        background-color: #003b48;
    }
    #masthead .btn-menu > a, #masthead .btn-menu:hover > a {
        color: #fff
    }
    
    
    #masthead .main-header-menu .sub-menu { background-color: #003b48; }
    #masthead .main-header-menu > li {font-weight: 600;}
    
    #masthead .main-header-menu .sub-menu a { 
        line-height: 1; 
        display: flex; 
        align-items: center; 
        color: #fff 
    }
    #masthead .main-header-menu .sub-menu > li a:before { 
        width: 20px; 
        height: 20px; 
        content:''; 
        margin-right: .5em; 
    }
    
    #masthead .main-header-menu .sub-menu > li:not(.has-mega-menu):first-child {
        border-top-left-radius:8px; 
        border-top-right-radius:8px; 
    }
    #masthead .main-header-menu .sub-menu > li:not(.has-mega-menu):last-child {
        border-bottom-left-radius:8px; 
        border-bottom-right-radius:8px; 
    }
    
    #masthead .main-header-menu > li:not(.has-mega-menu) > .sub-menu > li a:before { 
        background: url('/wp-content/themes/sictom/assets/img/fleche-d-b.svg') center no-repeat; 
    }
    #masthead .main-header-menu > li:not(.has-mega-menu) > .sub-menu > li:hover a:before { 
        background: url('/wp-content/themes/sictom/assets/img/fleche-d-v.svg') center no-repeat; 
    }
    #masthead .main-header-menu > li:not(.has-mega-menu) > .sub-menu > li:hover { 
        background-color: #003b48; 
    }
    #masthead .main-header-menu > li:not(.has-mega-menu) > .sub-menu > li:hover a { 
        background-color: #f7d100; 
        color: #003b48 
    }
    #masthead .main-header-menu .sub-menu, 
    #masthead .main-header-menu .has-mega-menu .sub-menu, 
    #masthead .has-mega-menu:hover > .sub-menu { 
        padding: 0; 
    }
    #masthead  .has-mega-menu .sub-menu {
        border-radius:8px;
    }
    #masthead .mega-menu__col-title {
        color: #f7d100;
        text-transform: uppercase; 
        font-size: .8em;
    }

    #masthead .has-mega-menu > .sub-menu > li > .sub-menu { 
        transform: translateY(0); 
    }
    #masthead .has-mega-menu > .sub-menu > li > .sub-menu > li:hover { 
        background-color: #f7d100;
        border-radius: 0 
    }
    #masthead .has-mega-menu > .sub-menu > li > .sub-menu > li:hover a { 
        color: #003b48 
    }
    #masthead .has-mega-menu > .sub-menu > li > .sub-menu > li a:before { 
        margin-right: .5em; 
        margin-left: 1em; 
        background: url('/wp-content/themes/sictom/assets/img/fleche-d-b.svg') center no-repeat;
    }
    #masthead .has-mega-menu > .sub-menu > li > .sub-menu > li:hover a:before { 
        margin-right: .5em; 
        margin-left: 1em; 
        background: url('/wp-content/themes/sictom/assets/img/fleche-d-v.svg') center no-repeat;
    }

}

/* === FOOTER === */

/* footer {
    margin-top: 3em;
} */

#ast-scroll-top {
    border-radius: 50px; 
  }


/* Ajouter un padding-bottom au footer en mobile pour éviter que le menu fixe cache le contenu */
@media (max-width: 768px) {
    .site-below-footer-wrap {
        padding-bottom: 120px; /* Ajuster selon la hauteur réelle de votre menu fixe */
    }
    #ast-scroll-top {
        right: 20px; 
        bottom: 130px;
    }
}

/* === AUTRES === */

.entry-content p {
    margin-bottom: .9em;
  }
.ast-container {
    width: 100%;
  }
.entry-content .wp-block-uagb-image img, .entry-content .wp-block-image img, .publication-image img, .publication-image, .ast-related-post img {
    border-radius: 8px;
  }

.ast-search-box.full-screen {
    z-index: 9999;
}
.has-border-color {
    width: auto!important;
}
.uagb-icon-list__label {
    font-size: 1rem;
    line-height: 1.2rem;
}
.publication-actions {
    background: rgb(0, 136, 164)!important;
}
.wp-block-table .has-fixed-layout {
    border-collapse: collapse;
    width: auto;
  }
.wp-block-table .has-fixed-layout th {
    word-break: break-word;
    background-color: #003b48;
    color: #fff;
}
.wp-block-table .has-fixed-layout th:first-child {
    border-left: thin solid #003b48;
  }
.wp-block-table .has-fixed-layout th:last-child {
    border-right: thin solid #003b48;
  }
  .wp-block-table thead {
    border-bottom: 0;
  }
  .wp-block-list {
    margin: 0 0 20px 20px !important;
  }
/* Effet survol photos */

#main a:has(img):not(.slider-agenda-link) {
    display: inline-block;
    text-decoration: none;
  }
  
  #main a:has(img):not(.slider-agenda-link) > div:has(img) {
    overflow: hidden;
    display: block;
    transition: transform 0.4s ease;
    transform-origin: center center;
  }
  
  /* .entry-content a:has(img) > div:has(img) img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.4s ease;
    transform-origin: center center;
  } */
  
  #main a:has(img):not(.slider-agenda-link):hover > div:has(img) {
    transform: scale(0.95);
  }
  
  #main a:has(img):not(.slider-agenda-link):hover > div:has(img) img {
    transform: scale(1.1);
  }

/* Accordeons */

.wp-block-accordion-heading button {
    box-shadow: none;
    background-color: var(--ast-global-color-1);
    border-color: var(--ast-global-color-0);
    padding-left: 10px;
    color: #fff
}
.wp-block-accordion-heading button:hover {
    box-shadow: none;
    background-color: var(--ast-global-color-0);
    border-color: var(--ast-global-color-0);
    padding-left: 10px;
    color: #fff
}
.wp-block-accordion-heading button:focus:not(:focus-visible) {
    box-shadow: none;
    background-color: var(--ast-global-color-0)!important;
    border-color: var(--ast-global-color-0)!important;
    padding-left: 10px;
    color: #fff!important;
  }
.wp-block-accordion-panel {
    padding: .9em;
    background-color: #F7F7F7;
    border-radius: 20px;
    color: var(--ast-global-color-0);
    margin-block-start: 10px;
    margin-block-end: 20px !important;
}

/* ============================================================================
    Table des matières (Spectra)
   ============================================================================ */

.uagb-toc__title {display: none;}
.uagb-toc__list {
    margin-left: 0;
    padding-left: 0;
}
.uagb-toc__list > ul {
    padding-left: 20px;
}

/* ============================================================================
   TOC SCROLL SPY (Spectra)
   ============================================================================ */

   .uagb-toc__list-wrap a.dfz-toc-active {
    background-color: #bdf1f9;
  padding: 0 5px;
}


/* Bloc bandeau talent/organigramme */

.home .organigramme {
    margin-top: 0;
 }

@media (max-width: 1099px) {

    .organigramme .orga_bg {
        background-image: none!important;
    }

}

@media (min-width: 768px) {

    .organigramme {
        max-height: 300px;
        z-index: 1;
    }
    /* .home .organigramme {
        max-height: 400px;
    } */
    
    .organigramme .identite {
        transform: scale(.9) translateX(-60px)
    }
    .organigramme .identite img {
        max-height: 500px;
      }
    /* .home .organigramme .identite {
        transform: scale(1.1) translateX(-20px);
    } */

}
@media (min-width: 1100px) {

    .organigramme .orga_bg {
        background-size: 60%!important;
    }

}
@media (min-width: 1400px) {

    .organigramme .orga_bg {
        background-size: contain!important;
    }

}

/* #rgaa-panel-trigger {
    display: none;
  } */

/* Popup Spectra */

/*.uagb-modal-popup.active {
    background: var(--ast-global-color-0);
    z-index: 9999;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    left: 50%;
}
.uagb-modal-popup-close {
    position: absolute;
    right: 0px !important;
    top: 0px !important;
    background-color: transparent !important;
}*/

/* RGPD Cookies */*

.rck-banner__inner h2, .rck-modal__inner h2 {
    font-size: 1.2em;
    text-transform: none;
    margin-top: 1em;
  }
  .rck-banner__title-row {
    align-items: flex-start;
    margin: 0 0 1em;
    flex-direction: column;
  }
  .rck-reject-link {
    text-transform: none;
  }
  .rck-logo {
    height: auto;
    max-width: 150px;
  }
  #rck-banner-desc {
    font-size: 0.8rem;
  }
  .rck-banner .rck-button-secondary, .rck-modal .rck-button-secondary, .rck-banner .rck-button-primary, .rck-modal .rck-button-primary, .rck-modal .rck-button-primary:not([data-rck-action="accept-all"]) {
    font-size: .8rem;
    padding: .5em 1em;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: 999px !important;
  }
  
/* Hover effect 5
--------------------------------------------------------------------------------------------------------------- */

:root {
--bg: hsla(0, 0%, 100%, 1);
--color1: var(--ast-global-color-0);
--color2: var(--ast-global-color-1);
--underline-width: 8px;
--underline-block-width: 50px;
--underline-color: hsla(188, 85%, 72%, 0.5);
/* --underline-color-hover: hsla(188, 85%, 72%, 1);  */
--underline-color-hover: hsla(50.6, 100%, 48.6%, .5);
--underline-transition: 1s;
--blur: blur(120px);
}


@media only screen and (min-width: 1024px) {

    .entry-content p > a, .entry-content p > strong > a, .entry-content li > a:not(.uagb-tabs-list, .uagb-toc-link__trigger)  {
      color: var(--color1);
      text-decoration: none;
      background-image: linear-gradient(90deg, var(--bg), var(--bg)), linear-gradient(90deg, var(--underline-color), var(--underline-color));
      background-size: var(--underline-block-width) var(--underline-width), 100% var(--underline-width);
      background-repeat: no-repeat;
      background-position-x: calc(var(--underline-block-width) * -1), 0;
      background-position-y: 100%;
      transition: background-position-x var(--underline-transition);
    }
    .entry-content p.has-text-color > a, .entry-content p.has-text-color > strong > a, .entry-content li.has-text-color > a:not(.uagb-tabs-list, .uagb-toc-link__trigger)  {
        color: #fff!important;
        background-image: linear-gradient(90deg, var(--color2), var(--color2)), linear-gradient(90deg, var(--underline-color), var(--underline-color));
        background-size: var(--underline-block-width) var(--underline-width), 100% var(--underline-width);
      }
    .entry-content p > a:hover, .entry-content p > strong > a:hover, .entry-content li > a:not(.uagb-tabs-list, .uagb-toc-link__trigger):hover {
      background-image: linear-gradient(90deg, var(--bg), var(--bg)), linear-gradient( 90deg, var(--underline-color-hover), var(--underline-color-hover) );
      background-position-x: calc(100% + var(--underline-block-width)), 0;
      color: var(--color1);
    }
    .entry-content p.has-text-color > a:hover, .entry-content p.has-text-color > strong > a:hover, .entry-content li.has-text-color > a:not(.uagb-tabs-list, .uagb-toc-link__trigger):hover {
        background-image: linear-gradient(90deg, var(--color2), var(--color2)), linear-gradient( 90deg, var(--underline-color-hover), var(--underline-color-hover) );
        background-position-x: calc(100% + var(--underline-block-width)), 0;
        color: var(--bg);
      }
  }

/* === SINGLE === */

.single .entry-content, .single .ast-single-related-posts-container {
    max-width: 1470px;
    margin: auto;
    padding: 0 30px;
  }

.ast-single-post-featured-section.post-thumb.ast-article-image-container--full > img {
    aspect-ratio: 7/2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 200px;
}
.single .entry-header .post-thumb {
    margin-bottom: 2em;
    border-radius: 8px;
    overflow: hidden;
}
.single figure {box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}
.ast-single-related-posts-container img {
    aspect-ratio: 16/9;
    width: 100%;
    height: 100%;
}

@media (min-width: 768px) {
    .single .entry-content, .single .ast-single-related-posts-container {
       padding: 0 20px;
      }
    .single .entry-header .post-thumb {
        max-width: 50%;
        float: right;
        transform: translateX(100px);
    }
}

/* === CORRECTIONS GLOBALES === */

/* ============================================================================
   FOCUS VISIBLE - RGAA 10.7 (Niveau A)
   ============================================================================

   Principe : Le focus doit être visible UNIQUEMENT lors de la navigation clavier,
   pas au clic souris, pour une meilleure UX sans compromettre l'accessibilité.

   Solution :
   - :focus = masqué par défaut (surcharge le style Astra)
   - :focus-visible = visible lors de la navigation clavier uniquement

   Navigateurs compatibles : Chrome 86+, Firefox 85+, Safari 15.4+
   Fallback : Pour anciens navigateurs, on garde le outline sur :focus
*/

/* Masquer le focus au clic souris (mais garder pour clavier) */
button:focus:not(:focus-visible),
.menu-toggle:focus:not(:focus-visible),
.ast-button:focus:not(:focus-visible),
.ast-custom-button:focus:not(:focus-visible),
.button:focus:not(:focus-visible),
input[type="reset"]:focus:not(:focus-visible),
input[type="button"]:focus:not(:focus-visible),
input[type="submit"]:focus:not(:focus-visible),
input#submit:focus:not(:focus-visible),
form[CLASS*="wp-block-search__"].wp-block-search
    .wp-block-search__inside-wrapper
    .wp-block-search__button:focus:not(:focus-visible),
body .wp-block-file .wp-block-file__button:focus:not(:focus-visible) {
    /* Annuler le style de focus au clic */
    color: inherit;
    background-color: transparent;
    border-color: inherit;
    outline: none;
}

/* Focus visible UNIQUEMENT au clavier (RGAA conforme) */
button:focus-visible,
.menu-toggle:focus-visible,
.ast-button:focus-visible,
.ast-custom-button:focus-visible,
.button:focus-visible,
input[type="reset"]:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible,
input#submit:focus-visible,
form[CLASS*="wp-block-search__"].wp-block-search
    .wp-block-search__inside-wrapper
    .wp-block-search__button:focus-visible,
body .wp-block-file .wp-block-file__button:focus-visible {
    /* Style de focus RGAA conforme - visible et contrasté */
    outline: 2px solid var(--ast-global-color-1);
    outline-offset: 2px;
}

/* Restaurer le comportement hover normal */
button:hover,
.menu-toggle:hover,
.ast-button:hover,
.ast-custom-button:hover,
.button:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input#submit:hover,
form[CLASS*="wp-block-search__"].wp-block-search
    .wp-block-search__inside-wrapper
    .wp-block-search__button:hover,
body .wp-block-file .wp-block-file__button:hover {
    color: #ffffff;
    background-color: var(--ast-global-color-1);
    border-color: var(--ast-global-color-1);
}

body {
    word-wrap: break-word;
}
/*.admin-bar #page {
    margin-top: 32px;
}*/
/* Suppression des box-shadow par défaut du thème Astra */
img,
.ast-article-single img,
.entry-content img {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

/* Correction pour les SVG - surcharge la règle svg:not(:root) du parent */
svg:not(:root) {
    overflow: visible !important;
}

/* Header astra */

.ast-theme-transparent-header .burger-line {
    background-color: #fff;
}
.ast-theme-transparent-header .dfz-favorites-icon-svg {
    stroke: #fff;
}
.ast-theme-transparent-header .dfz-popup-icon-svg {
    fill: #fff;
}

/* Entetes */

.ast-single-entry-banner {
    height: 50vh;
}

/* === STYLES PERSONNALISÉS === */

/* ============================================================================
   CONFORMITÉ RGAA 4.1 - RÈGLES OBLIGATOIRES
   ============================================================================ */

/* ---------------------------------------------------------------------------
   Critère 10.14 - Reduced motion (OBLIGATOIRE - Niveau A)
   Impact : Utilisateurs avec troubles vestibulaires, migraines, épilepsie
   Active uniquement si l'utilisateur a choisi "Réduire les animations" dans son OS
   --------------------------------------------------------------------------- */
@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;
    }
}

/* ---------------------------------------------------------------------------
   Critère 13.9 - Taille minimum de clic 44x44px (Niveau AAA)
   Impact : Utilisateurs avec difficultés motrices, tremblements, précision réduite
   Application intelligente : seulement sur boutons sans classes personnalisées
   --------------------------------------------------------------------------- */
button:not([class*="btn-"]):not(.swiper-button):not([class*="-filter"]):not(
        [class*="rgaa-"]
    ),
input[type="submit"]:not([class]),
input[type="button"]:not([class]),
[role="button"]:not([class]) {
    min-height: 44px;
    min-width: 44px;
}

/* Pagination (navigation importante) */
.pagination a,
.nav-links a {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ---------------------------------------------------------------------------
   Critère 10.7 - Focus visible (Niveau A)
   Impact : Utilisateurs naviguant au clavier
   Note : Navigateurs ont un focus par défaut, ceci améliore la visibilité
   --------------------------------------------------------------------------- */
*:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
}

/* ---------------------------------------------------------------------------
   Classe utilitaire - Screen Reader Only
   Masque visuellement mais reste accessible aux lecteurs d'écran
   --------------------------------------------------------------------------- */
   .sr-only {

    position: absolute !important;

    width: 1px;

    height: 1px;

    padding: 0;

    margin: -1px;

    overflow: hidden;

    clip: rect(0, 0, 0, 0);

    clip-path: inset(50%);

    white-space: nowrap;

    border: 0;

}

/* ============================================================================
   FIN CONFORMITÉ RGAA
   ============================================================================ */