/*
Theme Name: Bears & Friends
Theme URI: 
Author: D&O
Author URI: 
Description: Blog sur la communauté Bear / Bienveillante, Chaleureuse et Fière
Requires at least: 7.1
Tested up to: 7.1
Requires PHP: 8.2
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bears-friends
Tags: 
*/

/* -------------------------------------------------------------------- */
/* Header                                                               */
/* -------------------------------------------------------------------- */
.site-header {
    position: fixed;
    top: 30px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 40px);
    max-width: 1500px;
    z-index: 999;
}

/* Compensation du header fixe */
.wp-site-blocks {
    padding-top: 140px;
}

/* Quand la barre admin WordPress est visible */
.admin-bar .wp-site-blocks {
    padding-top: 108px;
}

/* Logo du Header */

.bears-friends-header-logo {
    flex-shrink: 0;
}

.bears-friends-header-logo img {
    width: 220px;
    height: auto;
}

/* -------------------------------------------------------------------- */
/* Barre de  Navigation                                                               */
/* -------------------------------------------------------------------- */

.bears-friends-navbar {
    position: relative;
    background: transparent;
    box-shabears-friendsw:
        0 10px 40px rgba(0,0,0,.12),
        0 2px 10px rgba(0,0,0,.05);
    border-radius: 50px;
    row-gap: .4rem;
}

.bears-friends-navbar::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(255,255,255,.6);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
    border-radius: inherit;
    z-index: -1;
}

.bears-friends-navbar .wp-block-navigation {
    flex-grow: 1;
    justify-content: center;
}

.bears-friends-navbar .wp-block-navigation__responsive-container-open {
    color: var(--wp--preset--color--brun-fonce);
}

.bears-friends-nav .wp-block-navigation-item__content {
    padding: .45rem 1.1rem;
    border-radius: 999px;
}

.bears-friends-nav .wp-block-navigation-item__content:hover {
    background-color: rgba(46,31,22,.1);
}

.bears-friends-nav .current-menu-item > .wp-block-navigation-item__content,
.bears-friends-nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
    background-color: #1e140c !important;
    color: #f5efe6 !important;
}

/* Force la pastille active sur "ACTIVITÉS" pour toutes les pages liées aux événements */
body.single-tribe_events .bears-friends-nav a[href="/event"],
body.tax-tribe_events_cat .bears-friends-nav a[href="/event"],
body.post-type-archive-tribe_events .bears-friends-nav a[href="/event"] {
	background-color: #2E1F16 !important;
	color: #ffffff !important;
}

/* Élément de menu actif (niveau principal) */
.wp-block-navigation-item.current-menu-item > a,
.wp-block-navigation-item.current-menu-ancestor > a,
.wp-block-navigation-item:hover > a {
	background-color: #2E1F16 !important;
	color: #ffffff !important;
	border-radius: 999px;
}

/* Éléments du sous-menu (dropbears-friendswn) : actif ou survolé */
.wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
.wp-block-navigation__submenu-container .wp-block-navigation-item:hover > a {
	background-color: #2E1F16 !important;
	color: #ffffff !important;
	border-radius: 6px; /* rectangle avec coins légèrement arrondis */
}

/* Réseaux Sociaux */

.bears-friends-header-socials.wp-block-social-links {
    gap: .6rem;
}

.bears-friends-header-socials .wp-social-link {
    background: none;
    width: 2rem;
    height: 2rem;
}

.bears-friends-header-socials .wp-social-link a {
    color: var(--wp--preset--color--brun-fonce);
}

.bears-friends-header-socials .wp-social-link svg {
    width: 1.4rem;
    height: 1.4rem;
    fill: var(--wp--preset--color--brun-fonce);
    transition: fill .2s ease;
}

.bears-friends-header-socials .wp-social-link:hover svg {
    fill: var(--wp--preset--color--ocre);
}

/* -------------------------------------------------------------------- */
/* Footer                                                               */
/* -------------------------------------------------------------------- */

footer.wp-block-group {
    margin-top: 0 !important;
}

/* Pastilles du pied de page : ordinateur et mobile */
footer .wp-block-navigation-item > .wp-block-navigation-item__content {
    box-sizing: border-box;
    display: inline-block;
    padding: 2px 10px !important;
    border-radius: 999px !important;
}

/* -------------------------------------------------------------------- */
/* Pages                                                                */
/* -------------------------------------------------------------------- */

.wp-block-post-title {
    display: none;
}

/* Traitement si on n'est pas sur la page d'accueil */
body:not(.home) .wp-block-post-title,
body:not(.home) h1.wp-block-heading:first-child {
    text-align: center;
    font-size: clamp(2.2rem, 3vw, 3.8rem);
    font-weight: 700;
    line-height: 1.2;
    color: var(--wp--preset--color--brun-fonce);
    max-width: 1000px;
    margin: 2rem auto;
}

body:not(.home) .wp-site-blocks main {
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

body:not(.home) .wp-site-blocks main p {
    text-align: justify;
}

body:not(.home) .wp-site-blocks main li {
    text-align: justify;
}

body:not(.home) .wp-site-blocks main p.has-drop-cap {
    text-align: justify;
    line-height: 1.8;
}

body:not(.home) .wp-site-blocks main .wp-block-image {
    text-align: center;
}

body:not(.home) .wp-site-blocks main .wp-block-image img {
    margin-left: auto;
    margin-right: auto;
}

/* Page d'accueil pleine largeur */

.home .wp-site-blocks main {
    max-width: none;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

/* Emojis collés sous forme d'images : les ramener à la taille du texte */
img[src*="s.w.org/images/core/emoji"],
img.emoji,
img.wp-smiley {
	width: 1em !important;
	height: 1em !important;
	max-width: 1em !important;
	margin: 0 .1em !important;
	vertical-align: -0.1em !important;
	display: inline !important;
	box-shadow: none !important;
	border: 0 !important;
	background: none !important;
	padding: 0 !important;
}

/* -------------------------------------------------------------------- */
/* Responsive                                                           */
/* -------------------------------------------------------------------- */

@media (max-width: 782px) {

    .bears-friends-navbar {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
        border-radius: 24px;
    }

    /* Header */
    .site-header {
        top: 10px;
        width: calc(100% - 20px);
    }

    .wp-site-blocks {
        padding-top: 90px !important;
    }

    .admin-bar .wp-site-blocks {
        padding-top: 130px !important;
    }

    /* Menu mobile : panneau ouvert */
    .bears-friends-nav .wp-block-navigation__responsive-container.is-menu-open {
        background-color: #f5efe6 !important;
        color: #2e1f16 !important;
        padding: 72px 24px 32px !important;
        overflow-y: auto;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /* Alignement général */
    .bears-friends-nav .is-menu-open .wp-block-navigation__responsive-container-content {
        align-items: flex-start !important;
        padding-top: 0 !important;
    }

    .bears-friends-nav .is-menu-open .wp-block-navigation__container {
        width: 100%;
        align-items: flex-start !important;
        gap: 12px !important;
    }

    /* Rubriques principales */
    .bears-friends-nav .is-menu-open .wp-block-navigation-item {
        width: 100%;
        align-items: flex-start !important;
    }

    .bears-friends-nav .is-menu-open .wp-block-navigation-item__content {
        box-sizing: border-box;
        display: block;
        padding: 2px 10px !important;
        font-size: 1.1rem;
        font-weight: 600;
        line-height: 1.4;
        text-align: left;
        border-radius: 999px !important;
    }

    /* Sous-menus visibles, avec retrait */
    .bears-friends-nav .is-menu-open .wp-block-navigation__submenu-container {
        box-sizing: border-box;
        width: 100%;
        margin: 6px 0 10px !important;
        padding: 0 0 0 18px !important;
        align-items: flex-start !important;
        gap: 4px !important;
        background: transparent !important;
        border: 0 !important;
        border-left: 2px solid #d8c9b8 !important;
    }

    .bears-friends-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        padding: 2px 10px !important;
        font-size: 0.95rem;
        font-weight: 400;
        text-transform: none;
        letter-spacing: normal;
        border-radius: 999px !important;
    }

    /* Page active et survol */
    .bears-friends-nav .is-menu-open .current-menu-item > .wp-block-navigation-item__content,
    .bears-friends-nav .is-menu-open .wp-block-navigation-item__content:hover {
        background-color: #2e1f16 !important;
        color: #ffffff !important;
    }

    /* Indicateur de navigation au clavier */
    .bears-friends-nav .is-menu-open .wp-block-navigation-item__content:focus-visible {
        outline: 2px solid #623804;
        outline-offset: 3px;
    }

    /* Bouton de fermeture */
    .bears-friends-nav .is-menu-open .wp-block-navigation__responsive-container-close {
        position: fixed;
        top: 20px;
        right: 20px;
        padding: 10px;
        color: #2e1f16;
    }

	/* Hero */
    .bears-friends-hero .wp-block-cover__inner-container {
        padding: 1.25rem;
        border-radius: 16px;
    }

	/* Masquer les réseaux sociaux sur smartphone */
    .bears-friends-header-socials {
        display: none !important;
    }

    /* ==========================
       FOOTER MOBILE
    ========================== */

    footer .wp-block-columns {
        flex-direction: column !important;
        gap: 2rem !important;
    }

    footer .wp-block-column {
        width: 100% !important;
        text-align: center !important;
    }

    footer .wp-block-heading,
    footer p {
        text-align: center !important;
    }

    footer .wp-block-navigation {
        justify-content: center !important;
    }

    footer .wp-block-navigation-item__content {
        justify-content: center !important;
        text-align: center !important;
    }

    footer.wp-block-template-part .wp-block-group {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
        box-sizing: border-box !important;
    }
}