/* =====================================================================
   ADMIN - THEME v1 (direction A "sobre" + barre fine aux couleurs de la marque)
   Charge APRES admin.css (inc/headerTags.cfm). admin.css n'est pas modifie.
   La marque est posee sur <html> par inc/headerTags.cfm :
       html.adm-one / html.adm-hoppacar / html.adm-trc
   Couleurs relevees sur les logos (assets/images/logo-w-*.png).
   Les couleurs des boutons existants (green, red, blue, purple, yellow...)
   ne sont PAS modifiees : seules leur forme et leur finition changent.
   Metronic force border-radius:0!important partout : d'ou "html body"
   et les !important pour les arrondis.
   ===================================================================== */

/* ---------------- couleurs ---------------- */
html {
	--adm-brand: #004ec1;        /* couleur du logo */
	--adm-brand-ink: #ffffff;    /* texte pose sur la couleur */
	--adm-brand-soft: #e8f0fc;   /* fond leger (menu actif...) */
	--adm-brand-text: #003a91;   /* couleur lisible sur fond blanc (liens, menu actif) */
	--adm-head: #1f2433;         /* en-tete */
	--adm-bg: #eef1f6;           /* fond des pages */
	--adm-line: #e3e7ef;         /* bordures */
	--adm-line-soft: #eef1f5;
	--adm-text: #1f2937;
	--adm-muted: #6b7280;
}
html.adm-one {
	--adm-brand: #004ec1; --adm-brand-ink: #ffffff; --adm-brand-soft: #e8f0fc; --adm-brand-text: #003a91;
}
html.adm-hoppacar {
	--adm-brand: #fa0f5c; --adm-brand-ink: #ffffff; --adm-brand-soft: #fde7ef; --adm-brand-text: #c50a48;
}
html.adm-trc {
	/* vert citron du logo : texte noir dessus, olive fonce pour les liens */
	--adm-brand: #cefb13; --adm-brand-ink: #141414; --adm-brand-soft: #f3fccc; --adm-brand-text: #4a5e00;
}

/* ---------------- fond et texte ---------------- */
html body.page-container-bg-solid,
html body.page-container-bg-solid .page-container,
html body.page-container-bg-solid .page-content-wrapper,
html body.page-container-bg-solid .page-content { background-color: var(--adm-bg); }
html body { color: var(--adm-text); }

/* ---------------- en-tete : sombre + barre fine de la marque ---------------- */
html body .page-header.navbar {
	background-color: var(--adm-head);
	box-shadow: inset 0 -3px 0 var(--adm-brand); /* barre fine sous l'en-tete, sans changer la hauteur */
}
html body .page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle > .username { color: #c7cedb; }
html body .page-header.navbar .top-menu .navbar-nav > li.logout-icon > a:hover { color: #fff !important; }

/* ---------------- titre de page et fil d'Ariane ---------------- */
html body .page-head .page-title > h1 { color: var(--adm-text); font-weight: 600; letter-spacing: -.01em; }
html body .page-breadcrumb.breadcrumb > li > a { color: var(--adm-brand-text); }
html body .page-breadcrumb.breadcrumb > li > i.fa-circle { color: #c3cad6; }
html body .page-breadcrumb.breadcrumb > li > span.active { color: var(--adm-muted); }

/* ---------------- menu lateral ---------------- */
html body .page-sidebar .page-sidebar-menu > li > a,
html body .page-sidebar .page-sidebar-menu .sub-menu > li > a { color: #4b5563; }
html body .page-sidebar .page-sidebar-menu > li > a > i,
html body .page-sidebar .page-sidebar-menu .sub-menu > li > a > i { color: #9aa3b2; }
html body .page-sidebar .page-sidebar-menu > li:hover > a,
html body .page-sidebar .page-sidebar-menu > li.open > a,
html body .page-sidebar .page-sidebar-menu .sub-menu > li:hover > a { background: #f4f6fa; color: var(--adm-text); }
html body .page-sidebar .page-sidebar-menu > li:hover > a > i,
html body .page-sidebar .page-sidebar-menu > li.open > a > i { color: var(--adm-brand-text); }
/* element actif : fond leger + barre de la couleur de la marque */
html body .page-sidebar .page-sidebar-menu > li.active > a,
html body .page-sidebar .page-sidebar-menu > li.active.open > a,
html body .page-sidebar .page-sidebar-menu > li.active > a:hover,
html body .page-sidebar .page-sidebar-menu > li.active.open > a:hover {
	background: var(--adm-brand-soft);
	color: var(--adm-brand-text);
	font-weight: 600;
	border-left-color: var(--adm-brand) !important;
}
html.adm-trc body .page-sidebar .page-sidebar-menu > li.active > a,
html.adm-trc body .page-sidebar .page-sidebar-menu > li.active.open > a { border-left-color: #9bbd00 !important; }
html body .page-sidebar .page-sidebar-menu > li.active > a > i,
html body .page-sidebar .page-sidebar-menu > li.active.open > a > i,
html body .page-sidebar .page-sidebar-menu > li.active > a > .arrow:before,
html body .page-sidebar .page-sidebar-menu > li.active > a > .arrow.open:before { color: var(--adm-brand-text); }
html body .page-sidebar .page-sidebar-menu .sub-menu > li.active > a,
html body .page-sidebar .page-sidebar-menu .sub-menu > li.open > a { background: var(--adm-brand-soft); color: var(--adm-brand-text); font-weight: 600; }
html body .page-sidebar .page-sidebar-menu .sub-menu > li.active > a > i { color: var(--adm-brand-text); }

/* ---------------- liens du contenu ---------------- */
html body .page-content a:not(.btn):not(.dt-button):not([class*="label"]) { color: var(--adm-brand-text); }
html body .page-content a:not(.btn):not(.dt-button):not([class*="label"]):hover { color: var(--adm-text); }

/* ---------------- blocs (portlets) ---------------- */
html body .portlet.light {
	border-radius: 12px !important;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
html body .portlet.light.bordered { border: 1px solid var(--adm-line) !important; }
html body .portlet.light > .portlet-title { border-bottom-color: var(--adm-line-soft); }
html body .portlet.light > .portlet-title > .caption,
html body .portlet.light > .portlet-title > .caption > .caption-subject { color: var(--adm-text) !important; font-weight: 600; }

/* ---------------- champs de formulaire ---------------- */
html body .page-content .form-control {
	border-color: #d4d9e3;
	border-radius: 6px !important;
	color: var(--adm-text);
	transition: border-color .15s, box-shadow .15s;
}
html body .page-content .form-control:focus {
	border-color: var(--adm-brand-text);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--adm-brand) 22%, transparent) !important;
}
html body .page-content .form-control[readonly],
html body .page-content .form-control[disabled] { background-color: #f6f7fa; }
/* champs groupes (ex. "du ... a ...") : arrondis seulement aux extremites */
html body .page-content .input-group .form-control,
html body .page-content .input-group .input-group-addon { border-radius: 0 !important; }
html body .page-content .input-group > .form-control:first-child,
html body .page-content .input-group > .input-group-addon:first-child { border-radius: 6px 0 0 6px !important; }
html body .page-content .input-group > .form-control:last-child,
html body .page-content .input-group > .input-group-addon:last-child { border-radius: 0 6px 6px 0 !important; }
html body .page-content .input-group .input-group-addon { background: #f3f5f9; border-color: #d4d9e3; color: var(--adm-muted); }
html body .page-content .control-label { color: #4b5563; }
html body .page-content .select2-container--bootstrap .select2-selection,
html body .page-content .select2-container--default .select2-selection { border-radius: 6px !important; }

/* ---------------- boutons : forme seulement, les couleurs restent ---------------- */
html body .page-content .btn:not(.btn-circle),
html body .page-content .dt-button:not(.btn-circle),
html body .modal .btn:not(.btn-circle) {
	border-radius: 6px !important;
	transition: filter .15s, box-shadow .15s;
}
html body .page-content .btn:hover,
html body .modal .btn:hover { filter: brightness(.95); }
html body .page-content .btn:focus-visible { box-shadow: 0 0 0 3px rgba(31, 41, 55, .18) !important; }
html body .page-content .btn-group > .btn { border-radius: 0 !important; }
html body .page-content .btn-group > .btn:first-child { border-radius: 6px 0 0 6px !important; }
html body .page-content .btn-group > .btn:last-child { border-radius: 0 6px 6px 0 !important; }

/* ---------------- tableaux ---------------- */
html body .page-content .table > thead > tr > th {
	background: #f8f9fc;
	border-bottom: 1px solid var(--adm-line) !important;
	color: var(--adm-muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	vertical-align: middle;
}
html body .page-content .table > tbody > tr > td { border-top-color: var(--adm-line-soft); vertical-align: top; }
html body .page-content .table-hover > tbody > tr:hover > td,
html body .page-content .table > tbody > tr:hover > td { background-color: #fafbfd; }
html body .page-content .table-striped > tbody > tr:nth-of-type(odd) { background-color: #fbfcfe; }
html body .page-content .table-bordered { border-color: var(--adm-line); }

/* DataTables : recherche, nombre de lignes, pagination */
html body .page-content .dataTables_wrapper .dataTables_filter input,
html body .page-content .dataTables_wrapper .dataTables_length select { border: 1px solid #d4d9e3; border-radius: 6px !important; }
html body .page-content .dataTables_wrapper .dataTables_filter input:focus { border-color: var(--adm-brand-text); outline: 0; }
html body .page-content .pagination > li > a,
html body .page-content .pagination > li > span { margin-left: 4px; border-color: var(--adm-line); border-radius: 6px !important; color: #4b5563; }
html body .page-content .pagination > li > a:hover { background: #f4f6fa; color: var(--adm-text); }
html body .page-content .pagination > .active > a,
html body .page-content .pagination > .active > a:hover,
html body .page-content .pagination > .active > span {
	background-color: var(--adm-brand);
	border-color: var(--adm-brand);
	color: var(--adm-brand-ink);
	font-weight: 600;
}

/* ---------------- statuts (labels) : pastilles, couleurs inchangees ---------------- */
html body .page-content .label {
	display: inline-block;
	border-radius: 999px !important;
	padding: 2px 9px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.5;
}
html body .page-content .label.label-sm { font-size: 11.5px; padding: 1px 9px; }
html body .page-content .badge { border-radius: 999px !important; }

/* ---------------- onglets ---------------- */
html body .page-content .nav-tabs > li > a { color: var(--adm-muted); border-radius: 8px 8px 0 0 !important; }
html body .page-content .nav-tabs > li > a:hover { color: var(--adm-text); background: #f4f6fa; }
html body .page-content .nav-tabs > li.active > a,
html body .page-content .nav-tabs > li.active > a:hover,
html body .page-content .nav-tabs > li.active > a:focus {
	color: var(--adm-text);
	font-weight: 600;
	box-shadow: inset 0 3px 0 var(--adm-brand);
}

/* ---------------- fenetres (modals) et menus deroulants ---------------- */
html body .modal-content { border: 0; border-radius: 12px !important; box-shadow: 0 20px 50px rgba(16, 24, 40, .25); overflow: hidden; }
html body .modal-header { border-bottom-color: var(--adm-line-soft); }
html body .modal-footer { border-top-color: var(--adm-line-soft); background: #fafbfd; }
html body .dropdown-menu { border-color: var(--adm-line); border-radius: 8px !important; box-shadow: 0 10px 30px rgba(16, 24, 40, .12); }

/* ---------------- divers ---------------- */
html body .page-content hr { border-top-color: var(--adm-line); }
html body .page-content .alert { border-radius: 8px !important; }
html body .page-content .note { border-radius: 8px !important; }
html body ::selection { background: color-mix(in srgb, var(--adm-brand) 35%, transparent); }