/* ================================================================
   THIAROYE 44 — AtoM Custom Theme
   Palette inspirée de thiaroye44.isfad-ucad.online
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,600&family=DM+Sans:wght@300;400;500;600&display=swap');

/* ── Variables couleurs ─────────────────────────────────────── */
:root {
  --th-or:        #C8952C;
  --th-or-clair:  #E8B850;
  --th-or-fonce:  #9B7020;
  --th-or-pale:   #F5E8C0;
  --th-rouge:     #8B1A1A;
  --th-nuit:      #0C0603;
  --th-nuit-2:    #1A0D06;
  --th-nuit-3:    #2A1A0E;
  --th-ivoire:    #FAF6EE;
  --th-ivoire-2:  #EDE7D8;
  --th-vert:      #1D5C38;
  --th-bordure:   #D8CAAF;
  --th-texte:     #1C1008;
  --th-serif:     'Cormorant Garamond', Georgia, serif;
  --th-sans:      'DM Sans', 'Helvetica Neue', Arial, sans-serif;
}

/* ── Typographie de base ────────────────────────────────────── */
body {
  font-family: var(--th-sans) !important;
  background-color: var(--th-ivoire) !important;
  color: var(--th-texte) !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--th-serif) !important;
  font-weight: 600 !important;
  color: var(--th-nuit-2) !important;
}

/* ── Navbar / En-tête ───────────────────────────────────────── */
#top-bar {
  background-color: var(--th-nuit) !important;
  border-bottom: 2px solid var(--th-or) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,.4) !important;
}

/* Bande tricolore sénégalaise sous la navbar */
#top-bar::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -5px;
  left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg,
    var(--th-vert)  33.33%,
    var(--th-or)    33.33%, var(--th-or)   66.66%,
    var(--th-rouge) 66.66%);
}

/* Logo / Titre dans la navbar */
.navbar-brand, .navbar-brand span {
  color: var(--th-ivoire) !important;
  font-family: var(--th-serif) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  letter-spacing: .03em !important;
}
.navbar-brand:hover { color: var(--th-or) !important; }

/* Liens navbar */
.navbar-dark .navbar-nav .nav-link,
#top-bar .nav-link {
  color: rgba(250,246,238,.75) !important;
  font-family: var(--th-sans) !important;
  font-size: .85rem !important;
  font-weight: 500 !important;
  transition: color .2s ease !important;
}
.navbar-dark .navbar-nav .nav-link:hover,
#top-bar .nav-link:hover {
  color: var(--th-or) !important;
}
.navbar-dark .navbar-nav .nav-link.active,
#top-bar .nav-link.active {
  color: var(--th-or-clair) !important;
}

/* Dropdown menus */
.dropdown-menu {
  background-color: var(--th-nuit-2) !important;
  border: 1px solid rgba(200,149,44,.3) !important;
  border-radius: 6px !important;
}
.dropdown-item {
  color: rgba(250,246,238,.8) !important;
  font-size: .85rem !important;
}
.dropdown-item:hover, .dropdown-item:focus {
  background-color: rgba(200,149,44,.15) !important;
  color: var(--th-or-clair) !important;
}
.dropdown-divider { border-color: rgba(200,149,44,.2) !important; }

/* Bouton hamburger mobile */
.navbar-toggler {
  border-color: rgba(200,149,44,.4) !important;
  color: var(--th-or) !important;
}

/* ── Barre de recherche ─────────────────────────────────────── */
#search-box input[type="text"],
.search-box input {
  background-color: rgba(255,255,255,.1) !important;
  border-color: rgba(200,149,44,.4) !important;
  color: var(--th-ivoire) !important;
  border-radius: 4px !important;
}
#search-box input[type="text"]::placeholder { color: rgba(250,246,238,.4) !important; }
#search-box input[type="text"]:focus {
  background-color: rgba(255,255,255,.15) !important;
  border-color: var(--th-or) !important;
  box-shadow: 0 0 0 3px rgba(200,149,44,.25) !important;
}
#search-box .btn, .search-box .btn {
  background-color: var(--th-or) !important;
  border-color: var(--th-or) !important;
  color: var(--th-nuit) !important;
  font-weight: 600 !important;
}
#search-box .btn:hover { background-color: var(--th-or-clair) !important; }

/* ── Contenu principal ──────────────────────────────────────── */
#wrapper, #main-column {
  background-color: transparent !important;
}

/* ── Boutons ────────────────────────────────────────────────── */
.btn-primary, .atom-btn-primary {
  background-color: var(--th-or) !important;
  border-color: var(--th-or-fonce) !important;
  color: var(--th-nuit) !important;
  font-weight: 600 !important;
  font-family: var(--th-sans) !important;
}
.btn-primary:hover, .atom-btn-primary:hover {
  background-color: var(--th-or-clair) !important;
  border-color: var(--th-or) !important;
}
.btn-secondary, .atom-btn-secondary {
  background-color: var(--th-nuit-3) !important;
  border-color: rgba(200,149,44,.3) !important;
  color: var(--th-ivoire) !important;
}
.btn-secondary:hover { background-color: var(--th-nuit-2) !important; }

.btn-link {
  color: var(--th-or-fonce) !important;
  text-decoration: none !important;
}
.btn-link:hover { color: var(--th-or) !important; text-decoration: underline !important; }

/* ── Liens ──────────────────────────────────────────────────── */
a { color: var(--th-or-fonce) !important; }
a:hover { color: var(--th-or) !important; }

/* ── Fil d'Ariane ───────────────────────────────────────────── */
.breadcrumb {
  background-color: var(--th-nuit-2) !important;
  border-radius: 6px !important;
  padding: .6rem 1rem !important;
}
.breadcrumb-item a { color: var(--th-or) !important; }
.breadcrumb-item.active { color: var(--th-or-pale) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--th-or-fonce) !important; }

/* ── Cartes / Cards ─────────────────────────────────────────── */
.card {
  border-color: var(--th-bordure) !important;
  background-color: #fff !important;
  box-shadow: 0 2px 12px rgba(12,6,3,.08) !important;
  border-radius: 8px !important;
}
.card-header {
  background-color: var(--th-nuit-2) !important;
  border-bottom-color: var(--th-or-fonce) !important;
  color: var(--th-ivoire) !important;
  font-family: var(--th-serif) !important;
  font-size: 1.1rem !important;
}
.card-header a { color: var(--th-or-clair) !important; }

/* ── Accordion (Description archivistique) ──────────────────── */
.accordion-button {
  background-color: var(--th-ivoire-2) !important;
  color: var(--th-nuit-2) !important;
  font-family: var(--th-serif) !important;
  font-weight: 600 !important;
  font-size: 1.05rem !important;
  border-bottom: 1px solid var(--th-bordure) !important;
}
.accordion-button:not(.collapsed) {
  background-color: var(--th-nuit-2) !important;
  color: var(--th-or-clair) !important;
}
.accordion-button::after {
  filter: brightness(0) saturate(100%) invert(70%) sepia(60%) saturate(500%) hue-rotate(5deg) !important;
}
.accordion-item { border-color: var(--th-bordure) !important; }
.accordion-body {
  background-color: #fff !important;
  font-size: .95rem !important;
  line-height: 1.75 !important;
}

/* ── Tableau de métadonnées (ISAD/G) ───────────────────────── */
table.table th {
  background-color: var(--th-nuit-2) !important;
  color: var(--th-or-pale) !important;
  font-family: var(--th-sans) !important;
  font-size: .75rem !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  border-color: var(--th-nuit-3) !important;
}
table.table td {
  border-color: var(--th-bordure) !important;
  font-size: .92rem !important;
  line-height: 1.65 !important;
}
table.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(250,246,238,.6) !important;
}

/* ── Liste des résultats de recherche ───────────────────────── */
.search-results .hit, .list-group-item {
  border-color: var(--th-bordure) !important;
  transition: background .2s ease !important;
}
.list-group-item:hover {
  background-color: var(--th-or-pale) !important;
}
.list-group-item-action {
  color: var(--th-texte) !important;
}
.list-group-item h3, .list-group-item h4 {
  font-family: var(--th-serif) !important;
  color: var(--th-rouge) !important;
}

/* ── Tree view (hiérarchie des fonds) ──────────────────────── */
.treeview a {
  color: var(--th-or-fonce) !important;
  font-size: .88rem !important;
}
.treeview a:hover { color: var(--th-or) !important; }
.treeview .current > a {
  color: var(--th-rouge) !important;
  font-weight: 600 !important;
}
#treeview-sidebar {
  border-right: 2px solid var(--th-bordure) !important;
}

/* ── Pagination ─────────────────────────────────────────────── */
.pagination .page-link {
  color: var(--th-or-fonce) !important;
  border-color: var(--th-bordure) !important;
  background-color: #fff !important;
}
.pagination .page-link:hover {
  background-color: var(--th-or-pale) !important;
  border-color: var(--th-or) !important;
  color: var(--th-or-fonce) !important;
}
.pagination .page-item.active .page-link {
  background-color: var(--th-or) !important;
  border-color: var(--th-or) !important;
  color: var(--th-nuit) !important;
}

/* ── Alertes et badges ──────────────────────────────────────── */
.badge.bg-primary { background-color: var(--th-or) !important; color: var(--th-nuit) !important; }
.badge.bg-secondary { background-color: var(--th-nuit-3) !important; }

/* ── Section héro / Homepage ────────────────────────────────── */
.homepage-hero, .jumbotron, [class*="jumbotron"],
.homepage .container-fluid:first-child,
.homepage .hero {
  background: linear-gradient(135deg, var(--th-nuit) 0%, var(--th-nuit-2) 60%, var(--th-nuit-3) 100%) !important;
  color: var(--th-ivoire) !important;
  padding: 4rem 2rem !important;
  border-bottom: 3px solid var(--th-or) !important;
}

/* ── Pied de page ───────────────────────────────────────────── */
footer, #footer {
  background-color: var(--th-nuit) !important;
  color: rgba(250,246,238,.6) !important;
  border-top: 2px solid var(--th-or-fonce) !important;
  margin-top: 3rem !important;
  padding: 2rem !important;
  font-size: .82rem !important;
}
footer a { color: var(--th-or) !important; }
footer a:hover { color: var(--th-or-clair) !important; }

/* Bande drapeau sénégalais en bas du pied */
footer::before {
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg,
    var(--th-vert) 33.33%,
    var(--th-or)   33.33%, var(--th-or) 66.66%,
    var(--th-rouge) 66.66%);
  margin-bottom: 1.5rem;
}

/* ── Formulaires ────────────────────────────────────────────── */
.form-control:focus {
  border-color: var(--th-or) !important;
  box-shadow: 0 0 0 3px rgba(200,149,44,.2) !important;
}
.form-label {
  font-weight: 600 !important;
  font-size: .82rem !important;
  letter-spacing: .05em !important;
  color: var(--th-nuit-3) !important;
}
select.form-select:focus {
  border-color: var(--th-or) !important;
  box-shadow: 0 0 0 3px rgba(200,149,44,.2) !important;
}

/* ── Icône de niveau (arbre) ─────────────────────────────────── */
.level-of-description {
  background-color: var(--th-or) !important;
  color: var(--th-nuit) !important;
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  padding: .2rem .5rem !important;
  border-radius: 3px !important;
}

/* ── Section titre de page ──────────────────────────────────── */
.page-header, h1.print-only {
  border-bottom: 2px solid var(--th-bordure) !important;
  padding-bottom: .75rem !important;
  margin-bottom: 1.5rem !important;
  font-family: var(--th-serif) !important;
}

/* ── Indicateur de statut / Description ─────────────────────── */
.description-status {
  font-size: .75rem !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--th-or-fonce) !important;
}

/* ── Scrollbar personnalisée ─────────────────────────────────── */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--th-ivoire-2); }
::-webkit-scrollbar-thumb { background: var(--th-or-fonce); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--th-or); }

/* ── Background global ──────────────────────────────────────── */
body.informationobject, body.repository, body.actor {
  background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23C8952C' fill-opacity='0.03'%3E%3Crect x='0' y='0' width='10' height='10'/%3E%3Crect x='20' y='0' width='10' height='10'/%3E%3Crect x='10' y='10' width='10' height='10'/%3E%3Crect x='30' y='10' width='10' height='10'/%3E%3Crect x='0' y='20' width='10' height='10'/%3E%3Crect x='20' y='20' width='10' height='10'/%3E%3Crect x='10' y='30' width='10' height='10'/%3E%3Crect x='30' y='30' width='10' height='10'/%3E%3C/g%3E%3C/svg%3E") !important;
}

/* ── Logo Thiaroye 44 dans la navbar ─────────────── */
.navbar-brand img {
  height: 48px !important;
  width: 48px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  box-shadow: 0 0 0 2px rgba(200,149,44,.4) !important;
  transition: box-shadow .3s ease !important;
}
.navbar-brand:hover img {
  box-shadow: 0 0 0 3px rgba(200,149,44,.8) !important;
}
/* Titre site à côté du logo */
.navbar-brand span {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--th-ivoire) !important;
  letter-spacing: .04em !important;
}