/* ==========================================================================
   Dolandie — habillage Cassiopeia
   Reprise du style fedaro_free (preset "default") :
   fond noir, texte blanc, accents rouge #ff0000 (survol #cc0000),
   titres Dosis, texte Roboto, menus déroulants #222327, boutons carrés.
   ========================================================================== */

:root {
	color-scheme: dark;

	/* Palette fedaro */
	--dol-bg: #000000;
	--dol-text: #ffffff;
	--dol-red: #ff0000;
	--dol-red-dark: #cc0000;
	--dol-dropdown-bg: #222327;
	--dol-dropdown-text: #dddddd;
	--dol-muted: #a3a5aa;
	--dol-line: #2a2b30;
	--dol-field-bg: #111111;
	--dol-error-bg: #0e0c1f;

	/* Variables Cassiopeia */
	--cassiopeia-color-primary: var(--dol-bg);
	--cassiopeia-color-hover: var(--dol-red-dark);
	--cassiopeia-color-link: var(--dol-red);
	--cassiopeia-color-brand: var(--dol-text);
	--cassiopeia-font-family-body: "Roboto", Arial, sans-serif;
	--cassiopeia-font-family-headings: "Dosis", Arial, sans-serif;
	--cassiopeia-font-weight-normal: 400;
	--cassiopeia-font-weight-headings: 600;

	/* Variables Bootstrap (préfixe vide dans Joomla) */
	--body-bg: var(--dol-bg);
	--body-bg-rgb: 0, 0, 0;
	--body-color: var(--dol-text);
	--body-color-rgb: 255, 255, 255;
	--body-font-family: var(--cassiopeia-font-family-body);
	--body-font-size: 1rem;
	--link-color: var(--dol-red);
	--link-color-rgb: 255, 0, 0;
	--link-hover-color: var(--dol-red-dark);
	--link-hover-color-rgb: 204, 0, 0;
	--heading-color: var(--dol-text);
	--emphasis-color: var(--dol-text);
	--secondary-color: var(--dol-muted);
	--secondary-bg: var(--dol-field-bg);
	--tertiary-bg: #0b0b0b;
	--border-color: var(--dol-line);
	--focus-ring-color: rgba(255, 0, 0, .35);
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

html,
body,
body.site {
	background: var(--dol-bg);
	color: var(--dol-text);
	font-family: var(--cassiopeia-font-family-body);
	font-size: 16px;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.page-header h1, .page-header h2 {
	font-family: var(--cassiopeia-font-family-headings);
	font-weight: var(--cassiopeia-font-weight-headings);
	color: var(--dol-text);
}

a {
	color: var(--dol-red);
}

a:hover,
a:focus,
a:active {
	color: var(--dol-red-dark);
}

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

hr {
	border-color: var(--dol-line);
	opacity: 1;
}

::selection {
	background: var(--dol-red);
	color: #fff;
}

/* --------------------------------------------------------------------------
   En-tête
   -------------------------------------------------------------------------- */

.container-header {
	background: var(--dol-bg);
	background-image: none;
	box-shadow: none;
}

.container-header .grid-child {
	padding: .5em 1em;
}

.container-header .navbar-brand {
	padding: 0;
}

.container-header .brand-logo img {
	height: 100px;
	width: auto;
	max-height: 100px;
}

.container-header .site-description {
	display: none;
}

.container-header .container-nav {
	padding-bottom: .5em;
}

/* Menu principal — module Menu, mise en page « Default » ou « Collapsible » (J6 : .mod-menu) */
.container-header .mod-menu {
	color: var(--dol-text);
	align-items: center;
}

.container-header .mod-menu > li + li {
	margin-left: 1.5em;
}

.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span,
.container-header .mod-menu > li > button.mod-menu__toggle-sub {
	color: var(--dol-text);
	font-family: var(--cassiopeia-font-family-body);
	font-size: 24px;
	text-decoration: none;
	background: none;
	border: 0;
	padding: 0;
}

.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li > button.mod-menu__toggle-sub:hover,
.container-header .mod-menu > li > button.mod-menu__toggle-sub[aria-expanded="true"],
.container-header .mod-menu > li.active > a,
.container-header .mod-menu > li.active > span,
.container-header .mod-menu > li.active > button,
.container-header .mod-menu > li > a[aria-current="page"] {
	color: var(--dol-red);
	text-decoration: none;
}

/* Pas de soulignement (fedaro n'en a pas) */
.container-header .mod-menu > li:after,
.container-header .mod-menu > li.active:after,
.container-header .mod-menu > li:hover:after {
	display: none;
}

.container-header .mod-menu.mod-list > li > a:hover,
.container-header .mod-menu .mod-menu__sub a:hover {
	text-decoration: none;
}

/* Chevron des parents */
.container-header .mod-menu__toggle-sub .icon-chevron-down {
	font-size: .55em;
	margin-left: .35em;
	vertical-align: middle;
}

/* Sous-menus */
.container-header .mod-menu :where(.mod-menu__sub:not(.mod-menu__sub *)),
.container-header .mod-menu .parent > ul {
	background: var(--dol-dropdown-bg);
	color: var(--dol-dropdown-text);
	min-width: 200px;
	padding: 15px 0;
	box-shadow: 1px 10px 20px rgba(0, 0, 0, .4);
}

.container-header .mod-menu .mod-menu__sub li {
	padding: .35em 25px;
	font-size: 15px;
}

.container-header .mod-menu .mod-menu__sub a,
.container-header .mod-menu .mod-menu__sub span {
	color: var(--dol-dropdown-text);
	text-decoration: none;
}

.container-header .mod-menu .mod-menu__sub a:hover,
.container-header .mod-menu .mod-menu__sub .active > a {
	color: #ffffff;
}

/* Bouton menu mobile (mise en page « Collapsible ») */
.container-header .navbar-toggler {
	color: var(--dol-text);
	border-color: var(--dol-text);
	border-radius: 0;
}

.container-header .navbar-toggler:hover,
.container-header .navbar-toggler:focus,
.container-header .navbar-toggler[aria-expanded="true"] {
	color: var(--dol-red);
	border-color: var(--dol-red);
}

@media (max-width: 991.98px) {
	.container-header .brand-logo img {
		height: 70px;
	}

	.container-header .mod-menu {
		flex-direction: column;
		align-items: flex-start;
	}

	.container-header .mod-menu > li + li {
		margin-left: 0;
	}

	.container-header .mod-menu > li {
		padding: .4em 0;
	}

	.container-header .mod-menu > li > a,
	.container-header .mod-menu > li > span,
	.container-header .mod-menu > li > button.mod-menu__toggle-sub {
		font-size: 20px;
	}

	.container-header .mod-menu :where(.mod-menu__sub:not(.mod-menu__sub *)),
	.container-header .mod-menu .parent > ul {
		position: relative;
		top: 0;
		background: transparent;
		box-shadow: none;
		padding: .25em 0 0 1em;
	}

	.container-header .mod-menu .mod-menu__sub li {
		padding: .3em 0;
	}

	.container-header .mod-menu .mod-menu__sub a {
		color: #919291;
	}
}

/* --------------------------------------------------------------------------
   Contenu
   -------------------------------------------------------------------------- */

.site-grid {
	background: transparent;
}

.page-header {
	border-bottom: 0;
	margin-bottom: 1.5rem;
}

.article-info,
.article-info a,
.article-info-term,
.text-muted,
.small,
small,
.breadcrumb,
.mod-breadcrumbs {
	color: var(--dol-muted);
}

.mod-breadcrumbs a,
.breadcrumb a {
	color: var(--dol-red);
}

/* Titres de section avec puce rouge, comme fedaro */
.com-content-article h2,
.com-content-category-blog h2.item-title,
.blog-item h2 {
	border-left: 5px solid var(--dol-red);
	padding-left: .6em;
}

.blog-item,
.com-content-category-blog__item {
	border-bottom: 1px solid var(--dol-line);
	padding-bottom: 1.5rem;
	margin-bottom: 1.5rem;
}

blockquote {
	border-left: 4px solid var(--dol-red);
	padding-left: 1em;
	color: var(--dol-dropdown-text);
}

/* Cartes / modules */
.card,
.card-body,
.moduletable {
	--card-bg: transparent;
	--card-color: var(--dol-text);
	--card-border-color: var(--dol-line);
	--card-cap-bg: var(--dol-dropdown-bg);
	background: transparent;
	color: var(--dol-text);
}

.card-header {
	font-family: var(--cassiopeia-font-family-headings);
	color: #ffffff;
}

/* Tableaux */
.table {
	--table-color: var(--dol-text);
	--table-bg: transparent;
	--table-border-color: var(--dol-line);
	--table-striped-bg: rgba(255, 255, 255, .04);
	--table-striped-color: var(--dol-text);
	--table-hover-bg: rgba(255, 0, 0, .08);
	--table-hover-color: var(--dol-text);
}

/* Pagination */
.pagination {
	--pagination-color: var(--dol-red);
	--pagination-bg: transparent;
	--pagination-border-color: var(--dol-line);
	--pagination-hover-color: #ffffff;
	--pagination-hover-bg: var(--dol-red);
	--pagination-hover-border-color: var(--dol-red);
	--pagination-focus-color: #ffffff;
	--pagination-focus-bg: var(--dol-red);
	--pagination-active-color: #ffffff;
	--pagination-active-bg: var(--dol-red);
	--pagination-active-border-color: var(--dol-red);
	--pagination-disabled-color: var(--dol-muted);
	--pagination-disabled-bg: transparent;
	--pagination-disabled-border-color: var(--dol-line);
	--pagination-border-radius: 0;
}

/* --------------------------------------------------------------------------
   Boutons (UIkit : carrés, 38px, padding 30px)
   -------------------------------------------------------------------------- */

.btn {
	border-radius: 0;
	padding: 0 30px;
	line-height: 38px;
	font-size: 15px;
}

.btn-primary,
.btn-success {
	--btn-color: #ffffff;
	--btn-bg: var(--dol-red);
	--btn-border-color: var(--dol-red);
	--btn-hover-color: #ffffff;
	--btn-hover-bg: var(--dol-red-dark);
	--btn-hover-border-color: var(--dol-red-dark);
	--btn-active-color: #ffffff;
	--btn-active-bg: var(--dol-red-dark);
	--btn-active-border-color: var(--dol-red-dark);
	--btn-focus-shadow-rgb: 255, 0, 0;
	--btn-disabled-bg: var(--dol-red);
	--btn-disabled-border-color: var(--dol-red);
}

/* Bouton par défaut fedaro : contour rouge, rempli au survol */
.btn-secondary,
.btn-outline-primary,
.btn-outline-secondary,
.btn-light,
.btn-dark {
	--btn-color: var(--dol-red);
	--btn-bg: transparent;
	--btn-border-color: var(--dol-red);
	--btn-hover-color: #ffffff;
	--btn-hover-bg: var(--dol-red);
	--btn-hover-border-color: var(--dol-red);
	--btn-active-color: #ffffff;
	--btn-active-bg: var(--dol-red);
	--btn-active-border-color: var(--dol-red);
	--btn-focus-shadow-rgb: 255, 0, 0;
}

/* --------------------------------------------------------------------------
   Formulaires (connexion CB, contact, Visforms)
   -------------------------------------------------------------------------- */

.form-control,
.form-select,
.custom-select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="number"],
input[type="date"],
textarea,
select {
	background-color: var(--dol-field-bg);
	color: var(--dol-text);
	border: 1px solid #333333;
	border-radius: 0;
}

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus {
	background-color: var(--dol-field-bg);
	color: var(--dol-text);
	border-color: var(--dol-red);
	box-shadow: 0 0 0 .2rem rgba(255, 0, 0, .25);
	outline: 0;
}

.form-control::placeholder,
textarea::placeholder {
	color: #777777;
}

.form-check-input {
	background-color: var(--dol-field-bg);
	border-color: #555555;
}

.form-check-input:checked {
	background-color: var(--dol-red);
	border-color: var(--dol-red);
}

.input-group-text {
	background: var(--dol-dropdown-bg);
	color: var(--dol-text);
	border-color: #333333;
	border-radius: 0;
}

/* Messages système */
.alert {
	border-radius: 0;
}

joomla-alert {
	--jui-alert-border-radius: 0;
}

/* --------------------------------------------------------------------------
   Pied de page
   -------------------------------------------------------------------------- */

.container-footer {
	background: var(--dol-bg);
	background-image: none;
	color: var(--dol-text);
	border-top: 1px solid var(--dol-line);
}

.container-footer .grid-child {
	padding: 10px 1em;
	justify-content: center;
	text-align: center;
	font-size: .9rem;
}

.container-footer a {
	color: var(--dol-red);
}

.container-footer a:hover {
	color: var(--dol-red-dark);
}

.back-to-top-link {
	background-color: var(--dol-dropdown-bg);
	color: #ffffff;
	border: 0;
	border-radius: 50%;
}

.back-to-top-link:hover,
.back-to-top-link:focus {
	background-color: var(--dol-red);
	color: #ffffff;
	border: 0;
}

/* --------------------------------------------------------------------------
   Page d'erreur (fond fedaro #0e0c1f)
   -------------------------------------------------------------------------- */

body.error_site,
body.error_site .container-header,
body.error_site .container-footer {
	background: var(--dol-error-bg);
}

/* --------------------------------------------------------------------------
   Bandeau cookies (media/js/user.js)
   -------------------------------------------------------------------------- */

#dol-cookie {
	position: fixed;
	left: 1rem;
	bottom: 1rem;
	z-index: 10001;
	max-width: 420px;
	padding: 1rem 1.25rem;
	background: var(--dol-dropdown-bg);
	color: var(--dol-text);
	border-left: 4px solid var(--dol-red);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .6);
	font-size: .9rem;
}

#dol-cookie p {
	margin: 0 0 .75rem;
}

@media (max-width: 575.98px) {
	#dol-cookie {
		left: .5rem;
		right: .5rem;
		bottom: .5rem;
		max-width: none;
	}
}

@media (min-width: 992px) {
	.container-header {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 2rem;
	}

	.container-header > .grid-child {
		margin: 0;
		max-width: none;
		width: auto;
	}

	.container-header .container-nav {
		padding-bottom: 0;
	}
}
