/* -------------------------------
Fichier : Styles généraux du thème light_Bordeaux
Version : 3.1.0
Mise à jour : 12/09/2026
Description : Définit les variables visuelles communes du thème.
Créé par : Jijo64, documentation par Codex

Historique :
- 3.1.0 : agrandit le logo et renforce les fondations responsive, tactiles et modales du thème.
- 3.0.0 : compose la nouvelle signature RED avec un emblème responsive et un nom toujours net.
- 2.2.0 : habille les contenus Markdown et le plan du site humain responsive.
- 2.3.0 : transforme le logo opaque en signature visuelle responsive du header.
- 2.4.0 : adapte les espacements et composants directionnels aux interfaces RTL.
-------------------------------- */

/* Variables de thème (messagerie) */
:root {
	--messagerie-active-bg: #8b1538;
	--messagerie-active-color: #fff;
	--messagerie-active-muted: rgba(255, 255, 255, 0.85);
	--racinged-bordeaux: #842029;
	--racinged-bordeaux-fonce: #58151c;
	--racinged-fond-doux: #f8f5f5;
}

html { max-width: 100%; scroll-padding-top: 7rem; }
body { max-width: 100%; background: var(--bs-body-bg); overflow-wrap: break-word; }
main, .main-wrap, .main-wrap > *, .row > * { min-width: 0; }
.main-wrap > main > .container { max-width: 100%; padding-inline: 0; }
img, svg, video, canvas { max-width: 100%; }
.card, .modal-content { min-width: 0; }
.table-responsive { scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.breadcrumb { flex-wrap: nowrap; overflow-x: auto; padding-block-end: .2rem; white-space: nowrap; scrollbar-width: thin; }
.dropdown-menu { max-width: calc(100vw - 1.5rem); overflow-wrap: anywhere; }
.site-header { position: sticky; top: 0; z-index: 1030; background: color-mix(in srgb, var(--bs-body-bg) 94%, var(--racinged-bordeaux) 6%); box-shadow: 0 .25rem 1.25rem rgb(0 0 0 / 5%); }
.site-identite { margin-right: clamp(.75rem, 2vw, 2rem); padding: 0; border-radius: 1rem; }
.site-logo-cadre { display: flex; box-sizing: border-box; width: clamp(15.5rem, 19vw, 18rem); min-height: 4.65rem; align-items: center; gap: .55rem; overflow: hidden; padding: .25rem .8rem .25rem .4rem; background: #fff; border: 1px solid rgb(132 32 41 / 18%); border-radius: 1rem; box-shadow: 0 .35rem 1rem rgb(88 21 28 / 12%); transition: transform .18s ease, box-shadow .18s ease; }
.site-identite:hover .site-logo-cadre, .site-identite:focus-visible .site-logo-cadre { transform: translateY(-1px); box-shadow: 0 .55rem 1.25rem rgb(88 21 28 / 20%); }
.site-identite:focus-visible { outline: .2rem solid color-mix(in srgb, var(--racinged-bordeaux) 50%, transparent); outline-offset: .2rem; }
.site-logo { display: block; width: 5.25rem; height: 4.55rem; flex: 0 0 auto; object-fit: contain; }
.site-marque { display: flex; min-width: 0; flex-direction: column; color: #171717; font-style: italic; line-height: 1; letter-spacing: -.025em; text-transform: uppercase; }
.site-marque strong { font-size: clamp(.82rem, .9vw, .96rem); font-weight: 850; white-space: nowrap; }
.site-marque small { margin-top: .25rem; color: var(--racinged-bordeaux); font-size: .72rem; font-weight: 800; letter-spacing: .2em; }
.site-header .nav-link { position: relative; color: var(--bs-body-color); font-weight: 650; border-radius: .55rem; padding-inline: .85rem !important; }
.site-header .nav-link:hover, .site-header .nav-link:focus-visible, .site-header .nav-link.active { color: var(--racinged-bordeaux); background: rgb(132 32 41 / 9%); }
.accueil-public { background: radial-gradient(circle at 90% 10%, rgb(132 32 41 / 13%), transparent 35%), var(--racinged-fond-doux); }
.accueil-hero { color: #fff; background: linear-gradient(135deg, var(--racinged-bordeaux), var(--racinged-bordeaux-fonce)); }
.accueil-espace { transition: transform .18s ease, box-shadow .18s ease; }
.accueil-espace:hover, .accueil-espace:focus-visible { transform: translateY(-3px); box-shadow: 0 .8rem 1.8rem rgb(0 0 0 / 14%) !important; }
.site-footer { background: color-mix(in srgb, var(--bs-body-bg) 96%, var(--racinged-bordeaux) 4%); }
.reseaux-sociaux__lien { display: inline-grid; width: 2.6rem; height: 2.6rem; place-items: center; border-radius: 50%; font-size: 1.15rem; }
.reseaux-sociaux__lien:hover, .reseaux-sociaux__lien:focus-visible { color: #fff; background: var(--racinged-bordeaux); border-color: var(--racinged-bordeaux); }
.page-institutionnelle-hero { color: #fff; background: linear-gradient(135deg, var(--racinged-bordeaux), var(--racinged-bordeaux-fonce)); }
.contenu-markdown { line-height: 1.75; overflow-wrap: anywhere; }
.contenu-markdown > :first-child { margin-top: 0; }
.contenu-markdown > :last-child { margin-bottom: 0; }
.contenu-markdown h2, .contenu-markdown h3, .contenu-markdown h4, .contenu-markdown h5 { color: var(--racinged-bordeaux); margin-block: 1.6em .65em; }
.contenu-markdown blockquote { margin: 1.25rem 0; padding: .9rem 1.15rem; border-inline-start: .3rem solid var(--racinged-bordeaux); background: color-mix(in srgb, var(--bs-body-bg) 91%, var(--racinged-bordeaux) 9%); border-radius: 0 .6rem .6rem 0; }
.contenu-markdown code { color: var(--racinged-bordeaux); background: color-mix(in srgb, var(--bs-body-bg) 88%, var(--racinged-bordeaux) 12%); padding: .1rem .3rem; border-radius: .25rem; }
.plan-site-carte { transition: transform .18s ease, box-shadow .18s ease; }
.plan-site-carte:hover, .plan-site-carte:focus-visible { transform: translateY(-3px); box-shadow: 0 .8rem 1.8rem rgb(0 0 0 / 14%) !important; }
.plan-site-icone { display: inline-grid; min-width: 2.8rem; height: 2.8rem; place-items: center; color: #fff; background: var(--racinged-bordeaux); border-radius: .8rem; font-size: 1.2rem; }
.administration-apercu-markdown { min-height: 28rem; max-height: 42rem; overflow: auto; }
[dir="rtl"] .site-identite { margin-right: 0; margin-left: clamp(.75rem, 2vw, 2rem); }
[dir="rtl"] .dropdown-menu { text-align: right; }
[dir="rtl"] .contenu-markdown blockquote { border-inline-start: .3rem solid var(--racinged-bordeaux); border-radius: .6rem 0 0 .6rem; }

@media (prefers-reduced-motion: reduce) {
	.site-logo-cadre { transition: none; }
	.site-identite:hover .site-logo-cadre { transform: none; }
	.accueil-espace { transition: none; }
	.accueil-espace:hover { transform: none; }
	.plan-site-carte { transition: none; }
	.plan-site-carte:hover { transform: none; }
}

/* La navigation complète reste réservée aux grands écrans ; tablette et mobile utilisent le menu tactile. */
@media (max-width: 1199.98px) {
	.site-header .navbar-collapse { margin-top: .75rem; padding: .75rem; background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .85rem; box-shadow: 0 .75rem 1.75rem rgb(0 0 0 / 9%); }
	.site-header .navbar-collapse > .d-flex { align-items: stretch; flex-direction: column; }
	.site-header .navbar-nav { width: 100%; margin-inline: 0 !important; }
	.site-header .navbar-collapse .nav-link { display: flex; min-height: 2.75rem; align-items: center; }
	.site-header .navbar-collapse .ms-auto { width: 100%; margin-inline: 0 !important; flex-wrap: wrap; }
	.site-header .navbar-collapse .nav-item.dropdown { flex: 1 1 10rem; }
	.site-header .navbar-collapse .dropdown > .btn { width: 100%; min-height: 2.75rem; }
}

/* Les cibles atteignent au moins 44 px sur les écrans principalement tactiles. */
@media (pointer: coarse) {
	.btn, .nav-link, .dropdown-item, .form-check-input, summary { min-height: 2.75rem; }
	.btn, .nav-link, .dropdown-item { display: inline-flex; align-items: center; justify-content: center; }
}

@media (max-width: 767.98px) {
	body > main > .container { padding: 1rem .75rem !important; }
	main .display-1, main .display-2, main .display-3, main .display-4, main .display-5, main .display-6 { font-size: clamp(2rem, 9vw, 2.75rem); }
	.modal-dialog { margin: .5rem; }
	.modal-content { max-height: calc(100dvh - 1rem); }
	.modal-body { overflow-y: auto; }
	.modal-footer { align-items: stretch; flex-direction: column; }
	.modal-footer > .btn, .modal-footer > form, .modal-footer > .d-flex { width: 100%; margin-inline: 0; }
	.modal-footer > form > .btn { width: 100%; }
	.pagination { flex-wrap: wrap; }
}

@media (max-width: 575.98px) {
	.site-logo-cadre { width: 5.75rem; min-height: 4.4rem; justify-content: center; padding: .2rem; border-radius: .8rem; }
	.site-logo { width: 5rem; height: 4.15rem; }
	.site-marque { display: none; }
	.site-identite { margin-right: .5rem; }
	.form-control, .form-select { font-size: 1rem; }
	.breadcrumb { font-size: .85rem; }
	.alert { padding: .85rem; }
	[dir="rtl"] .site-identite { margin-right: 0; margin-left: .5rem; }
}