/* ============================================================
 *  Couleurs personnalisées
 *  ============================================================ */

[data-md-color-scheme="default"] {
    --md-primary-fg-color:        #342820;
    --md-primary-fg-color--light: #F5F5F5;
    --md-primary-fg-color--dark:  #342820;
    --md-accent-fg-color:         #D4960A;
}

[data-md-color-scheme="slate"] {
    --md-primary-fg-color:        #342820;
    --md-primary-fg-color--light: #3ec4bf;
    --md-primary-fg-color--dark:  #342820;
    --md-accent-fg-color:         #D4960A;
    --md-default-bg-color:        #1e1712;
}

h1 {
    color: #D4960A !important;
}

strong {
    color: #0FADA8 !important;
}

.md-typeset .twemoji svg path[d="M8.04 16.34c1.01-2.51 2.15-5.38 6.46-6.34 0 0-5 0-6.62 4.63 0 0-.88-.88-.88-1.88s1-3.12 3.5-3.62c.71-.13 1.5-.26 2.28-.37 1.97-.26 3.86-.54 4.22-1.26 0 0-1.5 8.5-7 8.5-.18 0-.43-.06-.67-.15L8.86 17l-.95-.33zM12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8-8-3.59-8-8 3.59-8 8-8m0-2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2"],
.md-typeset .twemoji svg path[d="M21 11c0 5.55-3.84 10.74-9 12-5.16-1.26-9-6.45-9-12V5l9-4 9 4zm-9 10c3.75-1 7-5.46 7-9.78V6.3l-7-3.12L5 6.3v4.92C5 15.54 8.25 20 12 21m2.8-10V9.5C14.8 8.1 13.4 7 12 7S9.2 8.1 9.2 9.5V11c-.6 0-1.2.6-1.2 1.2v3.5c0 .7.6 1.3 1.2 1.3h5.5c.7 0 1.3-.6 1.3-1.2v-3.5c0-.7-.6-1.3-1.2-1.3m-1.3 0h-3V9.5c0-.8.7-1.3 1.5-1.3s1.5.5 1.5 1.3z"],
.md-typeset .twemoji svg path[d="M22.11 21.46 2.39 1.73 1.11 3 6.7 8.59c-.06.14-.13.27-.2.41H3l-1 2h4.06c-.06.33-.06.66-.06 1s0 .67.06 1H3l-1 2h4.5c1.26 3.5 4.58 6 8.5 6 1.21 0 2.36-.26 3.41-.7l2.43 2.43zM8.58 13c-.05-.33-.08-.66-.08-1s.03-.67.08-1h.53l2 2zM15 18.5c-2.5 0-4.68-1.42-5.76-3.5h3.87l3.33 3.33c-.47.1-.94.17-1.44.17M12.2 9H16l-1 2h-.8zm-1.7-1.68L8.74 5.54A8.96 8.96 0 0 1 15 3c2.3 0 4.41.87 6 2.3l-1.77 1.77A6.47 6.47 0 0 0 15 5.5c-1.74 0-3.31.7-4.5 1.82"],
.md-typeset .twemoji svg path[d="M14 15c0 1.11-.89 2-2 2a2 2 0 0 1-2-2c0-1.11.89-2 2-2a2 2 0 0 1 2 2m-.91 5c.12.72.37 1.39.72 2H6a2 2 0 0 1-2-2V10c0-1.11.89-2 2-2h1V6c0-2.76 2.24-5 5-5s5 2.24 5 5v2h1a2 2 0 0 1 2 2v3.09c-.33-.05-.66-.09-1-.09s-.67.04-1 .09V10H6v10zM9 8h6V6c0-1.66-1.34-3-3-3S9 4.34 9 6zm12.34 7.84-3.59 3.59-1.59-1.59L15 19l2.75 3 4.75-4.75z"] {
    color: #0FADA8 !important;
}

.md-typeset blockquote {
    border-left: 4px solid #A87408 !important;
    font-style: italic;
}

.md-typeset blockquote p {
    color: #D4960A !important;
}

.md-typeset a {
    color: #D4960A !important;
}

/* assurer que le tableau des liens utiles prenne le maximum d'espace */
.liens-utiles-table table {
    width: 100% !important;
    display: table !important;
    table-layout: fixed;
}

/* Gestion des colonnes du footer */
.footer-columns {
    display: flex;
    justify-content: space-between; /* pousse les cols aux extrémités */
    align-items: flex-start;
    width: 100%;
    gap: 2rem;
}

.footer-col {
    flex: 1; /* chaque colonne prend une part égale */
}

.footer-col:last-child {
    text-align: right; /* aligne le contenu de la colonne droite à droite */
}

@media (max-width: 600px) {
    .footer-columns {
        flex-direction: column;
    }
    .footer-col:last-child {
        text-align: left;
    }
}


/* Cibler UNIQUEMENT le mode sombre avec une spécificité maximale */
body[data-md-color-scheme="slate"] .md-button:not(.md-button--primary),
html[data-md-color-scheme="slate"] .md-button:not(.md-button--primary) {
    color: #bebfc2 !important;
    border-color: #bebfc2 !important;
    background-color: transparent !important;
}

/* Cibler UNIQUEMENT le mode sombre avec une spécificité maximale */
body[data-md-color-scheme="slate"] .md-button:not(.md-button--primary):hover,
html[data-md-color-scheme="slate"] .md-button:not(.md-button--primary):hover {
    color: #F5F5F5 !important;
    border-color: transparent !important;
    background-color: #D4960A !important;
}

/* ============================================================
 *  Fusion de la barre de navigation (tabs) dans le header
 *  ============================================================ */

/* On masque la barre tabs séparée et on intègre son contenu dans le header */
.md-tabs {
    display: none !important;  /* on cache la barre secondaire */
}

/* On réaffiche les liens directement dans le header via un trick :
 *  on utilise la nav Material mais repositionnée */
.md-header__inner {
    position: relative;
}

/* Liens injectés via le header natif Material —
 *  on surcharge l'élément .md-header-nav qui existe nativement */
.md-header__topic ~ .md-header__option {
    margin-left: auto;
}

/* ============================================================
 *  Liens de navigation dans le header
 *  ============================================================ */

/* Le titre prend tout l'espace disponible,
 *  les liens et le toggle restent groupés à droite */
.md-header__title {
    flex-grow: 1;
}

.md-header__nav-custom {
    display: flex;
    align-items: center;
    gap: 0;
    /* plus de margin-left: auto ici */
}

.md-header__nav-link {
    display: inline-flex;
    align-items: center;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.8rem;
    font-weight: 500;
    padding: 0 0.8rem;
    height: var(--md-header-height, 3.6rem);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color 0.2s, border-color 0.2s;
    white-space: nowrap;
}

.md-header__nav-link:hover,
.md-header__nav-link--active {
    color: #fff;
    border-bottom-color: var(--md-accent-fg-color);
}

/* Mobile : le burger prend le relais */
@media (max-width: 960px) {
    .md-header__nav-custom {
        display: none;
    }
}

/* ============================================================
 *  Suppression du panneau latéral gauche
 *  ============================================================ */

@media (min-width: 961px) {
    .md-sidebar--primary {
        display: none !important;
    }
}

.md-content {
    max-width: 860px;
    margin: 0 auto;
}

/* Compenser la hauteur de la barre tabs supprimée */
.md-main {
    margin-top: 0 !important;
}

/* ============================================================
 *  Footer Qualiopi
 *  ============================================================ */

.md-footer-meta {
    background-color: #342820 !important;
}

.footer-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    padding: 2rem 1rem;
    width: 100%;
}


.footer-col {
    flex: 1;
    min-width: 200px;
}

.footer-col h5 {
    color: var(--md-accent-fg-color);
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.footer-col p,
.footer-col small {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.75rem;
    line-height: 1.6;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0 0 0.75rem 0;
}

.footer-col ul li {
    margin-bottom: 0.35rem;
}

.footer-col a {
    color: rgba(255, 255, 255, 0.65);
    text-decoration: none;
    font-size: 0.75rem;
    transition: color 0.2s ease;
}

.footer-col a:hover {
    color: var(--md-accent-fg-color);
    text-decoration: underline;
}

.footer-col small {
    display: block;
    margin-top: 0.75rem;
    opacity: 0.5;
}

@media (max-width: 600px) {
    .footer-columns {
        flex-direction: column;
    }
}

.md-footer-qualiopi {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.3rem 0.1rem;
    padding: 1rem 1rem 0.5rem;
    font-size: 0.7rem;
    width: 100%;
}

.md-footer-qualiopi a {
    color: var(--md-footer-fg-color--light, rgba(255,255,255,0.7));
    text-decoration: none;
    transition: color 0.2s ease;
}

.md-footer-qualiopi a:hover {
    color: var(--md-accent-fg-color);
    text-decoration: underline;
}

.footer-sep {
    color: var(--md-footer-fg-color--lighter, rgba(255,255,255,0.3));
    user-select: none;
}

.md-footer-copyright {
    text-align: center;
    padding: 0.5rem 1rem 1rem;
    font-size: 0.65rem;
    opacity: 0.6;
}

/* Mobile : masquer les séparateurs si les liens passent à la ligne */
@media (max-width: 600px) {
    .md-header__nav-links {
        display: none; /* remplacé par le menu burger sur mobile */
    }
    .footer-sep {
        display: none;
    }
}

/* Afficher uniquement la bonne icône selon le thème actif */
[data-md-color-scheme="default"] .theme-icon-dark { display: none; }
[data-md-color-scheme="slate"]   .theme-icon-light { display: none; }

/* Supprimer le style bouton natif */
#theme-toggle {
background: none;
border: none;
cursor: pointer;
}

.md-sidebar--secondary {
    display: none !important;
}

.md-footer-copyright {
    display: none !important;
}

/* Format du message de validation du formulaire d'envoi */
.form-message-success {
    background-color: color-mix(in srgb, var(--md-primary-fg-color) 15%, transparent);
    border: 1px solid var(--md-primary-fg-color);
    border-radius: 0.4rem;
    padding: 1.25rem 1.5rem;
    color: var(--md-default-fg-color);
    font-size: 0.95rem;
    margin-bottom: 1.5rem;
}

/* ============================================================
 *  Bouton "Envoyer" du formulaire de contact
 *  ============================================================ */

.btn-primary {
    display: inline-block;
    background-color: var(--md-primary-fg-color);
    color: #fff;
    border: none;
    padding: 0.8rem 2rem;
    border-radius: 0.3rem;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 0.03em;
    transition: background-color 0.2s ease, transform 0.1s ease;
    text-decoration: none;
}

.btn-primary:hover {
    background-color: var(--md-accent-fg-color);
    transform: translateY(-1px);
}

.btn-primary:active {
    transform: translateY(0);
}

.btn-primary:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* ============================================================
 *  Iframe FormTools
 *  ============================================================ */

.form-iframe-container {
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
}

#contact-iframe {
width: 100%;
min-height: 700px;
border: none;
background: transparent !important;
}

#reclamation-iframe {
width: 100%;
min-height: 700px;
border: none;
background: transparent !important;
}