/*
 * Thème Jarnoux du back office, d'après bernard-jarnoux-crepier.com : jaune de marque #ffbb15
 * (survol #efa900), brun #341e0f pour le texte, crème #f8ede3 pour les fonds, Montserrat pour le
 * texte et Caveat Brush pour les titres. Mêmes choix que le thème de l'application mobile
 * (mobile-application-theme.css).
 *
 * Branché par appsettings.json (BackOfficeTheme:Stylesheet) et chargé en dernier par _ThemeCss,
 * après salto-theme.css, kendo-theme.css et les couleurs calculées par la palette
 * (BackOfficeTheme:Primary / Accent) : ce fichier ne fait que les ajuster au site. La police du
 * texte est posée par BackOfficeTheme:Font.
 *
 * Couleurs et polices seulement : aucune hauteur ne change, les vues (calc(100vh - Npx)) en
 * dépendent. Le titre de page garde la hauteur de ligne du h5 de Bootstrap.
 *
 * Polices hébergées par le host (wwwroot/fonts, licence SIL OFL 1.1 : OFL-*.txt), partagées avec
 * l'application mobile.
 */

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/montserrat-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Caveat Brush";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/caveat-brush-latin.woff2") format("woff2");
}

:root {
  --jarnoux-brown: #341e0f;
  --jarnoux-brown-muted: #7a6a5c;
  --jarnoux-cream: #f8ede3;
  --jarnoux-cream-strong: #f1e2d2;
  --jarnoux-line: #efe2d3;
  --jarnoux-yellow-pastel: #ffe8ad;
  --jarnoux-title-font: "Caveat Brush", "Montserrat", Arial, cursive;

  /* Sur le jaune, texte brun (la palette choisirait le noir) ; survol assombri comme sur le site
     (la palette éclaircirait un primaire clair). */
  --salto-primary-on: var(--jarnoux-brown);
  --salto-primary-hover: #efa900;
  --salto-primary-hover-on: var(--jarnoux-brown);
  --salto-primary-hover-border: #efa900;
  --salto-primary-active: #e3a100;
  --salto-primary-active-on: var(--jarnoux-brown);
  --salto-primary-active-border: #e3a100;
  /* mix(brun, jaune, 15 %), comme Bootstrap pour l'anneau de focus des boutons. */
  --salto-primary-focus-shadow-rgb: 225, 164, 20;
  --salto-primary-emphasis: var(--jarnoux-brown);

  /* Texte « primaire » (liens, titres, .text-primary) en brun, comme sur le site. */
  --salto-primary-text: var(--jarnoux-brown);
  --salto-primary-text-rgb: 52, 30, 15;
  --salto-primary-text-hover: #2a180c;
  --salto-primary-text-hover-rgb: 42, 24, 12;

  /* Bandeau du logo (logo blanc) : brun du site. */
  --salto-primary-brand: var(--jarnoux-brown);

  --bs-body-color: var(--jarnoux-brown);
  --bs-body-color-rgb: 52, 30, 15;
  --bs-emphasis-color: var(--jarnoux-brown);
  --bs-heading-color: var(--jarnoux-brown);
  --bs-secondary-color: rgba(52, 30, 15, .7);
  --bs-border-color: var(--jarnoux-line);
}

/* Connexion, profil et page non autorisée (pages sans shell) : fond crème. */
body:not(:has(#layoutSidenav)),
.salto-standalone {
  background-color: var(--jarnoux-cream);
}

.salto-standalone-footer {
  border-top-color: var(--jarnoux-line);
}

.salto-standalone-box p {
  color: var(--jarnoux-brown-muted);
}

/* Titres : Caveat Brush, plus grand, sur la même hauteur de ligne que le h5 de Bootstrap (21 px). */
.salto-page-title h5 {
  font-family: var(--jarnoux-title-font);
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.3125rem;
}

.salto-standalone-box h4 {
  font-family: var(--jarnoux-title-font);
  font-size: 2rem;
  font-weight: 400;
}

/* Bandeau du logo (brun, --salto-primary-brand) : signature du logo du site en crème
   (images/logo_backoffice_mini.png, tirée du SVG de l'en-tête de bernard-jarnoux-crepier.com).
   Barre repliée en rail (64 px) : le personnage seul (images/logo_backoffice_rail.png). */
@media (min-width: 992px) {
  body.sidenav-toggled .sidenav-brand img {
    content: url("/images/logo_backoffice_rail.png");
  }
}

/* Zone de contenu : crème très clair au lieu du gris du shell ; grilles et panneaux restent blancs. */
#layoutSidenav #layoutSidenav_content {
  background-color: #fcf8f4;
}

#sidebar {
  border-color: var(--jarnoux-line);
}

/* Barre du haut : blanche, trait chaud. */
.topnav {
  border-bottom-color: var(--jarnoux-line);
}

/* Barre latérale claire : crème, texte brun, rubrique active en jaune pâle. */
.sidenav-light {
  color: var(--jarnoux-brown);
  background-color: var(--jarnoux-cream);
  border-right-color: var(--jarnoux-line);
}

.sidenav-light .sidenav-menu .sidenav-menu-heading {
  color: var(--jarnoux-brown-muted);
}

.sidenav-light .sidenav-menu .sidenav-menu-heading[data-bs-toggle],
.sidenav-light .sidenav-menu .nav-link {
  color: var(--jarnoux-brown);
}

.sidenav-light .sidenav-menu .sidenav-menu-heading[data-bs-toggle] .nav-link-icon,
.sidenav-light .sidenav-menu .sidenav-menu-heading[data-bs-toggle] .chevron-icon,
.sidenav-light .sidenav-menu .nav-link .nav-link-icon,
.sidenav-light .sidenav-menu .nav-link .chevron-icon {
  color: var(--jarnoux-brown-muted);
}

.sidenav-light .sidenav-menu .sidenav-menu-heading[data-bs-toggle]:hover,
.sidenav-light .sidenav-menu .nav-link:hover {
  background-color: var(--jarnoux-cream-strong);
}

.sidenav-light .sidenav-menu .nav-link.active {
  color: var(--jarnoux-brown);
  background-color: var(--jarnoux-yellow-pastel);
}

.sidenav-light .sidenav-menu .nav-link.active .nav-link-icon,
.sidenav-light .sidenav-menu .sidenav-menu-heading[data-bs-toggle].active,
.sidenav-light .sidenav-menu .sidenav-menu-heading[data-bs-toggle].active .nav-link-icon {
  color: var(--jarnoux-brown);
}

/* Boutons secondaires (filtres) : crème au lieu du gris. */
.btn-secondary {
  --bs-btn-color: var(--jarnoux-brown);
  --bs-btn-bg: var(--jarnoux-cream);
  --bs-btn-border-color: var(--jarnoux-cream-strong);
  --bs-btn-hover-color: var(--jarnoux-brown);
  --bs-btn-hover-bg: var(--jarnoux-cream-strong);
  --bs-btn-hover-border-color: var(--jarnoux-cream-strong);
  --bs-btn-active-color: var(--jarnoux-brown);
  --bs-btn-active-bg: var(--jarnoux-cream-strong);
  --bs-btn-active-border-color: var(--jarnoux-cream-strong);
  --bs-btn-disabled-color: var(--jarnoux-brown);
  --bs-btn-disabled-bg: var(--jarnoux-cream);
  --bs-btn-disabled-border-color: var(--jarnoux-cream);
}

.card {
  --bs-card-border-color: var(--jarnoux-line);
}

/* Kendo : texte brun, en-têtes crème, traits chauds (kendo-theme.css les veut neutres). */
.k-widget,
.k-block,
.k-panel,
.k-content,
.k-popup,
.k-window {
  color: var(--jarnoux-brown);
}

.k-grouping-header,
.k-grid-header,
.k-grid-footer,
.k-grouping-row,
.k-group-cell,
.k-calendar .k-alt {
  border-color: var(--jarnoux-line);
  color: var(--jarnoux-brown);
  background-color: var(--jarnoux-cream);
}

/* En-tête des colonnes (thead) blanc pour tous les clients, comme kendo-theme.css : un en-tête
   teinté se confond avec le fond du contenu. */
.k-grouping-header,
.k-grid-header {
  background-color: #fff;
}

.k-grid-toolbar,
.k-toolbar,
.k-pager-wrap,
.k-grid-pager {
  border-color: var(--jarnoux-line);
  color: var(--jarnoux-brown);
}

.k-tabstrip-items .k-item {
  color: var(--jarnoux-brown-muted);
}

.k-calendar .k-header,
.k-calendar .k-content th {
  color: var(--jarnoux-brown);
}