/* =============================================================================
 * SaaS theme — systeme de design global du backoffice (style "Match2Campus").
 *
 * Applique a TOUTES les pages via cakelte_default.php. Pilote par deux variables
 * definies dans le layout depuis les couleurs du tenant :
 *   --brand-primary / --brand-secondary (+ triplets RGB, degrade --brand-gradient)
 * Fallback bleu->violet (couleurs du logo Badging) pour le super-admin.
 *
 * Objectif : un rendu unifie, moderne et professionnel sans toucher les pages.
 * ========================================================================== */

:root {
    /* Couleurs echantillonnees sur le logo : bleu (#1576F7) a gauche du symbole,
     * violet (#8324BF) a droite. La primaire est legerement assombrie
     * (#1576F7 -> #1268E8) car elle sert aussi de couleur de texte sur fond
     * blanc : 4.23:1 (sous le seuil AA) devient 5.03:1, teinte inchangee. */
    --brand-primary: #1268E8;
    --brand-secondary: #8324BF;
    --brand-primary-rgb: 18, 104, 232;
    --brand-secondary-rgb: 131, 36, 191;
    --brand-gradient: linear-gradient(90deg, #1268E8, #8324BF);

    --ink: #1e2432;
    --ink-soft: #3d4756;
    --muted: #7a8290;
    --line: #edf0f5;
    --line-soft: #f4f6fa;
    --surface: #ffffff;
    --bg: #f5f6fb;

    --ok: #16a34a;
    --info: #2563eb;
    --warn: #d97706;
    --danger: #e11d48;

    --radius: 16px;
    --radius-sm: 10px;
    --shadow: 0 6px 24px rgba(20, 22, 55, 0.06);
    --shadow-lg: 0 16px 40px rgba(20, 22, 55, 0.12);
}

/* ------------------------------- Base ------------------------------------ */
/* Echelle globale ~90% : on reduit la taille de base (rem). Tout ce qui est en
 * rem (texte, cartes, espacements, la plupart d'AdminLTE et du theme) retrecit
 * de 10% comme a un zoom 90%, SANS transformer les coordonnees : la sidebar
 * garde sa pleine hauteur et aucun scroll horizontal n'est provoque. */
html {
    font-size: 90%;
}
/* Filet de securite : jamais de scroll horizontal au niveau page ; les tableaux
 * larges defilent dans leur propre conteneur .table-responsive. */
html, body {
    overflow-x: hidden;
    max-width: 100%;
}

body {
    font-size: 13px;
}

body,
.wrapper {
    font-family: 'Inter', 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
    letter-spacing: -0.1px;
}

h1, h2, h3, h4, h5, h6 { letter-spacing: -0.3px; }

.content-wrapper {
    background: linear-gradient(180deg,
            rgba(var(--brand-secondary-rgb), 0.09) 0%,
            rgba(var(--brand-primary-rgb), 0.045) 34%,
            var(--bg) 100%) !important;
    min-height: 100vh;
}

/* Barres de defilement discretes */
* { scrollbar-width: thin; scrollbar-color: #cfd4de transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: #d3d8e2; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: #b9c0cd; background-clip: content-box; }

/* ------------------------------- Sidebar --------------------------------- */
.main-sidebar,
.main-sidebar .sidebar,
[class*="sidebar-dark"],
[class*="sidebar-light"] {
    background: var(--surface) !important;
    box-shadow: 0 0 40px rgba(20, 22, 55, 0.06);
}

.brand-link {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--line) !important;
    color: var(--ink) !important;
    padding: 0.95rem 1rem;
}
.brand-link .brand-image { max-height: 34px; box-shadow: none; opacity: 1; margin-top: 0; }
.brand-link .brand-text { color: var(--ink) !important; font-weight: 800 !important; }

.nav-sidebar { padding: 6px 4px; }
.nav-sidebar .nav-header {
    color: #a2a9b6 !important; text-transform: uppercase; font-size: 0.7rem;
    font-weight: 700; letter-spacing: 0.08em; padding: 15px 20px 6px;
}
/* Padding horizontal symetrique du conteneur : la pilule active a alors le meme
 * espace a gauche et a droite (AdminLTE mettait un padding asymetrique). */
.main-sidebar .sidebar { padding-left: 0 !important; padding-right: 0 !important; }

.nav-sidebar > .nav-item > .nav-link,
.nav-sidebar .nav-treeview > .nav-item > .nav-link {
    color: #55606f !important; border-radius: 12px;
    /* Marges symetriques gauche/droite pour centrer le bloc actif. */
    margin: 3px 10px !important;
    padding: 0.62rem 0.9rem; font-weight: 500; transition: all 0.15s ease;
}
.nav-sidebar > .nav-item > .nav-link .nav-icon,
.nav-sidebar .nav-treeview > .nav-item > .nav-link .nav-icon { color: #9aa1ad !important; }
.nav-sidebar > .nav-item > .nav-link:hover,
.nav-sidebar .nav-treeview > .nav-item > .nav-link:hover {
    background: rgba(var(--brand-primary-rgb), 0.09) !important; color: var(--brand-primary) !important;
}
.nav-sidebar > .nav-item > .nav-link:hover .nav-icon,
.nav-sidebar .nav-treeview > .nav-item > .nav-link:hover .nav-icon { color: var(--brand-primary) !important; }
.nav-sidebar > .nav-item > .nav-link.active,
.nav-sidebar .nav-treeview > .nav-item > .nav-link.active {
    background: var(--brand-gradient) !important; color: #fff !important;
    box-shadow: 0 8px 18px rgba(var(--brand-primary-rgb), 0.34);
}
.nav-sidebar > .nav-item > .nav-link.active .nav-icon,
.nav-sidebar .nav-treeview > .nav-item > .nav-link.active .nav-icon { color: #fff !important; }
.nav-sidebar .nav-link p > .right { transition: transform 0.2s ease; }
.nav-sidebar .menu-open > .nav-link p > .right { transform: rotate(-90deg); }

/* --------- Panneau utilisateur (nom du compte connecte) ------------------ */
.user-panel { border-bottom: 1px solid var(--line) !important; align-items: center; padding: 0 6px 12px; }
/* Nom lisible (remplace le gris pale #c2c7d0 par defaut d'AdminLTE) */
[class*="sidebar-dark-"] .sidebar .user-panel .info a,
.user-panel .info a {
    color: var(--ink) !important; font-weight: 600; font-size: 0.94rem;
}
.user-panel .info a:hover { color: var(--brand-primary) !important; }
/* Avatar : pastille degradee, icone parfaitement centree */
.user-panel > .image {
    width: 40px; height: 40px; min-width: 40px; border-radius: 50%;
    display: flex !important; align-items: center; justify-content: center;
    background: var(--brand-gradient); margin-right: 11px; padding: 0 !important;
    box-shadow: 0 4px 12px rgba(var(--brand-primary-rgb), 0.28);
}
.user-panel > .image > .fa-user,
.user-panel > .image > i {
    font-size: 1rem !important; line-height: 1 !important; color: #fff !important;
    margin: 0 !important; display: block;
}

/* --------------------------------- Navbar -------------------------------- */
.main-header.navbar {
    background: var(--surface) !important; border-bottom: 1px solid var(--line) !important;
    box-shadow: 0 2px 14px rgba(20, 22, 55, 0.04); min-height: 60px;
}
.main-header .nav-link { color: #55606f !important; font-weight: 500; }
.main-header .nav-link:hover { color: var(--brand-primary) !important; }

/* -------------------- En-tete de page = banniere degrade ----------------- */
.content-header {
    background: var(--brand-gradient);
    padding: 22px 28px;
    box-shadow: 0 12px 26px rgba(var(--brand-primary-rgb), 0.24);
}
.content-wrapper > .content {
    padding: 0.8rem 0.5rem;
}
.content-header h1 { color: #fff !important; font-weight: 800; font-size: 1.65rem; }
.content-header .breadcrumb { background: transparent; margin: 0; padding: 0.35rem 0 0; }
.content-header .breadcrumb-item,
.content-header .breadcrumb-item + .breadcrumb-item::before,
.content-header .breadcrumb-item a,
.content-header .breadcrumb-item.active { color: rgba(255, 255, 255, 0.85) !important; }
.content-header .breadcrumb-item a:hover { color: #fff !important; }

/* --------------------------------- Cartes -------------------------------- */
.card {
    border: none !important; border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important; margin-bottom: 1.25rem;
}
.card-header {
    background: var(--surface) !important; border-bottom: 1px solid var(--line-soft) !important;
    border-radius: var(--radius) var(--radius) 0 0 !important; padding: 1.05rem 1.4rem;
    display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
}
.card-title { font-weight: 700; color: var(--ink); font-size: 1.05rem; margin: 0; }
.card-toolbox { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card-body { padding: 1.3rem 1.4rem; }
.card-body.table-responsive.p-0 { padding: 0 !important; }
.card-footer {
    background: var(--surface) !important; border-top: 1px solid var(--line-soft) !important;
    border-radius: 0 0 var(--radius) var(--radius) !important; padding: 1rem 1.4rem;
}
.card-primary.card-outline { border-top: 3px solid var(--brand-primary) !important; }
.card-info.card-outline { border-top: 3px solid var(--brand-secondary) !important; }
.card-primary:not(.card-outline) > .card-header,
.bg-primary {
    background: var(--brand-gradient) !important; color: #fff !important; border: none !important;
}
/* Cartes "info" (bloc Recherche) : en-tete clair au lieu du bleu AdminLTE. */
.card-info:not(.card-outline) { box-shadow: none !important; border: 1px solid var(--line) !important; }
.card-info:not(.card-outline) > .card-header { background: var(--surface) !important; border-bottom: 1px solid var(--line-soft) !important; }
.card-info:not(.card-outline) > .card-header .card-title { color: var(--ink) !important; }

/* -------------------------------- Boutons -------------------------------- */
.btn {
    border-radius: var(--radius-sm); font-weight: 600; letter-spacing: 0;
    padding: 0.45rem 1rem; transition: all 0.15s ease; border-width: 1px;
}
.btn:focus { box-shadow: none; }
.btn-sm { padding: 0.35rem 0.8rem; border-radius: 9px; }
.btn-xs { border-radius: 8px; padding: 0.24rem 0.55rem; font-size: 0.75rem; }
.btn-lg { border-radius: 12px; }

.btn-primary {
    background: var(--brand-gradient) !important; border: none !important; color: #fff !important;
    box-shadow: 0 6px 16px rgba(var(--brand-primary-rgb), 0.28);
}
.btn-primary:hover, .btn-primary:focus { filter: brightness(0.96); box-shadow: 0 8px 20px rgba(var(--brand-primary-rgb), 0.36); color: #fff !important; }

.btn-success { background: var(--ok) !important; border-color: var(--ok) !important; color: #fff !important; box-shadow: 0 4px 12px rgba(22, 163, 74, 0.24); }
.btn-info { background: var(--info) !important; border-color: var(--info) !important; color: #fff !important; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.22); }
.btn-warning { background: var(--warn) !important; border-color: var(--warn) !important; color: #fff !important; box-shadow: 0 4px 12px rgba(217, 119, 6, 0.22); }
.btn-danger { background: var(--danger) !important; border-color: var(--danger) !important; color: #fff !important; box-shadow: 0 4px 12px rgba(225, 29, 72, 0.22); }
.btn-success:hover, .btn-info:hover, .btn-warning:hover, .btn-danger:hover { filter: brightness(0.95); color: #fff !important; }

.btn-secondary { background: #eef1f6 !important; border-color: #eef1f6 !important; color: #48505e !important; }
.btn-secondary:hover { background: #e2e6ee !important; color: #2b313c !important; }
.btn-default { background: #fff !important; border: 1px solid #e2e6ee !important; color: #55606f !important; }
.btn-default:hover { background: #f7f8fb !important; color: var(--ink) !important; }

.btn-outline-primary { color: var(--brand-primary) !important; border-color: rgba(var(--brand-primary-rgb), 0.5) !important; background: transparent !important; }
.btn-outline-primary:hover { background: var(--brand-primary) !important; color: #fff !important; }
.btn-outline-success { color: var(--ok) !important; border-color: rgba(22, 163, 74, 0.45) !important; }
.btn-outline-success:hover { background: var(--ok) !important; color: #fff !important; }
.btn-outline-danger { color: var(--danger) !important; border-color: rgba(225, 29, 72, 0.45) !important; }
.btn-outline-danger:hover { background: var(--danger) !important; color: #fff !important; }
.btn-outline-warning { color: var(--warn) !important; border-color: rgba(217, 119, 6, 0.5) !important; }
.btn-outline-warning:hover { background: var(--warn) !important; color: #fff !important; }
.btn-outline-info { color: var(--info) !important; border-color: rgba(37, 99, 235, 0.45) !important; }
.btn-outline-info:hover { background: var(--info) !important; color: #fff !important; }

.btn-group .btn { box-shadow: none; }

/* -------------------------------- Tables --------------------------------- */
.table { color: var(--ink-soft); margin-bottom: 0; }
.table thead th {
    color: #8a90a0; font-weight: 600; font-size: 0.78rem; text-transform: none;
    border-top: none; border-bottom: 1px solid var(--line); padding: 0.85rem 1.1rem;
    letter-spacing: 0.01em; white-space: nowrap;
}
.table td { vertical-align: middle; border-top: 1px solid var(--line-soft); padding: 0.85rem 1.1rem; }
.table-hover tbody tr:hover { background: rgba(var(--brand-primary-rgb), 0.04); }
.table a { color: var(--brand-primary); font-weight: 500; }
.table .actions { white-space: nowrap; }
.table .actions .btn { margin: 1px; }
.table img.img { border-radius: 8px; object-fit: contain; background: #f7f8fb; }
.table thead th a { color: #8a90a0; }
.table thead th a:hover { color: var(--brand-primary); }

/* Tables clef/valeur des pages "view" (2 colonnes th|td, th dans le corps) */
.view .table th, .table.table-vertical th, .table tbody th {
    color: var(--muted); font-weight: 600; width: 240px; background: var(--line-soft);
    font-size: 0.85rem; white-space: nowrap; vertical-align: middle;
}

/* -------------------------------- Badges --------------------------------- */
.badge { border-radius: 999px; padding: 0.42em 0.8em; font-weight: 600; font-size: 0.74rem; }
.badge-success { background: #e7f7ee !important; color: #15803d !important; }
.badge-secondary { background: #eef0f4 !important; color: #6b7280 !important; }
.badge-info { background: #e8f1ff !important; color: #1d4ed8 !important; }
.badge-warning { background: #fff3e0 !important; color: #c2660c !important; }
.badge-danger { background: #fdeaef !important; color: #be123c !important; }
.badge-primary { background: rgba(var(--brand-primary-rgb), 0.14) !important; color: var(--brand-primary) !important; }

/* ------------------------------- Formulaires ----------------------------- */
label { color: var(--ink); font-weight: 600; font-size: 0.86rem; margin-bottom: 0.35rem; }
.form-group { margin-bottom: 1.05rem; }
.form-control, .custom-select, textarea.form-control,
select.form-control, .select2-container--default .select2-selection--single {
    border-radius: var(--radius-sm); border: 1px solid #e3e7ef; color: var(--ink);
    padding: 0.5rem 0.85rem; min-height: calc(2.5rem + 2px); background-color: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
textarea.form-control { min-height: auto; }
.form-control:focus, .custom-select:focus, .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--brand-primary); box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.14);
}
.form-control::placeholder { color: #aab1bd; }
.form-control[type="color"] { padding: 0.2rem; height: 42px; }
.custom-file-label { border-radius: var(--radius-sm); border: 1px solid #e3e7ef; min-height: calc(2.5rem + 2px); padding: 0.55rem 0.85rem; }
.custom-file-label::after { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #f1f3f8; }
.input-group-text { border-radius: var(--radius-sm); border: 1px solid #e3e7ef; background: #f7f8fb; color: var(--muted); }
.custom-control-input:checked ~ .custom-control-label::before { background: var(--brand-primary); border-color: var(--brand-primary); }

/* Champ de recherche facon "pill" clair */
.card-info .card-body .form-control { background: #f7f8fb; }

/* --------------------- Select2 aligne sur nos inputs --------------------- */
.select2-container { width: 100% !important; }
.select2-container--bootstrap4 .select2-selection {
    border: 1px solid #e3e7ef !important; border-radius: var(--radius-sm) !important;
    min-height: calc(2.5rem + 2px) !important; height: auto !important; background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.select2-container--bootstrap4 .select2-selection--single { display: flex; align-items: center; padding: 0 0.85rem; }
.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered { color: var(--ink); line-height: 1.4; padding: 0; }
.select2-container--bootstrap4 .select2-selection__placeholder { color: #aab1bd; }
.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow { height: 100%; top: 0; right: 8px; }
.select2-container--bootstrap4.select2-container--focus .select2-selection,
.select2-container--bootstrap4.select2-container--open .select2-selection {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.14) !important;
}
/* Sélection multiple */
.select2-container--bootstrap4 .select2-selection--multiple { min-height: calc(2.5rem + 2px) !important; padding: 3px 6px; align-items: center; }
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
    background: rgba(var(--brand-primary-rgb), 0.12); border: none; color: var(--brand-primary);
    border-radius: 6px; padding: 2px 8px; margin: 3px 4px 0 0;
}
/* Menu déroulant */
.select2-container--bootstrap4 .select2-dropdown { border: 1px solid #e3e7ef; border-radius: 12px; box-shadow: var(--shadow-lg); overflow: hidden; }
.select2-container--bootstrap4 .select2-results__option { padding: 8px 12px; font-size: 0.9rem; color: var(--ink-soft); }
.select2-container--bootstrap4 .select2-results__option--highlighted[aria-selected] { background: var(--brand-primary) !important; color: #fff !important; }
.select2-container--bootstrap4 .select2-results__option[aria-selected=true] { background: rgba(var(--brand-primary-rgb), 0.10); color: var(--brand-primary); }
.select2-container--bootstrap4 .select2-search--dropdown .select2-search__field {
    border: 1px solid #e3e7ef; border-radius: 8px; padding: 6px 10px; outline: none;
}
.select2-container--bootstrap4 .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--brand-primary); box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.12);
}

/* -------------------------------- Modales -------------------------------- */
.modal-content { border: none; border-radius: var(--radius); box-shadow: var(--shadow-lg); overflow: hidden; }
.modal-header { border-bottom: 1px solid var(--line-soft); padding: 1.1rem 1.4rem; }
.modal-title { font-weight: 700; color: var(--ink); font-size: 1.05rem; }
.modal-header .close { color: var(--muted); text-shadow: none; opacity: 0.7; }
.modal-header .close:hover { opacity: 1; }
.modal-body { padding: 1.3rem 1.4rem; }
.modal-footer { border-top: 1px solid var(--line-soft); padding: 1rem 1.4rem; }
.modal-backdrop.show { opacity: 0.35; }

/* ------------------------------ Dropdowns -------------------------------- */
.dropdown-menu { border: none; border-radius: 12px; box-shadow: var(--shadow-lg); padding: 6px; margin-top: 6px; }
.dropdown-item { border-radius: 8px; padding: 0.5rem 0.75rem; font-size: 0.88rem; color: var(--ink-soft); font-weight: 500; }
.dropdown-item:hover { background: rgba(var(--brand-primary-rgb), 0.08); color: var(--brand-primary); }
.dropdown-divider { border-color: var(--line); }

/* ------------------------- Pagination & compteur ------------------------- */
.card-footer.paginator { display: flex; align-items: center; }
.pagination { margin: 0; }
.page-item .page-link { color: var(--ink-soft); border: none; border-radius: 8px; margin: 0 2px; min-width: 34px; text-align: center; font-weight: 600; }
.page-item .page-link:hover { background: rgba(var(--brand-primary-rgb), 0.1); color: var(--brand-primary); }
.page-item.active .page-link { background: var(--brand-gradient); color: #fff; box-shadow: 0 4px 12px rgba(var(--brand-primary-rgb), 0.3); }
.page-item.disabled .page-link { color: #c2c8d2; background: transparent; }

/* ------------------------------ Liens & texte ---------------------------- */
a { color: var(--brand-primary); transition: color 0.12s ease; }
a:hover { color: var(--brand-secondary); text-decoration: none; }
.text-primary { color: var(--brand-primary) !important; }
.text-muted { color: var(--muted) !important; }

/* ------------------------------ Alerts / flash --------------------------- */
.alert { border-radius: 12px; border: none; padding: 0.9rem 1.15rem; font-weight: 500; box-shadow: var(--shadow); }
.alert-success { background: #e7f7ee; color: #15803d; }
.alert-danger, .alert-error { background: #fdeaef; color: #be123c; }
.alert-info { background: rgba(var(--brand-secondary-rgb), 0.10); color: var(--ink); }
.alert-warning { background: #fff3e0; color: #b45309; }

/* Messages flash CakePHP (message + type) */
.message { border-radius: 12px; padding: 0.9rem 1.15rem; margin-bottom: 1rem; font-weight: 500; box-shadow: var(--shadow); }
.message.success { background: #e7f7ee; color: #15803d; }
.message.error { background: #fdeaef; color: #be123c; }
.message.info { background: rgba(var(--brand-secondary-rgb), 0.10); color: var(--ink); }
.message.warning { background: #fff3e0; color: #b45309; }

/* --------------------- Barre de recherche compacte ----------------------- */
.search-bar .card-body { padding: 14px 16px; }
.search-bar form { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; }
.search-bar .search-field { flex: 1 1 160px; min-width: 140px; }
.search-bar .search-actions { flex: 0 0 auto; display: flex; gap: 8px; align-items: flex-end; }
.search-bar .form-group { margin-bottom: 0; }
.search-bar label {
    font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.03em;
    color: var(--muted); margin-bottom: 3px; font-weight: 600;
}
.search-bar .form-control, .search-bar select.form-control { min-height: 40px; }

/* ------------------------- Tuiles KPI (index pages) ---------------------- */
.stat-tiles-row { margin-bottom: 2px; }
.stat-tile { display: flex; align-items: center; gap: 14px; padding: 1.1rem 1.3rem; }
.stat-tile .st-ico {
    width: 48px; height: 48px; min-width: 48px; border-radius: 13px; display: grid; place-items: center;
    font-size: 1.15rem; color: #fff; box-shadow: 0 6px 14px rgba(20, 22, 55, 0.12);
}
.stat-tile .st-num { font-size: 1.85rem; font-weight: 800; line-height: 1; letter-spacing: -0.5px; font-variant-numeric: tabular-nums; }
.stat-tile .st-lbl { color: var(--muted); font-size: 0.84rem; margin-top: 4px; }

/* --------------------- Widgets tableau de bord AdminLTE ------------------- */
.small-box { border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.small-box > .inner { padding: 18px; }
.small-box h3 { font-weight: 800; letter-spacing: -0.5px; }
.small-box .icon { opacity: 0.28; }
.info-box { border-radius: var(--radius); box-shadow: var(--shadow); border: none; }
.info-box .info-box-icon { border-radius: var(--radius) 0 0 var(--radius); }

/* ------------------------------ Divers ----------------------------------- */
hr { border-color: var(--line); }
.breadcrumb { background: transparent; }
code { color: var(--brand-secondary); background: rgba(var(--brand-secondary-rgb), 0.08); border-radius: 5px; padding: 2px 6px; }

/* ============================================================
   Cases a cocher stylees en interrupteurs (switches) — global
   S'applique a toutes les checkboxes classiques de l'application.
   Exclusions : .no-switch (opt-out manuel), .custom-control-input
   (deja gere par Bootstrap custom-control), widgets AdminLTE.
   Les boutons radio ne sont pas affectes.
   ============================================================ */
input[type="checkbox"]:not(.no-switch):not(.custom-control-input):not([data-widget]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    top: 0;
    left: 0;
    box-sizing: border-box;
    display: inline-block;
    flex: 0 0 auto;
    width: 38px;
    height: 18px;
    margin: 0 8px 0 0;
    padding: 0;
    vertical-align: middle;
    background-color: #cbd3dd;
    border: none;
    border-radius: 18px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
input[type="checkbox"]:not(.no-switch):not(.custom-control-input):not([data-widget])::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 14px;
    height: 14px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.28);
    transition: left 0.2s ease;
}
input[type="checkbox"]:not(.no-switch):not(.custom-control-input):not([data-widget]):checked {
    background-color: var(--brand-primary, #007bff);
}
input[type="checkbox"]:not(.no-switch):not(.custom-control-input):not([data-widget]):checked::before {
    left: 22px;
}
input[type="checkbox"]:not(.no-switch):not(.custom-control-input):not([data-widget]):focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb, 0, 123, 255), 0.25);
}
input[type="checkbox"]:not(.no-switch):not(.custom-control-input):not([data-widget]):disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

/* ============================================================
   Boutons radio personnalises — global
   Meme logique que les switches : couleur de marque, focus doux.
   Exclusions : .no-style (opt-out), .custom-control-input.
   ============================================================ */
input[type="radio"]:not(.no-style):not(.custom-control-input) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    top: 0;
    left: 0;
    box-sizing: border-box;
    display: inline-block;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0 7px 0 0;
    padding: 0;
    vertical-align: middle;
    background: #fff;
    border: 2px solid #cbd3dd;
    border-radius: 50%;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
input[type="radio"]:not(.no-style):not(.custom-control-input)::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--brand-primary, #007bff);
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.15s ease;
}
input[type="radio"]:not(.no-style):not(.custom-control-input):checked {
    border-color: var(--brand-primary, #007bff);
}
input[type="radio"]:not(.no-style):not(.custom-control-input):checked::before {
    transform: translate(-50%, -50%) scale(1);
}
input[type="radio"]:not(.no-style):not(.custom-control-input):focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb, 0, 123, 255), 0.25);
}
input[type="radio"]:not(.no-style):not(.custom-control-input):disabled {
    opacity: 0.55;
    cursor: not-allowed;
}