/*
Theme Name: DutyAdvisor
Theme URI: https://www.dutyadvisor.com/
Author: DutyAdvisor
Author URI: https://www.dutyadvisor.com/
Description: Thème de base pour l'application DutyAdvisor
Version: 0.1.11
Text Domain: dutyadvisor
Domain Path: /languages
*/

/* Pour éviter l'effet flash des composants non chargés FOUCE */
/* TO DO : faire javascript pour avoir un rendu plus soft :
	- https://shoelace.style/getting-started/usage#waiting-for-components-to-load
	- https://www.abeautifulsite.net/posts/flash-of-undefined-custom-elements/
*/
:not(:defined) {
	visibility: hidden;
}


:root {
	--couleur-noir: #343434;
	--couleur-gris: #ebebeb;
	--couleur-gris-filet-fond-blanc: #d3d3d3;
	--couleur-gris-filet-fond-gris: #b5b5b5;
	--couleur-dad: #d70466;
	--couleur-blanc: #fff;
	--couleur-icone-warning: var(--couleur-dad);
	--couleur-grc-sinistre: #7698f0;
	--couleur-grc-opportunite: #FF5D2D;
	--couleur-grc-tache: #3ba755;
	--font-size-normal: 13px;
	--font-size-menu-interaction: var(--font-size-normal);
	--default-radius: 10px;
	--large-radius: 25px;
	--menu-lateral-width: 130px;
	--menu-lateral-interaction-width: 200px;
	--small-padding: 10px;
	--medium-padding: 20px;
	--large-padding: 30px;
	--x-large-padding: 50px;
	--header-height: 70px;
	--height-header-single-compte: 60px;
	--header-intercation-height: 90px;
	--interaction-contenu-height: calc(100vh - var(--header-intercation-height) - ( 3 * var(--small-padding) ));
	--header-height-with-margin: calc( var(--header-height) + ( 2 * var(--small-padding) ) );
	--menu-lateral-min-height: calc(100vh - var(--header-height-with-margin) - 10px);
	--height-panel-single-compte: calc(var(--menu-lateral-min-height) - var(--small-padding) - var(--height-header-single-compte));
	--height-h1: 30px;
	--height-h2: 22px;
	--largeur-compte-entete-interaction: 80px;
	--largeur-label-input: 110px;
	--largeur-label-input-small: 80px;		/* Utilisé pour les dispositions en 3 colonnes */
	--largeur-card-membre: 220px;
	--largeur-card-membre-pro-pm: 290px;
	--largeur-colonne-categorie-assurance: 150px;
	--largeur-colonne-tab-assurances: 230px;
	--largeur-colonne-compte-rubrique: 250px;
	--largeur-colonne-compte-pro-pm-rubrique: 450px;
	--largeur-colonne-compte-rubrique-epargne: 75vw;
	--largeur-colonne-compte-rubrique-labels: 120px;
	--background-client-decede: linear-gradient(to bottom, darkgrey, var(--couleur-gris));
	--sl-input-background-color-disabled: var(--sl-color-neutral-50);
}

html {box-sizing: border-box;}
*, *::before, *::after {box-sizing: inherit;}

body {
	margin: 0;
	font-family: 'Inter Tight', sans-serif;
	background: #fff;
	color: var(--couleur-noir);
	text-rendering: optimizeLegibility; 
	word-wrap: normal !important;
	-webkit-hyphens: none !important;
	hyphens: none !important;
	-webkit-word-break: normal !important;
	word-break: normal !important;
	font-optical-sizing: auto;
	font-style: normal;
	font-size: var(--font-size-normal);
}

/* Bandeau warning site training */
div.warning_base_training {display: flex; align-items: baseline; justify-content: center; color: var(--couleur-blanc); background-color: red;}
div.warning_base_training h2 {padding-right: 5px;}
div.warning_base_training div {font-size: 15px;}

a {color: var(--couleur-noir); text-decoration: underline;}
a:hover {color: var(--couleur-dad);}
a:visited {opacity: 0.8;}

h1 {font-size: var(--height-h1);}
h2 {font-size: var(--height-h2);}

.display-none {display: none !important;}

a.lien_retour {font-size: 14px;}

#main_container {padding: var(--small-padding); min-height: 100vh;}

.chasse_fixe,  sl-input.chasse_fixe::part(input) {font-family: 'roboto-mono', sans-serif;}
sl-input.monetaire::part(input), sl-input.entier::part(input), sl-input.pourcentage::part(input) {font-family: 'roboto-mono', sans-serif; text-align: right;}
.full_width {width: 100%;}
.overflow-ellipsis {overflow-x: hidden; text-overflow: ellipsis;}

/* autoCompleteJS */
.autoComplete_wrapper {width: 100%;}
.autoComplete_wrapper > input {
	max-width: 100%; width: 100%; font-size: var(--sl-input-font-size-medium); color: var(--couleur-noir); border: solid var(--sl-input-border-width) var(--sl-input-border-color);
	border-radius: var(--sl-input-border-radius-small);
}
.autoComplete_wrapper > input:focus {
	background-color: var(--sl-input-background-color-focus); border-color: var(--sl-input-border-color-focus); 
	box-shadow: 0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color);
}
.autoComplete_wrapper > ul > li {font-size: 13px; padding: 10px 10px;}
.autoComplete_wrapper > ul {box-shadow: 0 12px 16px rgba(0, 0, 0, 0.2); min-height: 100px;}


/* ----- */
/* CARDS */
/* ----- */
.card {border-radius: var(--default-radius); padding: var(--small-padding); position: relative;}
/* .card_gris, .card_dad, .card_blanc {border-radius: var(--default-radius); padding: var(--small-padding); position: relative;} */
.card_gris {background-color: var(--couleur-gris);}
.card_blanc {background-color: var(--couleur-blanc);}
.card_dad {background-color: var(--couleur-dad); color: var(--couleur-blanc);}
.card_noir {background-color: var(--couleur-noir); color: var(--couleur-blanc);}
.card.new_item {text-align: center; display: flex; align-items: center; border: 2px dashed var(--couleur-gris-filet-fond-blanc);}
/* sl-icon-button dans un card en position bas droite */


/* sl-icon + span = ajoute margin pour éloigner le span de l'icone */
sl-icon + span, span + sl-icon {margin-left: 5px;}

/* Boutons circle small */
sl-button[circle][size="small"]::part(base) {min-height: 20px; height: 20px; width: 20px; line-height: 23px;}
sl-button[circle][size="small"]::part(label) {padding: 0; font-size:18px;}

sl-icon.dad_warning {color: var(--couleur-icone-warning); font-size: 18px;}
sl-tooltip sl-icon {cursor: pointer;}

/* Menus */
sl-menu a {text-decoration: none;}

/* -------------------- */
/* CHAMPS DE FORMULAIRE */
/* -------------------- */

/* Labels à gauche sur sl-select et sl-input et sl-textarea */
.labels_a_gauche sl-select::part(form-control), .labels_a_gauche sl-input::part(form-control), .labels_a_gauche div.select_with_search,
.labels_a_gauche sl-textarea::part(form-control), .labels_a_gauche sl-radio-group::part(form-control), .input_avec_label {
	display: grid; grid-template-columns: var(--largeur-label-input) auto; align-items: center; column-gap: 5px;
}
.labels_a_gauche sl-select::part(form-control-label), .labels_a_gauche sl-input::part(form-control-label),
.labels_a_gauche sl-textarea::part(form-control-label), .labels_a_gauche sl-radio-group::part(form-control-label) {
	margin-bottom: 0;
}
.labels_a_gauche sl-textarea::part(form-control) {align-items: start;}
.labels_a_gauche sl-textarea::part(form-control-label) {padding-top: 0.5em;}
.labels_a_gauche sl-select::part(form-control-help-text), .labels_a_gauche sl-input::part(form-control-help-text),
.labels_a_gauche sl-textarea::part(form-control-help-text) {grid-column: 2; grid-row: 2;}

/* select avec search Choices */
.choices__inner {background-color: var(--couleur-blanc);}
.choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list {max-height: 200px;}
.choices, .choices__list--dropdown .choices__item, .choices__list[aria-expanded] .choices__item, .choices__inner {font-size: var(--font-size-normal);}
.choices.is-disabled .choices__inner, .choices.is-disabled .choices__input {background-color: var(--sl-input-background-color-disabled); color: var(--sl-input-color-disabled); opacity: 0.5;}

/* Positionnement input et tooltip de warning */
div.champ_avec_tooltip {position: relative;}
div.champ_avec_tooltip sl-tooltip, div.champ_avec_tooltip sl-tooltip sl-icon {position: absolute; left: calc(var(--largeur-label-input) - 20px); top: 30%;}

*::placeholder, sl-input::part(input)::placeholder, sl-select::part(display-input)::placeholder {color: var(--couleur-gris-filet-fond-blanc); font-style: italic; text-align: left;}

/* sl-radio inline */
.inline_radios sl-radio-group::part(form-control-input) {display: inline-block; margin-left: var(--medium-padding);}
.inline_radios sl-radio-group sl-radio {display: inline-block; margin-right: var(--small-padding);}
.inline_radios sl-radio-group sl-radio:last-of-type {margin-right: 0;}

/* ---------------------------- */
/* Dispositions GRID 2 colonnes */
/* ---------------------------- */
.grid_deux_colonnes {display: grid; grid-template-columns: repeat(2, 1fr); column-gap: var(--large-padding); row-gap: var(--small-padding);}
.grid_deux_colonnes .full_row {grid-column: 1 / -1;}
.grid_deux_colonnes sl-checkbox, .grid_deux_colonnes sl-switch {align-content: center;}

/* ---------------------------- */
/* Dispositions GRID 3 colonnes */
/* ---------------------------- */
.grid_trois_colonnes {display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--large-padding); row-gap: var(--small-padding);}
.grid_trois_colonnes .full_row {grid-column: 1 / -1;}
.grid_trois_colonnes sl-checkbox, .grid_trois_colonnes sl-switch {align-content: center;}

/* ---------------------------- */
/* Dispositions GRID 4 colonnes */
/* ---------------------------- */
.grid_quatre_colonnes {display: grid; grid-template-columns: repeat(4, 1fr); column-gap: var(--medium-padding); row-gap: var(--medium-padding);}
.grid_quatre_colonnes .full_row {grid-column: 1 / -1;}
.grid_quatre_colonnes sl-checkbox, .grid_quatre_colonnes sl-switch {align-content: center;}

/* Champs de formulaire disabled */
sl-input[disabled]::part(base), sl-select[disabled]::part(combobox) {opacity: 0.85;}

/* Zone de messages sl-alert */
div.zone_message sl-alert, div.zone_message_synchro sl-alert {margin-bottom: var(--medium-padding);}

/* ------------- */
/* ALERTES TOAST */
/* ------------- */
.sl-toast-stack {bottom: 0; top:auto;}

/* ---------- */
/* SL-DETAILS */
/* ---------- */
sl-details[open]::part(header) {background-color: var(--couleur-gris); color: var(--couleur-dad);}
sl-details[open]::part(base) {border-color: var(--couleur-dad); border-width: 2px;}
sl-details .sl_summary_resume {margin-left: 6px; font-weight: 600;}


/* --------- */
/* SL-DIALOG */
/* --------- */
sl-dialog::part(header) {background-color: var(--couleur-gris); border-radius: var(--default-radius); margin: var(--small-padding) var(--small-padding) 0 var(--small-padding);}
sl-dialog::part(title) {color: var(--couleur-dad); font-weight: 600;}
sl-dialog::part(body) {padding: var(--medium-padding);}
sl-dialog::part(footer) {padding: var(--small-padding);}
sl-dialog label {display: flex; align-items: center;}
sl-dialog label[slot="label"] sl-icon {font-size: 30px;}
sl-dialog label[slot="label"] span + sl-badge, sl-dialog label[slot="label"] span + sl-select {margin-left: var(--small-padding);}

/* Sl-dialog en mode modale */
sl-dialog.popin_modale::part(header) {background-color: var(--couleur-dad);}
sl-dialog.popin_modale::part(title) {color: var(--couleur-blanc); font-weight: 600;}
sl-dialog.popin_modale::part(close-button) {color: var(--couleur-blanc);}
sl-dialog.popin_modale::part(close-button__base):hover {color: var(--couleur-blanc);}

/* -------------------------- */
/* SL-RADIO-BUTTON AVEC ICONE */
/* -------------------------- */
sl-radio-button sl-icon {font-size: 150%;}

/* ------------------- */
/* SL-INPUT AVEC ICONE */
/* ------------------- */
sl-input sl-icon {font-size: 150%;}

/* ------------- */
/* H3 avec BADGE */
/* ------------- */
h2 > sl-badge {margin-left: 10px;}
h3 > sl-badge {margin-left: 5px;}
h4 > sl-badge {margin-left: 5px;}

/* SL-ICON BTN_ADD */
sl-icon-button.btn_add {font-size: 30px;}

/* INLINE CHECKBOXES */
.inline_checkboxes sl-checkbox:not(:has(+ sl-tooltip)), .inline_checkboxes sl-tooltip sl-icon {margin-right: var(--medium-padding);}
.inline_checkboxes sl-checkbox:last-of-type {margin-right: 0;}


/* -------------------------------------------------- */
/* BADGES ET ICONES SINISTRES, OPPORTUNITES ET TACHES */
/* -------------------------------------------------- */
sl-icon[name="sinistre"] {color: var(--couleur-grc-sinistre);}
sl-icon[name="opportunite"] {color: var(--couleur-grc-opportunite);}
sl-icon[name="tache"] {color: var(--couleur-grc-tache);}
sl-icon[name="sinistre"], sl-icon[name="opportunite"], sl-icon[name="tache"] {font-size: 25px;}
sl-badge[variant="sinistre"]::part(base) {background-color: var(--couleur-grc-sinistre); color: #fff;}
sl-badge[variant="opportunite"]::part(base) {background-color: var(--couleur-grc-opportunite); color: #fff;}
sl-badge[variant="tache"]::part(base) {background-color: var(--couleur-grc-tache); color: #fff;}


/* ============= */
/* GRID REPEATER */
/* ============= */
table.repeater_grid sl-input::part(input) {width: 100%;}
table.repeater_grid {width: 100%;}
table.repeater_grid thead th {text-align: left; padding-bottom: var(--small-padding);}
table.repeater_grid thead th .card {border: 1px solid var(--couleur-gris-filet-fond-gris); font-weight: 600;}
table.repeater_grid thead th, table.repeater_grid tbody td {padding-right:var(--small-padding);}
table.repeater_grid tbody td {padding-bottom: 5px;}
table.repeater_grid tbody tr.skeleton td div {
	background-color: var(--couleur-blanc); height:30px; line-height: 30px; opacity: 0.7; font-style: italic; font-size: 12px; padding: 0 10px; color: var(--couleur-gris-filet-fond-blanc);
}

/* ========================== */
/* Autocomplete search Compte */
/* ========================== */
input.autocomplete_search_compte:focus {
	background-color: var(--sl-input-background-color-focus);
    border-color: var(--sl-input-border-color-focus);
    box-shadow: 0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color);
	border-width: 2px;
}
.autoComplete_wrapper:has(>input.autocomplete_search_compte) > ul > li {padding-left: 50px; font-size: 14px; display: flex; justify-content: space-between;}
.autoComplete_wrapper:has(>input.autocomplete_search_compte) > ul > li span.statut_compte {text-transform: uppercase; font-size: 13px; color: grey; margin-left: 6px;}
.autoComplete_wrapper:has(>input.autocomplete_search_compte) > ul > li sl-icon {font-size: 130%; position: absolute; left: 20px;}
.autoComplete_wrapper > ul > li mark {color: var(--couleur-dad);}


/* ------ */
/* HEADER */
/* ------ */
header.header {margin-bottom: var(--small-padding);}
header div.header {
	height: var(--header-height); color: var(--couleur-blanc); background-color: var(--couleur-noir); border-radius: var(--default-radius); 
	display: flex; justify-content: space-between; align-items: center;
}
#header_zone_gauche {display: flex; align-items: center; justify-content: space-between;}
#header_logo {text-align: center; width: var(--menu-lateral-width);}
#header_logo img {height: 50px;}
#header_zone_gauche #header_search {width: 35vw; color: var(--couleur-noir);}

#input_header_search {border-radius: var(--sl-input-height-medium); padding: 0 var(--sl-input-spacing-medium);}
#header_search .autoComplete_wrapper > ul {min-height: 270px; height: 270px; padding-bottom: var(--small-padding);}

#header_zone_droite ul li {display: inline-block; position: relative; opacity: 0.7;}
#header_zone_droite ul li:hover {opacity: 1;}
#header_zone_droite ul li sl-icon-button {color: var(--couleur-blanc);}
#header_zone_droite ul.header_menu_droite {display: flex; align-items: center; font-size: 150%;}
#header_zone_droite ul li.header_user sl-icon-button {font-size: 200%}
#header_zone_droite ul li.dad-actif {font-weight: 600; opacity: 1;}
#header_zone_droite ul li.dad-actif:after {content: ''; position: absolute; width: 70%; border-bottom: 6px solid var(--couleur-dad); bottom: -5px; left: 15%;}

#header_zone_droite ul li.header_configuration, #header_zone_droite ul li.header_notification {display: none;}


/* ------------------------------------------------ */
/* Zone principale : menu lateral + zone de contenu */
/* ------------------------------------------------ */
div.zone_page {display: flex;}
#menu_lateral {
	margin-right: 20px; color: var(--couleur-blanc); background-color: var(--couleur-noir); min-height: var(--menu-lateral-min-height); max-height: var(--menu-lateral-min-height); /*max-height: calc(100vh - 2 * var(--small-padding));*/
	width: var(--menu-lateral-width); min-width: var(--menu-lateral-width); border-radius: var(--default-radius);
	font-size: 12px; position: relative;
}
#menu_lateral ul.menu_principal {text-align: center; margin:0; padding:0;}
#menu_lateral ul.menu_principal li {list-style-type: none; margin: var(--large-padding) 0;}
#menu_lateral ul.menu_principal li a {color: var(--couleur-blanc); text-decoration: none; opacity: 0.7; display: block; position: relative;}
#menu_lateral ul.menu_principal li a sl-icon {font-size: 30px;}
#menu_lateral ul.menu_principal li a span {display: block; padding: 0 var(--small-padding);}
#menu_lateral ul.menu_principal li a:hover {opacity: 1;}
#menu_lateral ul.menu_principal li a.dad-actif {opacity: 1; font-weight: 600; font-size: 130%;}
#menu_lateral ul.menu_principal li a.dad-actif:after {content:''; position:absolute; top: 15%; right: -2px; height: 70%; display: inline-block; border-right: 6px solid var(--couleur-dad);}

#menu_lateral .zone_lien_grc {text-align: center; width: 100%; position: absolute; bottom: 12px; left: 0;}

/* #zone_contenu {width: calc(100% - 20px - var(--menu-lateral-width));}*/	/* prend la largeur restante */
#zone_contenu {flex: 1; min-width: 0;}

/* ------------- */
/* Page de login */
/* ------------- */
body.page-template-login div.rangee_connexion {
	margin: 10vh 15vw; width: 70vw; height: 80vh; max-height: 500px;
	background-color: var(--couleur-gris); border-radius: var(--large-radius); box-shadow: var(--sl-shadow-x-large);
	display: flex;
}
body.page-template-login div.login_partie_gauche {
	width: 55%; height: 100%; border-radius: var(--large-radius) 0 0 var(--large-radius);
	background-image: url("img/img-connexion.jpg"); background-size: cover; background-repeat: no-repeat; background-position: center;
	display: flex; align-items: center; justify-content: center;
}
body.page-template-login div.login_partie_gauche img {width: 300px;}
body.page-template-login div.login_partie_gauche h2, body.page-template-login div.login_partie_gauche div.login_quote {text-align: center; color: var(--couleur-dad);}
body.page-template-login div.login_partie_gauche sl-icon {rotate: 180deg; font-size: 40px; margin-top: -20px;}

body.page-template-login div.login_partie_droite {height: 100%; width: 45%; padding: var(--x-large-padding);}
body.page-template-login div.login_partie_droite h1, body.page-template-login div.login_partie_droite h3, body.page-template-login div.login_partie_droite div {
	text-align: center;
}
body.page-template-login div.login_partie_droite h1, body.page-template-login div.login_partie_droite div {
	color: var(--couleur-dad);
}
body.page-template-login div.login_partie_droite h1 {margin-top: 0;}
body.page-template-login div.login_partie_droite h3 {margin-bottom: var(--x-large-padding);}
body.page-template-login div.login_partie_droite div sl-icon {font-size: 30px;}
body.page-template-login div.login_partie_droite form sl-input {margin-bottom: var(--medium-padding);}
body.page-template-login div.login_partie_droite div.forget_password {text-align:right;}
body.page-template-login div.login_partie_droite form div.submit {text-align: center; margin: var(--medium-padding) 0;}

body.page-template-login div.login_partie_droite div.retour_login {margin-top: 30px; text-align:left;}

/* Responsive page de login : affichage en iframe quand timeout */
@media (max-width: 1000px) {
	body.page-template-login div.rangee_connexion {margin: 5vh 10vw; width: 80vw; height: 90vh;}
	body.page-template-login div.login_partie_gauche {width: 40%;}
	body.page-template-login div.login_partie_gauche img {width: 200px;}
	body.page-template-login div.login_partie_droite {width: 60%; padding: var(--large-padding);}
}

@media (max-width: 800px) {
	body.page-template-login div.rangee_connexion {margin: 5vh 5vw; width: 90vw; flex-direction: column;}
	body.page-template-login div.login_partie_gauche {width: 100%; border-radius: var(--large-radius) var(--large-radius) 0 0; }
	body.page-template-login div.login_partie_gauche h2, body.page-template-login div.login_partie_gauche div.login_quote {display: none;}
	body.page-template-login div.login_partie_droite {width: 100%;}
	body.page-template-login div.login_partie_droite form {max-width: 400px; margin: 0 auto;}
}
/* Format quand la page de login se réaffiche en iframe pour reconnexion */
@media (max-width: 381px) {
	body.page-template-login div.rangee_connexion {margin: 5% 3%; width: 94%; flex-direction: column;}
	body.page-template-login div.login_partie_gauche {display: none;}
	body.page-template-login div.login_partie_droite {width: 100%;}
	body.page-template-login div.login_partie_droite form {max-width: 340px; margin: 0 auto;}
}


/* ==================================== */
/* Pages de liste (comptes, groupes...) */
/* ==================================== */

/* Zone filtre */
div#zone_filtres {display: flex; margin-bottom: var(--medium-padding); align-items: center;}
div#zone_filtres div.un_filtre {width: 21%; margin-right: var(--small-padding);}
div.tabulator-cell[tabulator-field=dad_compte_type] sl-icon {font-size: 15px;}

/* ================================== */
/* ACCUEIL DASHBOARD				  */
/* ================================== */
.accueil_dashboard {height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.accueil_message {margin-bottom: var(--x-large-padding); text-align: center; /*border: 1px solid var(--couleur-dad)*/; margin-top: var(--medium-padding); padding: var(--medium-padding);}
.accueil_message h1 {color: var(--couleur-dad); margin: 0;}
.accueil_message h3 {margin-top: var(--small-padding); margin-bottom: 0; font-weight: 500; font-size: 18px;}
.accueil_message p {font-size: 16px; display: none;	}
.accueil_rangee_cards {display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--x-large-padding); margin: 0 var(--x-large-padding); }
.accueil_rangee_cards a {text-decoration: none;}
.accueil_rangee_cards a:hover .card {background-color: rgba(0, 0, 0, 0.02); border-color: var(--couleur-dad); box-shadow: 0 0 10px rgba(0, 0, 0, 0.15)}
.accueil_rangee_cards .card.card_blanc {text-align: center; padding: var(--x-large-padding); box-shadow: 0 0 18px rgba(0, 0, 0, 0.15);}
.accueil_rangee_cards .card.card_blanc sl-icon {font-size: 60px; color: var(--couleur-dad);}
.accueil_rangee_cards .card.card_blanc p {font-size: 14px; }
.accueil_footer {display: flex; justify-content: space-between; align-items: center;}
.accueil_footer .baseline_dad {color: var(--couleur-dad); font-weight: 500; font-size: 15px;}


/* ================================== */
/* SYNCHRONISATIONS  				  */
/* ================================== */
.synchro_warning {display: flex; flex-direction: column; margin-bottom: var(--medium-padding);}
.synchro_warning .synchro_titre {display: flex; align-items: center; column-gap: var(--large-padding);}
.synchro_warning sl-icon {font-size: 60px; color: var(--couleur-dad);}
.synchro_warning ul {padding-left: 1em; line-height: 1.5; font-size: 15px;}

.synchro_choix {display: grid; grid-template-columns: repeat(2, 1fr); column-gap: var(--large-padding); padding: var(--large-padding) var(--large-padding);}
.synchro_choix .card_blanc {border: 1px solid var(--couleur-gris-filet-fond-blanc); padding-left: var(--medium-padding); padding-right: var(--medium-padding); height: 100%;}
.synchro_choix form[name="form_synchro_vers_dad"] div, .synchro_choix form[name="form_synchro_un_compte_vers_dad"] div {margin-bottom: var(--medium-padding);}
.synchro_choix .synchro_vers_dad .grid_deux_colonnes {position: relative;}
.synchro_choix span.label_ou {position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); font-weight: 600;}



/* ================================== */
/* Pages SINGLE */
/* ================================== */

sl-icon[name="ruban-noir"] {color: var(--couleur-noir);}

/* Header */
.single_header {width: 100%; display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--small-padding);}
body.single-dad_compte .single_header {height: var(--height-header-single-compte);}
.single_header.decede {background: var(--background-client-decede);}
.single_header .partie_gauche {display: flex; justify-content: space-between; align-items: center;}
.single_header .partie_gauche div.avatar_et_nom_et_statut {display: flex; align-items: center; column-gap: var(--small-padding);}
.single_header .partie_gauche div.avatar_et_nom_et_statut > * {margin-top: 0; margin-bottom: 0;}
.single_header h2 {color: var(--couleur-dad);}
sl-avatar::part(base) {background-color: var(--couleur-dad); --size: calc(2 * var(--height-h2));}

/* Partie contenu */
.zone_affichage_single {width: 100%;}

.zone_affichage_single sl-tab-group[placement="start"] {--track-width: 4px; --track-color: transparent;}
/* Permet d'avoir la nav de gauche d'une hauteur différente du panel */
.zone_affichage_single sl-tab-group[placement="start"]::part(base) {align-items: flex-start;}
.zone_affichage_single sl-tab-group[placement="start"]::part(nav) {margin-right: var(--medium-padding); min-width: 200px;}
.zone_affichage_single sl-tab-group[placement="start"]::part(nav), .zone_affichage_single sl-tab-group[placement=start]::part(body) {
	background-color: var(--couleur-gris); border-radius: var(--default-radius); padding: var(--small-padding);
}
.zone_affichage_single sl-tab-group[placement="start"]::part(active-tab-indicator) {border-left: solid var(--track-width) var(--indicator-color); border-right: 0; left: 0; height: 16px; top: 5px;}
.zone_affichage_single sl-tab-group[placement="start"] > sl-tab::part(base) {padding: 5px 0 5px calc(var(--track-width) + var(--small-padding) );}
.zone_affichage_single sl-tab-group[placement="start"] > sl-tab sl-icon {font-size: 10px; line-height: var(--font-size-normal); margin-left: 4px;}
.zone_affichage_single sl-tab-group[placement="start"] > sl-tab sl-badge {position: absolute; right: 0;}
.zone_affichage_single sl-tab-group[placement="start"] > sl-tab .total_objets {font-size: 85%; color: var(--sl-color-gray-400); margin-top: 1px;}

/* Hauteur mini du panel */
sl-tab-group.single_compte::part(body) {min-height: var(--nav-height);}

/* Gestion scroll interne sur page single compte */
body.single-dad_compte .zone_affichage_single sl-tab-group.single_compte::part(nav) {height: var(--height-panel-single-compte);}
body.single-dad_compte .zone_affichage_single sl-tab-group.single_compte::part(body) {height: var(--height-panel-single-compte);}
body.single-dad_compte .zone_affichage_single sl-tab-panel.main_panel {height: calc(var(--height-panel-single-compte) - ( 2 * var(--small-padding) ) ); overflow-y: auto;}


/* Warnings dans le menu latéral */
.zone_affichage_single sl-tab-group[placement="start"] > sl-tab sl-badge.erreur {display: none;}
.zone_affichage_single sl-tab-group[placement="start"] > sl-tab.erreur sl-badge.erreur {display: initial;}


/* Cards détail d'un compte */
div.compte_details {width: var(--largeur-card-membre); min-width: var(--largeur-card-membre); margin-right: var(--medium-padding);}
div.compte_details div.badge_tns {position: absolute; top: 4px; right: 4px;}
div.compte_details .compte_card {margin-bottom: var(--small-padding);}
div.compte_details .compte_card div {margin-bottom: 4px;}
div.compte_details .compte_card:not(.compte_resume) h4 {color: var(--couleur-dad); margin: 0 0 6px 0;}
div.compte_details .compte_resume {display: grid; grid-template-columns: 40px 1fr; grid-column-gap: var(--small-padding);}
div.compte_details .compte_resume .compte_icone_genre {text-align: center; text-transform: uppercase;}
div.compte_details .compte_resume .compte_icone_genre sl-icon {font-size: 40px;}
div.compte_details .compte_resume .compte_icone_genre div {overflow: hidden;}
div.compte_details .compte_resume h4 {padding-top: 0; margin-top: 0; margin-bottom: var(--small-padding);}
div.compte_details .compte_resume.decede {background: var(--background-client-decede);}
div.compte_details .compte_resume .client_decede {position: absolute; top: 6px; right:4px;}
div.compte_details .compte_resume span.situation_familiale {margin-right: 5px;}
/* Icone lien GRC */
.card span.lien_grc {position: absolute; right: 0; top: 0;}
.card span.lien_grc.lien_compte sl-icon-button {color: var(--couleur-blanc);}
/* Activité pour les comptes pros */

div.compte_details.compte-pro-pm div.icones_activite {width: 100%; display: flex; justify-content: space-between; align-items: center; margin-top: var(--small-padding);}
div.compte_details.compte-pro-pm div.icones_activite sl-icon {font-size: 28px;}
div.compte_details.compte-pro-pm div.icones_activite sl-icon {color: var(--couleur-gris-filet-fond-blanc);}
div.compte_details.compte-pro-pm div.icones_activite sl-icon.pas_de_potentiel {color: var(--couleur-noir);}
div.compte_details.compte-pro-pm div.icones_activite sl-icon.potentiel {color: green;}

/* div.compte_details:last-child {padding-right: var(--medium-padding);} */

/* Panel identité */
.zone_affichage_single .entete_panel {display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--medium-padding);}
.zone_affichage_single .entete_panel h3 {display: inline-block; padding: 0; margin: 0;}
.panel_divider {--color: var(--couleur-noir); --spacing: var(--large-padding);}

/* Panel groupe */
div.panel_groupes {display: flex;}
/* div.panel_groupes .synthese_compte {margin-right: var(--medium-padding);} */
div.panel_groupes sl-tab-group {
	flex: 1; padding: var(--small-padding) var(--medium-padding); background-color: var(--couleur-blanc); border-radius: var(--default-radius);
	width: 0;	/* important pour l'élément ne dépasse pas */
}
div.panel_groupes sl-tab-group > sl-tab::part(base) {padding-top: var(--small-padding); padding-bottom: var(--small-padding);}
div.panel_groupes sl-tab-group > sl-tab[active]::part(base) {background-color: var(--couleur-gris);}

/* div.panel_groupes sl-tab-group form.description_groupe * {margin-bottom: var(--small-padding);} */
div.panel_groupes sl-tab-group form.description_groupe .btn_action {margin-bottom: 0; display: flex; column-gap: 30px; flex-direction: row;}
div.panel_groupes sl-tab-group form[name="form_create_groupe_comptes"] .btn_action {margin-bottom: 0; text-align: center; display: block;}
div.panel_groupes sl-tab-group div.groupe_membres {display: grid; grid-template-columns: 2fr 1fr; grid-column-gap: var(--x-large-padding);}
div.panel_groupes sl-tab-group div.groupe_membres .groupe_membres_colonne .groupe_membre_card {width: -webkit-fill-available; min-width: -webkit-fill-available; margin-right: 0;} 
div.panel_groupes sl-tab-group div.groupe_membres .groupe_membres_colonne .groupe_membre_card .compte_resume {grid-template-columns: 55px 1fr;} 
div.panel_groupes sl-tab-group div.groupe_membres .groupe_membres_colonne.particulier {display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: min-content; grid-column-gap: var(--small-padding);}
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume h4 a {color: var(--couleur-blanc); text-decoration: none;}
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume h4 a:hover {text-decoration: underline;}
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume .compte_icone_genre sl-icon {font-size: 30px;}
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume sl-button.remove_from_groupe_btn {position: absolute; bottom: 5px; right:5px;}
div.panel_groupes sl-tab-group div.groupe_membres div.new_compte {grid-column: 1 / 3; text-align: center; }

/* COMPTES RELATIONS en header (fonctionne aussi pour les groupes communs dans la liste des relations) */
/* div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume .compte_relations {grid-column: 1 / 3; grid-row: 1; margin-bottom: var(--small-padding);} */
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume .compte_relations {
	grid-column: 1 / 3; background-color: var(--sl-color-primary-900); margin: calc(var(--small-padding) * -1); padding: 5px 10px;
	border-top-left-radius: var(--default-radius); border-top-right-radius: var(--default-radius); margin-bottom: var(--small-padding);
}
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume.decede .compte_relations {background-color: darkgrey;}
div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume .compte_relations > sl-badge::part(base) {border:0; background-color: transparent;}
/* div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume .compte_icone_genre,  */
/* div.panel_groupes sl-tab-group div.groupe_membres div.compte_details .compte_resume .compte_infos {margin-top: 20px;} */
/* FIN TEST */

/* -------------------------------------- */
/* POPIN GESTION AJOUT MEMBRE A UN GROUPE */
/* -------------------------------------- */
#popin_add_comptes h3 {margin-top: 0;}
#popin_add_comptes sl-select[name="comptes_en_relation"] {margin-bottom: var(--medium-padding);}
#popin_add_comptes div.comptes_du_groupe_wrapper {min-height: 50vh; border: solid var(--sl-input-border-width) var(--sl-input-border-color); padding: 5px;}
#popin_add_comptes div.comptes_du_groupe_wrapper sl-tag {margin-bottom: 8px; margin-right: 8px;}
#popin_add_comptes div.comptes_du_groupe_wrapper sl-tag sl-icon {font-size: 150%;}

.fade-out {opacity: 0; transition: opacity 300ms ease;}


/* panel Epargne */
.bloc_compte_epargne table.placements_grid thead th.support {width: 20%; }
.bloc_compte_epargne table.placements_grid thead th.institution {width: 20%;}
.bloc_compte_epargne table.placements_grid thead th.montant {width: 18%;}
.bloc_compte_epargne table.placements_grid thead th.periodicite {width: 19%;}
.bloc_compte_epargne table.placements_grid thead th.actions {width: 5%;}

/* panel Revenus */
.bloc_compte_revenus table.revenus_grid thead th:nth-child(1) {width: 10%;}
.bloc_compte_revenus table.revenus_grid thead th:nth-child(2) {width: 25%;}
.bloc_compte_revenus table.revenus_grid thead th:nth-child(3) {width: 20%;}
.bloc_compte_revenus table.revenus_grid thead th:nth-child(4) {width: 25%;}
.bloc_compte_revenus table.revenus_grid thead th:nth-child(5) {width: 15%;}
.bloc_compte_revenus table.revenus_grid thead th.actions {width: 5%;}
.avec_sel_mode_saisie {display: flex; position: relative;}
.avec_sel_mode_saisie sl-input.monetaire, .avec_sel_mode_saisie sl-select {flex: 1; min-width: 0;}
.avec_sel_mode_saisie sl-dropdown {width: 47px;}
.avec_sel_mode_saisie.echelle sl-dropdown sl-icon.valeur_absolue, .avec_sel_mode_saisie.echelle sl-input.valeur_absolue {display: none;}
.avec_sel_mode_saisie.valeur_absolue sl-dropdown sl-icon.echelle, .avec_sel_mode_saisie.valeur_absolue sl-select.echelle {display: none;}

/* panel chiffres d'affaires */
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(1) {width: 9%;}
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(2) {width: 20%;}
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(3) {width: 16%;}
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(4) {width: 16%;}
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(5) {width: 12%;}
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(6) {width: 12%;}
.bloc_compte_infos_financieres table.ca_grid thead th:nth-child(7) {width: 12%;}
.bloc_compte_infos_financieres table.ca_grid thead th.actions {width: 3%;}

/* panel effectif */
.bloc_compte_effectif table.effectif_grid thead th:nth-child(1) {width: 9%;}
.bloc_compte_effectif table.effectif_grid thead th:nth-child(2) {width: 18%;}
.bloc_compte_effectif table.effectif_grid thead th:nth-child(3) {width: 18%;}
.bloc_compte_effectif table.effectif_grid thead th:nth-child(4) {width: 13%;}
.bloc_compte_effectif table.effectif_grid thead th:nth-child(5) {width: 13%;}
.bloc_compte_effectif table.effectif_grid thead th:nth-child(6) {width: 13%;}
.bloc_compte_effectif table.effectif_grid thead th:nth-child(7) {width: 13%;}
.bloc_compte_effectif table.effectif_grid thead th.actions {width: 3%;}

/* panel pro activité */
sl-tab-panel[name="activite"] .grid_deux_colonnes {row-gap: var(--medium-padding);}
sl-tab-panel[name="activite"] sl-details[open]::part(header) {background-color: var(--couleur-dad); color: var(--couleur-blanc);}
sl-tab-panel[name="activite"] sl-details[open]::part(base) {border-color: var(--couleur-dad); border-width: 2px;}
sl-tab-panel[name="activite"] sl-details::part(content) {padding-top: var(--large-padding); padding-bottom: var(--large-padding);}
sl-tab-panel[name="activite"] sl-details div.entete {position: relative; display: flex;}
sl-tab-panel[name="activite"] sl-details div.entete span {margin-left: 40px; min-width: 200px;}
sl-tab-panel[name="activite"] sl-details div.entete sl-icon {position: absolute; font-size: 30px; top: -5px;}
.bloc_compte_activite div.range {display: grid; align-items: center; grid-template-columns: 80px 1fr 80px; column-gap: var(--small-padding);}
.bloc_compte_activite div.range {background-color: var(--couleur-blanc); padding: var(--medium-padding); border-radius: var(--sl-border-radius-medium);}
.bloc_compte_activite div.range sl-range {
	--track-color-active: var(--sl-color-primary-400); --track-color-inactive: var(--sl-color-primary-400); --thumb-size: 30px;
}

/* Liste d'objets liés (contrats, interactions...) */
body.single-dad_compte div.compte_liste .liste_carousel {
	display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--large-padding); row-gap: var(--large-padding);
}
body.single-dad_compte div.compte_liste.trois_colonnes .liste_carousel {
	grid-template-columns: 1fr 1fr 1fr;
}
body.single-dad_compte div.compte_liste sl-card {width: 100%;}
body.single-dad_compte div.compte_liste sl-card::part(header) {background-color: var(--couleur-dad); color: var(--couleur-blanc); font-size: 14px; font-weight: 600; padding: var(--small-padding);}
body.single-dad_compte div.compte_liste div.card_header {display:flex; align-items: center; justify-content: space-between;}
body.single-dad_compte div.compte_liste div.card_header .card_header_title {display: flex; align-items: center; /*line-height: 40px;*/}
body.single-dad_compte div.compte_liste div.card_header sl-icon {font-size: 26px; margin-right: 5px;}
body.single-dad_compte div.compte_liste.vehicules div.card_header sl-icon {font-size: 50px;}
body.single-dad_compte div.compte_liste.objets_valeur div.card_header sl-icon {font-size: 40px;}
body.single-dad_compte div.compte_liste.biens_immo div.card_header sl-icon {font-size: 35px;}
body.single-dad_compte div.compte_liste sl-card::part(body) {min-height: 140px;}
body.single-dad_compte div.compte_liste sl-card::part(footer) {padding: var(--small-padding);}
body.single-dad_compte div.compte_liste div.card_footer {display:flex; justify-content: space-between; align-items: center;}
body.single-dad_compte div.compte_liste .card_content.grid_deux_colonnes {grid-template-columns: 120px 1fr; column-gap: 0;}
body.single-dad_compte div.compte_liste sl-card div.card_content sl-tooltip {cursor: pointer;}
body.single-dad_compte div.compte_liste sl-card div.card_content sl-tooltip::part(body) {padding: var(--medium-padding);}
body.single-dad_compte div.compte_liste sl-card div.card_content sl-tooltip div.tooltip_content div {margin-bottom: var(--medium-padding);}
body.single-dad_compte div.compte_liste sl-card div.card_content sl-tooltip div.tooltip_content div.roles {margin-bottom: var(--large-padding);}
body.single-dad_compte div.compte_liste sl-card div.card_content sl-tooltip div.tooltip_content div:last-child {margin-bottom: 0;}

span.texte_coupe {overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 250px; display: inline-block;}

/* spécifique véhicules */
body.single-dad_compte div.compte_liste sl-card div.card_content sl-tooltip div.tooltip_content div:last-child {margin-bottom: 0;}
body.single-dad_compte div.compte_liste.vehicules .card_content {min-height: 190px;}
body.single-dad_compte div.compte_liste.biens_immo .card_content {min-height: 170px;}
body.single-dad_compte div.compte_liste .card_content > div {margin-bottom: var(--small-padding);}
body.single-dad_compte div.compte_liste .card_content div.adresse_bien {min-height: 32px;}
body.single-dad_compte div.compte_liste .card_content > div:last-child {margin-bottom: 0;}
body.single-dad_compte div.compte_liste .card_content .grid_deux_colonnes {column-gap: var(--small-padding); row-gap: 5px;}
body.single-dad_compte div.compte_liste .card_content .grid_deux_colonnes div > label {color: var(--couleur-gris-filet-fond-gris);}
body.single-dad_compte div.compte_liste .card_content .grid_deux_colonnes div > div {font-weight: 600; min-height: 16px;}
body.single-dad_compte div.compte_liste .card_content .contrats_objet > div {margin-bottom: 5px;}
body.single-dad_compte div.compte_liste .card_content .contrats_objet .contrat_objet {display: flex; align-items: center; column-gap: 5px;}
body.single-dad_compte div.compte_liste .card_content .contrats_objet .contrat_objet sl-tooltip > sl-icon {font-size: 140%;}

/* interactions */
body.single-dad_compte div.compte_liste div.compteurs_actions {
	display: flex; justify-content: space-between; text-align: center; background-color: var(--sl-color-gray-100);
	margin-top: var(--large-padding); margin-left: -20px; margin-right: -20px; margin-bottom: -20px !important; padding: 5px 20px;
}
body.single-dad_compte div.compte_liste div.compteurs_actions .compteur_action .nom_action {margin-bottom: 5px;}
body.single-dad_compte div.compte_liste div.compteurs_actions .compteur_action.count-0 .nom_action {color: var(--sl-color-gray-300);}
body.single-dad_compte div.compte_liste div.compteurs_actions .compteur_action.count-0 sl-badge::part(base) {background-color: var(--sl-color-gray-300);}
/* met en évidence le card de l'interaction quand on revient après l'avoir consultée */
body.single-dad_compte div.compte_liste sl-card.hash_in_url::part(base) {box-shadow: 0 0 0 5px var(--couleur-gris), 0 0 0 8px var(--sl-color-dad-500); /* border: 3px solid var(--couleur-dad);*/}

/* liste des contrats */
body.single-dad_compte div.compte_liste.contrats sl-card .card_header {min-height: 48px;}
body.single-dad_compte div.compte_liste.contrats sl-card::part(body) {min-height: 210px;}

body.single-dad_compte div.compte_liste.contrats sl-card sl-divider {margin-top: var(--small-padding); margin-bottom: var(--small-padding);}

body.single-dad_compte div.compte_liste.contrats sl-card.dad-resilie::part(body), body.single-dad_compte div.compte_liste.contrats sl-card.dad-non-en-cours::part(body), 
body.single-dad_compte div.compte_liste.contrats sl-card.dad-reduit::part(body), body.single-dad_compte div.compte_liste.contrats sl-card.dad-remplace::part(body), 
body.single-dad_compte div.compte_liste.contrats sl-card.dad-terme::part(body), body.single-dad_compte div.compte_liste.contrats sl-card.dad-suspendu::part(body)
	{background-color: var(--sl-color-gray-100); opacity: 0.6;}

body.single-dad_compte div.compte_liste.contrats sl-card.concurrence::part(header) {background-color: var(--sl-color-gray-600);}
/* body.single-dad_compte div.compte_liste.contrats sl-card.partenaire::part(header), body.single-dad_compte div.compte_liste.contrats sl-card.courtage::part(header) {background-color: var(--sl-color-dad-600);} */
body.single-dad_compte div.compte_liste.contrats div.card_header sl-icon {font-size: 36px; margin-right: 10px;}
body.single-dad_compte div.compte_liste.contrats div.card_header .btn_lien_grc {color: #fff;}
body.single-dad_compte div.compte_liste.contrats .resume_objet {display: flex; column-gap: 5px; align-items: center;}
body.single-dad_compte div.compte_liste.contrats .resume_objet sl-icon {font-size: 25px;}
body.single-dad_compte div.compte_liste.contrats .resume_objet sl-button[variant="text"]::part(base) {color: var(--couleur-noir); text-decoration: underline;}

body.single-dad_compte div.compte_liste.contrats .roles {margin-top: var(--medium-padding);}

.compteurs_contrat_container {background-color: var(--sl-color-gray-100); margin: 0 -10px; display: flex; justify-content: space-around;}
body.single-dad_compte div.compte_liste.contrats  .compteurs_contrat_container {margin-top: -10px; margin-bottom: var(--small-padding);}
.card.contrat .compteurs_contrat_container {margin-top: var(--medium-padding); margin-bottom: var(--medium-padding); justify-content: space-between;}
.compteurs_contrat {padding: 10px; }
.card.contrat .compteurs_contrat_container .compteurs_contrat {padding: 8px 10px;}
.compteurs_contrat {display: flex; align-items: center; column-gap: var(--medium-padding);}
.compteurs_contrat div.compteur {display: flex; align-items: center; column-gap: 3px;}
.compteurs_contrat label {color: var(--couleur-gris-filet-fond-gris);}
.compteurs_contrat .tooltip_details {display: block;}

.compteurs_contrat .compteur.count-0 sl-badge[variant="opportunite"]::part(base),
.compteurs_contrat .compteur.count-0 sl-badge[variant="sinistre"]::part(base),
.compteurs_contrat .compteur.count-0 sl-badge[variant="tache"]::part(base)
	{background-color: var(--sl-color-gray-300);}
.compteurs_contrat .compteur.count-0 sl-icon[name="opportunite"],
.compteurs_contrat .compteur.count-0 sl-icon[name="sinistre"],
.compteurs_contrat .compteur.count-0 sl-icon[name="tache"]
	{color: var(--sl-color-gray-300);}
div.compteur:not(.compteur.count-0) sl-badge[variant="sinistre"].total_sinistres::part(base) {background-color: transparent; border: 1px solid var(--couleur-grc-sinistre); color: var(--couleur-grc-sinistre);}

/* TO DO - à enlever dès qu'on aura synchronisé les tâches */
.compteurs_contrat .compteur.taches {display: none;}


/* Liste des sinistres */
body.single-dad_compte div.compte_liste.sinistres sl-card::part(body) {min-height: 250px;}
body.single-dad_compte div.compte_liste.sinistres sl-card.dad-annule::part(body), body.single-dad_compte div.compte_liste.sinistres sl-card.dad-cloture::part(body), 
body.single-dad_compte div.compte_liste.sinistres sl-card.dad-sans-suite::part(body)
	{background-color: var(--sl-color-gray-100); opacity: 0.6;}
body.single-dad_compte div.compte_liste.sinistres sl-card.dad-annule::part(header), body.single-dad_compte div.compte_liste.sinistres sl-card.dad-cloture::part(header), 
body.single-dad_compte div.compte_liste.sinistres sl-card.dad-sans-suite::part(header)
	{background-color: var(--couleur-blanc); color: var(--sl-color-gray-500);}

/* Liste des opportunités */
body.single-dad_compte div.compte_liste.opportunites sl-card::part(body) {min-height: 280px;}
body.single-dad_compte div.compte_liste.opportunites sl-card.dad-gagnee::part(body), body.single-dad_compte div.compte_liste.opportunites sl-card.dad-perdue::part(body) 
	{background-color: var(--sl-color-gray-100); color: var(--sl-color-gray-500);}

body.single-dad_compte div.compte_liste.opportunites sl-card.dad-gagnee::part(header), body.single-dad_compte div.compte_liste.opportunites sl-card.dad-perdue::part(header) 
	{background-color: var(--couleur-blanc); color: var(--sl-color-gray-500);}

/* Liste des relations */
body.single-dad_compte div.compte_liste.relations div.compte_details {width: 100%; margin-right: 0;}
body.single-dad_compte div.compte_liste.relations span.badge {display: inline-block; width: 30px;}
body.single-dad_compte div.compte_liste.relations div.compte_infos a {color: var(--couleur-blanc);}
div.compte_liste.relations div.compte_details .compte_resume .compte_groupes_communs {
	grid-column: 1 / 3; background-color: var(--sl-color-primary-900); margin: calc(var(--small-padding) * -1); padding: 5px 10px;
	border-bottom-left-radius: var(--default-radius); border-bottom-right-radius: var(--default-radius); margin-top: var(--small-padding);
}

/* Zone filtre pour listes dans la single compte */
body.single-dad_compte #zone_filtres {column-gap: var(--medium-padding);}
body.single-dad_compte #zone_filtres h4 {margin: 0; width: 60px; text-transform: uppercase;}
body.single-dad_compte #zone_filtres div.un_filtre {width: auto; margin: 0;}
body.single-dad_compte #zone_filtres sl-select::part(form-control){
	grid-template-columns: var(--largeur-label-input-small) 260px;
}

body.single-dad_compte #zone_filtres.filtres_contrat sl-select::part(form-control){
	grid-template-columns: 60px auto;
}
/* body.single-dad_compte #zone_filtres.filtres_contrat sl-select::part(form-control-label) {display: none;} */


/* ============ */
/* INTERACTIONS */
/* ============ */

/* Popin interaction-details */
/* ------------------------- */
#interaction_details {margin-bottom: var(--medium-padding);}
.popin_interaction_details .zone_boutons {text-align: right;}
#interaction_details sl-select[name=comptes_abordes]::part(combobox) {min-height: 120px; align-items: start;}

/* ------------------ */
/* Single interaction */
/* ------------------ */
body.single-dad_interaction div.zone_page {
	display: grid; grid-template-columns: var(--menu-lateral-interaction-width) 1fr; 
	grid-template-rows: var(--header-intercation-height) 1fr;
	/* grid-column-gap: var(--medium-padding); grid-row-gap: var(--medium-padding); */
	grid-column-gap: var(--small-padding); grid-row-gap: var(--small-padding);
	min-height: calc(100vh - ( 2 * var(--small-padding)));
}
/* 0.1.11 : Gestion du scroll et sticky dans la zone de contenu */
body.single-dad_interaction div.intercation_tableau_comptes {}
body.single-dad_interaction .tableau_assurances, body.single-dad_interaction .intercation_tableau_comptes, body.single-dad_interaction .synthese_assurances_wrap {height: var(--interaction-contenu-height); overflow-y: auto;}
body.single-dad_interaction .synthese_assurances_wrap {padding-right: 5px; overflow-x: hidden;}	/* pour éviter le scroll horizontal avec le sl-badge qui dépasse */
body.single-dad_interaction .tableau_assurances div.entete_colonne {position: sticky; top: 0; z-index: 10;}
body.single-dad_interaction .tableau_assurances div.entete_colonne.sous_entete_colonne {top: 90px; z-index: 10; margin-bottom: 2px;}
body.single-dad_interaction .tableau_assurances div.entete_ligne {position: sticky; left: 0; z-index: 10;}
body.single-dad_interaction .tableau_assurances div.entete_ligne.entete_colonne {z-index: 20; border-radius: 0; box-shadow: 0 0 12px rgba(0, 0, 0, 0);}
body.single-dad_interaction .intercation_tableau_comptes div.compte_resume {position: sticky; top: 0; z-index: 10; }

/* Provisoire ? : n'affiche pas le + sur les compte pro-pm */
.intercation_tableau_comptes.pro-pm .compte_details:has(> div.card.new_compte) {display: none;}

/* Pencil modification */
body.single-dad_interaction .card sl-icon-button[name="pencil"] {position: absolute; font-size: 14px; color: var(--couleur-blanc); bottom:0; right: 0;}
body.single-dad_interaction .card_blanc.card sl-icon-button[name="pencil"] {color: var(--couleur-noir);}
body:not(.single-dad_interaction) .card sl-icon-button[name="pencil"] {display: none;}
body:not(.single-dad_interaction) .card span.lien_grc {display: none;}

/* Nom du compte avec padding pour garder la place au span lien_grc */
body.single-dad_interaction .card h4.compte_name {padding-right: 20px;}

/* Header de la single interaction */
body.single-dad_interaction div.zone_page .entete_intercation, body.single-dad_interaction div.zone_page .comptes_interaction {align-content: center;}
body.single-dad_interaction div.zone_page .entete_intercation {text-align: center;}
body.single-dad_interaction div.zone_page .entete_intercation h2 {margin: 0; font-size: 18px;}
body.single-dad_interaction div.zone_page .entete_intercation .canal {display: flex; justify-content: center; align-items: center;}
body.single-dad_interaction div.zone_page .entete_intercation sl-icon {font-size: 16px;}
body.single-dad_interaction div.entete_comptes_indicateurs {display:flex; justify-content: space-between; padding-right: 50px; align-items: center; column-gap: 20px; min-width: 0;}	
body.single-dad_interaction div.entete_comptes_indicateurs .tous_les_comptes {width: 80%; display: flex; align-items: center; overflow-x: auto;}
body.single-dad_interaction div.entete_comptes_indicateurs .tous_les_comptes sl-divider {--color: var(--couleur-gris-filet-fond-gris); height: 60px;}
body.single-dad_interaction div.entete_comptes_indicateurs .comptes_interaction {display: grid; align-items: center; grid-column-gap: var(--small-padding);}
body.single-dad_interaction div.entete_comptes_indicateurs .zone_indicateurs {flex: 1;}
body.single-dad_interaction div.entete_comptes_indicateurs .zone_contrats_a_affecter {flex: 1; position: relative; align-content: center; text-align: right;}
/* body.single-dad_interaction div.entete_comptes_indicateurs .zone_contrats_a_affecter sl-button::part(base) {border: 0; background-color: transparent;} */
body.single-dad_interaction div.entete_comptes_indicateurs .zone_contrats_a_affecter sl-icon-button {font-size: 44px;}
body.single-dad_interaction div.entete_comptes_indicateurs .zone_contrats_a_affecter sl-badge {position: absolute; top: 22px; right: 18px; cursor: pointer;}
body.single-dad_interaction div.entete_comptes_indicateurs .zone_contrats_a_affecter sl-badge.disabled {cursor: not-allowed;}

body.single-dad_interaction div.entete_comptes_indicateurs .comptes_interaction .compte {text-align: center; width: 100%;}
body.single-dad_interaction div.entete_comptes_indicateurs .comptes_interaction .compte sl-icon {display: block; width: 100%; font-size: 18px; margin-bottom: 4px;}
body.single-dad_interaction div.entete_comptes_indicateurs .comptes_interaction .compte .nom {
	display: block; background-color: var(--couleur-blanc); border-radius: 5px; height: 32px; max-height: 32px; overflow: hidden; text-overflow: ellipsis;
	-webkit-line-clamp: 2; -webkit-box-orient: vertical; align-content: center; margin: 0;
}
body.single-dad_interaction div.zone_page .entete_comptes_indicateurs div.fermeture_interaction {
	position: absolute; top:-6px; right: -6px; background-color: var(--couleur-blanc); border-radius: 50%;
}
body.single-dad_interaction div.zone_page .entete_comptes_indicateurs sl-icon-button.fermer_interaction {font-size: 28px; color: var(--couleur-dad);}
body.single-dad_interaction div.zone_page .entete_comptes_indicateurs sl-icon-button.fermer_interaction::part(base) {padding: 5px;}



/* Drawer liste des contrats à affecter */
sl-drawer[name="drawer_contrats_a_affecter"] {--size: 350px;}
sl-drawer[name="drawer_contrats_a_affecter"]::part(title) {font-weight: 500;}
sl-drawer .drawer_contrats_a_affecter {display: grid; row-gap: var(--small-padding); grid-template-columns: 1fr;}

/* Menu latéral */
#menu_lateral_interaction {
	/*margin-right: 20px;*/ color: var(--couleur-blanc); background-color: var(--couleur-noir);
	width: var(--menu-lateral-interaction-width); border-radius: var(--default-radius);
	font-size: var(--font-size-menu-interaction); padding: var(--medium-padding) 0; /*height: fit-content;*/
}
body.single-dad_interaction sl-menu.menu_lateral {background-color: var(--couleur-noir); border: 0; padding: 0;}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item {position: relative;}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-label::part(base) {color: var(--couleur-blanc); font-size: var(--font-size-menu-interaction); padding-left: 1.5rem}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item::part(base) { padding-top: 6px; padding-bottom: 6px; line-height: 1;}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item::part(label) {color: var(--couleur-blanc); font-size: var(--font-size-menu-interaction);}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item::part(prefix) {color: var(--couleur-blanc);}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item sl-icon { font-size: 15px;}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item::part(spinner) {--indicator-color: var(--couleur-blanc);}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item.niveau2::part(label) {color: var(--couleur-blanc); padding-left: 15px;}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item sl-badge {position: absolute; right: var(--small-padding);}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item sl-badge::part(base) {border:0;}

body.single-dad_interaction sl-menu.menu_lateral sl-menu-item:hover::part(base), body.single-dad_interaction sl-menu.menu_lateral sl-menu-item:focus-visible::part(base) {
	background-color: transparent; text-decoration: underline; color: var(--couleur-blanc);
}

body.single-dad_interaction sl-menu.menu_lateral sl-menu-item.actif:before {
	position: absolute; content:''; display: block; height: 16px; width: 5px; background-color: var(--couleur-blanc); left: 12px; top: 4px; border-radius: 2px;
}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item.actif::part(label) {font-weight: bold;}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item.actif sl-badge::part(base) {color: var(--couleur-dad); background-color: var(--couleur-blanc);}
body.single-dad_interaction sl-menu.menu_lateral sl-menu-item.actif {background-color: var(--couleur-dad);}

/* body.single-dad_interaction #zone_contenu {overflow-x: scroll;} */
body.single-dad_interaction #zone_contenu {margin-left:-12px; padding-left: 12px;}	/* Permet que les ombres des éléments collés à gauche dans zone contenu ne soient pas tronquées */

body.single-dad_interaction div.onglet_interaction {display: none;}
body.single-dad_interaction div.onglet_interaction.actif {display: block;}

/* Comptes particulier et professionnels */
div.intercation_tableau_comptes {display: flex;}
/* div.intercation_tableau_comptes div.compte_details {width: var(--largeur-card-membre); min-width: var(--largeur-card-membre); margin-right: var(--medium-padding);} */
div.intercation_tableau_comptes div.compte_details .compte_card.card_blanc {border: 1px solid var(--couleur-gris-filet-fond-blanc);}
div.intercation_tableau_comptes div.compte_details .new_compte {height:100%;}
/* compte pro/pm plus large que compte particulier car moins de comptes */
div.intercation_tableau_comptes.pro-pm div.compte_details {width: var(--largeur-card-membre-pro-pm); min-width: var(--largeur-card-membre-pro-pm);}

/* synthèse activité pour comptes pro-pm */
div.intercation_tableau_comptes.pro-pm div.icones_activite {width: 90%;}
div.intercation_tableau_comptes.pro-pm div.icones_activite sl-icon {font-size: 35px;}

/* ---------------------------------------------------- */
/* Onglets Categories assurantielles vs. objet/personne */
/* ---------------------------------------------------- */
body.single-dad_interaction .tableau_assurances {display: grid; grid-template-columns: 100px repeat(auto-fit, var(--largeur-colonne-tab-assurances)); column-gap: var(--small-padding); row-gap: var(--small-padding); padding-bottom: var(--medium-padding);}
.tableau_assurances .card.entete_colonne.cellule_vide sl-switch::part(label) {font-size: 11px; line-height: 14px;}
.tableau_assurances .card.entete_colonne .details_entite {display: grid; grid-template-columns: 50px 1fr; column-gap: var(--medium-padding);}
.tableau_assurances .card.entete_colonne .details_entite .type_entite {/*align-content: center;*/ text-align: center;}
.tableau_assurances .card.entete_colonne .details_entite .type_entite sl-icon {font-size: 50px;}
.tableau_assurances .card.entete_colonne .description_entite h3 {margin: 0;}
.tableau_assurances .card.entete_colonne .details_entite .description_entite h3, .tableau_assurances .card.entete_colonne .details_entite .description_entite > div {margin-bottom: 5px;}
.tableau_assurances .card.entete_colonne .details_entite .description_entite > div:last-child {margin-bottom: 0; margin-top: 12px; margin-right: 20px;}	/* margin right pour avoir la place pour le crayon de modification */
.tableau_assurances .card.entete_colonne.non_affecte {text-align: center; align-content: end; font-weight: bold; background-color: transparent;}
.tableau_assurances .card.entete_colonne.sous_entete_colonne {text-align: center; align-content: center;}
.tableau_assurances .card.entete_colonne.non_affecte h4, .tableau_assurances .card.entete_colonne.sous_entete_colonne h3 {margin: 5px;}
/* Change la couleur du card quand le proprio de l'objet n'est pas dans les comptes de l'entretien */
.tableau_assurances .card.entete_colonne:has(> div.details_entite.proprio_hors_groupe) {
	/* background-color: var(--sl-color-dad-500); */
	background-color: var(--couleur-blanc); border: 1px solid var(--sl-color-gray-500); color: var(--sl-color-gray-500);
}
.tableau_assurances .card.entete_colonne:has(> div.details_entite.proprio_hors_groupe) div.compte_proprietaire {font-weight: 600; /* color: var(--couleur-dad); */}

.tableau_assurances .entete_ligne:not(.cellule_vide) {
	color: var(--couleur-dad); text-align: center;
	/*box-shadow: 0 0 12px rgba(0, 0, 0, 0.15);*/ 
	border: 1px solid var(--couleur-gris-filet-fond-blanc);
	background-color: var(--sl-color-dad-50);
}
.tableau_assurances .entete_ligne sl-icon {font-size: 50px;}
.tableau_assurances .entete_ligne div.nom_categorie {text-transform: uppercase; font-weight: bold; font-size: 11px;}

/* CARD CONTRAT */
.tableau_assurances .cellule {display: grid; grid-template-columns: 1fr; row-gap: var(--small-padding);}
.card.contrat {border: 1px solid var(--couleur-dad);}
.card span.lien_grc.lien_contrat {right: -8px; top: -8px;}
.card.contrat h3 {margin: 0; text-align: center; color: var(--couleur-dad); position: relative;}
.card.contrat h3, .card.contrat > div {margin-bottom: 6px;}
.card.contrat div.dates span {display: block;}
.card.contrat div.roles {margin-top: 12px; *margin-bottom: 0;}
.card.contrat div:last-child {margin-bottom: 0;}
/* contrat non affecte */
/* div.cellule.contrat_non_affecte .card.contrat h3 {cursor: grab;} */
/* div.cellule.contrat_non_affecte .card.contrat h3:active {cursor: grabbing;} */
/* Modification impossible sur les contrats à affecter */
/* div.cellule.contrat_non_affecte .card.contrat sl-icon-button.btn_modifie_contrat {display: none;} */
/* .drawer_contrats_a_affecter .card.contrat.contrat_a_affecter sl-icon-button.btn_modifie_contrat {display: none;} */
/* contrat abordé */
.card.contrat.contrat_aborde {border-color: var(--couleur-gris-filet-fond-blanc); background-color: rgb(0, 0, 0, 0.01); color: var(--couleur-gris-filet-fond-blanc);}
.card.contrat.contrat_aborde sl-badge::part(base) {background-color: var(--sl-color-neutral-400);}
.card.contrat.contrat_aborde h3 {color: var(--sl-color-dad-400);}
.card.contrat.contrat_aborde:has(.action_contrat) {padding-top: 35px;}
.card.contrat.contrat_aborde .action_contrat {
		position: absolute; width: 100%; top:0; left: 0; text-align: center; background-color: var(--couleur-gris-filet-fond-gris); color: #fff;
		padding: 5px; display: flex; justify-content: center; border-top-left-radius: var(--default-radius); border-top-right-radius: var(--default-radius); 
		align-items: center; font-size: 14px; font-weight: 600;
	}
.card.contrat.contrat_aborde .action_contrat sl-icon {font-size: 20px;}
/* contrat non assuré */
.card.contrat.non-assure .nom_compte, .card.contrat.non-assure .numero_contrat, .card.contrat.non-assure .prime {display: none;}

/* POPIN VEHICULE NEW OR UPDATE */
sl-dialog.popin_vehicule_details::part(body) {min-height: 400px;}
sl-select[name="dad_vehicule_type"] sl-option sl-icon {font-size: 32px;}
sl-dialog.popin_vehicule_details .choices__list--dropdown .choices__list, sl-dialog.popin_vehicule_details .choices__list[aria-expanded] .choices__list {max-height: 180px;}

/* POPIN OBJET VALEUR NEW OR UPDATE */
sl-select[name="dad_objet_valeur_type"] sl-option sl-icon {font-size: 32px;}
sl-dialog.popin_objet_details div.select_race .choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list {max-height: 180px;}

/* POPIN BIEN IMMO - LOCAL NEW OR UPDATE */
sl-dialog.popin_bien_details sl-radio-button sl-icon {font-size: 220%;}
sl-dialog.popin_bien_details sl-details::part(base) .details__body {overflow-y: visible;}
sl-dialog.popin_bien_details div.data_proprietaire {margin-top: var(--small-padding);}
sl-dialog.popin_bien_details sl-select[name="proprietaire"] {margin-bottom: var(--small-padding);}
sl-dialog.popin_bien_details #wrapper_autocomplete {display: flex; align-items: center; column-gap: var(--medium-padding);}
sl-dialog.popin_bien_details .autoComplete_wrapper {display: flex;}
sl-dialog.popin_bien_details .checkbox_caracteristiques sl-checkbox {margin-right: var(--medium-padding);}
sl-dialog.popin_bien_details .checkbox_caracteristiques sl-checkbox[name="pollution"] {margin-right: 5px;}
sl-dialog.popin_bien_details #bien_details .culture:not(.all) {display: none;}
sl-dialog.popin_bien_details #bien_details[data-utilisation="culture"] .culture {display: initial;}
sl-dialog.popin_bien_details #bien_details[data-utilisation="culture"] sl-details:not(.culture) {display: none;}
sl-dialog.popin_bien_details #bien_details .locatif:not(.all) {display: none;}
sl-dialog.popin_bien_details #bien_details[data-utilisation="locatif"] .locatif {display: initial;}

/* POPIN CONTRAT */
/* Labels à gauche avec largeur plus limitée sur 3 colonnes */
/* sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche label {width: var(--largeur-label-input-small);} */
sl-dialog.popin_contrat_details span.nom_objet_personne {margin-left: 10px;}
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche .input_avec_label,
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-select::part(form-control),
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-input::part(form-control),
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche div.select_with_search,
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-textarea::part(form-control),
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-radio-group::part(form-control) {
	display: grid; grid-template-columns: var(--largeur-label-input-small) 1fr;
}
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche label,
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-select::part(form-control-label),
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-input::part(form-control-label),
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-textarea::part(form-control-label),
sl-dialog.popin_contrat_details .grid_trois_colonnes.labels_a_gauche sl-radio-group::part(form-control-label) {
	overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap;
}
sl-dialog.popin_contrat_details .grid_trois_colonnes sl-textarea[name="precision_contrat"], sl-dialog.popin_contrat_details .grid_trois_colonnes sl-input.two_rows {grid-column: 1 / 3;}
sl-dialog.popin_contrat_details #dad_contrat_type[data-value="compagnie"] ~ #actions_interaction sl-radio-group:not(.compagnie) {background-color: red;}

sl-dialog.popin_contrat_details div.select_with_search .choices__inner {
	min-height: var(--sl-input-height-small); height: calc(1.6px + var(--sl-input-height-small)); padding: 0; box-sizing: border-box; 
	padding-left: calc(var(--sl-input-spacing-small) - 4px); display: flex; align-items: center;
}
sl-dialog.popin_contrat_details div.select_produit_cial .choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list {max-height: 144px;}
sl-dialog.popin_contrat_details div.select_cie_autre .choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list {max-height: 108px;}

/* Affectation contrat */
sl-details.affectation_contrat sl-select.liste_affectation sl-option::part(label) {display: flex; justify-content: space-between;}


/* POPIN MODIF RUBRIQUE COMPTE */
#popin_compte_rubrique .tableau_rubrique_comptes {display: grid; grid-template-columns: var(--largeur-colonne-compte-rubrique-labels) repeat(auto-fit, var(--largeur-colonne-compte-rubrique)); column-gap: var(--small-padding); row-gap: var(--small-padding);}
/* #popin_compte_rubrique .tableau_rubrique_comptes .entete_colonne {position: sticky; } */
#popin_compte_rubrique .cellule .entete_panel {display: none;}
#popin_compte_rubrique .cellule.compte_selectionne {border: 2px solid var(--couleur-dad);}
#popin_compte_rubrique:not(.popin_multi_colonnes) .cellule .grid_deux_colonnes {/*grid-template-columns: 1fr;*/ row-gap: var(--small-padding); display: flex; flex-direction: column;}
#popin_compte_rubrique .cellule sl-input, #popin_compte_rubrique .tableau_rubrique_comptes .cellule sl-select,
#popin_compte_rubrique .cellule .select_with_search, #popin_compte_rubrique .cellule sl-textarea {
	position: relative;
}
#popin_compte_rubrique .tableau_rubrique_comptes .cellule:not(.colonne-2) .labels_a_gauche sl-input::part(form-control-label),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule:not(.colonne-2) .labels_a_gauche  sl-select::part(form-control-label),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule:not(.colonne-2) .labels_a_gauche  sl-textarea::part(form-control-label),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule:not(.colonne-2) .select_with_search label,
#popin_compte_rubrique .tableau_rubrique_comptes .cellule:not(.colonne-2) div.champ_avec_tooltip sl-tooltip {
	display: none;
}
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2 .avec_sel_mode_saisie sl-select,
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2 .avec_sel_mode_saisie sl-input {position: initial;}

#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2  .labels_a_gauche sl-input::part(form-control-label),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2  .labels_a_gauche sl-select::part(form-control-label),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2  .labels_a_gauche sl-textarea::part(form-control-label),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2  .labels_a_gauche .select_with_search label {
	position: absolute; left: calc(-1 * ( var(--largeur-colonne-compte-rubrique-labels) + var(--small-padding) + 5px )); top: 25%;
}
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2 div.champ_avec_tooltip sl-tooltip,
#popin_compte_rubrique .tableau_rubrique_comptes .cellule.colonne-2 div.champ_avec_tooltip sl-tooltip sl-icon {
	left: calc(-1 * ( var(--largeur-colonne-compte-rubrique-labels) + var(--small-padding) ) + ( var(--largeur-label-input) - 20px ) );
}

#popin_compte_rubrique .tableau_rubrique_comptes .cellule .labels_a_gauche sl-select::part(form-control),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule .labels_a_gauche sl-input::part(form-control),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule .labels_a_gauche div.select_with_search,
#popin_compte_rubrique .tableau_rubrique_comptes .cellule .labels_a_gauche sl-textarea::part(form-control),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule .labels_a_gauche sl-radio-group::part(form-control),
#popin_compte_rubrique .tableau_rubrique_comptes .cellule .input_avec_label {
	/* grid-template-columns: 1fr; */
	display: block;
}
/* mise en forme breadcrumb pour statut insee */
div.statut_insee sl-breadcrumb::part(base) {
	background-color: var(--sl-input-background-color-disabled); border: solid var(--sl-input-border-width) var(--sl-input-border-color-disabled); color: var(--sl-input-color-disabled);
    opacity: 0.5; cursor: not-allowed; border-radius: var(--sl-input-border-radius-small); padding-left: var(--sl-input-spacing-small); padding-right: var(--sl-input-spacing-small);
	padding-top: 8px;
}
div.statut_insee sl-breadcrumb-item {margin-bottom: 8px;}
div.statut_insee sl-breadcrumb-item::part(base) {white-space: normal;}
div.statut_insee sl-breadcrumb-item::part(label) {text-align: left; cursor: not-allowed; color: inherit; line-height: 1.4;}

/* popin revenus */
sl-dialog .bloc_compte_revenus sl-select.annee_information::part(display-input) {text-align: center; font-weight: 600;}
sl-dialog .bloc_compte_revenus sl-select.echelle::part(display-input) {text-align: right;}

/* Popin infos financières - Réduit les paddings des selects pour ne pas tronquer le contenu */
#comptes_pros_entreprises_infos_financieres .repeater_template_row sl-select::part(display-input) {text-align: right;}
#comptes_pros_entreprises_infos_financieres .repeater_template_row sl-select::part(combobox) {padding-inline: 5px;}
#comptes_pros_entreprises_infos_financieres .repeater_template_row sl-select::part(expand-icon) {margin-inline-start: 7px;}

/* Popin activité (comptes pros et entreprises) */
/* n'affiche pas le placeholder car les labels sont affichés */
#comptes_pros_entreprises_activite *::placeholder, #comptes_pros_entreprises_activite sl-input::part(input)::placeholder, 
#comptes_pros_entreprises_activite sl-select::part(display-input)::placeholder {
	display: none; color: #fff;
}
#comptes_pros_entreprises_activite sl-details div.entete {position: relative;}
#comptes_pros_entreprises_activite sl-details div.entete span.sl_summary_titre {margin-left: 40px; width: 180px; display: inline-block;}
#comptes_pros_entreprises_activite sl-details div.entete sl-icon {position: absolute; font-size: 30px; top: -5px;}


/* ---------------------- */
/* Synthèse assurantielle */
/* ---------------------- */
.synthese_assurances_sel_indicateurs {margin-bottom: var(--medium-padding); display: flex; justify-content: space-between;}
.synthese_assurances_sel_indicateurs.inline_radios sl-radio-group sl-radio {margin-right: var(--small-padding);}
.synthese_assurances_sel_indicateurs.inline_radios sl-radio-group::part(form-control-input) {margin-left: 0;}
.synthese_assurances_sel_indicateurs.inline_radios sl-radio-group sl-radio.card {border: 1px solid var(--couleur-gris);}
.synthese_assurances_sel_indicateurs .compteurs_globaux ul {padding: 0; margin: 0; display:flex; column-gap: 14px; align-items: center;}
.synthese_assurances_sel_indicateurs .compteurs_globaux ul li {list-style: none; display: inline-block;}
.synthese_assurances_sel_indicateurs .compteurs_globaux ul li label {padding-right: 5px;}
.synthese_assurances_tous_comptes {display: grid; grid-template-columns: 44% 54%; column-gap: 2%;}
.synthese_assurances_tous_comptes sl-icon {font-size: 35px;}
.synthese_assurances_tous_comptes .titre_groupe_categorie {font-weight: 600; margin-bottom: var(--small-padding);}
.synthese_assurances.particulier .categories_assurances {display: grid; grid-template-columns: repeat(5, 1fr); column-gap: var(--medium-padding); row-gap: var(--small-padding); margin-bottom: var(--medium-padding);}
.synthese_assurances.pro-entreprise .categories_assurances {display: grid; grid-template-columns: repeat(6, 1fr); column-gap: var(--medium-padding); row-gap: var(--small-padding); margin-bottom: var(--medium-padding);}
.synthese_assurances .categories_assurances .card_blanc.categorie {text-align: center; border: 1px solid var(--couleur-gris-filet-fond-blanc); position: relative;}
/* synthese actions */
.synthese_assurances_wrap.synthese_actions .categories_assurances .card_blanc.categorie.aucune_action sl-icon {color: var(--couleur-gris-filet-fond-blanc);}
.synthese_assurances_wrap.synthese_actions .categories_assurances .card_blanc.categorie:not(.aucune_action) {border-color: var(--couleur-noir);}
.synthese_assurances_wrap.synthese_actions .categories_assurances .card_blanc.categorie.aucune_action div.compteur_actions {display: none;}
/* synthese couverture */
.synthese_assurances_wrap.synthese_couverture .categories_assurances .card_blanc.categorie.aucun_contrat sl-icon {color: var(--couleur-gris-filet-fond-blanc);}
.synthese_assurances_wrap.synthese_couverture .categories_assurances .card_blanc.categorie:not(.aucun_contrat) {border-color: var(--couleur-noir);}
.synthese_assurances_wrap.synthese_couverture .categories_assurances .card_blanc.categorie.aucun_contrat div.compteur_actions {display: none;}


.synthese_assurances .categories_assurances .card_blanc.categorie div.compteur_actions {
	display: flex; justify-content: space-between; position: absolute; width: 100%; left: 0; bottom: 0; /*padding: 5px 10px;*/
}
.synthese_assurances_wrap.synthese_couverture .categories_assurances .card_blanc.categorie div.compteur_actions {
	top:-6px; right:-6px; bottom: initial; left: initial; display: inline; text-align: right;
}
.synthese_assurances .categories_assurances .card_blanc.categorie div.compteur_actions span {padding: 5px 10px; cursor: pointer;}
div.compteur_actions span {font-weight: 600; font-size: 16px;}
div.compteur_actions sl-badge {cursor: pointer;}
div.compteur_actions sl-badge::part(base) {font-size: 16px;}
div.compteur_actions span.zero_action {visibility: hidden;}
div.compteur_actions .resiliation {color: var(--couleur-dad);}
div.compteur_actions .avenant, div.compteur_actions .devis, div.compteur_actions .devis-plus-tard, div.compteur_actions .devis_avenant {color: green;}

.synthese_assurances_wrap:not(.synthese_actions) .indicateurs_actions {display: none !important;}
.synthese_assurances_wrap:not(.synthese_couverture) .indicateurs_couverture {display: none !important;}

/* Affichage synthèse dans single compte */
body.single-dad_compte .synthese_assurances_tous_comptes .titre_groupe_categorie {background-color: var(--sl-color-gray-500); color: var(--couleur-blanc);}
body.single-dad_compte .synthese_assurances_sel_indicateurs sl-radio {background-color: var(--couleur-blanc);}

/* =========================================== */
/* =========================================== */
/* ***************  SPINNERS   *************** */
/* =========================================== */
/* =========================================== */

/* Spinner site */
#loader-overlay {
	position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(255, 255, 255, 1); display: flex; align-items: center; justify-content: center; z-index: 9999;
}
.loader-content-site {text-align: center;}
.loader-site {width: 60px; height: 60px; animation: spin 1s linear infinite;}
@keyframes spin {
	0%   { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
.loader-text-site {margin-top: 1em; font-size: 1rem; color: var(--couleur-dad);}

/* Spinner chargement popin */
.loader-content {display: grid; align-items: center; text-align: center; height: 70vh;}
.loader {width: 60px; height: 60px; animation: spin 1s linear infinite;}
.loader-text {margin-top: 1em; font-size: 1rem; color: var(--couleur-dad);}

/* Spinner lors de la validation d'une popin */
.spinner-block-overlay {
	position: absolute; top:0; left:0; width: calc(100% + 20px); margin-left: -10px; height: calc(100% + 20px); margin-top:-10px;
	background: rgba(234, 234, 234, 0.9); display: flex; justify-content: center; align-items: center; z-index: 9999; flex-direction: column;
}
.spinner-block-overlay .loader-content-site {
	background: #fff; padding: 20px 120px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}


/* ------------------------------ */
/* ------------------------------ */
/* ------- AIDE EN LIGNE -------- */
/* ------------------------------ */
/* ------------------------------ */
.contenu_aide h1, .contenu_aide h2 {margin-top: 0;} 
.contenu_aide {display: flex; align-items: flex-start; column-gap: 30px;}
.contenu_aide .navigation_aide {width: 300px;}
.contenu_aide .videos_aide {width: calc(100% - 330px);}
.videos_du_folder {display: grid; column-gap: 20px; row-gap: 40px; grid-template-columns: repeat(3, 1fr);}
.videos_du_folder > * {min-width: 0;}
.videos_par_folder.display-none {display: none;}
.videos_du_folder .block_video .description_courte {padding: 0 5px;}
.videos_du_folder .block_video .lien_guide_pdg {margin-top: 15px; display: flex; align-items: center; justify-content: center; column-gap: 4px;}
.videos_du_folder .block_video .lien_guide_pdg sl-icon {font-size: 20px;}
.videos_du_folder .video {position: relative;}
.videos_du_folder .video img {width: -webkit-fill-available;}
.videos_du_folder .video .available_soon {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: var(--couleur-gris-filet-fond-gris); color: #fff; 
	font-size: 16px; padding: 10px 20px; font-weight: 600; white-space: nowrap;
}
.videos_du_folder .video .play_button {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: var(--couleur-dad); border-radius: 10px;
	width:80px; height: 70px; opacity: 0.66; display: flex; justify-content: center; align-items: center;
}
.videos_du_folder .video .play_button:hover {opacity: 1;}
.videos_du_folder .video sl-icon-button {font-size: 60px; color: #fff;}
.videos_du_folder .video sl-icon-button::part(base):hover {color: #fff;}
h3.titre_video {text-align: center;}


/* POUR VIDEO : A ENLEVER */
sl-switch.switch_sensibilite {display: none;}
sl-switch.switch_sensibilite {margin-top: 20px; color: var(--couleur-noir);}
sl-switch.switch_sensibilite::part(base) {flex-direction: column-reverse;}
sl-switch.switch_sensibilite::part(label) {margin-bottom: 6px;}

sl-switch.flag_no_objet {display: none;}