/*** BASIC*/
body, a, .link																				{color:#333;}
#htmlLightbox, .objContent, .miscContent, .menuContext, #menuMobileMain						{background:white;}
#headerBar																					{background:linear-gradient(white,#e8e8e8);}/*barre principale*/
.objLines .objContent																		{border-bottom:solid 1px #ccc;}
.menuContext,  .tox-tinymce																	{border:solid 1px #ccc!important;}
.objLines .objContent:hover, .menuContext .menuLine:hover, .lineHover:hover, .lineSelect	{background:#eee;}
.objContentSelected, #objSelectMenu															{background:#ddd!important;}
.tippy-box																					{background:white!important; color:#555!important; box-shadow:0px 0px 10px #444!important;}
/*** RESPONSIVE TABLET-SMARTPHONE*/
@media screen and (max-width:1199px){
	#htmlMainPage				{background:white url(../../img/logoMobileBg.png) no-repeat center 95%; height:100%;}
	#headerBar					{border-top:solid 1px #bbb;}/*séparation de la "appBar" du main.dart*/
	.objContent, .miscContent	{box-shadow:0px 1px 4px #bbb;}
}

/*** LIENS & OPTIONS*/
a:hover, .link:hover, .linkSelect, .menuContextLaunch:hover, [onclick]:hover, button:hover, label:hover, input:checked+label, .optionSelect	{color:#015eaa;}
.accessRead						{color:#007;}
.accessWrite					{color:#700;}
.option							{border:solid 1px transparent;}
.optionSelect, .option:hover 	{border:solid 1px #d5d5d5; border-radius:var(--radius-field);}
.optionSelect					{background:#eee; font-weight:bold;}

/*** INPUTS*/
input:not([type=radio],[type=checkbox]), textarea, select, button	{background:#fbfbfb; border:1px solid #ccc; transition:box-shadow 0.3s ease-in-out; color:#444;}
input:hover, textarea:hover, select:hover							{box-shadow:0px 0px 4px #bbb;}
input:focus, textarea:focus, select:focus							{box-shadow:0px 0px 4px #0068bd; border:#bcf 1px solid;}
.tox-edit-area__iframe												{background:#fbfbfb!important;}/*Editeur Tinymce*/
button																{background:linear-gradient(#fff,#eee);}
button:hover:not(.f-button)											{background:linear-gradient(#fff,#f9f9f9);}

/*** DIVERS*/
.objMenuTab, .objMenuMain, fieldset		{background:#fbfbfb; border:solid 1px #ccc; border-radius:var(--radius-block);}/*VueObjMenuEdit + fieldset*/
.objMenuTab								{background:transparent;}/*VueObjMenuEdit : onglet non sélectionnés*/
.objMenuTab:not(.objMenuTabSelect)		{border-color:#ddd #ddd #bbb #ddd;}
.objMenuTab:hover, .objMenuTabSelect	{background:#fbfbfb;}/*VueObjMenuEdit : onglet sélectionnés/survolé*/
hr										{background:linear-gradient(90deg,#eee,#ddd,#eee);}
.lightboxTitle							{border-bottom:solid 1px #ccc;}/*peudo <hr>*/
.jconfirm-box							{background:white!important; box-shadow:0px 2px 6px #555!important;}
::-webkit-scrollbar						{background:#eee;}/*chemin de scrollbar*/
::-webkit-scrollbar-thumb				{background:#888;}/*couleur de scrollbar*/
/* ===== THEME-CCA : charte graphique CCA (DSIPE/SI) ===== */
/* ==========================================================================
   Charte graphique CCA — plateforme e-Achats (DSIPE/SI) — jetons de design
   Source de vérité : resources/css/app.css de e-Achats (Tailwind CSS v4).
   Utilisable sans framework : importer ce fichier en premier.
   ========================================================================== */
:root {
  /* Vert institutionnel CCA (couleur primaire) */
  --cca-50:  #ebf5ee;
  --cca-100: #d3eadb;
  --cca-200: #a9d6b8;
  --cca-300: #74ba8c;
  --cca-500: #22a060;
  --cca-600: #16804a;
  --cca-700: #0f6b3d;   /* primaire : boutons, en-têtes de cartes */
  --cca-800: #0e5a34;   /* survol des boutons primaires */
  --cca-900: #0b3f25;   /* titres */
  --cca-950: #072a18;   /* pied de page, fonds très sombres */

  /* Orange « ocre » de la fiche officielle (couleur d'accent) */
  --ocre-50:  #fdf1e6;
  --ocre-100: #fbdcc0;
  --ocre-400: #f08a3e;
  --ocre-500: #e8741f;  /* accent : liseré d'en-tête, badges, focus */
  --ocre-600: #d06114;  /* survol des boutons accent */
  --ocre-700: #a84b0d;  /* texte orange sur fond clair */

  /* Neutres */
  --fond:  #e4ede7;     /* fond de page (vert-gris très clair) */
  --encre: #142019;     /* texte courant */
  --trait: #c8d7cd;     /* bordures */
  --blanc: #ffffff;
  --gris-texte: #475569; /* texte secondaire (slate-600) */
  --gris-aide:  #64748b; /* légendes, aides (slate-500) */

  /* États (palette Tailwind « red » pour le danger) */
  --danger-50:  #fef2f2;
  --danger-100: #fee2e2;
  --danger-300: #fca5a5;
  --danger-700: #b91c1c;

  /* Typographie : polices système, aucun appel externe */
  --police: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --taille-base: 0.875rem;   /* 14 px : texte des écrans de gestion */
  --taille-petit: 0.75rem;   /* 12 px : aides, badges */
  --taille-titre: 1.5rem;    /* 24 px : titre de page (h1), graisse 800 */
  --graisse-normal: 400; --graisse-semi: 600; --graisse-gras: 700; --graisse-extra: 800;

  /* Formes et ombres */
  --rayon-champ: 0.5rem;     /* 8 px : boutons, champs */
  --rayon-carte: 0.75rem;    /* 12 px : cartes, tuiles */
  --rayon-puce: 9999px;
  --ombre-carte: 0 1px 3px rgba(14, 90, 52, 0.10);
  --ombre-entete: 0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -2px rgba(0,0,0,.10);
  --focus: 3px solid var(--ocre-500);

  /* Mise en page */
  --largeur-max: 80rem;      /* 1280 px (max-w-7xl) ; portail public : 72rem */
  --gouttiere: 1rem;

  /* Dégradés signature */
  --degrade-entete: linear-gradient(to right, var(--cca-900), var(--cca-800), var(--cca-700));
  --degrade-portail: linear-gradient(to right, var(--ocre-700), var(--ocre-600), var(--ocre-500));
  --degrade-tuile-vert: linear-gradient(to bottom right, var(--cca-600), var(--cca-800));
  --degrade-tuile-sombre: linear-gradient(to bottom right, var(--cca-800), var(--cca-950));
  --degrade-tuile-ocre: linear-gradient(to bottom right, var(--ocre-500), var(--ocre-600));
}
/* ==========================================================================
   Thème CCA pour Agora Project (DSIPE/SI)
   S'appuie sur les jetons de la charte e-Achats (tokens.css, chargé juste avant).
   Ajouté en fin de white.css au build : aucun fichier PHP d'Agora n'est modifié.
   ========================================================================== */

/* ---- Variables d'Agora ramenées sur la charte ---- */
:root{
	--blue-bg:var(--cca-700);			/* boutons, jour sélectionné, listes */
	--radius-block:var(--rayon-carte);
	--radius-field:var(--rayon-champ);
}
html, body, input, textarea, select, button	{font-family:var(--police);}
body, a, .link								{color:var(--encre);}

/* ---- En-tête : dégradé vert, liseré ocre ---- */
#headerBar{
	background:var(--degrade-entete);
	box-shadow:inset 0 -4px 0 var(--ocre-500), var(--ombre-entete);
}
#headerBar>div:first-child, #headerBarLeft, #headerBarLeft div, #headerMobileModule, #headerMobileModule label{color:#fff;}
#headerBarLeft img:not(#headerMainLogo), #headerMobileModule>img:last-of-type{filter:brightness(0) invert(1);}
#headerMainLogo{height:40px; width:auto; top:6px; left:8px; filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));}
@media screen and (min-width:1200px){
	#headerBar #headerBarLeft{padding-inline:125px 20px;}	/* place pour le logo en cartouche */
}
.menuContext, .menuContext a{color:var(--encre);}		/* les menus déroulants restent sur fond blanc */

/* Modules : pastille blanche derrière chaque icône colorée */
#headerBar .vHeaderModule{color:#fff; border:1px solid transparent!important; transition:background-color .15s;}
#headerBar .vHeaderModule label{color:#fff; font-weight:600;}
#headerBar .vHeaderModule img{background:#fff; border-radius:50%; padding:3px; box-shadow:0 1px 2px rgba(0,0,0,.2);}
#headerBar .vHeaderModule:hover{background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.18)!important;}
#headerBar .vHeaderModuleCurrent, #headerBar .vHeaderModuleCurrent:hover{
	background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.28)!important; box-shadow:inset 0 -3px 0 var(--ocre-500);
}
#headerBar .vHeaderModuleCurrent label{font-weight:800;}

/* ---- Cartes, blocs, menus ---- */
.objContent, .miscContent, .ui-datepicker, #messengerMain{
	border:1px solid var(--trait); box-shadow:var(--ombre-carte);
}
.objLines .objContent{border:0; border-bottom:1px solid var(--cca-100); box-shadow:none;}
.menuContext{box-shadow:0 10px 28px rgba(7,42,24,.22); border-color:var(--trait)!important;}
.objLines .objContent:hover, .menuContext .menuLine:hover, .lineHover:hover, .lineSelect{background:var(--cca-50);}
.objContentSelected, #objSelectMenu{background:var(--cca-100)!important;}
.tippy-box{box-shadow:0 4px 14px rgba(7,42,24,.28)!important;}

/* ---- Liens, options, onglets ---- */
a:hover, .link:hover, .linkSelect, .menuContextLaunch:hover, [onclick]:hover, button:hover, label:hover, input:checked+label, .optionSelect{color:var(--cca-700);}
.optionSelect{background:var(--cca-50); color:var(--cca-800); font-weight:700;}
.optionSelect, .option:hover{border-color:var(--cca-200);}
.objMenuTab:hover, .objMenuTabSelect{background:var(--cca-100); color:var(--cca-900); font-weight:700;}
.objMenuTab:not(.objMenuTabSelect){border-color:var(--trait);}
.objMenuTab, .objMenuMain, fieldset{border-color:var(--trait);}
.objMenuMain, fieldset{background:var(--cca-50);}
.lightboxTitle{border-bottom:2px solid var(--cca-200); color:var(--cca-900); font-weight:800;}

/* ---- Champs de saisie ---- */
input:not([type=radio],[type=checkbox]), textarea, select{border-color:var(--trait); background:#fff;}
input:hover, textarea:hover, select:hover{box-shadow:0 0 0 1px var(--cca-200);}
input:focus, textarea:focus, select:focus{border-color:var(--cca-600); box-shadow:0 0 0 2px var(--cca-100);}
input[type=checkbox], input[type=radio]{accent-color:var(--cca-700);}

/* ---- Boutons ---- */
button{background:#fff; border:1px solid var(--trait); border-radius:var(--radius-field); font-weight:600;}
button:hover:not(.f-button){background:#fff; border-color:var(--cca-600); color:var(--cca-800);}
.submitButton button{background:var(--cca-700)!important; color:#fff!important; border:0; box-shadow:0 1px 2px rgba(0,0,0,.08);}
.submitButton button:hover{background:var(--cca-800)!important; color:#fff!important;}
.submitButtonMain button{border-radius:var(--rayon-champ);}
.circleNb{background:var(--ocre-500);}					/* pastilles de compteurs : accent ocre */
.progressBar{border-color:var(--cca-200); color:var(--cca-900);}
.jconfirm-buttons .btn-green{background:var(--cca-700)!important;}
.ui-datepicker .ui-state-active, li.ui-timepicker-selected, .ui-timepicker-list li:hover{background-color:var(--cca-700)!important; color:#fff!important;}

/* ---- Icônes « + » (teal d'origine) ramenées au vert CCA ---- */
img[src*="img/plus"]{filter:hue-rotate(-45deg) saturate(1.25);}

/* ---- Pied de page : pastille sombre + logo sur cartouche blanc ---- */
#pageFooterHtml{
	background:var(--cca-950); color:var(--cca-200); text-shadow:none; font-size:12px;
	padding:.35rem .75rem; border-radius:var(--rayon-champ); bottom:12px;
}
#pageFooterHtml:empty{display:none;}
#pageFooterIcon img{
	background:#fff; border-radius:var(--rayon-champ); padding:.25rem .5rem;
	box-shadow:0 1px 4px rgba(7,42,24,.25); max-height:54px; max-width:150px;
}

/* ---- Page de connexion : logo CCA en tête de carte ---- */
#pageCenter .miscContent:has(#connectLogin)::before{
	content:""; display:block; height:92px; margin:0 auto 52px;
	background:url("../../img/cca/logo-cca.png") center/contain no-repeat;
}
#pageCenter .miscContent:has(#connectLogin){border-top:4px solid var(--ocre-500);}

/* ---- Fond mobile ---- */
@media screen and (max-width:1199px){
	#htmlMainPage{background-color:var(--fond);}
	#headerBar{border-top:0;}
}

/* Emblème CCAK à la place du petit logo Agora (message d'accueil, menu principal) */
img[src*="img/logoSmall.png"]{height:36px;width:auto;vertical-align:middle}