/* ==========================================================================
   Thème OECCA — habillage élégant/premium posé au-dessus de bootstrap.min.css
   et style.css. Ne redéfinit que l'apparence des composants Bootstrap déjà
   utilisés partout (cards, boutons, tableaux, formulaires, badges,
   dropdowns, modales, breadcrumb, pagination) : aucun markup ni JS à
   modifier dans les pages qui en héritent. Les couleurs sémantiques
   (succès/danger/warning, badges de statut métier) ne sont pas touchées.
   Charger APRÈS bootstrap.min.css et style.css.
   ========================================================================== */

:root {
    --oecca-navy: #02254F;
    --oecca-navy-dark: #011933;
    --oecca-navy-light: #0B3A6E;
    --oecca-gold: #C7A14F;
    --oecca-gold-dark: #A9863D;
    --oecca-gold-tint: rgba(199, 161, 79, .12);
    --oecca-paper: #F7F5F1;
    --oecca-surface: #FFFFFF;
    --oecca-ink: #1C2430;
    --oecca-ink-muted: #5B6472;
    --oecca-line: #E5E0D5;
    --oecca-radius: 14px;
    --oecca-radius-sm: 8px;
    --oecca-shadow-sm: 0 1px 2px rgba(2, 37, 79, .06);
    --oecca-shadow: 0 1px 3px rgba(2, 37, 79, .05), 0 10px 28px rgba(2, 37, 79, .08);
    --oecca-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
    --oecca-font-body: 'Public Sans', 'Arial Nova', Arial, Helvetica, sans-serif;
}

/* ---------- Typographie & fond de page ---------- */

body {
    background-color: var(--oecca-paper);
    color: var(--oecca-ink);
    font-family: var(--oecca-font-body);
}

h1, h2, h3, .h1, .h2, .h3 {
    font-family: var(--oecca-font-display);
    font-weight: 600;
    color: var(--oecca-navy);
    letter-spacing: -.01em;
}

.content {
    background-color: var(--oecca-paper) !important;
}

/* ---------- Boutons ---------- */

.btn {
    border-radius: var(--oecca-radius-sm);
    font-weight: 600;
    letter-spacing: .01em;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.btn-primary {
    box-shadow: var(--oecca-shadow-sm);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--oecca-navy-dark);
    border-color: var(--oecca-navy-dark);
}

.btn-gold:hover, .btn-gold:focus {
    background-color: var(--oecca-gold-dark);
    border-color: var(--oecca-gold-dark);
}

.btn-lg-square, .btn-square, .btn-sm-square {
    box-shadow: var(--oecca-shadow);
}

/* ---------- Cards ---------- */

.card {
    border: 1px solid var(--oecca-line);
    border-radius: var(--oecca-radius);
    box-shadow: var(--oecca-shadow-sm);
}

.card-header {
    background-color: transparent;
    border-bottom: 1px solid var(--oecca-line);
    font-weight: 600;
}

/* ---------- Tableaux ---------- */

.table thead th {
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .07em;
    font-weight: 700;
    color: var(--oecca-ink-muted);
    background-color: transparent;
    border-bottom: 2px solid var(--oecca-gold);
}

.table td, .table th {
    vertical-align: middle;
}

/* ---------- Formulaires ---------- */

.form-control, .form-select {
    border-radius: var(--oecca-radius-sm);
    border-color: var(--oecca-line);
}

.form-control:focus, .form-select:focus {
    border-color: var(--oecca-gold);
    box-shadow: 0 0 0 .2rem var(--oecca-gold-tint);
}

.form-label {
    font-weight: 600;
    color: var(--oecca-ink);
}

/* ---------- Badges ---------- */

.badge {
    font-weight: 600;
    letter-spacing: .01em;
    border-radius: 6px;
    padding: .42em .65em;
}

/* ---------- Breadcrumb ---------- */

.breadcrumb {
    background-color: transparent;
    padding-left: 0;
    font-size: .85rem;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: "\203A";
    color: var(--oecca-gold);
    font-weight: 700;
}

.breadcrumb-item.active {
    color: var(--oecca-ink-muted);
}

/* ---------- Dropdowns ---------- */

.dropdown-menu {
    border: 1px solid var(--oecca-line);
    border-radius: var(--oecca-radius-sm);
    box-shadow: var(--oecca-shadow);
    padding: .5rem;
}

.dropdown-item {
    border-radius: 6px;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--oecca-gold-tint);
    color: var(--oecca-navy);
}

/* ---------- Modales ---------- */

.modal-content {
    border: none;
    border-radius: var(--oecca-radius);
    box-shadow: var(--oecca-shadow);
}

.modal-header {
    border-bottom: 1px solid var(--oecca-line);
}

.modal-footer {
    border-top: 1px solid var(--oecca-line);
}

.modal-title {
    font-family: var(--oecca-font-display);
    font-weight: 600;
}

/* ---------- Offcanvas (panneau tickets) ---------- */

.offcanvas {
    box-shadow: var(--oecca-shadow);
}

/* ---------- Listes ---------- */

.list-group-item {
    border-color: var(--oecca-line);
}

.list-group-item-action:hover, .list-group-item-action:focus {
    background-color: var(--oecca-gold-tint);
}

/* ---------- Pagination ---------- */

.page-link {
    color: var(--oecca-navy);
    border-color: var(--oecca-line);
    border-radius: var(--oecca-radius-sm);
    margin: 0 2px;
}

.page-item.active .page-link {
    background-color: var(--oecca-navy);
    border-color: var(--oecca-navy);
}

/* ---------- Onglets ---------- */

.nav-tabs .nav-link {
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--oecca-ink-muted);
    font-weight: 600;
}

.nav-tabs .nav-link.active {
    color: var(--oecca-navy);
    background-color: transparent;
    border-bottom-color: var(--oecca-gold);
}

/* ---------- Toastr : alignement charte (pas de rouge/vert Bootstrap brut) ---------- */

#toast-container > .toast-success { background-color: var(--oecca-navy); }
#toast-container > .toast-error { background-color: #8a1f2d; }

/* ==========================================================================
   Sidebar des espaces contrôleur/contrôlé (classe .sidebar, cf.
   layout_controlleur/sidebar.blade.php et layout_contribuable/sidebar.blade.php)
   — fond ivoire plat du template d'origine remplacé par le même dégradé
   navy que l'espace admin, sans toucher au markup (liens, request()->routeIs()).
   ========================================================================== */

.sidebar {
    background: linear-gradient(180deg, var(--oecca-navy) 0%, var(--oecca-navy-dark) 100%) !important;
}

.sidebar .navbar {
    background: transparent !important;
}

.sidebar .navbar-brand h6 {
    font-family: var(--oecca-font-display);
    letter-spacing: .02em;
}

.sidebar .navbar-brand h6.text-primary,
.sidebar .navbar-brand h6.text-black {
    color: #fff !important;
}

.sidebar .navbar-brand h6.text-primary {
    color: var(--oecca-gold) !important;
}

.sidebar .navbar .navbar-nav .nav-link {
    color: rgba(255, 255, 255, .82);
    border-left-color: transparent;
}

.sidebar .navbar .navbar-nav .nav-link:hover,
.sidebar .navbar .navbar-nav .nav-link.active {
    color: #fff;
    background: rgba(199, 161, 79, .18);
    border-color: var(--oecca-gold);
}

.sidebar .navbar .navbar-nav .nav-link i {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.sidebar .navbar .navbar-nav .nav-link:hover i,
.sidebar .navbar .navbar-nav .nav-link.active i {
    background: var(--oecca-gold);
    color: var(--oecca-navy);
}

.sidebar .ms-3 h6 {
    color: #fff;
}

.sidebar .ms-3 span {
    color: rgba(255, 255, 255, .65);
    font-size: .78rem;
}

.sidebar .rounded-circle.bg-primary {
    background-color: var(--oecca-gold) !important;
    color: var(--oecca-navy) !important;
}

/* ---------- Navbar (topbar) — les 3 espaces ---------- */

.content .navbar {
    box-shadow: var(--oecca-shadow-sm);
}

.content .navbar .user-avatar.bg-primary,
.content .navbar .rounded-circle.bg-primary {
    background-color: var(--oecca-gold) !important;
    color: var(--oecca-navy) !important;
    box-shadow: 0 0 0 2px var(--oecca-gold-tint);
}
