/* =====================================================================
   Bailsecurity - thème clair pastel (espace connecté, inscription,
   mot de passe perdu, fiche agence).
   Se charge APRÈS BS.css / style.css : ne modifie que l'apparence.
   La géométrie (largeurs, positions animées en JS) est conservée, et les
   valeurs posées par le JavaScript (style.color = "orange", etc.) restent
   intactes : elles sont seulement réinterprétées visuellement ici.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Syne:wght@600;700&display=swap');

:root {
	--canvas: #F5F7FB;
	--canvas-2: #EEF2F9;
	--surface: #FFFFFF;
	--surface-soft: rgba(255,255,255,.72);
	--ink: #1E2640;
	--ink-2: #4A5470;
	--ink-3: #7A839C;
	--line: #DCE2EE;
	--line-strong: #B9C3D8;
	--blue: #BFD3F5;       /* bleu poudré */
	--blue-ink: #2F55B8;
	--sage: #CDE5D8;       /* sauge */
	--sage-ink: #2D7253;
	--lilac: #DCD5F6;      /* lilas */
	--peach: #FAD9C6;      /* pêche */
	--butter: #FFF4D2;     /* beurre */
	--rose: #FBE0E0;
	--rose-ink: #B23B3B;
	--accent: #5B6CF0;     /* pervenche : appels à l'action, focus, état actif */
	--accent-2: #4453D6;
	--accent-soft: #E6E9FF;
	--radius: 14px;
	--radius-sm: 10px;
	--shadow: 0 1px 2px rgba(30,38,64,.05), 0 8px 24px rgba(30,38,64,.07);
	--shadow-lg: 0 2px 4px rgba(30,38,64,.05), 0 18px 48px rgba(30,38,64,.12);
	--ease: cubic-bezier(.22,.8,.24,1);
	--font: "Manrope", "Segoe UI", system-ui, sans-serif;
	--font-display: "Syne", "Manrope", sans-serif;
}

/* ------------------------------------------------------------- fond */
html { background: var(--canvas); }
body {
	color: var(--ink) !important;
	font-family: var(--font) !important;
	text-shadow: none !important;
	background:
		radial-gradient(1100px 700px at 8% -10%, rgba(191,211,245,.55), transparent 60%),
		radial-gradient(900px 600px at 105% 10%, rgba(220,213,246,.55), transparent 60%),
		radial-gradient(900px 700px at 60% 120%, rgba(205,229,216,.55), transparent 60%),
		var(--canvas) !important;
	background-attachment: fixed !important;
	-webkit-font-smoothing: antialiased;
	min-height: 100vh;
	max-height: none !important;
	animation: bs-entree .6s var(--ease) backwards;
}
@keyframes bs-entree { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

h1, h2, h3, h4, legend { font-family: var(--font-display); letter-spacing: -.01em; }
h2, h3, h4 { color: var(--ink) !important; }
a { color: var(--blue-ink); transition: color .2s var(--ease), background-color .2s var(--ease); }
::selection { background: var(--lilac); color: var(--ink); }

/* couleurs posées en ligne (texte clair prévu pour l'ancien fond ardoise) */
[style*="color:white"], [style*="color: white"], [style*="color : white"],
[style*="color:#fff"], [style*="color: #fff"], [style*="color :#fff"],
[style*="color:#F5D0A9"], [style*="color: #F5D0A9"], [style*="color: rgb(245, 208, 169)"],
[style*="color:#A87A4C"], [style*="color: #A87A4C"],
[style*="color:yellow"], [style*="color:#F9FF33"], [style*="color:#E8EF0F"],
[style*="color:#eca603"], [style*="color: #eca603"], [style*="color:#ADADAD"], [style*="color:#999F7F"] {
	color: var(--ink) !important;
	text-shadow: none !important;
}
[style*="color:#F5D0A9"], [style*="color: #F5D0A9"], [style*="color: rgb(245, 208, 169)"] { color: var(--blue-ink) !important; }
[style*="color:#999F7F"], [style*="color:#ADADAD"], [style*="color: rgb(110"] { color: var(--ink-3) !important; }
[style*="color:orange"], [style*="color: orange"], [style*="color : orange"] { color: var(--accent) !important; }
[style*="color:red"], [style*="color: red"] { color: var(--rose-ink) !important; }

/* fonds sombres translucides -> cartes claires */
[style*="rgba(1,1,1,0.20)"], [style*="rgba(1, 1, 1, 0.2)"], [style*="rgba(1,1,1,0.15)"], [style*="rgba(1,1,1,0.3)"],
[style*="rgba(1,1,1,0.25)"], [style*="rgba(30,30,30,0.3)"], [style*="rgba(10,10,10,0.5)"], [style*="rgba(0,0,0,0.18)"],
[style*="rgba(97,95,92,0.5)"], [style*="rgba(154, 64, 49, 0.1)"], [style*="rgba(154,64,49,0.1)"], [style*="rgba(1,64,49,0.1)"],
[style*="rgba(70, 70, 70, 0.7)"], [style*="rgba(195,169,163,0.4)"], [style*="rgba(237,223,220,0.15)"] {
	background-color: var(--surface-soft) !important;
	color: var(--ink);
}
[style*="background-color:#635350"], [style*="background-color : #635350"], [style*="background-color: #635350"],
[style*="background-color:black"], [style*="background-color: black"] {
	background-color: var(--canvas-2) !important;
	color: var(--ink-2) !important;
	border-radius: 8px;
	font-weight: 600;
}
[style*="background-color: #716761"], [style*="background-color:#716761"] { background-color: transparent !important; }
[style*="rgba(235, 195, 30, 0.8)"], [style*="rgba(235,195,30,0.8)"] { background-color: var(--butter) !important; color: var(--ink) !important; }
[style*="background-color:#D9705B"], [style*="background-color: #D9705B"], [style*="background-color:#D9700B"], [style*="background-color:#D9505B"] {
	background-color: var(--peach) !important; color: var(--ink) !important; border-radius: var(--radius-sm);
}

/* états posés par le JavaScript sur les champs */
[style*="rgba(162, 149, 146, 0.5)"], [style*="rgba(162,149,146,0.5)"],
[style*="rgba(162, 149, 146, 0.2)"], [style*="rgba(182, 168, 166, 0.4)"], [style*="rgba(182,168,166,0.4)"] {
	background-color: #EDF0F6 !important; color: var(--ink-2) !important;            /* verrouillé */
}
[style*="rgba(255, 250, 192, 0.3)"], [style*="rgba(255, 255, 92, 0.3)"], [style*="rgba(250, 255, 192, 0.3)"],
[style*="rgba(250, 250, 192, 0.3)"] {
	background-color: var(--butter) !important; color: var(--ink) !important;         /* modifiable */
}
[style*="rgba(191, 62, 44, 0.5)"] { background-color: var(--rose) !important; color: var(--ink) !important; }  /* à compléter */
[style*="background-color: rgb(85, 86, 65)"] {                                         /* ligne sélectionnée */
	background-color: var(--accent-soft) !important; color: var(--accent-2) !important;
	box-shadow: inset 3px 0 0 var(--accent);
}
[style*="color: rgb(175, 175, 173)"] { color: var(--accent-2) !important; }
[style*="background-color: rgb(1, 70, 146)"] { background-color: var(--blue) !important; color: var(--ink) !important; }
[style*="solid orange"], [style*="solid  orange"] { border-color: var(--blue) !important; border-radius: 10px; }
[style*="border: medium solid orange"] { border-color: var(--accent) !important; }
[style*="border:1px solid orange"], [style*="border: 1px solid orange"] { border: 1px dashed var(--accent) !important; border-radius: 8px; }
[style*="border:1px solid white"], [style*="border: 1px solid white"], [style*="border:2px solid white"] { border-color: var(--line) !important; }

/* ------------------------------------------------------------- barre latérale */
#sidebar {
	background: rgba(255,255,255,.78) !important;
	backdrop-filter: blur(18px) saturate(1.2);
	-webkit-backdrop-filter: blur(18px) saturate(1.2);
	border-right: 1px solid var(--line);
	box-shadow: 4px 0 30px rgba(30,38,64,.05);
	padding: 6px 8px 24px !important;
	box-sizing: border-box;
}
#sidebar a {
	color: var(--ink-2) !important;
	border-radius: 10px;
	margin: 2px 0;
	padding: 9px 12px !important;
	font-weight: 600;
	font-size: 13px;
	transition: background-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);
}
#sidebar a[style*="orange"] {
	color: var(--accent-2) !important;
	background: var(--accent-soft);
	box-shadow: inset 3px 0 0 var(--accent);
}
#sidebar a:hover:not(.active) {
	background-color: var(--canvas-2) !important;
	color: var(--ink) !important;
	transform: translateX(3px);
	font-size: 13px;
}
#sidebar div[style*="#716761"] {
	background: var(--canvas) !important;
	border-radius: 12px;
	padding: 4px;
	border: 1px solid var(--line);
}
#sidebar div[style*="border-top"] { border-color: var(--line) !important; border-radius: 0; }
#sidebar #logo { border-radius: 10px; }
#mAccueil { font-family: var(--font-display); font-weight: 700; font-size: 15px !important; color: var(--ink); }
#BarreM { background: var(--accent) !important; border-radius: 0 0 12px 0; }

/* ------------------------------------------------------------- bandeau "Mettez-vous à la page" */
#flip, #panel {
	background: var(--surface-soft) !important;
	border: 1px solid var(--line) !important;
	border-radius: 0 0 var(--radius) var(--radius);
	color: var(--ink-2) !important;
	backdrop-filter: blur(10px);
	box-shadow: var(--shadow);
}
#flip { font-weight: 600; letter-spacing: .01em; }
#flip:hover { background: var(--accent-soft) !important; color: var(--accent-2) !important; }
#panel .box50 p { color: var(--ink-2); line-height: 1.55; }

/* ------------------------------------------------------------- fenêtre d'aide */
#mydiv {
	background: rgba(255,255,255,.9) !important;
	border: 1px solid var(--line) !important;
	border-radius: var(--radius) !important;
	box-shadow: var(--shadow-lg);
	font-family: var(--font) !important;
	backdrop-filter: blur(14px);
	overflow: hidden;
	padding: 0 !important;
}
#mydivheader {
	background: linear-gradient(120deg, var(--lilac), var(--blue)) !important;
	color: var(--ink) !important;
	font-family: var(--font) !important;
	font-weight: 700;
	border-radius: 0 !important;
	padding: 8px !important;
}
#mydiv span { line-height: 1.5; padding: 0 10px; display: inline-block; }
#Helps2 { color: var(--blue-ink) !important; }
#Helps4 { color: var(--rose-ink) !important; }
#Helpsx0y0 {
	background: var(--surface-soft); border: 1px solid var(--line); border-radius: 999px 0 0 0;
	padding: 6px 10px; color: var(--ink-2); backdrop-filter: blur(8px);
}
#Helpsx0y0 input { accent-color: var(--accent); vertical-align: middle; }

/* ------------------------------------------------------------- conteneur et cartes */
#LeConteneur > div:first-child p { font-family: var(--font-display); font-weight: 700; color: var(--ink); letter-spacing: -.01em; }
#MessageJava { background: var(--peach) !important; color: var(--ink) !important; border-radius: var(--radius-sm); }
#AffichageJava, #RetourAjax { color: var(--ink) !important; }

#SearchProp, #SearchImm, #SearchProp-2, #SearchLoc, #Visu_Temoignage, #Save_Temoignage,
#ModifProp, #ModifImm, #ModifLoca, #SaveProp, #SaveImm, #SaveLoc, #SaveColl, #ModColl, #BTproprio,
#Accueil2, .AuCentre > form, #Enquetes, #Temoignages {
	background-color: var(--surface-soft) !important;
	border-radius: var(--radius) !important;
	box-shadow: var(--shadow);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}
#SearchProp, #SearchImm, #SearchProp-2, #SearchLoc, #Visu_Temoignage, #Save_Temoignage { border: 1px solid var(--line); }

/* cartes d'accueil */
.CarteAccueil {
	color: var(--ink) !important;
	font-weight: 700;
	border-radius: var(--radius);
	transition: transform .35s var(--ease), box-shadow .35s var(--ease), width .35s var(--ease) !important;
}
.CarteAccueil img { border-radius: var(--radius) var(--radius) 0 0; box-shadow: var(--shadow); transition: transform .5s var(--ease), filter .5s var(--ease); }
.CarteAccueil:hover { color: var(--accent-2) !important; }
.CarteAccueil:hover img { transform: scale(1.02); filter: saturate(1.08); }
#Accueil h3, #Accueil p, #Accueil h2 { color: var(--ink) !important; }

/* ------------------------------------------------------------- formulaires */
fieldset {
	border: 1px solid var(--line) !important;
	border-radius: var(--radius) !important;
	background-color: var(--surface-soft) !important;
	box-shadow: var(--shadow);
}
legend {
	color: var(--ink) !important;
	font-weight: 700;
	padding: 2px 10px !important;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 999px;
	font-size: 13px;
}
.text-form {
	color: var(--ink-2) !important;
	background: transparent !important;
	text-shadow: none !important;
	font-weight: 600 !important;
	letter-spacing: .01em;
}
input[type=text], input[type=email], input[type=tel], input[type=password], input[type=number], input:not([type]), select, textarea {
	font-family: var(--font) !important;
	color: var(--ink) !important;
	background: var(--surface) !important;
	border: 1px solid var(--line-strong) !important;
	border-radius: 9px !important;
	transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease);
}
/* le fond posé par le JS reste visible (verrouillé / modifiable / à compléter) */
input[style*="background-color: rgba(162"], input[style*="background-color: rgba(182"] { background-color: #EDF0F6 !important; }
input[style*="background-color: rgba(255, 250"], input[style*="background-color: rgba(250"], input[style*="background-color: rgba(255, 255, 92"] { background-color: var(--butter) !important; }
input[style*="background-color: rgba(191"] { background-color: var(--rose) !important; }
input::placeholder, textarea::placeholder { color: var(--ink-3) !important; opacity: 1; }
input:focus, select:focus, textarea:focus {
	outline: none !important;
	border-color: var(--accent) !important;
	box-shadow: 0 0 0 4px rgba(91,108,240,.16) !important;
}
input:user-invalid { border-color: #E9A3A3 !important; }
input[type=radio], input[type=checkbox] { accent-color: var(--accent); }
input[type=range] { accent-color: var(--accent); }
.contact-form input { background-image: none !important; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px var(--surface) inset !important; -webkit-text-fill-color: var(--ink); }

/* boutons */
input[type=submit], input[type=reset], input[type=button], button, .BoutonBS, .button-2 {
	font-family: var(--font) !important;
	font-weight: 700 !important;
	letter-spacing: .01em;
	border-radius: 999px !important;
	border: 1px solid transparent !important;
	cursor: pointer;
	transition: transform .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease) !important;
}
input[type=submit], .contact-form input[type=submit] {
	background: var(--accent) !important;
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(91,108,240,.28);
}
input[type=submit]:hover { background: var(--accent-2) !important; box-shadow: 0 10px 22px rgba(91,108,240,.32); border-width: 1px !important; }
input[type=submit]:active, input[type=reset]:active, .BoutonBS:active { transform: translateY(1px) scale(.99); border-width: 1px !important; margin-top: 0 !important; }
input[type=reset], input[type=button] {
	background: var(--surface) !important;
	color: var(--ink-2) !important;
	border-color: var(--line-strong) !important;
}
input[type=reset]:hover, input[type=button]:hover { background: var(--canvas-2) !important; color: var(--ink) !important; border-width: 1px !important; }
.BoutonBS, .BoutonBS:before {
	background: var(--surface) !important;
	color: var(--ink) !important;
	border: 1px solid var(--line-strong) !important;
	box-shadow: var(--shadow);
	line-height: 1.15;
}
.BoutonBS:hover { background: var(--accent-soft) !important; color: var(--accent-2) !important; border-color: var(--accent) !important; padding: 7px !important; }
button.BoutonBS { color: var(--ink) !important; }
#LibelleB, #LibelleP { color: var(--ink) !important; }

.closeX {
	background: var(--surface) !important;
	color: var(--ink-2) !important;
	border: 1px solid var(--line);
	border-radius: 999px;
	width: 22px; height: 22px; line-height: 22px;
	text-align: center; padding: 0 !important; font-weight: 700;
	box-shadow: var(--shadow);
	transition: transform .25s var(--ease), background-color .2s var(--ease);
}
.closeX:hover { background: var(--rose) !important; color: var(--rose-ink) !important; transform: rotate(90deg); }

.BarreDeTrie { background: var(--surface) !important; color: var(--ink-2) !important; border: 1px solid var(--line) !important; border-radius: 999px; }
.BarreDeTrie:hover { background: var(--accent-soft) !important; color: var(--accent-2) !important; }
.BarreDeTrie:active { background: var(--accent) !important; color: #fff !important; }
.ClasseTrie { color: var(--ink-3) !important; }

#Reset_p, #Reset_i, #Reset_l, #Reset_p2 { background: var(--sage) !important; color: var(--sage-ink) !important; border-radius: 999px; padding: 2px 8px; }
#Reset_i:hover, #Reset_p:hover, #Reset_p2:hover, #Reset_l:hover { background: #B7DCC8 !important; }
#BMficheProp, #BMficheImm, #BMficheLoc { background: var(--surface) !important; color: var(--ink-2) !important; border: 1px solid var(--line-strong) !important; }
#BMficheProp:hover, #BMficheImm:hover, #BMficheLoc:hover { background: var(--accent-soft) !important; color: var(--accent-2) !important; }
#BienF:hover, #PropI:hover { background-color: var(--accent-soft) !important; }

/* ------------------------------------------------------------- listes de résultats */
#LeConteneur table, .AuCentre table { border-collapse: separate !important; border-spacing: 0 2px; }
body tr, #LeConteneur tr, body a[id^="CL"], #LeConteneur a[id^="CL"], #LeConteneur a[id^="CI"], #LeConteneur a[id^="Exp"] {
	color: var(--ink) !important;
	border-radius: 8px;
	transition: background-color .2s var(--ease), color .2s var(--ease);
}
body tr:hover, #LeConteneur tr:hover, body a[id^="CL"]:hover, body a[id^="CI"]:hover, body a[id^="Exp"]:hover, #LeConteneur a[id^="CL"]:hover, #LeConteneur a[id^="CI"]:hover, #LeConteneur a[id^="Exp"]:hover {
	background-color: var(--accent-soft) !important;
	color: var(--accent-2) !important;
}
body td { padding: 3px 4px; }
body a[id^="CI"], body a[id^="Exp"], body a[id^="ExpO"] { color: var(--ink) !important; border-radius: 8px; }
#LeConteneur tr td:first-child { font-weight: 700; }

/* messages d'erreur du site (bandeaux fixes) */
div[style*="position:fixed"][style*="background-color:red"] {
	background: var(--rose) !important;
	color: var(--rose-ink) !important;
	border: 1px solid #F2C2C2;
	border-radius: var(--radius-sm) !important;
	box-shadow: var(--shadow-lg);
	padding: 10px 14px !important;
	font-weight: 600;
	animation: bs-entree .4s var(--ease) both;
}
.error, #error { color: var(--rose-ink) !important; }
.captcha-local { font-size: 12px; color: var(--ink-3); background: var(--canvas-2); border-radius: 999px; padding: 6px 12px; display: inline-block; }

/* défilement discret */
* { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 9px; }
::-webkit-scrollbar-track { background: transparent; }

:focus-visible { outline: 2px solid var(--accent) !important; outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ------------------------------------------------------------- inscription / mot de passe perdu (style.css) */
#AccrochNew, .Message2, .Message1, .error, .text-form, h4 a, .AuCentre .header { color: var(--ink-2) !important; text-shadow: none !important; }
#AccrochNew { background: var(--accent-soft); border-radius: var(--radius-sm); padding: 10px 14px; }
[style*="color: #FAAC45"], [style*="color:#FAAC45"] { color: var(--accent-2) !important; }
[style*="background-color: #FAAC45"] { background-color: var(--accent) !important; color: #fff !important; }
.AuCentre > form { padding: 26px 28px; }
.button-2 { background: var(--accent) !important; color: #fff !important; padding: 12px 22px !important; box-shadow: 0 6px 16px rgba(91,108,240,.28); }

/* inscription / fiche agence : adresse sur 2 lignes */
textarea[data-une-ligne] { width: 100%; max-width: 352px; box-sizing: border-box; font-family: var(--font); }
.es-rang > textarea[data-une-ligne] { max-width: none; }
