/* =============================================================================
designBRA.css — Front-office IDET
Sauvegarde : designBRA.css.backup (copie avant ajout des sections)
IMPORTANT : l’ordre des règles CSS est inchangé (cascade / spécificité).
Recherche rapide : « SECTION » + numéro (01–18, 97–99).
=============================================================================
SOMMAIRE (ordre logique du fichier, 01 → 18)
01 Polices (@font-face) et note Font Awesome
02 Design tokens (:root)
03 Base — html, body, #global, #content
04 En-tête fixe — #headerBuzzy, logo, menus (divers.php)
05 Bandeaux sous header — #title_page (BO) ; puces multi/subheader → §98 suspects
06 BO gestion_champs — #list_select, panneaux erreurs
07 Entrée contenu — pont vers §08 (pas de règles dédiées)
08 Accueil + MesDocuments — §08.1–08.6 (sommaire interne sous l’en-tête §08)
09 Éléments génériques — tableaux… ; inclut .saisie-quick-menu + #bg_nav (print_SubHeader divers.php)
10 Parcours — suites barres .progress_*, sprites ; prolonge #progress_bar1
11 Formulaires métiers, boîtes, champs (.input*, .box*)
12 Composants — statuts, boutons de navigation parcours
13 Compte / profil (gestion_user.php, messages MDP)
14 Popups — modales (#popup*…), aide (#cont_popup_aide…), lexique, navigation
15 Popups plein écran — sidebar (.popup_sidebar, #popup_bt…)
16 Gestion établissement, grille home.php (l’aide : section 14)
17 Identification / auth (identification.php, .id-auth*)
18 Pied de page — #conteneur_footer… (divers.php)
97 RÉSERVE — règles à reclasser (voir fin de fichier)
98 Suspects inutiles — .id_button, .button_id, #home_menu…#connexion, #h_*:hover, multi/header & subheader (fin fichier)
99 Confirmés inutiles — candidats suppression / archivage
============================================================================= */
@font-face {
font-family: "Noteworthy Bold";
font-style: normal;
font-weight: 700;
font-display: swap;
src:
url("f4bc352b52c96ca087093d36bd2396bb.woff2") format("woff2"),
url("f4bc352b52c96ca087093d36bd2396bb.woff") format("woff"),
url("f4bc352b52c96ca087093d36bd2396bb.ttf") format("truetype");
}
@font-face {
font-family: "Edmondsans";
font-style: normal;
font-weight: 400;
font-display: swap;
src: local("Edmondsans"), url("https://fonts.cdnfonts.com/s/29139/EdmondsansRegular_web.woff") format("woff");
}
@font-face {
font-family: "Edmondsans";
font-style: normal;
font-weight: 500;
font-display: swap;
src: local("Edmondsans"), url("https://fonts.cdnfonts.com/s/29139/EdmondsansMedium_web.woff") format("woff");
}
@font-face {
font-family: "Edmondsans";
font-style: normal;
font-weight: 700;
font-display: swap;
src: local("Edmondsans"), url("https://fonts.cdnfonts.com/s/29139/EdmondsansBold_web.woff") format("woff");
}
/* Icônes : Font Awesome chargé via le kit (declaFO), pas de @font-face FA ici. */
/* -------------------------------------------------------------------------- */
/* SECTION 01 — Polices (@font-face) : fin. */
/* SECTION 02 — Design tokens (:root) */
/* -------------------------------------------------------------------------- */
:root {
/* ===================================================================== */
/* FOUNDATION TOKENS — GLOBAL DESIGN SYSTEM (FO) */
/* ===================================================================== */
/* Typographies */
--font-family-base: "azo-sans-web", Arial, sans-serif;
--font-family-alt: "Noteworthy Bold", "azo-sans-web", Arial, sans-serif;
--font-family-icon: "Font Awesome 6 Free", "Font Awesome 5 Free", sans-serif;
--font-size-root: 16px;
--font-size-xs: 0.75rem;
--font-size-sm: 0.875rem;
--font-size-md: 1rem;
--font-size-lg: 1.125rem;
--font-size-xl: 1.35rem;
--font-weight-regular: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--line-height-tight: 1.2;
--line-height-normal: 1.5;
--line-height-relaxed: 1.65;
/* Palette neutre */
--color-white: #fff;
--color-black: #000;
--color-gray-50: #f8fafc;
--color-gray-100: #f1f1f1; /* utilisé sur fond global */
--color-gray-200: #e2e8f0;
--color-gray-300: #cbd5e1;
--color-gray-400: #94a3b8;
--color-gray-500: #64748b;
--color-gray-600: #4b5563; /* texte historique FO */
--color-gray-700: #334155;
--color-gray-800: #2d3748;
--color-gray-900: #0f172a;
/* Couleurs marque / interface FO */
--color-brand-primary: #2374aa;
--color-brand-primary-hover: #0f86b5;
--color-brand-secondary: #00a6e3;
--color-brand-secondary-hover: #217bae;
--color-brand-accent: #f0a32a;
--color-brand-accent-hover: #f7b23d;
--color-brand-accent-active: #d99216;
--color-success: #5db461;
--color-success-dark: #007239;
--color-green-strong: #86bb79;
--color-green-pale: #abd39f;
--color-green-tile-muted: #c8d8c3;
--color-green-hover: #abd39f;
--color-green-shadow: #c8e6c9;
--color-green-muted: #5e7454;
--color-action-green: var(--color-success);
--color-action-green-hover: var(--color-success);
--color-action-green-soft: var(--color-success);
--color-danger: #c53030;
--color-red-strong: #bf453a;
--color-red-pale: #f5978e;
--color-red-hover: #d02718;
--color-red-shadow: #810e05;
--color-red-muted: #c16767;
--color-warning: #f6d365;
--color-warning-bg: #fff8e6;
--color-warning-border: var(--color-warning);
--color-orange-strong: #ffbe44;
--color-orange-hover: #ffbe44;
--color-yellow-strong: #ffc96f;
--color-yellow-pale: #fff2ba;
--color-yellow-shadow: #fff2ba;
--color-orange-warm: #fb9e25;
--color-orange-soft: #ffc477;
--color-orange-tint: #fce2c1;
--color-gold-strong: #eeb44f;
--color-gold-deep: #cc9f52;
--color-amber: #faad08;
--color-info: #138bd6;
/* Couleurs sémantiques */
--color-text-main: var(--color-gray-800);
--color-text-muted: var(--color-gray-500);
--color-text-inverse: var(--color-white);
--color-link-primary: #0c6fae;
--color-link-primary-hover: var(--color-brand-primary-hover);
--color-border-default: #c5d9ec;
--color-border-strong: #005baa;
--color-surface-page: #c9c9c9; /* body */
--color-surface-app: var(--color-gray-100); /* global/global2 fallback (= #f1f1f1) */
--color-surface-card: var(--color-white);
--color-overlay-soft: rgba(0, 0, 0, 0.08);
--color-overlay-medium: rgba(0, 0, 0, 0.14);
--color-overlay-strong: rgba(0, 0, 0, 0.28);
/* Transparences génériques (mutualisation des rgba/rgb legacy) */
--overlay-black-06: rgba(0, 0, 0, 0.06);
--overlay-black-08: rgba(0, 0, 0, 0.08);
--overlay-black-10: rgba(0, 0, 0, 0.1);
--overlay-black-12: rgba(0, 0, 0, 0.12);
--overlay-black-14: rgba(0, 0, 0, 0.14);
--overlay-black-15: rgba(0, 0, 0, 0.15);
--overlay-black-20: rgba(0, 0, 0, 0.2);
--overlay-black-80: rgba(0, 0, 0, 0.8);
--overlay-white-00: rgba(255, 255, 255, 0);
--overlay-white-10: rgba(255, 255, 255, 0.1);
--overlay-white-12: rgba(255, 255, 255, 0.12);
--overlay-white-14: rgba(255, 255, 255, 0.14);
--overlay-white-18: rgba(255, 255, 255, 0.18);
--overlay-white-20: rgba(255, 255, 255, 0.2);
--overlay-white-24: rgba(255, 255, 255, 0.24);
--overlay-white-25: rgba(255, 255, 255, 0.25);
--overlay-white-45: rgba(255, 255, 255, 0.45);
--overlay-white-55: rgba(255, 255, 255, 0.55);
--overlay-white-70: rgba(255, 255, 255, 0.7);
--overlay-white-82: rgba(255, 255, 255, 0.82);
--overlay-white-90: rgba(255, 255, 255, 0.9);
--overlay-white-95: rgba(255, 255, 255, 0.95);
--overlay-frost-58: rgba(224, 223, 223, 0.58);
--overlay-neutral-58: rgba(127, 127, 127, 0.58);
--overlay-brand-deep-20: rgba(0, 73, 121, 0.2);
--overlay-brand-deep-25: rgba(0, 73, 121, 0.25);
--overlay-brand-primary-08: rgba(35, 116, 170, 0.08);
--overlay-brand-primary-20: rgba(35, 116, 170, 0.2);
--overlay-brand-primary-28: rgba(35, 116, 170, 0.28);
--overlay-brand-secondary-95: rgba(15, 134, 181, 0.95);
--overlay-ink-06: rgba(15, 71, 105, 0.06);
--overlay-ink-deep-06: rgba(19, 46, 89, 0.06);
--overlay-nav-22: rgba(43, 47, 52, 0.22);
--overlay-nav-32: rgba(43, 47, 52, 0.32);
--overlay-nav-40: rgba(43, 47, 52, 0.4);
--overlay-nav-95: rgba(43, 47, 52, 0.95);
--overlay-charcoal-80: rgba(42, 41, 44, 0.8);
--overlay-ice-blue-80: rgba(216, 232, 247, 0.8);
--color-white-soft: rgba(252, 252, 252, 1);
--color-accent-cyan-solid: rgba(0, 142, 198, 1);
--color-accent-blue-solid: rgb(24, 140, 248);
/* Spacing scale */
--space-2xs: 0.25rem;
--space-xs: 0.35rem;
--space-sm: 0.75rem;
--space-md: 1.25rem;
--space-lg: 1.75rem;
--space-xl: 2.5rem;
--space-2xl: 3.5rem;
/* Rayons */
--radius-xs: 3px;
--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 10px;
--radius-xl: 12px;
--radius-pill: 999px;
/* Compléments (historique FO — alignés sur des usages récurrents) */
--radius-5: 5px;
--radius-7: 7px;
--radius-9: 9px;
--radius-34: 34px;
--radius-42: 42px;
--radius-14: 14px;
--radius-hairline: 1px;
/* Bordures */
--border-width-thin: 1px;
--border-width-medium: 2px;
--border-default: var(--border-width-thin) solid var(--color-border-default);
--border-brand: var(--border-width-thin) solid var(--color-brand-primary);
/* Ombres */
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.08);
--shadow-md: 0 2px 6px rgba(0, 0, 0, 0.12);
--shadow-lg: 0 5px 12px rgba(0, 73, 121, 0.2);
--shadow-focus-ring: 0 0 0 3px rgba(35, 116, 170, 0.2);
--shadow-inset-soft: inset 0 1px 2px rgba(15, 71, 105, 0.06);
/* Durées / easing */
--duration-fast: 0.15s;
--duration-base: 0.2s;
--duration-slow: 0.3s;
--easing-standard: ease;
--easing-decelerate: cubic-bezier(0, 0, 0.2, 1);
/* Z-index standards (ordre de superposition conservé) */
--z-base: 1;
--z-surface-2: 2;
--z-surface-3: 3;
--z-page-ui: 9;
--z-sticky-bar: 10;
--z-carousel-ui: 20;
--z-layout-low: 25;
--z-layout-mid: 26;
--z-floating: 30;
--z-floating-high: 40;
--z-menu: 95;
--z-header-under: 92;
--z-header-chip: 93;
--z-nav-layer: 100;
--z-pagination: 110;
--z-modal: 101;
--z-header: 150;
--z-menu-link: 161;
--z-overlay: 200;
--z-popup-high: 205;
--z-popup-panel: 206;
--z-tooltip: 300;
--z-lightbox-backdrop: 1000;
--z-lightbox-panel: 1001;
--z-preview-peak: 1001;
/* Layout / dimensions */
--header-height: 110px;
--logo-height: 100px;
--content-max-width: 1200px;
--content-offset-top: 20px;
--login-card-max-width: 28rem;
--login-card-min-height: 340px;
/* Breakpoints (documentation + usages progressifs) */
--breakpoint-xs: 480px;
--breakpoint-sm: 640px;
--breakpoint-md: 768px;
--breakpoint-lg: 900px;
--breakpoint-xl: 1200px;
/* Tokens spécifiques FO (hors standards génériques, mais utiles ici) */
--fo-header-bg-image: url("../images/header2.png");
--fo-page-bg-image: url("../images/back.png");
--fo-login-bg-image: url("../images/back_login.png");
--fo-login-lock-image: url("../images/cadenas.png");
--fo-cta-fill-start: var(--color-brand-secondary);
--fo-cta-fill-end: var(--color-brand-secondary);
--fo-cta-text-color: var(--color-text-inverse);
/* Guide saisie — bouton « Valider ma saisie » (recap.php + .home-cta-form-wrap) */
--guide-saisie-valider-btn-width: 200px;
--guide-saisie-valider-btn-height: 50px;
/* Guide saisie FO — navigation parcours (commencer, validation, valider) : .home-cta-form-btn, #menu_nav_validation_flag, #valid_saisie */
--guide-saisie-text: var(--color-brand-primary);
--guide-saisie-text-hover: var(--color-brand-primary-hover);
--guide-saisie-bg: var(--color-brand-accent);
--guide-saisie-bg-hover: var(--color-brand-accent-hover);
--guide-saisie-bg-active: var(--color-brand-accent-active);
--guide-saisie-border-color: rgba(43, 47, 52, 0.22);
--guide-saisie-border-color-hover: rgba(43, 47, 52, 0.32);
--guide-saisie-border-color-active: rgba(43, 47, 52, 0.4);
--guide-saisie-shadow-rest: 0 2px 6px rgba(0, 0, 0, 0.1), 0 6px 20px rgba(0, 0, 0, 0.12);
--guide-saisie-shadow-hover: 0 4px 10px rgba(0, 0, 0, 0.1), 0 10px 24px rgba(0, 0, 0, 0.14);
--guide-saisie-shadow-active: 0 1px 4px rgba(0, 0, 0, 0.1), 0 3px 8px rgba(0, 0, 0, 0.12);
/* --------------------------------------------------------------------- */
/* Désactivé / prévu pour extension (non utilisé actuellement) */
/* --------------------------------------------------------------------- */
/* --container-max-width: 1440px; */
/* --grid-columns: 12; */
/* --shadow-xl: 0 16px 40px rgba(0, 0, 0, 0.2); */
/* --color-brand-tertiary: #7c3aed; */
/* --motion-reduce-duration: 0ms; */
/* --focus-outline-color: #1d4ed8; */
/* --focus-outline-width: 2px; */
/* --table-row-hover-bg: var(--color-gray-50); */
/* --input-height-default: 42px; */
}
/* -------------------------------------------------------------------------- */
/* Fin SECTION 02 (:root). SECTION 03 — Base (html, body, #global, #content). */
/* -------------------------------------------------------------------------- */
/**
* Document : fond #global sur html si marge ; body en colonne flex (pied fixe).
*/
html,
body {
padding: 0;
margin: 0;
height: 100%;
font-family: var(--font-family-base);
color: var(--color-gray-600);
}
html {
background-color: var(--color-surface-app);
}
body {
min-height: 100vh;
display: flex;
flex-direction: column;
text-align: center;
background-color: var(--color-surface-page);
}
.impressionh {
background-color: var(--color-white);
}
#global,
#global2 {
position: relative;
margin: 0 auto;
width: 100%;
text-align: center;
background-color: var(--color-surface-app);
}
#global {
min-height: 100%;
}
#global2 {
background-image: var(--fo-page-bg-image);
background-size: cover;
padding-top: 100px;
flex: 1 0 auto;
}
#content {
position: relative;
width: 100%;
margin-top: var(--content-offset-top);
}
/* -------------------------------------------------------------------------- */
/* SECTION 04 — En-tête fixe (divers.php print_Header / print_Header_nonconnected). */
/* Sous-blocs : bandeau → logo → sous-titre → menu (#home_menu). */
/* Lien #connexion, overlay #container_login_window… → SECTION 17 (identification). */
/* -------------------------------------------------------------------------- */
/* --- 04.1 Bandeau fixe ----------------------------------------------------- */
#headerBuzzy {
position: fixed;
inset: 0 0 auto;
overflow: hidden;
height: var(--header-height);
width: 100%;
z-index: var(--z-header);
background-image: var(--fo-header-bg-image);
background-size: cover;
}
/* --- 04.2 Logo (#pos_logo / print_Header, print_Header_nonconnected) ------- */
#pos_logo {
float: left;
position: fixed;
}
#logo {
z-index: var(--z-nav-layer);
}
#logoB {
height: var(--logo-height);
margin: -10px 20px;
}
/* --- 04.3 Sous-titre sous le logo ------------------------------------------ */
#subtitle_header {
float: left;
position: fixed;
top: 75px;
left: 40px;
color: var(--color-gray-600);
font: var(--font-weight-bold) var(--font-size-sm) / var(--line-height-tight) var(--font-family-base);
}
/* --- 04.4 Menu principal connecté (#home_menu dans print_Header) ------------ */
/* .home_bar :
dans multi/header.php et BO/multi/header_bo*.php (masqués). */
.home_bar {
display: none;
}
#home_menu {
--home-menu-link-pad-y: 6px;
--home-menu-link-pad-x: 8px;
box-sizing: border-box;
position: fixed;
top: 8px;
right: 10px;
z-index: var(--z-menu);
display: grid;
grid-auto-flow: column;
grid-auto-columns: max-content;
align-items: center;
column-gap: 4px;
padding: var(--home-menu-link-pad-y) 10px;
border-radius: var(--radius-sm);
background-color: transparent;
font: var(--font-weight-regular) var(--font-size-sm) / var(--line-height-tight) var(--font-family-base);
color: var(--color-brand-primary);
}
#home_menu a {
position: relative;
display: block;
padding: var(--home-menu-link-pad-y) var(--home-menu-link-pad-x);
border-radius: var(--radius-xs);
text-decoration: none;
font-size: var(--font-size-sm);
font-weight: var(--font-weight-medium);
line-height: var(--line-height-tight);
color: inherit;
transition:
background var(--duration-base) var(--easing-standard),
color var(--duration-base) var(--easing-standard),
box-shadow var(--duration-base) var(--easing-standard);
}
#home_menu a:not(.home_menu_icon_link) {
font-weight: var(--font-weight-bold);
}
.home_menu_icon_link {
min-width: 30px;
text-align: center;
}
.home_menu_icon_link i {
font-size: var(--font-size-sm);
line-height: 1;
vertical-align: middle;
}
#home_menu .home_menu_icon_link + .home_menu_icon_link {
margin-left: -2px;
}
/* --- 04.5 Menu visiteur (print_Header_nonconnected — .home_menu--public) --- */
#home_menu.home_menu--public {
column-gap: 0;
}
#home_menu.home_menu--public a.home_menu--public-cta {
display: inline-flex;
align-items: center;
justify-content: flex-start;
gap: 0.55rem;
padding: 8px 14px;
border-radius: var(--radius-sm);
font-weight: var(--font-weight-semibold);
color: var(--color-white);
background-color: var(--color-brand-primary);
border: var(--border-width-thin) solid var(--overlay-black-12);
box-shadow: var(--shadow-sm);
}
/**
* Pictogramme à gauche : même fond que le lien parent (pas de second plan).
*/
#home_menu.home_menu--public a.home_menu--public-cta .home_menu--public-cta-iconWrap {
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
/**
* Edmondsans sur #home_menu héritait sur et masquait les glyphes FA :
* forcer la pile Font Awesome sur l’icône du CTA.
*/
#home_menu.home_menu--public a.home_menu--public-cta .home_menu--public-cta-iconWrap i,
#home_menu.home_menu--public a.home_menu--public-cta i[class*="fa-"] {
font-family: var(--font-family-icon);
font-weight: 900;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
font-size: var(--font-size-md);
}
#home_menu.home_menu--public a.home_menu--public-cta .home_menu--public-cta-label {
white-space: nowrap;
}
#home_menu.home_menu--public a.home_menu--public-cta:hover,
#home_menu.home_menu--public a.home_menu--public-cta:focus {
background-color: var(--color-brand-primary-hover);
color: var(--color-white);
box-shadow: 0 0 12px 2px var(--overlay-white-55);
outline: none;
}
#home_menu.home_menu--public a.home_menu--public-cta:focus-visible {
outline: var(--border-width-medium) solid var(--color-white);
outline-offset: var(--border-width-medium);
}
/* Infobulles des liens icône (data-tooltip) — sous le déclencheur */
.home_menu_icon_link::after {
content: attr(data-tooltip);
position: absolute;
top: calc(100% + 4px);
right: 0;
padding: 3px 6px;
border-radius: var(--radius-xs);
background-color: var(--overlay-brand-secondary-95);
color: var(--color-white);
font-size: 11px;
font-weight: var(--font-weight-medium);
line-height: var(--line-height-tight);
white-space: nowrap;
opacity: 0;
pointer-events: none;
transform: translateY(-2px);
transition:
opacity var(--duration-fast) var(--easing-standard),
transform var(--duration-fast) var(--easing-standard);
}
.home_menu_icon_link:hover::after {
opacity: 1;
transform: translateY(0);
}
/* -------------------------------------------------------------------------- */
/* SECTION 05 — Éléments sous la bannière hors print_SubHeader() FO */
/* */
/* Ne pas confondre avec divers.php print_SubHeader() (l.397+) qui rend #bg_nav, */
/* #progress_bar1… — styles principalement en SECTION 09 (#bg_nav) + §10. */
/* */
/* Ici : #title_page (BO/multi/header_bo*). Puces étab. / sous-titre adhérent / */
/* navigation sous-en-tête (ex-multi) → SECTION 98 (suspects : styles historiques). */
/* -------------------------------------------------------------------------- */
/* --- 05.1 Titres & puces fixes — BO/multi/header_bo*.php, multi/header.php --- */
#title_page{
text-align: right;
font-weight: var(--font-weight-bold);
font-style: italic;
float: right;
z-index: var(--z-header-under);
width: 700px;
height: 20px;
position: fixed;
cursor: default;
color:var(--color-brand-primary-hover);
top: 80px;
right: 60px;
}
/* -------------------------------------------------------------------------- */
/* SECTION 06 — BO/gestion_champs.php : colonnes liste / détail et erreurs */
/* (#list_select, #conteneur_select, #edition_erreur_*, .select_bloc…). */
/* Hors header FO (cf. divers.php — pas ces ids dans la bannière .header). */
/* -------------------------------------------------------------------------- */
#list_select{
z-index: var(--z-popup-panel);
width: 250px;
height: 80%;
float: left;
margin-left: 0;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
border: 2px solid;
border-radius: var(--radius-md);
background-color: var(--color-brand-secondary-hover);
border-color: var(--color-info);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
}
#list_erreur{
z-index: var(--z-popup-panel);
width: 100%;
height: 65vh;
float: left;
margin-left: 0;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
border: 2px solid;
border-radius: var(--radius-md);
background-color: var(--color-brand-secondary-hover);
border-color: var(--color-info);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
}
#conteneur_select{
z-index: var(--z-popup-panel);
float: right;
width: 360px;
height: 80%;
margin-left: 0;
border: 2px solid var(--color-gray-300);
border-radius: var(--radius-md);
background-color: var(--color-gray-300);
font: normal 14px/normal var(--font-family-base);
color: var(--color-gray-600);
}
#conteneur_erreur{
z-index: var(--z-popup-panel);
float: right;
width: 100%;
height: 65vh;
margin-left: 0;
border: 2px solid var(--color-gray-300);
border-radius: var(--radius-md);
background-color: var(--color-gray-300);
font: normal 14px/normal var(--font-family-base);
text-align: center;
color: var(--color-gray-600);
}
#edition_erreur_val_hn{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
#edition_erreur_di{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
#edition_erreur_var_an{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
#edition_erreur_vent{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
#edition_erreur_cout{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
#edition_erreur_ms{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
#edition_erreur_autre{
width: 100%;
height: 100%;
overflow-y: scroll;
display: none;
}
.select_bloc{
display: inline-block;
box-sizing: content-box;
width: 90%;
height: 15px;
padding: 5px;
border: 1px solid var(--color-info);
border-radius: var(--radius-md);
font: normal 11px/normal var(--font-family-base);
color: var(--color-info);
text-overflow: clip;
background-color: var(--color-white);
box-shadow: 0 0 4px 1px var(--overlay-black-20);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.erreur_bloc_titre{
display: inline-block;
box-sizing: content-box;
width: 90%;
height: 15px;
padding: 5px;
margin: 1px;
border: 1px solid var(--color-green-shadow);
border-radius: var(--radius-md);
font: bold 12px/normal var(--font-family-base);
color: var(--color-gray-600);
text-overflow: clip;
background-color: var(--color-green-shadow);
box-shadow: 0 0 4px 1px var(--overlay-black-20);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.erreur_bloc_titre_vide{
display: inline-block;
box-sizing: content-box;
width: 90%;
height: 15px;
padding: 5px;
margin: 1px;
border: 1px solid var(--color-gray-300);
border-radius: var(--radius-md);
font: bold 12px/normal var(--font-family-base);
color: var(--color-gray-600);
text-overflow: clip;
background-color: var(--color-gray-300);
box-shadow: 0 0 4px 1px var(--overlay-black-20);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: default;
}
.erreur_bloc{
display: inline-block;
box-sizing: content-box;
width: 90%;
height: 15px;
padding: 5px;
border: 1px solid var(--color-info);
border-radius: var(--radius-md);
font: normal 11px/normal var(--font-family-base);
color: var(--color-info);
text-overflow: clip;
background-color: var(--color-white);
box-shadow: 0 0 4px 1px var(--overlay-black-20);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
#annuler_s{
float:left;
margin-left: 50px;
margin-top: 20px;
}
#annuler_e{
float:right;
}
#valider_f_e{
float:left;
background-color: var(--color-gray-400);
cursor: default;
}
#valider_f_e:hover{
float:left;
background-color: var(--color-gray-400);
border:1px solid var(--color-white);
color: var(--color-white);
cursor: default;
}
#valider_f_c{
float:left;
background-color: var(--color-green-strong);
padding-left: 15px;
padding-right: 15px;
}
#valider_f_c:hover{
float:left;
background-color: var(--color-white);
border:1px solid var(--color-green-strong);
color: var(--color-green-strong);
}
.correct_erreur{
margin-top: 50px;
height: 20px;
width: 80px;
font-weight: bold;
}
.confirm_erreur{
margin-top: 50px;
height: 20px;
width: 80px;
font-weight: bold;
}
#valider_s{
float:right;
margin-right: 110px;
margin-top: -30px;
display: none;
}
/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
/*@media screen and (max-height: 450px) {
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}*/
/* -------------------------------------------------------------------------- */
/* SECTION 07 — Entrée contenu après §04–06 (pas de règles propres ici). */
/* SECTION 08 — Index (§08.1–08.4) puis MesDocuments (§08.5), puis legacy (§08.6). */
/* -------------------------------------------------------------------------- */
/* Sommaire interne §08 (Index en continu, puis MesDocuments, puis legacy) : */
/* 08.1 Index — grilles & tuiles (#blocks_3*, #block*, couleurs .titreb) */
/* 08.2 Index — chrome tuile partagé (.bhead… p.textb) */
/* 08.3 Index — #slider, * { box-sizing }, carrousel, accroches index */
/* 08.4 Index — bande verte, CTA, zone blanche, vidéo, captures */
/* 08.5 MesDocuments — .mesdocs-* (réutilise #block*_b / #blocks_3_b) */
/* 08.6 Legacy — img, table, td (voir SECTION 09) */
/* -------------------------------------------------------------------------- */
/* --- 08.1 Index — grilles & tuiles (#blocks_3, #blocks_3_b, #block*, titres) */
#blocks_3,
#blocks_3_b {
--home-tile-border: 1px solid var(--color-gray-200);
--home-tile-shadow: 0 0 10px 2px var(--color-gray-200);
--home-tile-bg: var(--color-gray-50);
}
#blocks_3{
position: relative;
padding-top: 20px;
margin-left: auto;
margin-right: auto;
width: 1100px;
min-height: 200px;
}
/* Clearfix : les tuiles sont en float, sans quoi #blocks_3 n’a pas de hauteur réelle sous les tuiles. */
#blocks_3::after {
content: "";
display: table;
clear: both;
}
@media only screen and (max-width: 1100px) {
#blocks_3{
position: relative;
margin-top: 100px;
padding-top: 20px;
margin-left: auto;
margin-right: auto;
max-width: 800px;
min-height: 450px;
}
}
#blocks_3_b{
position: relative;
margin-left: 50px;
margin-bottom: 1.15rem;
width: 900px;
min-height: 95px;
}
#blocks_3_b::after {
content: "";
display: table;
clear: both;
}
/* Tuiles 300px — page accueil (#block1–3) */
#block1,
#block2,
#block3{
box-sizing: content-box;
position: relative;
width: 300px;
min-height: 200px;
border: var(--home-tile-border);
background: var(--home-tile-bg);
box-shadow: var(--home-tile-shadow);
border-radius: var(--radius-lg);
}
#block1{
float: left;
}
#block2{
margin-left: 100px;
float: left;
}
#block3{
float: right;
}
@media only screen and (max-width: 1100px) {
#block1{
float: left;
}
#block2{
float: right;
}
#block3{
margin-top: 30px;
float: left;
}
}
/* Couleurs des titres — tuiles index uniquement (index.php) */
#blocks_3 #block1 .titreb {
color: var(--color-border-strong);
}
#blocks_3 #block2 .titreb {
color: var(--color-green-strong);
}
#blocks_3 #block3 .titreb {
color: var(--color-brand-secondary-hover);
}
/* Tuiles 250px — accueil compact / prête pour variantes MesDocuments (§08.5) */
#block1_b,
#block2_b,
#block3_b{
box-sizing: content-box;
position: relative;
width: 250px;
min-height: 105px;
border: var(--home-tile-border);
background: var(--home-tile-bg);
box-shadow: var(--home-tile-shadow);
border-radius: var(--radius-lg);
}
#block1_b{
float: left;
}
#block2_b{
margin-left: 50px;
float: left;
}
#block3_b{
float: right;
}
/* --- 08.2 Index — chrome tuile partagé (accueil & écrans voisins) ------------ */
.bhead{
position: relative;
width: 100%;
height: 90px;
margin-top: 0px;
background-color: var(--color-gray-100);
}
.bhead_b{
position: relative;
width: 100%;
height: 60px;
margin-top: 0;
}
.logob{
position: relative;
width: 60px;
margin-left: 15px;
margin-top: 15px;
height: 60px;
float: left;
}
.logoc{
position: relative;
width: 60px;
margin-left: 15px;
margin-top: 20px;
height: 30px;
float: left;
font-size: 25px;
}
.img_b{
width: 60px;
height: auto;
}
.titreb{
margin: auto;
padding-top: 30px;
font-weight: var(--font-weight-bold);
text-align: center;
font-size: 23px;
}
.titrec{
margin: auto;
padding-top: 10px;
font-weight: var(--font-weight-bold);
text-align: center;
font-size: 23px;
}
.textb{
position: relative;
width: 300px;
height: 140px;
margin: 0;
font-size: 17px;
background-color: var(--color-gray-100);
text-align: justify;
}
.textc{
position: relative;
width: 250px;
margin: 10px 0 0;
font-size: 12px;
background-color: var(--color-gray-100);
text-align: center;
}
p.textb{
width: 270px;
padding: 15px;
margin-left: 10px;
margin-right: 10px;
}
/* --- 08.3 Index — #slider, box-sizing global, carrousel, accroches ---------- */
#slider{
position: relative;
margin-top: 75px;
margin-left: auto;
margin-right: auto;
width: 1100px;
height: 450px;
background-color: var(--color-gold-deep);
}
/* Modèle de boîte : impact sur tout le document (cascade après #slider). */
* {
box-sizing: border-box;
}
/* Carrousel — échelle 2/3 : hauteur des images et largeur réduites au même ratio (proportions conservées) */
.slideshow-container {
--home-slideshow-scale: 0.66666667;
max-width: calc(1100px * var(--home-slideshow-scale));
width: 100%;
position: relative;
/* Même écart qu’entre le carrousel et #greenzone (margin-top: 50px) */
margin-top: 50px;
margin-left: auto;
margin-right: auto;
background-color: var(--color-white);
overflow: hidden;
box-sizing: border-box;
}
@media only screen and (max-width: 1100px) {
.slideshow-container {
margin-top: 75px;
}
}
.mySlides {
display: none;
position: relative;
width: 100%;
box-sizing: border-box;
}
.mySlides img {
width: 100%;
max-width: 100%;
height: auto;
display: block;
}
/* Flèches : z-index au-dessus des slides */
.prev,
.next {
cursor: pointer;
position: absolute;
top: 55%;
z-index: var(--z-carousel-ui);
width: auto;
height: calc(40px * var(--home-slideshow-scale));
margin-top: calc(-22px * var(--home-slideshow-scale));
padding: calc(8px * var(--home-slideshow-scale)) calc(16px * var(--home-slideshow-scale));
color: var(--color-brand-primary);
background-color: var(--color-gray-300);
font-weight: var(--font-weight-bold);
font-size: calc(18px * var(--home-slideshow-scale));
transition: 0.6s ease;
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
}
.prev {
left: 0;
margin-left: 0;
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
}
.next {
right: 0;
left: auto;
margin-left: 0;
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
}
.prev:hover,
.next:hover {
background-color: var(--overlay-black-80);
}
.text {
color: var(--color-white);
background-color: var(--overlay-charcoal-80);
font-size: calc(22px * var(--home-slideshow-scale));
left: calc(80px * var(--home-slideshow-scale));
padding: calc(8px * var(--home-slideshow-scale)) calc(12px * var(--home-slideshow-scale));
position: absolute;
top: calc(40px * var(--home-slideshow-scale));
width: calc(440px * var(--home-slideshow-scale));
text-align: left;
line-height: 1.35;
}
.numbertext {
color: var(--color-gray-100);
font-size: calc(15px * var(--home-slideshow-scale));
padding: calc(8px * var(--home-slideshow-scale)) calc(12px * var(--home-slideshow-scale));
position: absolute;
top: 0;
}
.dot {
cursor: pointer;
height: calc(15px * var(--home-slideshow-scale));
width: calc(15px * var(--home-slideshow-scale));
margin: 0 2px;
background-color: var(--color-gray-300);
border-radius: 50%;
display: inline-block;
transition: background-color 0.6s ease;
}
.active,
.dot:hover {
background-color: var(--color-gray-500);
}
.fade {
animation: fade 1.5s;
}
@keyframes fade {
from {
opacity: 0.4;
}
to {
opacity: 1;
}
}
/* Dots + textes d’intro sous le carrousel */
.slideshow-container > .mySlides:first-of-type {
display: block;
}
.slideshow-dots {
text-align: center;
margin-top: calc(-50px * var(--home-slideshow-scale));
position: relative;
}
.whitezone-index-lead {
text-align: center;
font-size: 22px;
font-weight: bold;
font-style: italic;
width: 80%;
margin-left: 10%;
margin-top: 0;
margin-bottom: 0;
}
.whitezone-index-justify {
text-align: justify;
width: 80%;
margin-left: 10%;
margin-top: 0;
margin-bottom: 0;
}
/* --- 08.4 Index — bande verte, CTA, zone blanche, vidéo, captures d’écran --- */
#greenzone{
position: relative;
margin-top: 50px;
padding: 0;
width: 100%;
min-height: 470px;
background-image: url("../images/home_green2.png");
}
@media only screen and (max-width: 1100px) {
#greenzone{
position: relative;
margin-top: 75px;
padding: 0;
margin-left: auto;
margin-right: auto;
max-width: 100%;
min-height: 800px;
background-size: cover;
}
}
#greenzone_content{
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
width: 1100px;
min-height: 300px;
}
@media only screen and (max-width: 1100px) {
#greenzone_content{
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
max-width: 600px;
min-height: 450px;
padding-left: 50px;
left: 0;
float: left;
line-height: 1.2;
}
}
#greenzone_left{
position: relative;
width: 500px;
min-height: 300px;
float: left;
}
#greenzone_separator{
position: relative;
width: 12px;
max-height: 313px;
margin-left: 20px;
margin-top: 30px;
float: left;
}
@media only screen and (max-width: 1100px) {
#greenzone_separator{
display: none;
}
}
#greenzone_right{
position: relative;
width: 540px;
min-height: 300px;
float: right;
}
@media only screen and (max-width: 1100px) {
#greenzone_right{
position: relative;
width: 500px;
min-height: 300px;
margin-top: 40px;
margin-left: auto;
margin-right: auto;
float: left;
}
}
p.greenzone_title{
position: relative;
height: 50px;
margin-top: 25px;
width: 500px;
color: var(--color-white);
font-weight: bold;
font-family: var(--font-family-base);
text-align: left;
font-size: 22px;
}
p.greenzone_text{
position: relative;
min-height: 150px;
margin-top: 0;
margin-bottom: 0;
color: var(--color-white);
text-align: left;
font-size: 16px;
font-family: var(--font-family-base);
}
#greenzone_buttons{
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
padding-top: 30px;
width: 1100px;
height: 100px;
}
@media only screen and (max-width: 1100px) {
#greenzone_buttons{
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
padding-top: 30px;
width: 200px;
height: 600px;
float: right;
right: 0;
}
}
#greenzone_button_left{
position: relative;
width: 500px;
height: 100px;
float: left;
}
@media only screen and (max-width: 1100px) {
#greenzone_button_left{
position: relative;
width: 200px;
height: 300px;
padding-top: 150px;
float: right;
right: 50px;
}
}
#greenzone_button_right{
position: relative;
width: 540px;
height: 100px;
float: right;
}
@media only screen and (max-width: 1100px) {
#greenzone_button_right{
position: relative;
width: 200px;
height: 300px;
padding-top: 150px;
float: right;
right: 50px;
}
}
/* CTA sous #greenzone_buttons */
.button_yellow,
.button_blue{
display: inline-flex;
align-items: center;
justify-content: center;
width: 320px;
max-width: 100%;
height: 48px;
padding: 0 50px;
line-height: 1;
box-sizing: border-box;
}
.button_yellow{
cursor: pointer;
border: 1px solid var(--color-gold-strong);
border-radius: var(--radius-34);
font: var(--font-weight-bold) 20px/1 var(--font-family-base);
color: var(--color-gray-800);
text-overflow: clip;
background: var(--color-gold-strong);
}
.button_yellow:hover{
color: var(--color-gold-strong);
background: var(--color-gray-800);
}
/* CTA Adhérer (index) : conserve la forme .button_yellow, applique la palette du bouton formulaire */
#btn_participate{
color: var(--guide-saisie-text);
background: var(--guide-saisie-bg);
border-color: var(--guide-saisie-border-color);
transition: color var(--duration-base) var(--easing-standard), background-color var(--duration-base) var(--easing-standard), border-color var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard);
}
#btn_participate:hover{
/* Hover spécifique : inversion texte/fond pour distinguer le CTA Adhérer */
color: var(--guide-saisie-bg);
background: var(--guide-saisie-text);
border-color: var(--guide-saisie-border-color-hover);
box-shadow: var(--guide-saisie-shadow-hover);
}
.button_blue{
cursor: pointer;
border: 1px solid var(--color-link-primary);
border-radius: var(--radius-34);
font: var(--font-weight-bold) 20px/1 var(--font-family-base);
color: var(--color-white);
text-overflow: clip;
background: var(--color-link-primary);
}
.button_blue:hover{
color: var(--color-link-primary);
background: var(--color-white);
}
#whitezone{
margin-bottom: 25px;
box-sizing: content-box;
position: relative;
margin-top: 75px;
margin-left: auto;
margin-right: auto;
width: 1100px;
height: 800px;
border: 1px solid var(--color-gray-200);
background: var(--color-gray-50);
box-shadow: 0 0 10px 2px var(--color-gray-200) ;
line-height: 1.2;
}
@media only screen and (max-width: 1100px) {
#whitezone{
box-sizing: content-box;
position: relative;
margin-top: 25px;
margin-bottom: 25px;
padding: 0;
margin-left: auto;
margin-right: auto;
max-width: 100%;
min-height: 1900px;
border: 1px solid var(--color-gray-200);
background: var(--color-gray-50);
box-shadow: 0 0 10px 2px var(--color-gray-200) ;
line-height: 1.2;
}
}
/* container of the 2 blocks whitezone */
.whitezone_2{
position: relative;
padding-top: 25px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
width: 1100px;
height: auto;
}
@media only screen and (max-width: 1100px) {
.whitezone_2{
position: relative;
padding-top: 25px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
max-width: 600px;
min-height: 450px;
padding-left: 50px;
left: 0;
float: left;
}
}
/* Style the first block in the container 2*/
.whitezone_2_left{
position: relative;
width: 530px;
height: 280px;
float: left;
padding-left: 30px;
}
@media only screen and (max-width: 1100px) {
.whitezone_2_left{
position: relative;
width: 530px;
height: 280px;
padding-left: 30px;
}
}
#vid_h{
margin-top: 750px;
}
@media only screen and (max-width: 1100px) {
#vid_h{
margin-top: 450px;
}
}
#video_home{
width: 80%;
height: 350px;
}
/* Style the first third in the container 2*/
.whitezone_2_right{
position: relative;
width: 530px;
height: 280px;
float: right;
padding-right: 30px;
}
@media only screen and (max-width: 1100px) {
.whitezone_2_right{
position: relative;
width: 500px;
min-height: 300px;
margin-top: 400px;
margin-left: auto;
margin-right: auto;
}
}
#video{
position: relative;
width: 450px;
height: 150px;
background-color: var(--color-danger);
}
/* container of the 3 blocks whitezone */
.whitezone_3{
position: relative;
margin-top: 50px;
padding-bottom: 25px;
margin-left: auto;
margin-right: auto;
width: 1100px;
min-height: 200px;
}
/* Style the first block in the container 3*/
.whitezone_3_left{
position: relative;
width: 350px;
min-height: 200px;
float: left;
padding-left: 30px;
}
/* Style the second block in the container 3*/
.whitezone_3_center{
position: relative;
width: 300px;
min-height: 200px;
margin-left: 50px;
padding-top: 20px;
float: left;
}
/* Style the first third in the container 3*/
.whitezone_3_right{
position: relative;
width: 350px;
min-height: 200px;
float: right;
padding-right: 30px;
}
.whitezone-screen-img {
max-width: 100%;
height: auto;
display: block;
}
.whitezone-screen-img--w80 {
width: 80%;
}
.whitezone-screen-img--w70 {
width: 70%;
}
.whitezone-screen-img--w85 {
width: 85%;
}
/* Liens entourant les visuels zone blanche (index et autres écrans) */
.whitezone-screen{
position: relative;
background-color: transparent;
}
#screen{
position: relative;
background-color: transparent;
}
.screen2{
position: relative;
margin-top: 20px;
background-color: transparent;
}
/* --- 08.5 MesDocuments — tuiles téléchargement (.mesdocs-* sur #block*_b) ----- */
/**
* MesDocuments — blocs téléchargement (titre #ddd, zone texte #e7eff2, bas bouton).
*/
.mesdocs-telechargement-bloc {
--mesdocs-bloc-skin: var(--color-gray-300);
--mesdocs-bloc-title-bg: var(--color-gray-300);
--mesdocs-bloc-text-bg: var(--color-gray-200);
display: flex;
flex-direction: column;
box-sizing: border-box;
padding: 0;
overflow: hidden;
border-radius: var(--radius-md);
border: 1px solid var(--color-gray-300);
background: var(--mesdocs-bloc-skin);
}
#block1_b.mesdocs-telechargement-bloc,
#block2_b.mesdocs-telechargement-bloc,
#block3_b.mesdocs-telechargement-bloc {
background: var(--mesdocs-bloc-skin);
box-shadow: 0 1px 3px var(--color-overlay-soft);
min-height: 120px;
}
#blocks_3_b #block1_b.mesdocs-telechargement-bloc {
margin-right: 1.1rem;
}
#blocks_3_b #block2_b.mesdocs-telechargement-bloc {
margin-left: 1.1rem;
margin-right: 1.1rem;
}
#blocks_3_b #block3_b.mesdocs-telechargement-bloc {
margin-left: 1.1rem;
}
.mesdocs-telechargement-bloc__title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 0.35rem;
margin: 0;
padding: 0.3rem 0.4rem 0.3rem 0.5rem;
min-height: 0;
background-color: var(--mesdocs-bloc-title-bg);
border-radius: 0;
box-sizing: border-box;
}
.mesdocs-telechargement-bloc__title-text {
flex: 1 1 auto;
min-width: 0;
color: var(--color-brand-primary);
font: var(--font-weight-semibold) 0.8rem/1.2 var(--font-family-base);
text-align: left;
}
.mesdocs-telechargement-bloc__icon {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: center;
width: 1.5rem;
height: 1.5rem;
font-size: 0.95rem;
line-height: 1;
color: var(--color-brand-primary);
}
.mesdocs-telechargement-bloc__body {
flex: 0 1 auto;
margin: 0 0.35rem 0.2rem;
padding: 0.35rem 0.45rem;
background-color: var(--mesdocs-bloc-text-bg);
border-radius: 0;
box-sizing: border-box;
min-height: 2.9rem;
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: center;
}
.mesdocs-telechargement-bloc__text-inner {
margin: 0;
font: var(--font-weight-regular) 0.78rem/1.35 var(--font-family-base);
color: var(--color-gray-800);
text-align: center;
}
.mesdocs-telechargement-bloc__text-inner--empty {
margin: 0;
min-height: 0;
line-height: 1.35;
}
.mesdocs-telechargement-bloc__action {
flex: 0 0 auto;
align-self: stretch;
margin: 0;
padding: 0.25rem 0.4rem 0.12rem;
text-align: center;
box-sizing: border-box;
background-color: var(--mesdocs-bloc-skin);
border-top: 1px solid var(--color-overlay-soft);
}
.mesdocs-telechargement-bloc__action .home-nav-tile__btn {
font-size: 0.86rem;
min-height: 2.45rem;
padding: 0.45rem 0.7rem;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: 100%;
margin: 0;
border-bottom-left-radius: var(--radius-5);
border-bottom-right-radius: var(--radius-5);
}
/* --- 08.6 Legacy — balises globales (héritage ; doublons possibles avec §09) - */
img{
border: 0;
margin: 0;
padding: 0;
}
table{
border-width: 0;
}
td{
height: 30px;
padding: 3px;
font-size: 14px;
}
/* -------------------------------------------------------------------------- */
/* SECTION 09 — Éléments génériques : tableaux, .td*, grilles transverses, */
/* navigation prev/next, utilitaires de mise en page */
/* -------------------------------------------------------------------------- */
.titre_table td{
height:0px;
font-size:0px;
}
/*
.td1{
width:400px;
}
.td2{
width:50px;
}
.td3{
width:150px;
}
.td4{
width:250px;
}
.td5{
width:250px;
}
.td6{
width:50px;
}
.td7{
width:50px;
}*/
.td1{
width:30%;
}
.td2{
width:3%;
}
.td3{
width:13%;
}
.td4{
width:20%;
}
.td5{
width:20%;
}
.td6{
width:3%;
}
.td7{
width:3%;
}
td.tab_drag_text{
width:80%;
padding: 2px;
font-size: 12px;
height:auto;
}
.tab_drag{
width:100%;
}
blockquote{
font-size:14px;
}
.maxi{
display:none;
}
.ancres{
float:right;
}
#prev{
float:left;
margin-left:50px;
}
#next{
float:right;
margin-right:50px;
}
.imprimer, .bouton_carto, .bouton_carto_2{
float:right;
margin-top:6px;
margin-right:20px;
}
.imprimer_recap{
float:right;
margin-top:6px;
margin-right:45px;
}
#ancre_bas{
position:fixed;
bottom:25px;
right:25px;
}
#ancre_haut{
z-index: var(--z-nav-layer);
position:fixed;
top:25px;
right:25px;
}
.block_principal{
display:none;
}
.lien_tab{
color:var(--color-gray-600);
}
.tab_recherche{
width:852px;
background-color:var(--color-gray-600);
margin-left:auto;
margin-right:auto;
}
.tab_recherche td {
background-color:var(--color-white);
height:15px;
}
.budget_type{
display:none;
border: solid;
border-width:1px;
border-color:var(--color-black);
background-color:var(--color-gray-600);
margin-left:auto;
margin-right:auto;
}
.impression {
background: white;
margin-top: 0px;
min-width: 100vh;
min-height: auto; /* Changer de 100vh à auto pour s'adapter au contenu */
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
overflow: visible; /* Assurez-vous que le débordement est visible */
}
#global_impression{
position : relative;
margin : auto;
width : 1000px;
text-align : center;
min-height : 100%;
background-color : var(--color-white);
}
.print_tab{
width:850px;
border: solid;
border-width:1px;
border-color:var(--color-black);
background-color:var(--color-gray-600);
margin-left:auto;
margin-right:auto;
}
.print_titre_2{
background-color:var(--color-white);
text-align:center;
}
.print_titre_2 td {
font-size:20px;
}
.print_tab td {
height:13px;
}
.print_titre{
background-color:var(--color-white);
}
.print_lvl_1{
background-color:var(--color-gray-200);
}
.print_lvl_2{
background-color:var(--color-gray-100);
}
.print_lvl_3, .print_lvl_4, .print_lvl_5{
background-color:var(--color-white);
}
.text_2{
padding-left:10px;
}
.text_3{
padding-left:25px;
}
.budget_titre_1, .budget_lvl_4{
background-color:var(--color-white);
}
.budget_lvl_1{
background-color:var(--color-brand-secondary);
}
.budget_lvl_2{
background-color:var(--color-brand-secondary);
}
.budget_lvl_3{
background-color:var(--color-info);
}
#menu{
color:var(--color-gray-400);
font-family:var(--font-family-base);
font-size:11px;
position:relative;
height : 32px;
width:100%;
float:left;
margin-bottom:0;
}
#menu ul{
clear:left;
float:left;
list-style:none;
margin:0px;
padding:0;
position:relative;
/*left:50%;*/
text-align:center;
}
li.menuitem{
display:block;
float:left;
list-style:none;
margin:0px;
padding:10px;
position:relative;
right:50%;
}
a{
text-decoration:none;
color:var(--color-black);
}
a.menu_link, a.menu_link_s, a.menu_link_bo{
color:black;
font-family:var(--font-family-base);
font-size:12px;
z-index: var(--z-menu-link);
}
a.menu_link:hover, a.menu_link_s:hover, a.menu_link_bo:hover{color:var(--color-border-strong);}
/* --- Saisie FO : barre d’icônes rapides (hors header — pages avec .saisie-quick-menu) */
.saisie-quick-menu {
position: absolute;
top: 5px;
right: 14px;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 6px;
z-index: var(--z-floating);
}
.saisie-quick-menu__icons {
display: inline-flex;
align-items: center;
gap: 2px;
}
.saisie-quick-menu__save {
display: flex;
justify-content: flex-end;
}
.saisie-quick-menu .home_menu_icon_link {
width: 30px;
height: 30px;
min-width: 30px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: var(--radius-sm);
color: var(--color-brand-primary);
}
.saisie-quick-menu .home_menu_icon_link i {
font-size: 14px;
}
.saisie-quick-menu .home_menu_icon_link:hover {
background: radial-gradient(circle, var(--color-white) 0%, var(--overlay-white-82) 58%, var(--overlay-white-20) 85%, var(--overlay-white-00) 100%);
box-shadow: 0 0 16px 2px var(--overlay-white-90);
color: var(--color-brand-primary-hover);
}
/**
* Sauvegarde saisie — même gabarit vertical que #menu_nav_validation_flag (50×45, icône 21px).
* Repos : contour vert (bordure épaisse) ; survol : plein vert.
*/
.saisie-quick-menu #save {
--save-accent-color: var(--color-action-green);
box-sizing: border-box;
width: 50px;
height: 45px;
min-width: 50px;
min-height: 45px;
border-radius: var(--radius-xl);
border: var(--border-width-medium) solid var(--save-accent-color);
background-color: transparent;
color: var(--save-accent-color);
transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.saisie-quick-menu #save:hover {
background-color: var(--color-action-green-hover);
background-image: none;
color: var(--color-white);
border-color: var(--color-action-green-hover);
box-shadow: none;
}
.saisie-quick-menu #save i {
font-size: 21px;
line-height: 1;
}
/* print_SubHeader() divers.php — bandeau onglets saisie FO (#bg_nav, #menu_nav, #progress_bar1…) */
#bg_nav{
box-sizing: border-box;
position: relative;
margin: 30px auto -10px;
padding: 12px 56px 14px;
width: min(96%, 1600px);
border: 1px solid var(--color-gray-200);
border-radius: var(--radius-lg);
background: var(--color-gray-50);
box-shadow: 0 0 10px 2px var(--color-gray-200);
z-index: var(--z-menu);
}
#bg_nav_bo{
width:100%;
position: fixed;
height:82px;
padding-top: 10px;
z-index: var(--z-sticky-bar);
background-image: url("../images/bg_nav.png");
background-size: cover;
}
#menu_nav{
width: 100%;
position: relative;
height: auto;
margin: 0;
z-index: var(--z-nav-layer);
}
#progress_main{
margin: 8px 0 0;
}
.progress_m{
appearance: none;
background-color: var(--color-gray-300);
border-radius: var(--radius-5);
/* (height of inner div) / 2 + padding */
padding: 1px;
width: 30%;
display: inline-block;
}
.progress_m_size{
/* Adjust with JavaScript */
height: 5px;
border-radius: var(--radius-5);
}
.progress_p{
appearance: none;
background-color: var(--color-gray-300);
border-radius: var(--radius-5);
/* (height of inner div) / 2 + padding */
padding: 1px;
width: 250px;
display: inline-block;
}
.progress_p_size{
/* Adjust with JavaScript */
height: 10px;
border-radius: var(--radius-5);
}
#progress_d_o{
background-color: var(--color-red-strong);
}
#progress_d_i{
background-color: var(--color-green-strong);
}
#progress_d_s{
background-color: var(--color-brand-primary-hover);
}
#progress_t_o{
background-color: var(--color-red-strong);
animation-name: progressBar_t_o;
animation-iteration-count: 1;
animation-duration: 2s;
}
#progress_t_i{
background-color: var(--color-green-strong);
animation-name: progressBar_t_i;
animation-iteration-count: 1;
animation-duration: 2s;
}
/**
* Barre d'avancement global d'affichage (prct_t_affichage) : piste élargie, 90 % du conteneur,
* losanges décoratifs aux extrémités, remplissage var(--color-brand-primary).
*/
.progress_m.progress_m_affichage{
width: 90%;
max-width: 100%;
display: block;
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
padding: 0;
background-color: transparent;
}
.progress_m_affichage_row{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
box-sizing: border-box;
}
.progress_m_affichage_track{
flex: 1 1 auto;
min-width: 0;
background-color: var(--color-gray-300);
border-radius: var(--radius-md);
padding: 2px;
box-sizing: border-box;
}
#progress_t_affichage.progress_m_affichage_fill{
height: 14px;
border-radius: var(--radius-md);
background-color: var(--color-brand-primary);
animation-name: progressBar_t_affichage;
animation-iteration-count: 1;
animation-duration: 2s;
}
@keyframes progressBar_t_affichage{
from { opacity: 0.4; }
to { opacity: 1; }
}
.progress_m_affichage_diamond{
width: 12px;
height: 12px;
flex-shrink: 0;
transform: rotate(45deg);
border-radius: var(--radius-hairline);
}
.progress_m_affichage_diamond--debut{
background-color: var(--color-yellow-strong);
}
.progress_m_affichage_diamond--fin{
background-color: var(--color-green-strong);
}
#progress_t_s{
background-color: var(--color-brand-primary-hover);
animation-name: progressBar_t_s;
animation-iteration-count: 1;
animation-duration: 2s;
}
#progress_p_o{
background-color: var(--color-red-strong);
animation-name: progressBar_p_o;
animation-iteration-count: 1;
animation-duration: 2s;
}
#progress_p_i{
background-color: var(--color-green-strong);
animation-name: progressBar_p_i;
animation-iteration-count: 1;
animation-duration: 2s;
}
#progress_p_s{
background-color: var(--color-brand-primary-hover);
animation-name: progressBar_p_s;
animation-iteration-count: 1;
animation-duration: 2s;
}
#btn_nav{
/*display: block;*/
/*overflow: auto;*/
box-sizing: content-box;
position: relative;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 50px;
height: 50px;
border: 1px solid var(--color-gray-200);
background: var(--color-gray-50);
box-shadow: 0 0 10px 2px var(--color-gray-200);
}
#nav_but {
box-sizing: border-box;
position: relative;
cursor: pointer;
padding: 0; /* Supprimez le padding pour permettre un centrage précis */
border: 1px solid var(--color-gray-400);
border-radius: var(--radius-xs);
font: normal 22px/normal var(--font-family-base);
color: var(--color-info);
text-align: center;
background-color: var(--color-gray-50);
box-shadow: 0 0 10px 2px var(--color-gray-200);
transition: 0.2s;
width: 50px; /* Largeur ajustée pour former un carré */
height: 50px; /* Hauteur ajustée pour former un carré */
display: flex; /* Utilisez flexbox pour centrer le contenu */
justify-content: center; /* Centre horizontalement */
align-items: center; /* Centre verticalement */
}
#nav_but:hover {
color: var(--color-white);
background-color: var(--color-info);
}
#progress_bar{
height:50px;
margin-top:0px;
padding-top:0px;
}
#progress_bar1{
width: 96%;
max-width: 96%;
height: auto;
padding-top: 0;
margin-left: 1%;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
column-gap: 12px;
row-gap: 8px;
}
#progress_bar1 .progress_bar1_nationaux{
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: flex-start;
}
#progress_bar1 .progress_bar1_sites{
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: flex-start;
}
#progress_bar1 .progress_bar1_validation_wrap{
margin-left: auto;
}
/**
* Bouton « validation saisie » (drapeau) — palette / animations guide saisie (tokens --guide-saisie-* §02).
* Dimensions conservées (50×45) pour l’alignement sous-barre.
*/
#menu_nav_validation_flag{
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 50px;
height: 45px;
padding: 0;
box-sizing: border-box;
border-radius: var(--radius-xl);
border: var(--border-width-thin) solid var(--guide-saisie-border-color);
background-color: var(--guide-saisie-bg);
color: var(--guide-saisie-text);
text-decoration: none;
cursor: pointer;
box-shadow: var(--guide-saisie-shadow-rest);
transform: translateY(0) scale(1);
transition: color var(--duration-base) var(--easing-standard), background-color var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard), border-color var(--duration-base) var(--easing-standard), transform 0.18s ease;
}
#menu_nav_validation_flag i{
font-size: 21px;
line-height: 1;
}
#menu_nav_validation_flag::after{
content: attr(data-tooltip);
position: absolute;
top: calc(100% + 6px);
right: 0;
padding: 4px 8px;
border-radius: var(--radius-sm);
background-color: var(--overlay-nav-95);
color: var(--color-white);
font-size: 11px;
line-height: 1.2;
white-space: nowrap;
opacity: 0;
pointer-events: none;
transform: translateY(-2px);
transition: opacity var(--duration-fast) var(--easing-standard), transform var(--duration-fast) var(--easing-standard);
}
#menu_nav_validation_flag:hover{
color: var(--guide-saisie-text-hover);
background-color: var(--guide-saisie-bg-hover);
box-shadow: var(--guide-saisie-shadow-hover);
border-color: var(--guide-saisie-border-color-hover);
transform: translateY(-2px) scale(1.01);
}
#menu_nav_validation_flag:hover::after{
opacity: 1;
transform: translateY(0);
}
#menu_nav_validation_flag:active{
color: var(--guide-saisie-text-hover);
background-color: var(--guide-saisie-bg-active);
box-shadow: var(--guide-saisie-shadow-active);
border-color: var(--guide-saisie-border-color-active);
transform: translateY(0) scale(0.99);
transition-duration: 0.05s;
}
#menu_nav_validation_flag:focus-visible{
outline: var(--border-width-medium) solid var(--color-brand-primary);
outline-offset: 3px;
}
#progress_bar1 .progress-base{
display: inline-flex;
width: 118px;
height: 45px;
min-height: 45px;
max-height: 45px;
padding: 2px 0;
box-sizing: border-box;
font-size: 12px;
line-height: 1.15;
text-decoration: none;
vertical-align: middle;
}
#progress_bar1 .progress_bar1_cell_body{
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: center;
gap: 2px;
width: 100%;
height: 100%;
min-height: 0;
box-sizing: border-box;
margin: 0;
padding: 0;
background: transparent;
border: none;
}
#progress_bar1 .progress_bar1_titre_row,
#progress_bar1 .progress_bar1_prct_row{
flex: 0 0 auto;
width: 100%;
min-width: 0;
margin: 0;
padding: 0;
}
#progress_bar1 .progress_bar1_prct_row{
display: flex;
justify-content: flex-end;
align-items: center;
text-align: right;
}
#progress_bar1 .progress_bar1_titre_row{
flex: 1 1 auto;
display: flex;
align-items: center;
justify-content: center;
min-height: 0;
text-align: center;
}
#progress_bar1 .progress_bar1_titre_row .titre_onglet{
float: none;
display: block;
width: 100%;
margin: 0;
padding: 0;
font-size: 11px;
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
}
#progress_bar1 .progress_bar1_prct_row a{
float: none;
display: inline-block;
margin: 0;
padding: 0;
font-size: 11px;
line-height: 1.2;
text-align: center;
}
#progress_bar1 .progress_bar1_prct_row .prct_onglet_y{
font-size: 11px;
}
#progress_bar1 .progress_bar1_prct_row .prct_onglet,
#progress_bar1 .progress_bar1_prct_row .prct_onglet_g,
#progress_bar1 .progress_bar1_prct_row .prct_onglet_y{
float: none;
display: inline-block;
width: auto;
margin: 0 0 0 auto;
padding: 0 2px 0 0;
text-align: right;
}
@media (max-width: 1450px){
#progress_bar1{
row-gap: 10px;
}
#progress_bar1 .progress_bar1_nationaux{
width: 100%;
order: 1;
}
#progress_bar1 .progress_bar1_sites{
width: 100%;
order: 2;
}
#progress_bar1 .progress_bar1_validation_wrap{
width: 100%;
order: 3;
margin-left: 0;
display: flex;
justify-content: flex-end;
}
}
/* -------------------------------------------------------------------------- */
/* SECTION 10 — Parcours : barres de progression, sprites d’étapes, */
/* #progress_bar1, animations, sélecteurs .progress_* */
/* -------------------------------------------------------------------------- */
/* ProgressBar Saisie */
/*.progress_cout{background:url("../images/progress_cout.png") no-repeat; height:74px; width:151px; padding:0px;}*/
.progress_immo{background:url("../images/progress_immo.png") no-repeat; height:74px; width:136px; padding:0px;}
.progress_expl{background:url("../images/progress_exploit.png") no-repeat; height:74px; width:124px; padding:0px;}
.progress_serv{background:url("../images/progress_serv.png") no-repeat; height:74px; width:103px; padding:0px;}
.progress_moye{background:url("../images/progress_moy.png") no-repeat; height:74px; width:193px; padding:0px;}
.progress_coll{background:url("../images/progress_collab.png") no-repeat; height:74px; width:145px; padding:0px;}
.progress_orga{background:url("../images/progress_orga.png") no-repeat; height:74px; width:125px; padding:0px;}
.progress_inve{background:url("../images/progress_invest.png") no-repeat; height:74px; width:174px; padding:0px;}
/*.progress_cout:hover{background-position:0px -74px;}*/
.progress_immo:hover{background-position:0px -74px;}
.progress_expl:hover{background-position:0px -74px;}
.progress_serv:hover{background-position:0px -74px;}
.progress_moye:hover{background-position:0px -74px;}
.progress_coll:hover{background-position:0px -74px;}
.progress_orga:hover{background-position:0px -74px;}
.progress_inve:hover{background-position:0px -74px;}
/* ProgressBar Identite */
.progress_coo{background:url("../images/progress_coo.png") no-repeat; height:74px; width:315px; padding:0px; background-position:0px -74px;}
.progress_eta{background:url("../images/progress_eta.png") no-repeat; height:74px; width:352px; padding:0px; background-position:0px -74px;}
.progress_val{background:url("../images/progress_val.png") no-repeat; height:74px; width:333px; padding:0px; background-position:0px -74px;}
.progress_coo:hover{background-position:0px 0px;}
.progress_eta:hover{background-position:0px 0px;}
.progress_val:hover{background-position:0px 0px;}
.selected{background-position:0px -74px;}
.selected1{background-position:0px 0px;}
/* Classes de base pour les éléments de progression */
.progress-base {
box-sizing: content-box;
width: 120px;
height: 55px;
padding: 0 10px;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font: normal 16px/1 var(--font-family-base);
color: var(--color-white);
text-align: center;
text-overflow: ellipsis;
cursor: pointer;
z-index: var(--z-layout-mid);
}
/* États des éléments verts */
.progress_green_off {
background: var(--color-green-strong);
}
.progress_green_off:hover,
.progress_green_on {
background: var(--color-green-pale);
box-shadow:
0 2px 2px var(--color-green-shadow) inset,
2px 2px 2px var(--color-green-shadow) inset,
-2px 2px 2px var(--color-green-shadow) inset;
}
.progress_green_off .titre_onglet,
.progress_green_off .prct_onglet,
.progress_green_off .prct_onglet_g,
.progress_green_off .prct_onglet_y,
.progress_green_off:hover .titre_onglet,
.progress_green_off:hover .prct_onglet,
.progress_green_off:hover .prct_onglet_g,
.progress_green_off:hover .prct_onglet_y,
.progress_green_on .titre_onglet,
.progress_green_on .prct_onglet,
.progress_green_on .prct_onglet_g,
.progress_green_on .prct_onglet_y {
color: var(--color-gray-800);
}
/* États des éléments jaunes */
.progress_yellow_off {
background: var(--color-yellow-strong);
}
.progress_yellow_off .titre_onglet,
.progress_yellow_off .prct_onglet,
.progress_yellow_off .prct_onglet_g,
.progress_yellow_off .prct_onglet_y {
color: var(--color-gray-800);
}
.progress_yellow_off:hover,
.progress_yellow_on {
background: var(--color-yellow-pale);
color: var(--color-gray-800);
box-shadow: 0px 2px 2px var(--color-yellow-pale) inset, 2px 2px 2px var(--color-yellow-pale) inset, -2px 2px 2px var(--color-yellow-pale) inset;
}
.progress_yellow_off:hover .titre_onglet,
.progress_yellow_off:hover .prct_onglet,
.progress_yellow_off:hover .prct_onglet_g,
.progress_yellow_off:hover .prct_onglet_y,
.progress_yellow_on .titre_onglet,
.progress_yellow_on .prct_onglet,
.progress_yellow_on .prct_onglet_g,
.progress_yellow_on .prct_onglet_y {
color: var(--color-gray-800);
}
/* États des éléments grisés */
.progress_grey_off {
background: var(--color-gray-300);
}
.progress_grey_off:hover,
.progress_grey_on {
background: var(--color-gray-50);
box-shadow: 0px 2px 2px var(--color-gray-300) inset, 2px 2px 2px var(--color-gray-300) inset, -2px 2px 2px var(--color-gray-300) inset;
}
.titre_onglet{
font: normal 12px/normal var(--font-family-base);
color: var(--color-gray-500);
float: left;
}
.prct_onglet{
font: normal 12px/normal var(--font-family-base);
color: var(--color-gray-500);
float: right;
}
.prct_onglet_g{
font: normal 12px/normal var(--font-family-base);
color: var(--color-green-pale);
float: right;
font-weight: bold;
}
.prct_onglet_y{
font: normal 13px/normal var(--font-family-base);
color: var(--color-gold-strong);
float: right;
font-weight: bold;
}
.container_saisie{
box-sizing: border-box;
position: relative;
margin: auto;
margin-bottom: 30px;
padding: 25px 56px 36px;
width: min(96%, 1600px);
height: auto;
min-height: 50vh;
border: 1px solid var(--color-gray-200);
border-radius: var(--radius-lg);
background: var(--color-gray-50);
box-shadow: 0 0 10px 2px var(--color-gray-200) ;
z-index: var(--z-layout-low);
}
.container_saisie_top{
box-sizing: content-box;
position : fixed;
margin-left:10px;
margin-right:10px;
margin-top: 75px;
margin-bottom: 40px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 50px;
padding-right: 50px;
width: 90%;
border-top: 0px solid var(--color-gray-200);
border-left: 1px solid var(--color-gray-200);
border-right: 1px solid var(--color-gray-200);
background: var(--color-gray-50);
box-shadow: 0 10px 2px var(--color-gray-200), -2 10px 2px var(--color-gray-200), -2 10px 2px var(--color-gray-200);
z-index: var(--z-modal);
display: none;
}
.cont_drop_1{
display: inline-block;
box-sizing: content-box;
overflow: hidden;
border: 1px dotted var(--color-gray-300);
border-radius: var(--radius-7);
width:750px;
background: var(--color-white);
}
.cont_drop_2{
display: inline-block;
box-sizing: content-box;
overflow: hidden;
border: 2px dotted var(--color-gray-300);
border-radius: var(--radius-7);
width:700px;
background: var(--color-white);
}
.cont_drop_3{
display: inline-block;
box-sizing: content-box;
overflow: hidden;
border: 2px dotted var(--color-gray-300);
border-radius: var(--radius-7);
width:650px;
background: var(--color-white);
}
.cont_drop_1_p{
display: inline-block;
box-sizing: content-box;
overflow: hidden;
border-radius: var(--radius-7);
width:750px;
padding-right: 20px;
background: var(--color-white);
}
.cont_drop_2_p{
display: inline-block;
box-sizing: content-box;
overflow: hidden;
border-radius: var(--radius-7);
width:700px;
background: var(--color-white);
}
.cont_drop_3_p{
display: inline-block;
box-sizing: content-box;
overflow: hidden;
border-radius: var(--radius-7);
width:650px;
background: var(--color-white);
}
.etiquette_champ_d{
display: inline-block;
box-sizing: content-box;
width: 220px;
height: 25px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-info);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--color-info);
text-overflow: clip;
background-color: var(--color-white);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.etiquette_champ_d:hover {
border: 1px solid var(--color-white);
border-radius: var(--radius-sm);
color: var(--color-white);
background: var(--color-info);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.etiquette_champ_d.is-dragging { opacity: 0.9; }
.etiquette_champ_a1{
display: inline-block;
box-sizing: content-box;
width: 750px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--color-white);
text-overflow: clip;
text-align: left;
background-color: var(--color-brand-secondary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.etiquette_champ_a1:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.etiquette_champ_a1.is-dragging { opacity: 0.9; }
.etiquette_champ_a2{
display: inline-block;
box-sizing: content-box;
width: 700px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--color-gray-500);
text-overflow: clip;
text-align: left;
background-color: var(--color-green-shadow);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.etiquette_champ_a2:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.etiquette_champ_a2.is-dragging { opacity: 0.9; }
.etiquette_champ_a3{
display: inline-block;
box-sizing: content-box;
width: 650px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--color-gray-600);
text-overflow: clip;
text-align: left;
background-color: var(--color-gray-300);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.etiquette_champ_a3:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.etiquette_champ_a3.is-dragging { opacity: 0.9; }
#msg_save{
box-sizing: content-box;
position : relative;
margin-left:auto;
margin-right:auto;
margin-top: 0px;
margin-bottom: 0px;
padding: 5px;
width: 200px;
height: auto;
color: grey;
border: 0px;
background: var(--color-gray-50);
text-shadow: 0px 0px 15px var(--color-green-strong) ;
font: normal 14px/normal var(--font-family-base);
}
.bloc_saisie{
width: 100%;
table-layout: fixed;
}
.box_title{
margin-left:auto;
margin-right:100px;
display: flex;
align-items: center;
text-align:left;
width:90%;
min-height:31px;
padding: 0 10px 2px;
box-sizing: border-box;
background-color: var(--color-brand-primary);
border-radius: var(--radius-md);
}
.box_title_text {
color: var(--color-white);
font-size: 16px;
line-height: 1;
font-weight: 500;
}
.box_title_bo{
margin-left:0;
text-align:left;
width:75%;
height:31px;
background-image:url("../images/bloc_barre.png");
}
.box_title_blue_profil{
margin-left:auto;
margin-right:100px;
margin-bottom:0px;
cursor: pointer;
text-align:left;
width:90%;
height:31px;
background-color: var(--color-info);
}
.box_title_blue_profil:hover{
background-color: var(--color-accent-blue-solid)
}
.box_title_grey_profil{
margin-left:0;
margin-right:auto;;
text-align:left;
width:95%;
height:31px;
background-image:url("../images/bloc_barre.png");
}
.hidden_section{
display: none;
}
.table_grey {
display: flex; /* Utiliser Flexbox */
justify-content: space-between; /* Aligner les enfants aux extrémités */
width: 100%; /* Prend toute la largeur de .box_title */
align-items: center; /* Centrer verticalement */
}
.left_title, .right_title {
height: 40px;
}
.left_title {
padding-top: 5px;
padding-left: 5px;
color: var(--color-white);
font-size: 16px;
}
.left_title2{
color:var(--color-white);
height:31px;
width: 60%;
}
.left_title_blue_profil{
color:var(--color-white);
width:400px;
height:31px;
}
.right_title {
padding-top: 9px;
padding-right: 5px;
color: var(--color-white);
padding-bottom: 8px; /* Ajustez selon le besoin */
text-align: right;
font-size: 12px; /* Assurez-vous que c'est une unité valide, comme 10px */
flex-grow: 1; /* Permet au contenu de droite de prendre l'espace disponible */
display: flex;
justify-content: flex-end; /* Aligner le contenu de droite à droite */
}
.center_title_blue_profil{
height:31px;
width:400px;
color:var(--color-white);
}
.right_title_blue_profil{
color:var(--color-white);
height:31px;
width:100px;
text-align:right;
}
.button_deploy_page_profil {
background-color:var(--color-white);
border-radius: var(--radius-42);
border:3px solid var(--color-gray-500);
display:inline-block;
cursor:pointer;
color:var(--color-gray-500);
font-family:Verdana;
font-size:15px;
font-weight:bold;
padding:0px 1px;
text-decoration:none;
}
.button_deploy_page_profil:hover {
background-color:var(--color-gray-300);
}
.button_reduce_page_profil {
background-color:var(--color-white);
border-radius: var(--radius-42);
border:3px solid var(--color-gray-500);
display:inline-block;
cursor:pointer;
color:var(--color-gray-500);
font-family:Verdana;
font-size:15px;
font-weight:bold;
padding:0px 4px;
text-decoration:none;
}
.button_reduce_page_profil:hover {
background-color:var(--color-gray-300);
}
.button_create {
display: inline-block;
box-sizing: content-box;
width: 50px;
cursor: pointer;
padding:6px 24px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.button_create:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_right{
float:right;
margin-right:15%;
margin-top: -40px;
}
.button_create2 {
float:right;
margin-right:50px;
width: 130px;
box-shadow: 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-brand-primary-hover) 5%, var(--color-border-strong) 100%);
background-color:var(--color-brand-primary-hover);
border-radius: var(--radius-7);
border:1px solid var(--color-border-strong);
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:15px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-align: center;
text-shadow:0px -1px 0px var(--color-border-strong);
}
.button_create2:hover {
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-brand-primary-hover) 100%);
background-color:var(--color-border-strong);
}
.button_create3 {
float:right;
margin-right:50px;
width: 130px;
box-shadow: 0px 1px 0px 0px var(--color-red-shadow);
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background-color:var(--color-red-strong);
border-radius: var(--radius-7);
border:1px solid var(--color-red-hover);
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:15px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-align: center;
text-shadow:0px -1px 0px var(--color-red-shadow);
}
.button_create4 {
float:right;
margin-right:50px;
width: 130px;
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-7);
border:1px solid var(--color-green-strong);
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:15px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-align: center;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.button_create4:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.save_profil {
display: inline-block;
box-sizing: content-box;
cursor: pointer;
padding: 10px 50px;
border: 1px solid var(--color-green-strong);
border-radius: var(--radius-34);
font: normal normal bold 20px/normal var(--font-family-base);
color: var(--color-white);
text-overflow: clip;
background: var(--color-green-strong);
}
.save_profil:hover {
color: var(--color-green-strong);
background: var(--color-white);
}
.button_delete {
box-shadow: 0px 1px 0px 0px var(--color-red-shadow);
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background-color:var(--color-red-strong);
border-radius: var(--radius-7);
border:1px solid var(--color-red-hover);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 25px;
text-decoration:none;
text-shadow:0px -1px 0px var(--color-red-shadow);
}
.button_delete:hover {
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background-color:var(--color-red-strong);
}
.button_load {
box-shadow: 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-brand-primary-hover) 5%, var(--color-border-strong) 100%);
background-color:var(--color-brand-primary-hover);
border-radius: var(--radius-7);
border:1px solid var(--color-border-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 30px;
text-decoration:none;
text-shadow:0px -1px 0px var(--color-border-strong);
}
.button_load:hover {
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-brand-primary-hover) 100%);
background-color:var(--color-border-strong);
}
.tab_align_button_center{
text-align:center;
}
.ancre {
display: block;
height: 215px; /*same height as header*/
margin-top: -215px; /*same height as header*/
visibility: hidden;
}
.ancre2 {
display: block;
height: 215px; /*same height as header*/
top: -200px;
margin-top: -215px; /*same height as header*/
visibility: hidden;
position: relative;
}
.table_faq{
color: var(--color-gray-500);
}
.table_faq2{
color: var(--color-gray-500);
text-decoration: underline;
}
.home_text{
width:75%;
margin-top:-120px;
margin-left:20%;
}
.box{
margin: 15px auto;
}
.box2{
margin-left:auto;
margin-right:100px;
margin-bottom: -25px;
min-height:50px;
width:90%;
padding:20px;
padding-top:25px;
padding-bottom:5px;
text-align:left;
border: 0px solid var(--color-border-strong);
border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}
/* Retour d’action BO (succès, info…) — fond aligné sur .container_saisie */
.bo-feedback{
display: flex;
align-items: flex-start;
gap: 1rem;
max-width: 42rem;
margin: 0 auto 1.25rem;
padding: 1rem 1.25rem;
border: var(--border-brand);
border-radius: var(--radius-lg);
background-color: var(--color-gray-50);
box-sizing: border-box;
}
.bo-feedback__icon{
flex-shrink: 0;
font-size: 1.75rem;
line-height: 1;
color: var(--color-success);
}
.bo-feedback__text{
margin: 0;
font-weight: 700;
font-size: 0.95rem;
line-height: 1.5;
color: var(--color-brand-primary);
text-align: left;
}
.bo-feedback__note{
margin: 0.65rem 0 0;
font-weight: 600;
font-size: 0.88rem;
line-height: 1.45;
color: var(--color-gray-800);
text-align: left;
}
.bo-rgpd-warning{
margin-top: 1rem;
padding: 0.75rem 1rem;
text-align: left;
font-size: 0.9rem;
line-height: 1.45;
color: var(--color-danger);
background-color: var(--color-warning-bg);
border: 1px solid var(--color-warning-border);
border-radius: var(--radius-lg);
}
.popupGeneric .bo-rgpd-warning{
margin-top: 0.75rem;
}
/* Tuiles BO campagne : champs et retour succès dans la zone texte */
.home-nav-tile__body--form .home-nav-tile__text{
text-align: left;
}
.home-nav-tile__download {
display: flex;
flex: 0 0 auto;
justify-content: center;
align-items: center;
margin-top: 1rem;
padding-top: 0.35rem;
text-align: center;
}
.home-nav-tile__sync-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
margin-right: 0.35rem;
padding: 0.25rem;
vertical-align: middle;
}
.home-nav-tile__body--calc-individuel .home-nav-tile__text--center {
text-align: center;
}
.home-nav-tile__avancement {
display: flex;
flex: 1 1 auto;
justify-content: center;
align-items: center;
min-height: 2.75rem;
margin: 0.35rem 0 0.5rem;
text-align: center;
}
.home-nav-tile__footer-actions {
display: flex;
flex: 0 0 auto;
justify-content: space-between;
align-items: center;
gap: 0.5rem;
margin-top: auto;
padding-top: 0.45rem;
border-top: 1px solid var(--overlay-black-08);
}
.home-nav-tile__footer-left {
display: flex;
align-items: center;
gap: 0.3rem;
margin: 0;
min-width: 0;
}
.home-nav-tile__sync-round {
display: inline-flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 1.65rem;
height: 1.65rem;
padding: 0;
border: 1px solid var(--color-white);
border-radius: 50%;
font-size: 0.68rem;
line-height: 1;
color: var(--overlay-white-90);
text-decoration: none;
background-color: var(--color-gray-600);
box-shadow: 0 0 3px 1px var(--overlay-black-15);
transition: background-color 100ms ease, color 100ms ease;
}
.home-nav-tile__sync-round:hover {
color: var(--color-gray-600);
background-color: var(--color-white);
}
.home-nav-tile__nb-calc {
width: 2.35rem;
max-width: 3rem;
padding: 0.15rem 0.25rem;
font-size: 0.78rem;
text-align: center;
}
.home-nav-tile__footer-hint {
font: 400 0.72rem/1.2 var(--font-family-base);
color: var(--color-gray-700);
white-space: nowrap;
}
.home-nav-tile__btn-restart--compact {
box-sizing: border-box;
width: auto;
min-width: 0;
height: auto;
padding: 0.3rem 0.55rem;
font-size: 0.72rem;
line-height: 1.2;
}
.home-nav-tile__sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.home-nav-tile__fields{
display: flex;
flex-direction: column;
gap: 0.65rem;
margin-top: 0.75rem;
text-align: left;
}
.home-nav-tile__field-row{
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 0.35rem 0.5rem;
align-items: center;
}
.home-nav-tile__field-row label{
font: 600 0.85rem/1.35 var(--font-family-base);
color: var(--color-gray-800);
min-width: 0;
}
.home-nav-tile__field-row .input_profil{
width: 4.5rem;
max-width: 100%;
}
.home-nav-tile__body .bo-feedback{
max-width: none;
margin: 0.75rem 0 0;
}
.box3{
margin-left:auto;
margin-right:30%;
margin-bottom: -25px;
min-height:50px;
width:70%;
padding:20px;
padding-top:25px;
padding-bottom:5px;
text-align:right;
border: 0px solid var(--color-border-strong);
border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}
.box_profil{
margin-left:auto;
margin-right:auto;
min-height:50px;
width:90%;
padding:20px;
padding-top:25px;
padding-bottom:5px;
text-align:left;
}
.aide_b{
text-align:center;
}
.box_id{
margin-left:auto;
margin-right:auto;
margin-top:75px;
margin-bottom:75px;
height:150px;
width:350px;
padding:12px;
text-align:left;
font-size:14px;
border: 1px solid var(--color-border-strong);
border-radius: var(--radius-lg);
background-image:url("../images/cadenas.png");
background-position:270px 20px;
background-repeat:no-repeat;
}
#box_mdp, #box_pb, #box_pb_serv, #box_ok, #box_pb_envoi{
display: none;
position: fixed;
padding: 30px;
margin-top: 1px;
width: 450px;
height: 300px;
background-image: url("../images/back_login.png");
color: var(--color-white);
z-index: var(--z-modal);
}
.blue_link{
font-size:15px;
color:var(--color-border-strong);
}
/* -------------------------------------------------------------------------- */
/* SECTION 11 — Boîtes profil, modales #box_mdp / alertes, liens contextuels */
/* SECTION 12 — Composants : statuts de parcours, boutons d’étape, états */
/* -------------------------------------------------------------------------- */
/* Bouton de statut commun : à utiliser avec .termine ou .en_cours */
.statut_btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 40px;
min-width: 90px;
margin-left: 1.5rem;
margin-right: 1rem;
padding: 0 1rem;
font-weight: 600;
font-size: 0.8rem;
font-family: var(--font-family-base);
border-radius: var(--radius-md);
border: 1px solid transparent;
box-sizing: border-box;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
cursor: default;
user-select: none;
transition: background 0.2s, color 0.2s, border 0.2s;
}
/* Statut terminé */
.termine {
color: var(--color-white);
background: var(--color-green-strong);
border-color: var(--color-green-strong);
}
/* Statut en cours */
.en_cours {
color: var(--color-gray-900);
background: var(--color-yellow-pale);
border-color: var(--color-gold-strong);
}
/* Statut non actif */
.non_actif {
color: var(--color-white);
background: var(--color-gray-400); /* gris clair moderne */
border-color: var(--color-gray-400);
}
.recap_tab{
margin-left:auto;
margin-right:auto;
}
.btn_recap_container {
display: flex;
justify-content: center;
gap: 24px; /* espace entre les boutons */
margin-top: 16px;
margin-bottom: 16px;
}
.btn_recap{
cursor: pointer;
}
.btn_bleu {
background: var(--color-brand-primary-hover);
color: var(--color-white);
border: 1px solid var(--color-brand-primary-hover);
cursor: pointer;
transition: background 0.2s, color 0.2s, border 0.2s;
}
.statut_btn.btn_bleu:hover {
background: var(--color-white);
color: var(--color-brand-primary-hover);
border: 1px solid var(--color-brand-primary-hover);
}
.statut_btn.btn_green {
background-color: var(--color-action-green);
border-color: var(--color-action-green);
color: var(--color-white);
}
.statut_btn.btn_green:hover {
background-color: var(--color-white);
color: var(--color-action-green);
border-color: var(--color-action-green);
}
.statut_btn.btn_red {
background-color: red;
border-color: var(--color-red-strong);
color: var(--color-white);
}
.statut_btn.btn_red:hover {
background-color: var(--color-white);
color: red;
border-color: var(--color-red-strong);
}
/* Récap : surcharge dimensions du bouton guide (.home-cta-form-btn) — §02 (--guide-saisie-valider-btn-*) */
.home-cta-form-wrap #valid_saisie.home-cta-form-btn {
width: var(--guide-saisie-valider-btn-width);
min-width: var(--guide-saisie-valider-btn-width);
flex-shrink: 0;
height: var(--guide-saisie-valider-btn-height);
min-height: var(--guide-saisie-valider-btn-height);
padding-block: 0;
padding-inline: var(--font-size-md);
margin: 0;
float: none;
font-family: var(--font-family-base);
font-size: var(--font-size-root);
font-weight: var(--font-weight-semibold);
line-height: var(--line-height-tight);
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
}
.btn_valid_small {
height: 50px;
width: 100px;
margin: 0 auto;
padding: 0;
position: relative;
display: flex;
justify-content: center;
align-items: center;
font: bold 14px var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
background-color: var(--color-brand-secondary);
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
box-shadow: 0 0 4px 1px var(--overlay-black-20);
cursor: pointer;
overflow: hidden;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_valid_small:hover {
border-color: var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
.maj_champ{
padding:10px;
text-align:center;
font-weight:bold;
cursor: pointer;
box-sizing: content-box;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font-size: 14px;
font-family: var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
border: 1px solid var(--color-white);
background-color: var(--color-brand-secondary);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.maj_champ:hover{
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
.conserv_val{
padding:10px;
text-align:center;
font-weight:bold;
cursor: pointer;
box-sizing: content-box;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font-size: 14px;
font-family: var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
border: 1px solid var(--color-white);
background-color: var(--color-brand-secondary);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.conserv_val:hover{
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
.btn_recap2{
padding-left:50px;
padding-right:50px;
padding-top:20px;
padding-bottom:20px;
text-align:center;
font-weight:bold;
cursor: pointer;
box-sizing: content-box;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font-size: 14px;
font-family: var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
border: 1px solid var(--color-white);
background-color: var(--color-brand-secondary);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_recap2:hover{
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
#link_recap{
color: var(--color-info);
background-color:transparent;
font-size: 16px;
}
#link_recap:hover {
color: var(--color-info);
}
.center_text{
display:inline;
height:15px;
}
.col3{
padding-left:40px;
background-position: 20px 10px;
font-size:13px;
}
.col4{
padding-left:55px;
background-position: 35px 20px;
font-size:12px;
}
.feuille{
background-image: url(../images/ss_menu_bg2.png);
background-repeat: repeat-y;
}
.force{
color:var(--color-danger);
font-size:20px;
}
.infobulle{
display:none;
position:absolute;
text-align:center;
padding:5px;
color: var(--color-border-strong);
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-400);
text-align: left;
font-size: 11px;
max-width: 400px;
z-index: var(--z-floating);
}
#text_question{
display: inline-block;
position: relative;
box-sizing: content-box;
position: relative;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 10px/normal var(--font-family-base);
color: var(--color-accent-cyan-solid);
text-overflow: clip;
background-color: var(--color-gray-50);
}
.valider_question{
position: relative;
float:right;
bottom: -2;
right: 10px;
font-size: 15px;
color: var(--color-info);
}
.valider_question:hover{
color: var(--color-brand-secondary);
}
.disabled_ie{
display:block;
padding:3px;
text-align:left;
font-size:12px;
height:22px;
width:120px;
}
.lvl1_ie{
background:url(../images/bg_ie_lvl1.png) no-repeat;
}
.lvl2_ie{
background:url(../images/bg_ie_lvl2.png) no-repeat;
}
.lvl3_ie{
background:url(../images/bg_ie_lvl3.png) no-repeat;
}
.radio_saisie{
color:var(--color-brand-primary-hover);
font-weight: bold;
display: inline-block;
vertical-align: middle;
line-height: 1.1;
padding-top: 0;
padding-right: 5px;
margin-left: 4px;
}
.col_data_saisie input[type="radio"]{
vertical-align: middle;
margin-top: 0;
}
.col_data_saisie{
display: flex;
flex-wrap: nowrap;
align-items: stretch;
width: 400px;
}
.col_data_saisie2{
display: flex;
flex-wrap: wrap;
align-items: stretch;
}
.unites{
text-align:center;
order: 2;
flex-basis: auto;
box-sizing: content-box;
position: relative;
padding: 1px 4px;
margin-left: -3;
height: 20px;
min-width: 40px;
max-width: 50px;
border-top: 1px solid var(--color-info);
border-right: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-left: 0.5px solid var(--color-gray-200);
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
font: normal 14px/normal var(--font-family-base);
color: var(--color-brand-primary);
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.a_prec{
/*background: #eeeff2;*/
color: var(--color-brand-primary);
font: var(--font-family-base);
order: 3;
flex-basis: 80%;
min-width: 30%;
flex-grow: 2;
margin-top: -2px;
padding: 5px;
padding-left: 15px;
}
.warning{
order: 4;
color: red;
}
.input1{
text-align:right;
flex-grow: 2;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 33%;
flex-basis: 30%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
z-index: var(--z-base);
}
.input1_d{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
flex-grow: 2;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 33%;
flex-basis: 30%;
border-top: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input2{
text-align:right;
flex-grow: 2;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 33%;
flex-basis: 30%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input2_d{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
flex-grow: 2;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 33%;
flex-basis: 30%;
border-top: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input3{
text-align:right;
flex-grow: 2;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 33%;
flex-basis: 30%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input3_d{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
flex-grow: 2;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 33%;
flex-basis: 30%;
border-top: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input1f{
text-align:right;
flex-grow: 2;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 30%;
flex-basis: 30%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input1f_d{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
flex-grow: 2;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 30%;
flex-basis: 30%;
border-top: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input2f{
text-align:right;
flex-grow: 2;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 30%;
flex-basis: 30%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input2f_d{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
flex-grow: 2;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 30%;
flex-basis: 30%;
border-top: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input3f{
text-align:right;
flex-grow: 2;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 30%;
flex-basis: 30%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input3f_d{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
flex-grow: 2;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
min-width: 30%;
flex-basis: 30%;
border-top: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input1_s{
text-align:right;
width: 182px;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input1_d_s{
pointer-events:none;
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
width: 93%;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input2_s{
text-align:right;
width: 182px;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input2_d_s{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
width: 93%;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-gray-600);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input3_s{
text-align:right;
width: 182px;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input3_d_s{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
width: 93%;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-gray-600);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input1f_s{
text-align:right;
width: 93%;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input1f_d_s{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
width: 93%;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-gray-600);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input2f_s{
text-align:right;
width: 93%;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input2f_d_s{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
width: 93%;
text-align:right;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-gray-600);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.input3f_s{
text-align:right;
width: 93%;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-gray-50);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
color:var(--color-brand-primary-hover);
font-weight: bold;
}
.input3f_d_s{
background-color: var(--color-gray-300);
color:var(--color-gray-600);
text-align:right;
text-align:right;
width: 93%;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-gray-600);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
}
.lvl_1{
display:table-row;
font-size:13px;
height: 35px;
}
.lvl_3{
display:table-row;
font-size:13px;
height: 35px;
}
.lvl_4{
display:table-row;
font-size:12px;
height: 35px;
}
.lvl_3_profil{
font-size:13px;
}
.lvl_4_profil{
font-size:12px;
}
/* Styles de base pour tous les boutons */
.button_activate_active, .button_inactivate_active, .button_activate_inactive, .button_inactivate_inactive {
display: inline-block;
cursor: pointer;
font-family: var(--font-family-base);
font-size: 15px;
font-weight: bold;
text-decoration: none;
border-radius: var(--radius-42); /* Unifié pour tous les boutons */
/*border: 3px solid; Prépare pour la spécification de couleur */
}
/* Styles spécifiques pour les boutons actifs */
.button_activate_active, .button_inactivate_active {
background-color: var(--color-gray-50);
font-size: 20px; /* Taille de police spécifique pour les boutons actifs */
}
.button_activate_active {
color: var(--color-brand-primary-hover);
}
.button_activate_active:hover {
color: var(--color-gray-300);
}
.button_inactivate_active {
color: var(--color-gray-300);
}
.button_inactivate_active:hover {
color: var(--color-brand-primary-hover);
}
/* Styles spécifiques pour les boutons inactifs */
.button_activate_inactive, .button_inactivate_inactive {
display: none; /* Cache ces boutons par défaut */
background-color: transparent;
}
.button_activate_inactive {
border-color: var(--color-brand-primary); /* Couleur de bordure spécifique */
color: var(--color-border-strong);
}
.button_inactivate_inactive {
border-color: var(--color-gray-500); /* Couleur de bordure spécifique */
color: var(--color-gray-500);
}
.button_inactivate_inactive:hover {
background-color: var(--color-gray-400);
}
.button_activate_active2, .button_activate_inactive2 {
background-color: white; /* Couleur de fond par défaut pour les deux boutons */
border-radius: 50%; /* Rend le bord complètement arrondi */
border: 3px solid var(--color-brand-primary);
display: flex; /* Utilisez flex pour centrer le contenu, remplace inline-block */
cursor: pointer;
color: var(--color-border-strong);
font-family: var(--font-family-base);
font-size: 15px;
font-weight: bold;
text-decoration: none;
padding: 5px 5px;
margin-left: 5px;
width: 15px;
height: 15px;
justify-content: center;
align-items: center;
}
/* Couleur de fond spécifique pour le bouton actif */
.button_activate_active2 {
background-color: var(--color-info);
}
/* Gestion des états de survol */
.button_activate_active2:hover, .button_activate_inactive2:hover {
background-color: var(--color-info); /* Bleu pour le survol */
}
/* Pour revenir à la couleur de fond blanche lors du survol du bouton inactif */
.button_activate_inactive2:hover {
background-color: white;
}
/*.lien_bulle{
color: var(--color-border-strong);
font-weight:bold;
font-size:16px;
text-align:center;
}*/
.lien_bulle {
display: inline-block;
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle:hover {
color: var(--color-info);
}
.lien_bulleo {
display: inline-block;
color: var(--color-red-strong);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulleo:hover {
color: var(--color-red-muted);
}
.lien_bullei {
display: inline-block;
color: var(--color-green-strong);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bullei:hover {
color: var(--color-green-hover);
}
.lien_bulleb {
display: inline-block;
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulleb:hover {
color: var(--color-info);
}
.lien_bulle_d {
display: inline-block;
color: var(--color-gray-300);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle_do {
display: inline-block;
color: var(--color-red-muted);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle_di {
display: inline-block;
color: var(--color-green-muted);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle_db {
display: inline-block;
color: var(--color-gray-300);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle2 {
display: inline-block;
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle2:hover {
color: var(--color-info);
}
.lien_bulle2_vert {
display: inline-block;
color: var(--color-green-strong);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.lien_bulle2_vert:hover {
color: var(--color-green-pale);
}
.lien_bulle2_ina {
display: inline-block;
color: var(--color-gray-300);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.min_max {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.min_max:hover {
color: var(--color-info);
}
.min_max2 {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.min_max2:hover {
color: var(--color-info);
}
.nationale
{
text-align:center;
}
.titre_lexique{
font-size:22px;
font-weight:bold;
text-align:left;
}
.sous_titre_lexique{
margin-left:20px;
font-size:18px;
font-weight:bold;
color:var(--color-border-strong);
}
.specRow{
background-color: var(--color-gray-50);
}
#titrecom{
color:black;
font-weight: bold;
font-size:16px;
}
#commentaire{
display: inline-block;
position: relative;
box-sizing: content-box;
width: 50%;
min-width: 400px;
height: 200px;
position: relative;
margin: 5px auto;
padding: 10px;
border: 1px solid var(--color-info);
border-radius: var(--radius-md);
font: normal 16px/normal var(--font-family-base);
color: var(--color-accent-cyan-solid);
text-overflow: clip;
background: var(--color-white-soft);
box-shadow: 0 0 25px 2px var(--overlay-neutral-58) inset, 0 0 25px 2px var(--overlay-white-70) ;
}
.button_container_prec_next {
display: grid;
grid-template-columns: auto auto;
gap: 10px;
justify-content: end;
margin: 20px 0;
width: 100%;
}
.prec_bo2 {
order: 1;
grid-column: 1; /* Force la position dans la deuxième colonne */
}
.suiv_bo2 {
order: 2;
grid-column: 2; /* Force la position dans la première colonne */
}
.next_prev{
float:right;
margin-right:50px;
}
.prec{
position: relative;
margin-top: 75px;
left: 7%;
float: left;
}
.prec2{
position: relative;
margin-top: 0px;
left: 7%;
z-index: var(--z-pagination);
float: left;
}
.prec_bo{
position: relative;
margin-top: 5px;
float: left;
}
.suiv{
margin-top: 75px;
right: 100px;
float: right;
z-index: var(--z-pagination);
}
.suiv_bo{
position: relative;
margin-top: 5px;
float: right;
}
.suiv2{
position: relative;
margin-top: 0px;
right: 7%;
float: right;
z-index: var(--z-pagination);
}
.suiv3{
position: fixed;
top: 210px;
right: 150px;
z-index: var(--z-page-ui);
}
.suiv4{
position: fixed;
top: 125px;
right: 20px;
z-index: var(--z-floating-high);
}
.suiv5{
position: fixed;
top: 210px;
right: 85px;
z-index: var(--z-page-ui);
}
.suiv6{
position: fixed;
top: 190px;
right: 60px;
z-index: var(--z-sticky-bar);
}
.suiv7{
float: right;
margin-top: -40px;
z-index: var(--z-popup-panel);
}
.suiv8{
float: right;
margin-top: -170px;
margin-right: 320px;
z-index: var(--z-popup-panel);
}
.btn_next_prev{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 30px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_orange{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 30px;
cursor: pointer;
padding:10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: bold 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-orange-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_orange:hover {
border: 1px solid var(--color-orange-strong);
border-radius: var(--radius-sm);
color: var(--color-orange-strong);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_vert{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 30px;
cursor: pointer;
padding-top:10px;
padding-bottom: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: bold 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-green-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_vert:hover {
border: 1px solid var(--color-green-strong);
border-radius: var(--radius-sm);
color: var(--color-green-strong);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_small{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
text-align: center;
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_small:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_small_red{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
text-align: center;
background-color: var(--color-red-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_small_red_a{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
text-align: center;
background-color: var(--color-red-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_small_red_a:hover {
border: 1px solid var(--color-red-strong);
border-radius: var(--radius-sm);
color: var(--color-red-strong);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_small_green{
display: inline-block;
cursor: default;
box-sizing: content-box;
width: 120px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
text-align: center;
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-green-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_small_green:hover {
border: 1px solid var(--color-green-strong);
border-radius: var(--radius-sm);
color: var(--color-green-strong);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_small_green_d{
display: inline-block;
cursor: default;
box-sizing: content-box;
width: 120px;
height: 15px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
text-align: center;
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-green-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.spinner {
width: 16px;
height: 16px;
border: 2px solid var(--color-white);
border-bottom-color: transparent;
border-radius: 50%;
display: none;
animation: spin 1s linear infinite;
}
@keyframes spin {
from {transform: rotate(0deg);}
to {transform: rotate(360deg);}
}
/* État de chargement */
.loading .button-text {
opacity: 0.7;
}
.loading .spinner {
display: inline-block;
}
.mini_butt_g {
color: var(--color-green-strong);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.mini_butt_r {
color: var(--color-red-strong);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.mini_butt_b{
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.mini_butt_b:hover {
color: var(--color-green-strong);
}
.mini_butt2_b{
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.mini_butt2_b:hover {
color: var(--color-red-strong);
}
.mini_butt3_b{
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_h{
display: inline-block;
box-sizing: content-box;
width: 100px;
height: 25px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-brand-secondary-hover);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
z-index: var(--z-base);
}
.btn_next_prev_h:hover {
border: 1px solid var(--color-brand-secondary-hover);
border-radius: var(--radius-sm);
color: var(--color-brand-secondary-hover);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_b{
display: inline-block;
box-sizing: content-box;
width: 120px;
height: 20px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 14px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_b:hover {
border: 1px solid var(--color-info);
border-radius: var(--radius-sm);
color: var(--color-info);
background: var(--color-white);
box-shadow: 0 0 2px 1px var(--overlay-black-20) ;
}
.btn_next_prev_s{
display: inline-block;
box-sizing: content-box;
width: 30px;
height: 30px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 22px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-green-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_s:hover {
border: 1px solid var(--color-green-strong);
color: var(--color-green-strong);
background: var(--color-white);
}
.btn_next_prev_sr{
display: inline-block;
box-sizing: content-box;
width: 30px;
height: 30px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 22px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-red-strong);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_l{
display: inline-block;
box-sizing: content-box;
width: 12px;
height: 12px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 15px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_l:hover {
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
.btn_next_prev_ul{
display: inline-block;
box-sizing: content-box;
width: 12px;
height: 12px;
cursor: pointer;
padding: 10px;
border: 1px solid var(--color-white);
border-radius: var(--radius-md);
font: normal 15px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-overflow: clip;
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_next_prev_ul:hover {
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
.mdp_valid{
width:110px;
float: right;
}
.mdp_valid2{
width:110px;
float: right;
}
.btn_bo{
width:110px;
float: right;
margin-right: 25%;
margin-top: -10px;
}
.btn_bo2{
width:110px;
float: right;
margin-right: -300px;;
margin-top: -10px;
}
.btn_bo_right{
width:110px;
float: right;
margin-right: 10%;
margin-top: -30px;
}
#msg_save_compte{
width:200px;
float: right;
margin-right: 19%;
margin-top: -180px;
box-sizing: content-box;
position : relative;
height: auto;
color: grey;
border: 0px;
text-shadow: 0px 0px 15px var(--color-green-strong) ;
font: normal 16px/normal var(--font-family-base);
}
.msg_save_mdp{
width:300px;
float: right;
margin-right: 15%;
margin-top: -60px;
box-sizing: content-box;
position : relative;
height: auto;
color: grey;
border: 0px;
text-shadow: 0px 0px 15px var(--color-red-strong) ;
font: normal 16px/normal var(--font-family-base);
}
.msg_save_mdp2{
width:300px;
float: right;
margin-right: 12%;
margin-top: -60px;
box-sizing: content-box;
position : relative;
height: auto;
color: grey;
border: 0px;
text-shadow: 0px 0px 15px var(--color-green-strong) ;
font: normal 16px/normal var(--font-family-base);
}
.mdp_diff, .mdp_diff_2{
width:200px;
float: right;
margin-right: 19%;
margin-top: -60px;
box-sizing: content-box;
position : relative;
height: auto;
color: grey;
border: 0px;
text-shadow: 0px 0px 15px var(--color-red-strong) ;
font: normal 16px/normal var(--font-family-base);
display:none;
}
#valid_gestion{
margin-left: 80%;
}
/* -------------------------------------------------------------------------- */
/* SECTION 13 — Compte / profil (gestion_user.php) : formulaires, MDP, grille */
/* -------------------------------------------------------------------------- */
/* =========================================================
Gestion utilisateur - page profil (gestion_user.php)
========================================================= */
.showmdptext{
font-size: 13px;
}
#password-strength{
font-size: 13px;
display: inline-block;
margin-top: 8px;
}
#form_profil_mail .grid-container,
#form_profil_mdp .grid-container {
display: grid;
grid-template-columns: auto auto;
gap: 10px;
}
#form_profil_mail .grid-item,
#form_profil_mdp .grid-item {
padding: 2px;
text-align: left;
}
#form_profil_mail .grid-item.label,
#form_profil_mdp .grid-item.label {
font-weight: bold;
grid-column: 1;
}
#form_profil_mail .grid-item.input,
#form_profil_mdp .grid-item.input {
grid-column: 2;
}
.profile-box {
width: 100%;
max-width: 780px;
margin: 0 0 22px 18px;
padding: 18px 24px;
box-sizing: border-box;
}
.profile-grid {
display: grid;
grid-template-columns: 210px minmax(320px, 1fr);
column-gap: 18px;
row-gap: 12px;
align-items: center;
}
.profile-label {
font-weight: 600;
text-align: right;
padding-right: 8px;
}
.profile-field {
width: 100%;
}
.profile-actions {
margin-top: 20px;
display: flex;
justify-content: flex-start;
padding-left: 228px;
float: none;
width: auto;
}
.profile-action-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 230px;
height: 38px;
padding: 0 16px;
border: 1px solid var(--color-link-primary);
border-radius: var(--radius-9);
font: 600 13px/1 var(--font-family-base);
letter-spacing: 0.01em;
color: var(--color-white);
background-color: var(--color-info);
box-shadow: 0 2px 6px var(--overlay-black-12), 0 5px 12px var(--overlay-brand-deep-20);
cursor: pointer;
transform: translateY(0) scale(1);
transition: background-color var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard), border-color var(--duration-base) var(--easing-standard), transform var(--duration-fast) var(--easing-standard);
}
.profile-action-btn:hover {
background-color: var(--color-info);
border-color: var(--color-link-primary);
box-shadow: 0 4px 10px var(--color-overlay-medium), 0 8px 16px var(--overlay-brand-deep-25);
transform: translateY(-1px) scale(1.005);
}
.profile-action-btn:active {
background-color: var(--color-link-primary);
box-shadow: 0 1px 4px var(--overlay-black-12), 0 3px 8px var(--overlay-brand-deep-20);
transform: translateY(0) scale(0.995);
}
.password-option {
display: flex;
align-items: center;
gap: 6px;
white-space: nowrap;
}
.password-status {
margin-top: 8px;
}
.password-field-row {
display: flex;
align-items: center;
gap: 10px;
}
.password-field-row .input_profil {
flex: 1;
}
.form-spacing {
margin-top: 20px;
}
.input_profil::placeholder {
color: var(--color-gray-400);
}
.input_file{
width:300px;
text-align:left;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-white);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.tab_emailing{
background-color:var(--color-white);
margin-left:auto;
margin-right:auto;
}
.tab_ratio{
width:1000px;
margin-right: auto;
margin-left: 5%;
table-layout: fixed;
}
.tab_ratio2{
width:1000px;
table-layout: fixed;
}
.tab_select{
width:300px;
table-layout: fixed;
margin-left: 10px;
margin-top: 20px;
}
#cont_tab_soc{
margin-left:5%;
margin-right:auto;
max-height: 400px;
width:1050px;
margin-top: 0px;
margin-bottom:0px;
padding-top:0px;
padding-bottom:0px;
text-align:left;
overflow-y: scroll;
}
.line_emailing{
background-color:var(--color-gray-200);
}
.line_tab_avancement{
height:30px;
font-size: 10px;
}
.line_tab_avancement_b{
height:30px;
font-size: 10px;
text-align: center;
}
.line_tab_emailing{
height:60px;
}
.bouton_add_email{
float:right;
margin-right:0px;
}
#bouton_preview{
float:left;
margin-left:0px;
}
#fermer_preview{
position: inherit;
bottom:5px;
margin-left:38%;
}
.input_pdf{
width:850px;
}
.input_pdf2{
width:815px;
}
.textarea_pdf{
width:850px;
height:100px;
border:solid 1px var(--color-gray-400);
background-color: var(--color-white);
}
.ratio_select_droit{
float: right;
}
.ratio_select{
width: 200px;
height: 25px;
}
.input_ratio{
width:850px;
height: 30px;
}
.input_ratio2{
width:850px;
height: 100px;
}
.input_ratio3{
width:250px;
height: 30px;
}
.graphique{
float: right;
height:150px;
width:300px;
}
.input_emailing{
width:850px;
}
.textarea_emailing{
width:850px;
height:100px;
border:solid 1px var(--color-gray-400);
background-color: var(--color-white);
}
.tabDate{
margin-left:auto;
margin-right:auto;
}
.tab_erreur{
margin-left:auto;
margin-right:auto;
width: 90%;
}
.e_date{
background-color:var(--color-brand-secondary);
color:black;
text-align:left;
width:120px;
}
.e_jour{
background-color:var(--color-brand-secondary);
color:black;
text-align:left;
width:120px;
}
.e_dateedit{
background-color:var(--color-brand-secondary);
color:black;
text-align:left;
width:120px;
}
.e_jouredit{
background-color:var(--color-brand-secondary);
color:black;
text-align:left;
width:120px;
}
.form_bo_import_user{
position:relative;
overflow:hidden;
width:97px;
height:25px;
}
.bouton_charger_bo{
position:absolute;
top:0;
left:0;
}
.input_charger{
position:absolute;
top:-100px;
}
.box_super_user, .box_user{
display:none;
}
.small_input{
width:100px;
}
.table_carto{
margin-left:auto;
margin-right:auto;
text-align:left;
}
.content_carto{
text-align:center;
}
#confirmer{
height:28px;
width:81px;
padding-top:5px;
padding-bottom: 15px;
padding-right: 5px;
padding-left: 5px;
text-align:center;
font-weight:bold;
cursor: pointer;
box-sizing: content-box;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font-size: 14px;
font-family: var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
border: 1px solid var(--color-white);
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
#confirmer:hover{
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
#ne_pas_confirmer{
height:28px;
width:81px;
padding-top:5px;
padding-bottom: 15px;
padding-right: 5px;
padding-left: 5px;
text-align:center;
font-weight:bold;
cursor: pointer;
box-sizing: content-box;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font-size: 14px;
font-family: var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
border: 1px solid var(--color-white);
background-color: var(--color-danger);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
#ne_pas_confirmer:hover{
border: 1px solid var(--color-danger);
color: var(--color-danger);
background: var(--color-white);
}
.btn_carto{
height:28px;
width:81px;
padding-top:5px;
padding-bottom: 5px;
text-align:center;
font-weight:bold;
cursor: pointer;
box-sizing: content-box;
overflow: hidden;
border: none;
border-radius: var(--radius-md);
font-size: 14px;
font-family: var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
text-overflow: ellipsis;
border: 1px solid var(--color-white);
background-color: var(--color-info);
box-shadow: 0 0 4px 1px var(--overlay-black-20) ;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.btn_carto:hover{
border: 1px solid var(--color-info);
color: var(--color-info);
background: var(--color-white);
}
.box_error, .box_carto_ok, .box_fin{
display:none;
}
#self_redirection{
display:none;
}
#bouton_fermer_carto{
float:right;
cursor:pointer;
margin-right:3px;
margin-top:3px;
font-size:13px;
font-weight:bold;
color:var(--color-gray-900);
}
#bouton_fermer_bt{
float:right;
cursor:pointer;
margin-right:3px;
margin-top:3px;
font-size:13px;
font-weight:bold;
color:var(--color-gray-900);
}
#bouton_fermer_lex{
float:right;
cursor:pointer;
margin-right:3px;
margin-top:3px;
font-size:13px;
font-weight:bold;
color:var(--color-gray-900);
}
#bouton_fermer_aide{
float:right;
cursor:pointer;
margin-right:3px;
margin-top:3px;
font-size:13px;
font-weight:bold;
color:var(--color-gray-900);
}
#bouton_fermer_nav{
float:right;
cursor:pointer;
margin-right:3px;
margin-top:3px;
font-size:13px;
font-weight:bold;
color:var(--color-gray-900);
}
.white_tr{
background-color:var(--color-white);
}
.hidden{
display:none;
}
/* -------------------------------------------------------------------------- */
/* SECTION 14 — Popups modales, aide (#cont_popup_aide…), lexique, navigation… */
/* -------------------------------------------------------------------------- */
/******* POPUPS *******/
#popup{
position:fixed;
/*HACK IE6*/
position:absolute;
display:none;
height:270px;
width:400px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupValid{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:500px;
width:600px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-preview-peak);
top: 50%; /* Ajouté */
left: 50%; /* Ajouté */
transform: translate(-50%, -50%); /* Ajouté */
}
#popupValid1{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:250px;
width:600px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupValid2{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:250px;
width:600px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupValidm{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:250px;
width:600px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupValidp{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:250px;
width:600px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupValida_1{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:250px;
width:600px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
.popupValid_content{
font-size:16px;
text-align:center;
margin-left:0px;
z-index: var(--z-overlay);
}
.popupValid_legal{
font-size:12px;
font-style: italic;
text-align:left;
margin:10px;
padding: 5px;
z-index: var(--z-overlay);
border: 2px solid var(--color-brand-primary);
border-radius: var(--radius-lg);
}
.popup_content,
#cont_popup_bt,
#cont_popup_lex,
#cont_popup_aide {
font-size:13px;
text-align:left;
margin-left:30px;
z-index: var(--z-overlay);
}
.popupAccessDenied{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 50px;
margin-left: 30%;
height:300px;
width:500px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupAlert{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 50px;
margin-left: 30%;
height:300px;
width:500px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
.popupProcess{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 30%;
margin-left: 35%;
height:200px;
width:500px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-popup-panel);
}
#popupConfirm{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 100px;
margin-left: 30%;
height:250px;
width:500px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupConfirmSupp{
position:fixed;
/*HACK IE6*/
/*position:absolute;*/
display:block;
top: 100px;
margin-left: 30%;
height:450px;
width:500px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
.popupValid_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
.popupValid_content_left{
font-size:11px;
text-align:left;
margin-left:25px;
}
.popupValid_content_calc{
font-size:20px;
text-align:center;
margin-left:0px;
}
#popupDate{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:600px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
z-index: var(--z-overlay);
}
.popupDate_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupDateEdit{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:600px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
z-index: var(--z-overlay);
}
.popupDateEdit_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupDateSuppr{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height:250px;
width:600px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
z-index: var(--z-overlay);
}
.popupDateSuppr_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
.text_alert_date{
font-size:13px;
color:var(--color-danger);
}
#popupPreview{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
width:700px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
#popupPreview2 {
/* Dimensions fixes format A4 */
width: 810px;
height: 1140px;
/* Positionnement */
position: absolute;
/* Apparence */
background-image: url("../images/rapport/global.png");
background-size: 100% 100%;
background-repeat: no-repeat;
background-color: var(--color-white);
/* Bordures et coins arrondis */
border: solid 1px var(--color-gray-300);
border-radius: var(--radius-lg);
/* Autres propriétés */
text-align: left;
z-index: var(--z-preview-peak);
overflow: hidden;
/* Optionnel : animation douce */
transition: transform 0.3s ease-out;
}
/* Pour assurer que le contenu ne déborde pas */
.texte_analyse_tend {
height: 100%;
overflow: hidden;
padding: 20px;
}
.progress-circle {
position: relative;
width: 25px;
height: 25px;
text-align: center;
margin-left: 48%;
}
.circle {
height: 100%;
right: 0px;
position: absolute;
border: solid 5px var(--color-gray-400);
border-top-color: var(--color-green-pale);
border-radius: 50%;
}
.border {
width: 100%;
transform: rotate(135deg);
animation: spin 1.3s steps(2) .2s infinite;
}
.bordure_bleue{
box-sizing: border-box;
padding: 10px;
overflow: hidden;
border: 1px solid var(--color-border-strong);
border-radius: var(--radius-7);
text-align: center;
text-overflow: ellipsis;
box-shadow: 0 0 2px 1px var(--color-border-strong) ;
}
.bordure_rouge{
box-sizing: border-box;
padding: 10px;
overflow: hidden;
border: 1px solid var(--color-red-strong);
border-radius: var(--radius-7);
text-align: center;
text-overflow: ellipsis;
box-shadow: 0 0 2px 1px var(--color-red-strong) ;
}
.fond_bleu {
box-sizing: border-box;
padding: 10px;
overflow: hidden;
border: none;
border-radius: var(--radius-7);
text-align: center;
text-overflow: ellipsis;
background: var(--color-info);
}
.texte_analyse_tend{
position : relative;
padding-top:20px;
margin-left: 25px;
padding-right:25px;
color:var(--color-black);
font-size: 14px;
text-align : left;
}
#popupArseg{
position:fixed;
/*HACK IE6*/
top: 100px;
left:35%;
_position:absolute;
display:none;
width:500px;
height: 250px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
.popupGeneric{
position:fixed;
/*HACK IE6*/
top: 100px;
left:35%;
_position:absolute;
display:none;
width:500px;
min-height: 200px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
/* Au-dessus de .bg_lightbox après setBG() (--z-lightbox-backdrop) */
z-index: var(--z-lightbox-panel);
}
.popupGeneric__icon{
color: var(--color-danger);
font-size: 30px;
}
#popupNewField{
position:fixed;
/*HACK IE6*/
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
_position:absolute;
display:none;
width:700px;
max-height: 95vh;
top: 25px;
left: 25%;
font-size: 12px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-overlay);
}
#popupEditField{
position:fixed;
/*HACK IE6*/
_position:absolute;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
display:none;
width:700px;
max-height: 95vh;
top: 25px;
left: 25%;
font-size: 12px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-overlay);
}
#popupSelect{
position:fixed;
/*HACK IE6*/
_position:absolute;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
display:none;
width:700px;
height: 95vh;
top: 25px;
left: 25%;
font-size: 12px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-popup-high);
}
#popupCorrectErreur{
position:fixed;
/*HACK IE6*/
_position:absolute;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
/*display: none;*/
width:60%;
min-width: 700px;
height: 90vh;
top: 25px;
left: 20%;
font-size: 12px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-popup-high);
}
#popupValidSuppChamp{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 150px;
left: 25%;
height:350px;
width:700px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupSaveGoTo{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 150px;
left: 25%;
height:350px;
width:700px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupNoMove{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 160px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
#popupUnlock{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 220px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
#popupSaveDone{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 220px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
#popupSaveFailed{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 220px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
.popupArseg_content{
text-align:center;
}
#popupCarto{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 300px;
width:950px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
#popup_nav{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height: 500px;
width:950px;
overflow-y: auto;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
#hidden_templates{
display:none;
}
.bg_lightbox{
display:none;
background-color: var(--color-gray-600);
opacity:0.75;
z-index: var(--z-header);
}
/* ——— Suite SECTION 14 (popups) + fragments gestion_user — legacy ——— */
/******* POPUPS *******/
/******* Gestion_user.php *******/
.line_0{
background-color: var(--color-gray-300);
}
.line_1{
background-color: var(--color-gray-100);
}
.input_eta{
margin:5px;
width:155px;
}
.img_supp{
margin-right:5px;
}
.align_center{
text-align:center;
}
.input_profil{
text-align:left;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
width: 180px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-white);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.input_profil2{
text-align:left;
display: inline-block;
box-sizing: content-box;
position: relative;
width: 500px;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-white);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.input_champ_bo{
text-align:left;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
width: 90%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-white);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.input_champ_bo_com{
text-align:left;
display: inline-block;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 50px;
width: 90%;
border: 1px solid var(--color-info);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
text-overflow: clip;
background: var(--color-white);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.ajout_eta{
display:block;
margin-top:5px;
background-color: var(--color-info);
border: 1px solid var(--color-info);
color: var(--color-white);
padding-top:3px;
padding-bottom:3px;
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.ajout_eta:hover {
color: var(--color-info);
background: var(--color-white);
}
#btn_supp_eta{
color: var(--color-info);
background-color:transparent;
font-size: 18px;
}
#btn_supp_eta:hover {
color: var(--color-info);
}
#btn_supp_eta2{
color: red;
background-color:transparent;
font-size: 18px;
}
#btn_supp_eta2:hover {
color: darkred;
}
#link_home{
color: var(--color-info);
background-color:transparent;
font-size: 20px;
}
#link_home:hover {
color: var(--color-info);
}
.list_save{
display:none;
}
.acti_plrs,.acti_total_plrs,.acti2_plrs,.acti2_total_plrs,.desacti_plrs,.desacti_total_plrs,.desacti2_plrs,.desacti2_total_plrs{
float:right;
margin-right:5px;
}
.button_cat_erreur {
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur:hover {
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
background-color:var(--color-border-strong);
}
.button_cat_erreur:active {
position:relative;
top:1px;
}
.button_cat_erreur_o {
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur_o:hover {
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
background-color:var(--color-border-strong);
}
.button_cat_erreur_o:active {
position:relative;
top:1px;
}
.button_cat_erreur_v {
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
}
.button_cat_erreur_v:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.button_cat_erreur_v:active {
position:relative;
top:1px;
}
.button_cat_erreur_v_o {
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
}
.but_conserver_popup:hover {
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-info) 100%);
background-color:var(--color-info);
}
.but_conserver_popup:active {
position:relative;
top:1px;
}
.button_cat_erreur_v_o:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.button_cat_erreur_v_o:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert {
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur_vert:hover {
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
background-color:var(--color-border-strong);
}
.button_cat_erreur_vert:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert_o {
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:inline-block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur_vert_o:hover {
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
background-color:var(--color-border-strong);
}
.button_cat_erreur_vert_o:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert_v {
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
}
.button_cat_erreur_vert_v:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.button_cat_erreur_vert_v:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert_v_o {
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
}
.button_cat_erreur_vert_v_o:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.button_cat_erreur_vert_v_o:active {
position:relative;
top:1px;
}
.butt_error_var_an {
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background-color:var(--color-orange-soft);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_var_an:hover {
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background-color:var(--color-orange-warm);
}
.butt_error_var_an:active {
position:relative;
top:1px;
}
.butt_error2_var_an {
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_var_an:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.butt_error2_var_an:active {
position:relative;
top:1px;
}
.butt_error_absence_ms {
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background-color:var(--color-orange-soft);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_absence_ms:hover {
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background-color:var(--color-orange-warm);
}
.butt_error_absence_ms:active {
position:relative;
top:1px;
}
.butt_error2_absence_ms {
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_absence_ms:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.butt_error2_absence_ms:active {
position:relative;
top:1px;
}
.butt_error_ventilation {
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background-color:var(--color-orange-soft);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_ventilation:hover {
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background-color:var(--color-orange-warm);
}
.butt_error_ventilation:active {
position:relative;
top:1px;
}
.butt_error2_ventilation {
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_ventilation:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.butt_error2_ventilation:active {
position:relative;
top:1px;
}
.butt_error_autre {
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background-color:var(--color-orange-soft);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_autre:hover {
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background-color:var(--color-orange-warm);
}
.butt_error_autre:active {
position:relative;
top:1px;
}
.butt_error2_autre {
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_autre:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.butt_error2_autre:active {
position:relative;
top:1px;
}
.butt_error_valhn {
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background-color:var(--color-orange-soft);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_valhn:hover {
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background-color:var(--color-orange-warm);
}
.butt_error_valhn:active {
position:relative;
top:1px;
}
.butt_error2_valhn {
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_valhn:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.butt_error2_valhn:active {
position:relative;
top:1px;
}
.but_annuler_popup {
box-shadow:inset 0px 1px 0px 0px var(--color-red-pale);
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background-color:var(--color-red-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-red-hover);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 19px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-red-shadow);
}
.but_annuler_popup:hover {
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background-color:var(--color-red-strong);
}
.but_annuler_popup:active {
position:relative;
top:1px;
}
.but_conserver_popup {
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-info) 100%);
background-color:var(--color-info);
border-radius: var(--radius-md);
border:1px solid var(--color-info);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-brand-secondary-hover);
}
.but_conserver_popup:hover {
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-info) 100%);
background-color:var(--color-info);
}
.but_conserver_popup:active {
position:relative;
top:1px;
}
.but_corriger_popup {
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 19px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.but_corriger_popup:hover {
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background-color:var(--color-green-strong);
}
.but_corriger_popup:active {
position:relative;
top:1px;
}
#popupVarAnn{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupVarAnn_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupValHN{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupValHN_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupAbsenceMS{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupAbsenceMS_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupVentilation{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupVentilation_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupAutre{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupAutre_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
.plus_minus {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus:hover {
color: var(--color-info);
}
.plus_minus2 {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus2:hover {
color: var(--color-info);
}
.plus_minusedit {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minusedit:hover {
color: var(--color-info);
}
.plus_minusedit_s {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minusedit_s:hover {
color: var(--color-info);
}
.plus_minusactif_s {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minusactif_s:hover {
color: var(--color-info);
}
.plus_minus3 {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus3:hover {
color: var(--color-info);
}
.plus_minus4 {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus4:hover {
color: var(--color-info);
}
.plus_minussupp {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minussupp_s {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minussupp_s_o {
color: var(--color-brand-primary-hover);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.etiquette_t_left{
float:left;
text-align: left;
width: 60%;
}
.etiquette_t_left2{
float:left;
text-align: left;
width: 70%;
}
.etiquette_t_left3{
float:left;
text-align: left;
width: 90%;
}
.etiquette_titre{
float:left;
text-align: center;
width: 100%;
}
#md1, #md2, #md1_e, #md2_e{
width: 85%;
}
#select_profil{
box-sizing: content-box;
float: right;
z-index: var(--z-header-chip);
width: 150px;
height: 15px;
cursor: pointer;
margin-top: -25px;
margin-right: 10px;
padding: 5px;
border: 1px solid var(--color-white);
border-radius: var(--radius-xs);
font: normal 12px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
text-overflow: clip;
background-color: var(--color-gray-100);
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
transition: 0.1s;
}
/*
.datepicker2{
height:19px;
width:20px;
float:left;
background-image:url("../images/agrandir.png");
background-repeat:no-repeat;
}*/
/******* Gestion_user.php *******/
/* -------------------------------------------------------------------------- */
/* SECTION 15 — Popups plein écran (sidebar) : .popup_sidebar, #popup_bt… */
/* -------------------------------------------------------------------------- */
/************************** POP-UP SIDEBAR**************************/
/* Style commun pour toutes les popups */
.popup_sidebar,
#popup_bt,
#popup_lex,
#popup_aide {
position: fixed;
top: 5vh;
left: 5vw;
width: 90vw;
height: 90vh;
max-width: 1200px;
max-height: 800px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border: solid 1px var(--color-gray-300);
padding: 15px;
text-align: center;
z-index: var(--z-overlay);
display: none;
/* Empêche le défilement de la popup elle-même */
overflow: hidden;
}
/* Style commun pour tous les conteneurs de contenu */
.popup_content,
#cont_popup_bt,
#cont_popup_lex,
#cont_popup_aide {
/* Permet le défilement vertical du contenu */
overflow-y: auto;
/* Permet le défilement horizontal si nécessaire */
overflow-x: auto;
/* Prend toute la hauteur disponible moins les paddings */
height: 100%;
/* Prend toute la largeur disponible */
width: 100%;
/* Style de la barre de défilement pour Webkit (Chrome, Safari) */
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-track {
background: var(--color-surface-app);
border-radius: var(--radius-sm);
}
&::-webkit-scrollbar-thumb {
background: var(--color-gray-500);
border-radius: var(--radius-sm);
}
&::-webkit-scrollbar-thumb:hover {
background: var(--color-gray-600);
}
}
/* Media queries pour les petits écrans */
@media screen and (max-width: 768px) {
.popup_sidebar,
#popup_bt,
#popup_lex,
#popup_aide {
top: 2vh;
left: 2vw;
width: 96vw;
height: 96vh;
padding: 10px;
}
}
/* -------------------------------------------------------------------------- */
/* SECTION 18 — Pied de page (divers.php : #conteneur_footer, grilles, réseaux) */
/* Repère aligné sur la sauvegarde : bloc FOOTER ci-dessous. */
/* -------------------------------------------------------------------------- */
/************************** FOOTER **************************/
/**
* Variables locales : palette footer (descendants de #conteneur_footer uniquement).
*/
#conteneur_footer {
--footer-surface: var(--color-gray-800);
--footer-text: var(--color-gray-200);
--footer-text-soft: var(--color-gray-300);
--footer-heading: var(--color-gray-200);
--footer-link: var(--color-gray-200);
--footer-meta: var(--color-gray-300);
--footer-pill-caption: var(--color-gray-300);
--footer-icon: var(--color-gray-300);
--footer-bottom-text: var(--color-gray-200);
--footer-divider: var(--overlay-white-14);
--footer-chip: var(--overlay-white-12);
--footer-chip-strong: var(--overlay-white-24);
--footer-chip-social-hover: var(--overlay-white-25);
--footer-mail-dot: var(--overlay-ice-blue-80);
--footer-motion-icon: background var(--duration-base) var(--easing-standard),
transform var(--duration-base) var(--easing-standard);
flex-shrink: 0;
box-sizing: border-box;
width: 96%;
margin: 10px auto;
padding: 22px 30px 18px;
position: relative;
z-index: var(--z-sticky-bar);
background-color: var(--footer-surface);
border-radius: var(--radius-14);
box-shadow: 0 10px 22px var(--overlay-black-20);
color: var(--footer-text);
}
#footer_shell {
width: 100%;
color: inherit;
}
.footer-content {
width: 100%;
}
.footer-grid-top {
display: grid;
grid-template-columns: minmax(220px, 1fr) minmax(420px, 560px) minmax(260px, 1fr);
gap: 20px;
align-items: start;
}
.footer-brand-column {
display: grid;
gap: 8px;
justify-self: start;
padding-left: 10px;
}
.logo_footer {
width: 155px;
max-width: 155px;
height: auto;
}
.footer-credit {
font-size: 11px;
color: var(--footer-text-soft);
}
.footer-nav-block {
justify-self: center;
width: 100%;
max-width: 260px;
display: grid;
grid-template-columns: 1fr;
gap: 12px;
}
.footer-nav-section {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
text-align: center;
}
.footer-nav-title {
margin-bottom: 4px;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.6px;
color: var(--footer-heading);
}
.footer-nav-block a {
color: var(--footer-link);
text-decoration: none;
font-size: 13px;
transition: color var(--duration-base) var(--easing-standard);
}
.footer-nav-block a:hover {
color: var(--color-white);
}
.footer-info-block {
justify-self: end;
display: grid;
gap: 10px;
text-align: right;
opacity: 0.88;
padding-right: 10px;
}
.other-sites {
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: nowrap;
gap: 10px;
color: var(--footer-meta);
}
.other-sites-title {
text-transform: uppercase;
font-size: 11px;
letter-spacing: 0.5px;
color: var(--footer-pill-caption);
}
.other-site-pill {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px 10px;
border-radius: var(--radius-pill);
background: var(--footer-chip);
color: var(--footer-text);
font-size: 11px;
font-weight: var(--font-weight-semibold);
letter-spacing: 0.2px;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
transition: var(--footer-motion-icon);
}
.other-site-pill:hover {
background: var(--footer-chip-strong);
transform: translateY(-1px);
}
.footer-social-row {
justify-self: end;
}
.social-media-container {
display: inline-flex;
align-items: center;
gap: 10px;
color: var(--footer-link);
font-weight: var(--font-weight-medium);
}
.social-media-label {
font-size: 12px;
color: var(--footer-meta);
}
.social-media-links {
display: inline-flex;
align-items: center;
gap: 8px;
}
.social-media-links a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 50%;
background: var(--footer-chip);
color: var(--footer-text);
transition: var(--footer-motion-icon);
}
.social-media-links a:hover {
background: var(--footer-chip-social-hover);
transform: translateY(-1px);
}
.footer-grid-bottom {
margin-top: 16px;
padding-top: 14px;
border-top: var(--border-width-thin) solid var(--footer-divider);
display: grid;
grid-template-columns: 1fr 1.3fr 1fr;
align-items: start;
gap: 16px;
}
.footer-bottom-item {
display: inline-flex;
align-items: flex-start;
gap: 8px;
font-size: 12px;
color: var(--footer-bottom-text);
}
.footer-bottom-item i {
color: var(--footer-icon);
margin-top: 2px;
}
.footer-bottom-phone {
justify-self: start;
}
.footer-bottom-address {
justify-self: center;
max-width: 360px;
white-space: normal;
text-align: center;
line-height: 1.35;
}
.footer-bottom-mail {
justify-self: end;
}
.footer-bottom-mail a {
color: var(--footer-link);
text-decoration: none;
border-bottom: var(--border-width-thin) dotted var(--footer-mail-dot);
}
@media (max-width: 968px) {
#conteneur_footer {
width: calc(100% - 24px);
padding: 16px;
}
.footer-grid-top,
.footer-nav-block,
.footer-grid-bottom {
grid-template-columns: 1fr;
}
.footer-brand-column,
.footer-nav-section,
.footer-info-block,
.other-sites,
.footer-social-row,
.footer-bottom-phone,
.footer-bottom-address,
.footer-bottom-mail {
justify-self: center;
justify-content: center;
align-items: center;
text-align: center;
padding-left: 0;
padding-right: 0;
}
.other-sites {
flex-wrap: wrap;
}
}
/************************** END FOOTER **************************/
/* -------------------------------------------------------------------------- */
/* SECTION 16 — Gestion établissement, grille home.php (aide → section 14) */
/* -------------------------------------------------------------------------- */
/************************** Gestion_etablissement **************************/
.popupManageEtablissement{
position:fixed;
display:none;
top: 50px;
left: 50%;
transform: translateX(-50%);
max-height: calc(100vh - 100px); /* Hauteur maximale = hauteur de la fenêtre moins 100px de marge */
overflow-y: auto; /* Active le défilement vertical */
width:500px;
padding: 5px 5px 20px 5px;
background-color: var(--color-white);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-preview-peak);
}
.popupManageEtablissement-actions {
display: flex;
justify-content: center;
width: 100%;
margin-top: 12px;
}
.popupManageEtablissement a.profile-action-btn {
min-width: 100px;
width: 100px;
max-width: 100px;
box-sizing: border-box;
text-decoration: none;
}
.flex_gestion_etablissement {
display: flex;
flex-direction: column;
width: 100%;
gap: 10px;
align-items: center;
}
.etablissement_row {
display: flex;
align-items: center;
width: auto;
}
.checkbox_container {
flex: 0 0 40px;
display: flex;
justify-content: center;
}
.etablissement_name_container {
width: 200px;
min-width: 200px;
max-width: 200px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
position: relative;
padding: 8px 12px;
margin-left: 0;
background: var(--color-gray-50);
border-radius: var(--radius-xs);
border-top: 1px solid var(--color-info);
border-right: 1px solid var(--color-info);
border-bottom: 1px solid var(--color-info);
border-left: 1px solid var(--color-info);
box-shadow: 0 0 5px 5px var(--color-gray-100) inset;
font: normal 14px/normal var(--font-family-base);
color: var(--color-brand-primary);
text-align: center;
text-overflow: clip;
overflow: hidden;
white-space: nowrap;
}
.etablissement_name_container label {
display: block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/**
* ---------------------------------------------------------------------------
* MesDocuments — menu horizontal des années (rapports)
* Thème clair : pas de fond propre (hérite du container), boutons gris clairs.
* Actif : rappel visuel de .box_title (bleu). Zone panneaux : min-height pour limiter les sauts de layout.
* ---------------------------------------------------------------------------
*/
.mesdocs-annees-wrap {
box-sizing: border-box;
width: 100%;
max-width: min(96%, 1600px);
margin: 0 auto 16px;
padding: 10px 4px 6px;
background: transparent;
color: inherit;
}
.mesdocs-annees-nav {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 10px;
}
.mesdocs-annee-btn {
box-sizing: border-box;
min-width: 72px;
padding: 10px 16px;
font-family: var(--font-family-base);
font-size: 14px;
font-weight: 600;
line-height: 1.2;
border-radius: var(--radius-lg);
border: 1px solid transparent;
cursor: pointer;
transition: background-color var(--duration-base) var(--easing-standard), color var(--duration-base) var(--easing-standard), border-color var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard);
}
.mesdocs-annee-btn:focus-visible {
outline: 2px solid var(--color-brand-primary);
outline-offset: 2px;
}
/* Année sélectionnée (onglet actif) — rappel de la barre .box_title */
.mesdocs-annee--actif {
background-color: var(--color-brand-primary);
color: var(--color-white);
border-color: var(--color-brand-primary);
box-shadow: 0 2px 8px var(--overlay-brand-primary-28);
}
.mesdocs-annee--actif:hover {
background-color: var(--color-brand-secondary-hover);
color: var(--color-white);
}
/* Année cliquable mais non sélectionnée — gris clair (thème clair) */
.mesdocs-annee--disponible {
background-color: var(--color-gray-100);
color: var(--color-gray-600);
border-color: var(--color-gray-200);
}
.mesdocs-annee--disponible:hover {
background-color: var(--color-gray-200);
color: var(--color-gray-800);
border-color: var(--color-brand-secondary-hover);
}
/* Aucun rapport pour cette année — gris très clair, lisible sur fond clair */
.mesdocs-annee--indisponible {
background-color: var(--color-gray-50);
color: var(--color-brand-secondary-hover);
border-color: var(--color-gray-200);
cursor: not-allowed;
}
.mesdocs-annee--indisponible:hover {
background-color: var(--color-gray-100);
color: var(--color-brand-secondary-hover);
border-color: var(--color-gray-200);
}
/* Hauteur minimale : évite que la page « saute » trop quand le nombre de rapports varie selon l'année */
.mesdocs-annees-panels {
margin-top: 12px;
min-height: min(52vh, 560px);
}
@media screen and (max-width: 768px) {
.mesdocs-annees-panels {
min-height: min(48vh, 420px);
}
}
.mesdocs-annee-panel[hidden] {
display: none;
}
/**
* MesDocuments — message lorsque l'utilisateur n'est pas administrateur (superuser)
*/
.mesdocs-access-info {
box-sizing: border-box;
width: 100%;
max-width: 36rem;
margin: clamp(2rem, 8vh, 4rem) auto;
padding: 0 1rem;
text-align: center;
}
.mesdocs-access-info-inner {
box-sizing: border-box;
padding: clamp(1.75rem, 4vw, 2.5rem) clamp(1.25rem, 4vw, 2rem);
border: 1px solid var(--color-gray-200);
border-radius: var(--radius-xl);
background: var(--color-white);
box-shadow: 0 0 10px 2px var(--color-gray-200);
}
.mesdocs-access-info-icon {
margin-bottom: 0.75rem;
font-size: 2.25rem;
line-height: 1;
color: var(--color-brand-primary);
}
.mesdocs-access-info-heading {
margin: 0 0 0.75rem;
font-size: clamp(1.15rem, 2.5vw, 1.35rem);
font-weight: 600;
color: var(--color-gray-800);
}
.mesdocs-access-info-lead {
margin: 0 0 1rem;
font-size: clamp(0.95rem, 2vw, 1.05rem);
line-height: 1.55;
color: var(--color-gray-600);
}
.mesdocs-access-info-text {
margin: 0;
font-size: clamp(0.9rem, 1.8vw, 1rem);
line-height: 1.6;
color: var(--color-gray-500);
}
/* ——— Suite SECTION 15 (doublon legacy — même bloc POP-UP SIDEBAR) ——— */
/************************** POP-UP SIDEBAR**************************/
/* Style commun pour toutes les popups */
.popup_sidebar,
#popup_bt,
#popup_lex,
#popup_aide {
position: fixed;
top: 5vh;
left: 5vw;
width: 90vw;
height: 90vh;
max-width: 1200px;
max-height: 800px;
background-color: var(--color-gray-100);
border-radius: var(--radius-lg);
border: solid 1px var(--color-gray-300);
padding: 15px;
text-align: center;
z-index: var(--z-overlay);
display: none;
/* Empêche le défilement de la popup elle-même */
overflow: hidden;
}
/* Style commun pour tous les conteneurs de contenu */
.popup_content,
#cont_popup_bt,
#cont_popup_lex,
#cont_popup_aide {
/* Permet le défilement vertical du contenu */
overflow-y: auto;
/* Permet le défilement horizontal si nécessaire */
overflow-x: auto;
/* Prend toute la hauteur disponible moins les paddings */
height: 100%;
/* Prend toute la largeur disponible */
width: 100%;
/* Style de la barre de défilement pour Webkit (Chrome, Safari) */
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-track {
background: var(--color-surface-app);
border-radius: var(--radius-sm);
}
&::-webkit-scrollbar-thumb {
background: var(--color-gray-500);
border-radius: var(--radius-sm);
}
&::-webkit-scrollbar-thumb:hover {
background: var(--color-gray-600);
}
}
/* Media queries pour les petits écrans */
@media screen and (max-width: 768px) {
.popup_sidebar,
#popup_bt,
#popup_lex,
#popup_aide {
top: 2vh;
left: 2vw;
width: 96vw;
height: 96vh;
padding: 10px;
}
}
/** ===================================================================== **/
/** HOME — grille d'accueil (home.php) : layout 1/3 + 2/3 **/
/** ===================================================================== **/
/**
* Grille principale : colonne info (1fr) + zone principale (2fr).
* Sur petit écran : une colonne, ordre conservé.
*/
.home-layout-grid {
/* Même givrage blanc 10 % que .home-info-panel__body (sur bleu var(--color-brand-primary)) */
--home-info-body-frost: var(--overlay-white-10);
display: grid;
grid-template-columns: 1fr 2fr;
gap: clamp(1rem, 2.5vw, 2rem);
align-items: start;
width: 100%;
box-sizing: border-box;
margin: 0 0 1.5rem;
}
.home-layout-grid__zone--info {
min-width: 0;
}
.home-layout-grid__zone--main {
min-width: 0;
min-height: 8rem;
/* Réservé pour print_Block_tiles_navigation() */
}
@media screen and (max-width: 900px) {
.home-layout-grid {
grid-template-columns: 1fr;
}
}
/**
* Panneau d'information : fond bleu type .box_title, texte blanc,
* disposition verticale, coin supérieur droit replié (effet feuille).
*/
.home-info-panel {
--home-info-panel-bg: var(--color-brand-primary);
--home-info-panel-fold-size: 26px;
position: relative;
display: flex;
flex-direction: column;
min-height: 14rem;
padding: 0 0 1rem;
border-radius: 0 0 var(--radius-lg) var(--radius-lg);
background: var(--home-info-panel-bg);
color: var(--color-white);
overflow: visible;
box-sizing: border-box;
}
/* Pli (ombre) : noir transparent pour tout fond */
.home-info-panel::before {
content: "";
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 var(--home-info-panel-fold-size) var(--home-info-panel-fold-size) 0;
border-color: transparent var(--color-overlay-medium) transparent transparent;
z-index: var(--z-base);
pointer-events: none;
}
/* Pli (face) : blanc transparent — le fond de la page reste visible à travers */
.home-info-panel::after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 calc(var(--home-info-panel-fold-size) - 3px) calc(var(--home-info-panel-fold-size) - 3px) 0;
border-color: transparent var(--color-gray-50) transparent transparent;
z-index: var(--z-surface-2);
pointer-events: none;
}
.home-info-panel__title {
flex: 0 0 auto;
margin: 0;
padding: 0.65rem 2.4rem 0.65rem 0.85rem;
min-height: 2.25rem;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
background-color: var(--home-info-panel-bg);
border-radius: var(--radius-md) 0 0 0;
box-sizing: border-box;
}
.home-info-panel__title-text {
flex: 1 1 auto;
min-width: 0;
color: var(--color-white);
font-size: 16px;
font-weight: 500;
line-height: 1.25;
font-family: var(--font-family-base);
text-align: left;
}
.home-info-panel__icon {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: center;
width: 2.1rem;
height: 2.1rem;
font-size: 1.3rem;
line-height: 1;
color: var(--overlay-white-95);
}
.home-info-panel__body {
flex: 1 1 auto;
margin: 0 0.75rem 0.25rem;
padding: 0.75rem 0.85rem 0.5rem;
background: var(--home-info-body-frost, var(--overlay-white-10));
border-radius: 0 0 var(--radius-md) var(--radius-md);
box-sizing: border-box;
min-height: 6rem;
}
.home-info-panel__text {
margin: 0;
color: var(--color-white);
font-size: 14px;
line-height: 1.55;
font-family: var(--font-family-base);
}
/* Contenu structuré (HTML statique) dans le panneau Informations */
.home-info-panel__rich {
color: var(--color-white);
font-size: 14px;
line-height: 1.55;
font-family: var(--font-family-base);
}
.home-info-panel__rich p {
margin: 0 0 0.65rem;
}
.home-info-panel__rich p:last-child {
margin-bottom: 0;
}
.home-info-panel__section {
margin: 0 0 1rem;
padding: 0 0 0.85rem;
border-bottom: 1px solid var(--overlay-white-20);
}
.home-info-panel__section:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}
.home-info-panel__section-title {
margin: 0 0 0.5rem;
font-size: 0.95rem;
font-weight: 600;
line-height: 1.3;
color: var(--color-white);
font-family: var(--font-family-base);
}
.home-info-panel__list {
margin: 0.35rem 0 0;
padding-left: 1.2rem;
list-style-type: disc;
}
.home-info-panel__list li {
margin-bottom: 0.25rem;
}
.home-info-panel__date-limite {
color: var(--color-red-pale);
font-weight: 700;
}
.home-info-panel__rich a {
color: var(--color-info);
text-decoration: underline;
text-underline-offset: 2px;
}
.home-info-panel__rich a:hover,
.home-info-panel__rich a:focus {
color: var(--color-white);
}
/* Liens accent (ateliers, mailto…) : même couleur que .home-info-panel__date-limite (lisible sur fond bleu) */
.home-info-panel__rich a.home-info-panel__accent-link {
color: var(--color-red-pale);
font-weight: 700;
}
.home-info-panel__rich a.home-info-panel__accent-link:hover,
.home-info-panel__rich a.home-info-panel__accent-link:focus {
color: var(--color-white);
}
/* Guide saisie — wrap boutons parcours ; fond orange ; libellé aux couleurs du menu #home_menu */
.home-cta-form-wrap {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
width: 100%;
margin: 0.25rem 0 2.25rem;
padding: 0 0.5rem;
box-sizing: border-box;
}
/* Même bleu que les liens du menu principal (#home_menu → --color-brand-primary) */
.home-cta-form-wrap .home-cta-form-wrap__validation-hint {
color: var(--color-brand-primary);
font-size: 18px;
}
.home-cta-form-wrap .home-cta-form-btn {
/* Couleurs / ombres guide saisie — partagées avec #menu_nav_validation_flag — tokens --guide-saisie-* §02 */
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
width: min(100%, 36rem);
max-width: 100%;
min-width: min(100%, 32rem);
min-height: 3.35rem;
height: auto;
padding: 0.9rem 2.4rem;
margin: 0;
font: 600 1.25rem/1.2 var(--font-family-base);
color: var(--guide-saisie-text);
letter-spacing: 0.01em;
border: var(--border-width-thin) solid var(--guide-saisie-border-color);
border-radius: var(--radius-xl);
box-sizing: border-box;
background-color: var(--guide-saisie-bg);
box-shadow: var(--guide-saisie-shadow-rest);
transform: translateY(0) scale(1);
transition: color var(--duration-base) var(--easing-standard), background-color var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard), border-color var(--duration-base) var(--easing-standard), transform 0.18s ease;
}
.home-cta-form-wrap .home-cta-form-btn__label {
white-space: normal;
text-align: center;
}
/* Guide saisie : texte seul sur le bouton principal, pas d’icône flèche (pseudo / décoratif) */
.home-cta-form-wrap .home-cta-form-btn::before,
.home-cta-form-wrap .home-cta-form-btn::after {
content: none;
display: none;
}
.home-cta-form-wrap .home-cta-form-btn > i {
display: none;
}
.home-cta-form-wrap .home-cta-form-btn:hover {
color: var(--guide-saisie-text-hover);
background-color: var(--guide-saisie-bg-hover);
box-shadow: var(--guide-saisie-shadow-hover);
border-color: var(--guide-saisie-border-color-hover);
transform: translateY(-2px) scale(1.01);
}
.home-cta-form-wrap .home-cta-form-btn:active {
color: var(--guide-saisie-text-hover);
background-color: var(--guide-saisie-bg-active);
box-shadow: var(--guide-saisie-shadow-active);
border-color: var(--guide-saisie-border-color-active);
transform: translateY(0) scale(0.99);
transition-duration: 0.05s;
}
.home-cta-form-wrap .home-cta-form-btn:focus-visible {
outline: 2px solid var(--color-brand-primary);
outline-offset: 3px;
}
/* Grille de tuiles navigation (accueil) : rectangles verticaux, structure proche de .home-info-panel */
.home-nav-tiles {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.75rem 0.85rem;
width: 100%;
align-items: stretch;
box-sizing: border-box;
}
@media screen and (max-width: 900px) {
.home-nav-tiles {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media screen and (max-width: 500px) {
.home-nav-tiles {
grid-template-columns: 1fr;
}
.home-nav-tile {
min-height: 16rem;
}
}
/* Enveloppe jaune-orangé, pli haut-droit type feuille, coin haut-gauche à 90° (pas d’arrondi) */
.home-nav-tile {
--home-nav-tile-skin: var(--color-green-pale);
--home-nav-tile-fold: 20px;
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
min-height: 18.5rem;
padding: 0;
background: var(--home-nav-tile-skin);
color: var(--color-gray-800);
border-radius: 0 0 var(--radius-lg) var(--radius-lg);
overflow: hidden;
box-sizing: border-box;
}
/* Pli (ombre) */
.home-nav-tile::before {
content: "";
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 var(--home-nav-tile-fold) var(--home-nav-tile-fold) 0;
border-color: transparent var(--overlay-black-12) transparent transparent;
z-index: var(--z-base);
pointer-events: none;
}
/* Pli (face) — fond page */
.home-nav-tile::after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 calc(var(--home-nav-tile-fold) - 3px) calc(var(--home-nav-tile-fold) - 3px) 0;
border-color: transparent var(--color-gray-50) transparent transparent;
z-index: var(--z-surface-2);
pointer-events: none;
}
/* Bande titre : titre à gauche, picto Font Awesome à droite (pli haut-droit : marge droite) */
.home-nav-tile__title {
--home-nav-tile-title-fg: var(--color-gray-800);
flex: 0 0 auto;
margin: 0;
padding: 0.65rem 2.1rem 0.65rem 0.75rem;
min-height: 2.75rem;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
background-color: var(--home-nav-tile-skin);
border-radius: 0;
box-sizing: border-box;
}
.home-nav-tile__title-text {
flex: 1 1 auto;
min-width: 0;
color: var(--home-nav-tile-title-fg);
font: 600 1.1rem/1.25 var(--font-family-base);
text-align: left;
}
.home-nav-tile__icon {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: center;
width: 2.4rem;
height: 2.4rem;
font-size: 1.35rem;
line-height: 1;
color: var(--home-nav-tile-title-fg);
opacity: 0.95;
}
/* Zone de texte seule (fond crème) */
.home-nav-tile__body {
flex: 1 1 auto;
display: flex;
flex-direction: column;
margin: 0 0.5rem 0.3rem;
padding: 0.85rem 0.8rem 0.8rem;
background-color: var(--color-gray-200);
border-radius: 0;
box-sizing: border-box;
min-height: 0;
max-height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
.home-nav-tile__body--form .home-nav-tile__text{
flex: 0 0 auto;
}
.home-nav-tile__text {
flex: 1 1 auto;
margin: 0;
font: 400 0.95rem/1.5 var(--font-family-base);
color: var(--color-gray-800);
text-align: center;
}
/* Bande basse jaune-orangé (#ffc96f) : pleine largeur sous la zone texte */
.home-nav-tile__action {
flex: 0 0 auto;
align-self: stretch;
margin: 0;
padding: 0.5rem 0.55rem 0.7rem;
text-align: center;
box-sizing: border-box;
background-color: var(--home-nav-tile-skin);
border-top: 1px solid var(--overlay-black-06);
}
/*
* Bouton Accéder : fond #55585b, survol légèrement plus clair, clic plus sombre
*/
.home-nav-tile__btn {
--acceder-surface: var(--color-gray-600);
--acceder-surface-hover: var(--color-gray-500);
--acceder-surface-active: var(--color-gray-600);
display: block;
width: 100%;
box-sizing: border-box;
margin: 0;
padding: 0.7rem 1.1rem;
font: 600 1.05rem/1.25 var(--font-family-base);
color: var(--color-white);
text-decoration: none;
background-color: var(--acceder-surface);
border: 1px solid var(--overlay-white-18);
border-radius: var(--radius-md);
cursor: pointer;
transition: color var(--duration-base) var(--easing-standard), background-color var(--duration-base) var(--easing-standard), border-color var(--duration-base) var(--easing-standard), transform 0.1s ease;
}
a.home-nav-tile__btn.menu_link,
a.home-nav-tile__btn.menu_link_s,
a.home-nav-tile__btn.menu_link_bo {
font: 600 1.05rem/1.25 var(--font-family-base);
color: var(--color-white);
z-index: auto;
}
.home-nav-tile__btn:hover {
color: var(--color-white);
background-color: var(--acceder-surface-hover);
border-color: var(--overlay-white-24);
}
a.home-nav-tile__btn.menu_link:hover,
a.home-nav-tile__btn.menu_link_s:hover,
a.home-nav-tile__btn.menu_link_bo:hover {
color: var(--color-white);
}
.home-nav-tile__btn:active {
color: var(--color-white);
background-color: var(--acceder-surface-active);
border-color: var(--overlay-black-15);
transform: scale(0.98);
transition-duration: 0.05s;
}
.home-nav-tile__btn:focus-visible {
outline: 2px solid var(--color-info);
outline-offset: 2px;
}
/* Tuile désactivée : vert atténué + bouton grisé non cliquable */
.home-nav-tile--disabled {
--home-nav-tile-skin: var(--color-green-tile-muted);
--home-nav-tile-title-fg: var(--color-gray-600);
}
.home-nav-tile--disabled::after {
border-color: transparent var(--color-green-tile-muted) transparent transparent;
}
.home-nav-tile--disabled .home-nav-tile__icon {
opacity: 0.75;
}
.home-nav-tile__btn--disabled,
.home-nav-tile__btn:disabled {
--acceder-surface: var(--color-gray-400);
--acceder-surface-hover: var(--color-gray-400);
--acceder-surface-active: var(--color-gray-400);
color: var(--color-gray-100);
background-color: var(--color-gray-400);
border-color: var(--overlay-black-08);
cursor: not-allowed;
opacity: 0.92;
transform: none;
pointer-events: none;
}
.home-nav-tile__btn--disabled:hover,
.home-nav-tile__btn:disabled:hover {
color: var(--color-gray-100);
background-color: var(--color-gray-400);
border-color: var(--overlay-black-08);
}
/** Fin bloc HOME — grille d'accueil **/
/* ===== Aide popup: rendu modernise ===== */
#popup_aide {
background: var(--color-gray-50);
border: 1px solid var(--color-info);
border-radius: var(--radius-14);
width: 94vw;
max-width: 1380px;
}
#cont_popup_aide {
padding: 0.25rem 1rem 1rem;
box-sizing: border-box;
overflow-x: hidden;
}
/**
* Aide / lexique : fenêtre centrée dans le viewport (fixed), colonnes à défilement indépendant.
* Sans .popup_documentation--visible : ne pas mettre display sur .popup_documentation seule —
* sinon on écrase display:none et la popup apparaît au chargement.
*/
#popup_aide.popup_documentation,
#popup_lex.popup_documentation {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: min(94vw, 1380px);
height: min(90vh, 820px);
max-height: 92vh;
text-align: left;
overflow: hidden;
box-sizing: border-box;
}
#popup_aide.popup_documentation.popup_documentation--visible,
#popup_lex.popup_documentation.popup_documentation--visible {
display: flex;
flex-direction: column;
align-items: stretch;
/* Au-dessus de .bg_lightbox (--z-lightbox-backdrop / setBG) */
z-index: var(--z-preview-peak);
}
#popup_aide.popup_documentation > br,
#popup_lex.popup_documentation > br {
display: none;
}
#popup_aide.popup_documentation > a[id="bouton_fermer_aide"],
#popup_lex.popup_documentation > a[id="bouton_fermer_lex"] {
flex-shrink: 0;
align-self: flex-end;
margin: 0 0 0.35rem;
}
#popup_aide.popup_documentation #cont_popup_aide,
#popup_lex.popup_documentation #cont_popup_lex {
flex: 1 1 0;
min-height: 0;
height: auto;
overflow: hidden;
display: flex;
flex-direction: column;
padding-top: 0;
text-align: left;
}
#popup_aide.popup_documentation #cont_popup_aide .sidebar-doc-layout,
#popup_lex.popup_documentation #cont_popup_lex .sidebar-doc-layout {
flex: 1 1 auto;
min-height: 0;
display: grid;
grid-template-columns: minmax(220px, 0.9fr) minmax(0, 2.3fr);
grid-template-rows: minmax(0, 1fr);
gap: 1.1rem;
align-items: stretch;
overflow: hidden;
}
#popup_aide.popup_documentation .sidebar-doc-layout__menu,
#popup_lex.popup_documentation .sidebar-doc-layout__menu {
overflow-x: hidden;
overflow-y: auto;
min-height: 0;
-webkit-overflow-scrolling: touch;
}
#popup_aide.popup_documentation .sidebar-doc-layout__content,
#popup_lex.popup_documentation .sidebar-doc-layout__content {
overflow-x: hidden;
overflow-y: auto;
min-height: 0;
-webkit-overflow-scrolling: touch;
}
@media screen and (max-width: 768px) {
#popup_aide.popup_documentation,
#popup_lex.popup_documentation {
width: min(96vw, 100%);
height: min(92vh, 100%);
max-height: 94vh;
padding: 10px 12px 12px;
}
#popup_aide.popup_documentation #cont_popup_aide .sidebar-doc-layout,
#popup_lex.popup_documentation #cont_popup_lex .sidebar-doc-layout {
grid-template-columns: 1fr;
grid-template-rows: auto minmax(0, 1fr);
max-height: none;
}
#popup_aide.popup_documentation .sidebar-doc-layout__menu,
#popup_lex.popup_documentation .sidebar-doc-layout__menu {
max-height: min(38vh, 280px);
}
}
#cont_popup_aide .box,
#cont_popup_lex .box {
width: calc(100% - 1.5rem);
max-width: 920px;
margin: 0.85rem auto 1.25rem;
padding: 1rem 1.25rem;
background: var(--color-white);
border: 1px solid var(--color-info);
border-radius: var(--radius-xl);
box-shadow: 0 2px 8px var(--overlay-ink-deep-06);
text-align: left;
box-sizing: border-box;
}
#cont_popup_aide p,
#cont_popup_lex p {
margin: 0;
line-height: 1.65;
color: var(--color-border-strong);
}
#cont_popup_aide .sous_titre_lexique,
#cont_popup_lex .sous_titre_lexique {
display: inline-block;
margin: 0 0 0.5rem;
font-size: 1.05rem;
font-weight: 700;
color: var(--color-border-strong);
border-left: 4px solid var(--color-info);
padding-left: 0.5rem;
}
#cont_popup_aide .aide-image,
#cont_popup_aide img,
#cont_popup_lex img {
display: block;
width: 100%;
max-width: 100%;
height: auto;
object-fit: contain;
border-radius: var(--radius-lg);
margin: 0.75rem auto;
}
#cont_popup_aide .sidebar-doc-layout,
#cont_popup_lex .sidebar-doc-layout {
display: grid;
grid-template-columns: minmax(220px, 0.9fr) minmax(0, 2.3fr);
gap: 1.1rem;
align-items: start;
}
#cont_popup_aide .sidebar-doc-layout__menu,
#cont_popup_aide .sidebar-doc-layout__content,
#cont_popup_lex .sidebar-doc-layout__menu,
#cont_popup_lex .sidebar-doc-layout__content {
min-width: 0;
}
#cont_popup_aide .sidebar-doc-layout__menu,
#cont_popup_lex .sidebar-doc-layout__menu {
background: var(--color-border-strong);
border-radius: var(--radius-xl);
padding: 0.9rem 0.75rem;
}
#cont_popup_aide .sidebar-doc-nav,
#cont_popup_lex .sidebar-doc-nav {
display: flex;
flex-direction: column;
gap: 0.4rem;
margin-top: 0;
}
#cont_popup_aide .sidebar-doc-nav a,
#cont_popup_lex .sidebar-doc-nav a {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.2rem;
padding: 0.65rem 0.8rem;
background: var(--overlay-white-14);
border: 1px solid var(--overlay-white-25);
border-left: 4px solid var(--overlay-white-55);
border-radius: var(--radius-md);
font: 600 0.95rem/1.35 var(--font-family-base);
color: var(--color-white);
text-decoration: none;
transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
#cont_popup_aide .sidebar-doc-nav a:hover,
#cont_popup_lex .sidebar-doc-nav a:hover {
background: var(--overlay-white-25);
border-color: var(--overlay-white-45);
color: var(--color-white);
}
#cont_popup_aide .sidebar-doc-nav a.is-active,
#cont_popup_lex .sidebar-doc-nav a.is-active {
background: var(--color-white);
border-color: var(--color-white);
color: var(--color-border-strong);
}
#cont_popup_aide .js-sidebar-doc-section,
#cont_popup_lex .js-sidebar-doc-section {
display: none;
}
#cont_popup_lex .lexique-popup-detail__index {
margin: 0 0 0.75rem;
}
#cont_popup_lex .lexique-popup-detail__texte {
line-height: 1.65;
color: var(--color-border-strong);
}
#cont_popup_lex .lexique-popup-detail__sous {
margin-top: 1.15rem;
padding-top: 0.5rem;
border-top: 1px solid var(--color-info);
}
#cont_popup_lex .lexique-popup-detail__sous-texte {
margin: 0.5rem 0 0;
padding: 0.65rem 0.85rem;
background: var(--color-gray-50);
border-left: 4px solid var(--color-info);
border-radius: var(--radius-md);
}
@media screen and (max-width: 768px) {
#cont_popup_aide .sidebar-doc-layout,
#cont_popup_lex .sidebar-doc-layout {
grid-template-columns: 1fr;
}
#cont_popup_aide .sidebar-doc-nav,
#cont_popup_lex .sidebar-doc-nav {
margin-top: 0.45rem;
}
#cont_popup_aide .sidebar-doc-nav a,
#cont_popup_lex .sidebar-doc-nav a {
padding: 0.58rem 0.72rem;
font-size: 0.92rem;
}
#cont_popup_aide .box,
#cont_popup_lex .box {
width: calc(100% - 0.5rem);
padding: 0.85rem 0.9rem;
}
#cont_popup_aide .sous_titre_lexique,
#cont_popup_lex .sous_titre_lexique {
font-size: 1rem;
}
}
/* -------------------------------------------------------------------------- */
/* SECTION 17 — Identification / authentification (identification.php) */
/* -------------------------------------------------------------------------- */
/* --- 17.0 Bases historiques (divers.php) : lien #connexion header, overlay */
/* #container_login_window, #login_window, .login_title, .field_id, #id_bra, */
/* .white_link — utilisés avant / en parallèle de .id-page-login. Les règles */
/* .id-auth--page ci-dessous surchargent sur identification.php. */
/* Float #connexion annulé dans #home_menu.home_menu--public (SECTION 04.5). */
#connexion {
float: right;
margin-right: 10px;
margin-top: 40px;
z-index: var(--z-nav-layer);
}
#container_login_window{
float: right;
position: relative;
display:none;
width: 450px;
height: 300px;
margin-right:-185px;
margin-top:76px;
}
#login_window{
position: fixed;
padding: 10px;
width: 450px;
height: 300px;
background-image: var(--fo-login-bg-image);
color: var(--color-text-inverse);
z-index: var(--z-modal);
}
.login_title{
font-size: 20px;
color: var(--color-text-inverse);
}
.field_id {
margin-top: 10px;
display: inline-block;
box-sizing: content-box;
width: 300px;
position: relative;
padding: 10px 20px;
border: 1px solid var(--color-gray-400);
border-radius: var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: var(--color-accent-cyan-solid);
text-overflow: clip;
background: var(--color-white-soft);
}
#id_bra{
margin-top: 40px;
}
.white_link{
font-size:15px;
color:var(--color-white);
text-decoration: underline;
}
/** ===================================================================== **/
/** IDENTIFICATION — page connexion (identification.php) **/
/** Variables regroupées en début de section **/
/** ===================================================================== **/
.id-page-login {
/* Cartouche titre colonne (harmonisé avec gestion_user / home) */
--id-login-title-bg: var(--color-brand-primary);
--id-login-title-text: var(--color-white);
/* Thème formulaire */
--id-auth-font: var(--font-family-base);
--id-auth-color-text: var(--color-text-main);
--id-auth-color-muted: var(--color-text-muted);
--id-auth-color-brand: var(--color-brand-primary);
--id-auth-color-brand-hover: var(--color-brand-primary-hover);
--id-auth-color-danger: var(--color-danger);
--id-auth-color-warn-bg: var(--color-warning-bg);
--id-auth-color-warn-border: var(--color-warning-border);
--id-auth-color-link: var(--color-link-primary);
--id-auth-radius-input: var(--radius-md);
--id-auth-space-xs: var(--space-xs);
--id-auth-space-sm: var(--space-sm);
--id-auth-space-md: var(--space-md);
--id-auth-space-lg: var(--space-lg);
--id-auth-inner-max: 22rem;
--id-auth-stack-min-h: 340px;
--id-auth-input-border: 1px solid var(--color-border-default);
--id-auth-input-bg: var(--color-white);
}
.id-login-panel__head {
margin: 0 0 0.5rem;
padding: 0;
border-radius: var(--radius-md) var(--radius-md) 0 0;
overflow: hidden;
}
.id-login-panel__head table {
width: 100%;
border-collapse: collapse;
}
.id-login-panel__head .left_title {
background: var(--id-login-title-bg, var(--color-brand-primary));
color: var(--id-login-title-text, var(--color-white));
font-weight: 600;
padding: 0.5rem 0.75rem;
font-size: 1rem;
}
.id-login-panel__body--flush {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
#container_login_window.container-login-window--page.id-auth--page {
display: block !important;
float: none !important;
position: relative;
width: 100% !important;
max-width: min(100%, 28rem);
height: auto !important;
min-height: var(--id-auth-stack-min-h);
margin: 0 auto !important;
}
#container_login_window.id-auth--page #login_window,
#container_login_window.id-auth--page #box_mdp,
#container_login_window.id-auth--page #box_pb,
#container_login_window.id-auth--page #box_pb_envoi,
#container_login_window.id-auth--page #box_pb_serv,
#container_login_window.id-auth--page #box_ok {
position: absolute !important;
top: 0;
left: 0;
right: 0;
width: 100% !important;
min-height: 260px;
height: auto !important;
box-sizing: border-box;
z-index: var(--z-surface-2);
background: transparent !important;
background-image: none !important;
box-shadow: none;
padding: 0 !important;
margin: 0 !important;
color: var(--id-auth-color-text) !important;
}
#container_login_window.id-auth--page #login_window {
z-index: var(--z-surface-3);
}
.id-auth--page .id-auth-panel__inner {
max-width: var(--id-auth-inner-max);
margin: 0 auto;
padding: var(--id-auth-space-md) 0;
text-align: center;
font-family: var(--id-auth-font);
color: var(--id-auth-color-text);
}
.id-auth--page .id-auth-heading {
margin: 0 0 var(--id-auth-space-sm);
font-size: 1.35rem;
font-weight: 700;
color: var(--id-auth-color-brand);
letter-spacing: 0.02em;
}
.id-auth--page .id-auth-lead {
margin: 0 0 var(--id-auth-space-md);
font-size: 0.95rem;
line-height: 1.5;
color: var(--id-auth-color-muted);
}
.id-auth--page .id-auth-fields {
display: flex;
flex-direction: column;
gap: var(--id-auth-space-md);
text-align: left;
margin-bottom: var(--id-auth-space-md);
}
.id-auth--page .id-auth-label {
display: block;
font-size: 0.82rem;
font-weight: 600;
color: var(--id-auth-color-text);
margin-bottom: var(--id-auth-space-xs);
}
#container_login_window.id-auth--page .id-auth-input.field_id,
#container_login_window.id-auth--page .id-auth-input.input_profil {
display: block;
width: 100%;
max-width: none;
height: auto;
min-height: 42px;
padding: 0.55rem 0.75rem;
box-sizing: border-box;
border: var(--id-auth-input-border);
border-radius: var(--id-auth-radius-input);
font-size: 0.95rem;
background: var(--id-auth-input-bg);
box-shadow: inset 0 1px 2px var(--overlay-ink-06);
transition: border-color var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard);
}
#container_login_window.id-auth--page .id-auth-input:focus {
outline: none;
border-color: var(--id-auth-color-brand);
box-shadow: 0 0 0 3px var(--overlay-brand-primary-20);
}
#container_login_window.id-auth--page #id_bra {
margin-top: 0;
}
.id-auth--page .id-auth-alert.login-msg--warn {
text-align: left;
margin: 0 0 var(--id-auth-space-md);
padding: var(--id-auth-space-sm) var(--id-auth-space-md);
border-radius: var(--id-auth-radius-input);
background: var(--id-auth-color-warn-bg);
border: 1px solid var(--id-auth-color-warn-border);
color: var(--id-auth-color-danger);
font-weight: 600;
font-size: 0.9rem;
}
.id-auth--page .id-auth-actions {
display: flex;
flex-direction: column;
align-items: stretch;
gap: var(--id-auth-space-sm);
margin-top: var(--id-auth-space-sm);
}
.id-auth--page .id-auth-submit.profile-action-btn,
.id-auth--page a.id-auth-submit.profile-action-btn {
width: 100%;
min-width: 0;
box-sizing: border-box;
text-decoration: none;
text-align: center;
line-height: 1.2;
}
.id-auth--page button.id-auth-submit.profile-action-btn {
border: 1px solid var(--color-link-primary);
cursor: pointer;
font-family: inherit;
}
.id-auth--page .id-auth-footer {
margin: var(--id-auth-space-md) 0 0;
}
.id-auth--page .id-auth-link.white_link,
.id-auth--page a.id-auth-link {
color: var(--id-auth-color-link) !important;
font-size: 0.9rem;
font-weight: 600;
text-decoration: underline;
text-underline-offset: 3px;
}
.id-auth--page .id-auth-link.white_link:hover,
.id-auth--page a.id-auth-link:hover {
color: var(--id-auth-color-brand-hover);
}
.id-auth--page .id-auth-actions--split {
flex-direction: column;
align-items: stretch;
}
.id-auth--page .id-auth-btn-secondary {
display: block;
text-align: center;
padding: 0.5rem;
font-size: 0.9rem;
font-weight: 600;
color: var(--id-auth-color-link);
text-decoration: none;
border-radius: var(--id-auth-radius-input);
transition: background var(--duration-base) var(--easing-standard);
}
.id-auth--page .id-auth-btn-secondary:hover {
background: var(--overlay-brand-primary-08);
}
.id-auth--page .id-auth-panel--message .id-auth-message {
margin: 0 0 var(--id-auth-space-lg);
font-size: 0.95rem;
line-height: 1.55;
color: var(--id-auth-color-text);
}
.id-login-panel__body {
position: relative;
font-family: var(--id-auth-font);
}
.id-login-panel .profile-box.id-login-panel__body {
width: 100%;
max-width: none;
margin-left: 0;
margin-right: 0;
}
@media screen and (max-width: 900px) {
.id-page-login {
--id-auth-inner-max: 100%;
}
}
/* =============================================================================
SECTION 97 — RÉSERVE / À CLASSER
-----------------------------------------------------------------------------
Espace prévu pour déplacer ici, après analyse (grep HTML/PHP), les règles
dont la page ou le composant d’origine est incertain — sans mélanger avec
la cascade active tant qu’elles n’y sont pas recopiées.
Pour l’instant : aucune règle déplacée (ordre historique conservé).
============================================================================= */
#popupPreview2 {
/* Dimensions fixes format A4 */
width: 810px;
height: 1140px;
/* Positionnement */
position: absolute;
/* Apparence */
background-image: url("../images/rapport/global.png");
background-size: 100% 100%;
background-repeat: no-repeat;
background-color: var(--color-white);
/* Bordures et coins arrondis */
border: solid 1px var(--color-gray-300);
border-radius: var(--radius-lg);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
/* Autres propriétés */
text-align: left;
z-index: var(--z-preview-peak);
overflow: hidden;
/* Optionnel : animation douce */
transition: transform 0.3s ease-out;
}
/* Pour assurer que le contenu ne déborde pas */
.texte_analyse_tend {
height: 100%;
overflow: hidden;
padding: 20px;
}
.progress-circle {
position: relative;
width: 25px;
height: 25px;
text-align: center;
margin-left: 48%;
}
.circle {
height: 100%;
right: 0px;
position: absolute;
border: solid 5px var(--color-gray-400);
border-top-color: var(--color-green-pale);
border-radius: 50%;
}
.border {
width: 100%;
transform: rotate(135deg);
animation: spin 1.3s steps(2) .2s infinite;
-webkit-animation: spin 1.3s linear infinite;
}
@-webkit-keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.bordure_bleue{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10px;
overflow: hidden;
border: 1px solid var(--color-border-strong);
-webkit-border-radius: var(--radius-7);
border-radius: var(--radius-7);
text-align: center;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
-webkit-box-shadow: 0 0 2px 1px var(--color-border-strong) ;
box-shadow: 0 0 2px 1px var(--color-border-strong) ;
}
.bordure_rouge{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10px;
overflow: hidden;
border: 1px solid var(--color-red-strong);
-webkit-border-radius: var(--radius-7);
border-radius: var(--radius-7);
text-align: center;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
-webkit-box-shadow: 0 0 2px 1px var(--color-red-strong) ;
box-shadow: 0 0 2px 1px var(--color-red-strong) ;
}
.fond_bleu {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10px;
overflow: hidden;
border: none;
-webkit-border-radius: var(--radius-7);
border-radius: var(--radius-7);
text-align: center;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
background: var(--color-info);
}
.texte_analyse_tend{
position : relative;
padding-top:20px;
margin-left: 25px;
padding-right:25px;
color:var(--color-black);
font-size: 14px;
text-align : left;
}
#popupArseg{
position:fixed;
/*HACK IE6*/
top: 100px;
left:35%;
_position:absolute;
display:none;
width:500px;
height: 250px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
#popupNewField{
position:fixed;
/*HACK IE6*/
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
_position:absolute;
display:none;
width:700px;
max-height: 95vh;
top: 25px;
left: 25%;
font-size: 12px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-overlay);
}
#popupEditField{
position:fixed;
/*HACK IE6*/
_position:absolute;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
display:none;
width:700px;
max-height: 95vh;
top: 25px;
left: 25%;
font-size: 12px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-overlay);
}
#popupSelect{
position:fixed;
/*HACK IE6*/
_position:absolute;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
display:none;
width:700px;
height: 95vh;
top: 25px;
left: 25%;
font-size: 12px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-popup-high);
}
#popupCorrectErreur{
position:fixed;
/*HACK IE6*/
_position:absolute;
overflow-x: hidden; /* Disable horizontal scroll */
overflow-y: scroll;
/*display: none;*/
width:60%;
min-width: 700px;
height: 90vh;
top: 25px;
left: 20%;
font-size: 12px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:25px;
text-align:center;
z-index: var(--z-popup-high);
}
#popupValidSuppChamp{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 150px;
left: 25%;
height:350px;
width:700px;
background-color: var(--color-white);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupSaveGoTo{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 150px;
left: 25%;
height:350px;
width:700px;
background-color: var(--color-white);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-info);
z-index: var(--z-overlay);
}
#popupNoMove{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 160px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
#popupUnlock{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 220px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
#popupSaveDone{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 220px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
#popupSaveFailed{
position:fixed;
/*HACK IE6*/
_position:absolute;
opacity:0.9;
display:none;
width:400px;
height: 220px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
top: 40%;
left: 35%;
}
.popupArseg_content{
text-align:center;
}
#popupCarto{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
top: 300px;
width:950px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
#popup_nav{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
height: 500px;
width:950px;
overflow-y: auto;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding:5px;
text-align:center;
z-index: var(--z-overlay);
}
#hidden_templates{
display:none;
}
.bg_lightbox{
display:none;
background-color: var(--color-gray-600);
opacity:0.75;
z-index: var(--z-lightbox-backdrop);
}
.bg_lightbox_bloquante{
display:none;
background-color: var(--color-gray-600);
opacity:0.75;
z-index: var(--z-lightbox-backdrop);
}
/* ——— Suite SECTION 14 (popups) + fragments gestion_user — doublon legacy ——— */
/******* POPUPS *******/
/******* Gestion_user.php *******/
.line_0{
background-color: var(--color-gray-300);
}
.line_1{
background-color: var(--color-gray-100);
}
.input_eta{
margin:5px;
width:155px;
}
.img_supp{
margin-right:5px;
}
.align_center{
text-align:center;
}
.input_profil{
text-align:left;
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
width: 180px;
border: 1px solid var(--color-info);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
-o-text-overflow: clip;
text-overflow: clip;
background: var(--color-white);
-webkit-box-shadow: 0 0 5px 5px var(--color-gray-100) inset;
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.input_profil2{
text-align:left;
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
position: relative;
width: 500px;
padding: 1px 8px;
height: 20px;
border: 1px solid var(--color-info);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
-o-text-overflow: clip;
text-overflow: clip;
background: var(--color-white);
-webkit-box-shadow: 0 0 5px 5px var(--color-gray-100) inset;
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.input_champ_bo{
text-align:left;
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 20px;
width: 90%;
border: 1px solid var(--color-info);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
-o-text-overflow: clip;
text-overflow: clip;
background: var(--color-white);
-webkit-box-shadow: 0 0 5px 5px var(--color-gray-100) inset;
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.input_champ_bo_com{
text-align:left;
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
position: relative;
padding: 1px 8px;
height: 50px;
width: 90%;
border: 1px solid var(--color-info);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs) 0 0 var(--radius-xs);
font: normal 14px/normal var(--font-family-base);
color: black;
-o-text-overflow: clip;
text-overflow: clip;
background: var(--color-white);
-webkit-box-shadow: 0 0 5px 5px var(--color-gray-100) inset;
box-shadow: 0 0 5px 5px var(--color-gray-100) inset ;
}
.ajout_eta{
display:block;
margin-top:5px;
background-color: var(--color-info);
border: 1px solid var(--color-info);
color: var(--color-white);
padding-top:3px;
padding-bottom:3px;
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.ajout_eta:hover {
color: var(--color-info);
background: var(--color-white);
}
#btn_supp_eta{
color: var(--color-info);
background-color:transparent;
font-size: 18px;
}
#btn_supp_eta:hover {
color: var(--color-info);
}
#btn_supp_eta2{
color: red;
background-color:transparent;
font-size: 18px;
}
#btn_supp_eta2:hover {
color: darkred;
}
#link_home{
color: var(--color-info);
background-color:transparent;
font-size: 20px;
}
#link_home:hover {
color: var(--color-info);
}
.list_save{
display:none;
}
.acti_plrs,.acti_total_plrs,.acti2_plrs,.acti2_total_plrs,.desacti_plrs,.desacti_total_plrs,.desacti2_plrs,.desacti2_total_plrs{
float:right;
margin-right:5px;
}
.button_cat_erreur {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-info);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-info);
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-border-strong)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-border-strong)',GradientType=0);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-border-strong)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-border-strong)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-border-strong);
}
.button_cat_erreur:active {
position:relative;
top:1px;
}
.button_cat_erreur_o {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-info);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-info);
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-border-strong)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-border-strong)',GradientType=0);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur_o:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-border-strong)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-border-strong)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-border-strong);
}
.button_cat_erreur_o:active {
position:relative;
top:1px;
}
.button_cat_erreur_v {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
}
.button_cat_erreur_v:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.button_cat_erreur_v:active {
position:relative;
top:1px;
}
.button_cat_erreur_v_o {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:12px 15px;
text-decoration:none;
}
.but_conserver_popup:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-info);
}
.but_conserver_popup:active {
position:relative;
top:1px;
}
.button_cat_erreur_v_o:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.button_cat_erreur_v_o:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-info);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-info);
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-border-strong)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-border-strong)',GradientType=0);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur_vert:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-border-strong)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-border-strong)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-border-strong);
}
.button_cat_erreur_vert:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert_o {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-info);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-info);
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-border-strong)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-border-strong) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-border-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-border-strong)',GradientType=0);
background-color:var(--color-info);
border:1px solid var(--color-border-strong);
display:inline-block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-border-strong);
}
.button_cat_erreur_vert_o:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-border-strong)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-border-strong) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-border-strong) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-border-strong)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-border-strong);
}
.button_cat_erreur_vert_o:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert_v {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
}
.button_cat_erreur_vert_v:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.button_cat_erreur_vert_v:active {
position:relative;
top:1px;
}
.button_cat_erreur_vert_v_o {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
box-shadow:inset 0px 1px 0px 0px var(--color-green-pale);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-amber);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:11px 42px;
text-decoration:none;
}
.button_cat_erreur_vert_v_o:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.button_cat_erreur_vert_v_o:active {
position:relative;
top:1px;
}
.butt_error_var_an {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-soft)), color-stop(1, var(--color-orange-warm)));
background:-moz-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-o-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-ms-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-soft)', endColorstr='var(--color-orange-warm)',GradientType=0);
background-color:var(--color-orange-soft);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_var_an:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-warm)), color-stop(1, var(--color-orange-soft)));
background:-moz-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-o-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-ms-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-warm)', endColorstr='var(--color-orange-soft)',GradientType=0);
background-color:var(--color-orange-warm);
}
.butt_error_var_an:active {
position:relative;
top:1px;
}
.butt_error2_var_an {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_var_an:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.butt_error2_var_an:active {
position:relative;
top:1px;
}
.butt_error_absence_ms {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-soft)), color-stop(1, var(--color-orange-warm)));
background:-moz-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-o-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-ms-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-soft)', endColorstr='var(--color-orange-warm)',GradientType=0);
background-color:var(--color-orange-soft);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_absence_ms:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-warm)), color-stop(1, var(--color-orange-soft)));
background:-moz-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-o-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-ms-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-warm)', endColorstr='var(--color-orange-soft)',GradientType=0);
background-color:var(--color-orange-warm);
}
.butt_error_absence_ms:active {
position:relative;
top:1px;
}
.butt_error2_absence_ms {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_absence_ms:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.butt_error2_absence_ms:active {
position:relative;
top:1px;
}
.butt_error_ventilation {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-soft)), color-stop(1, var(--color-orange-warm)));
background:-moz-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-o-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-ms-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-soft)', endColorstr='var(--color-orange-warm)',GradientType=0);
background-color:var(--color-orange-soft);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_ventilation:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-warm)), color-stop(1, var(--color-orange-soft)));
background:-moz-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-o-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-ms-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-warm)', endColorstr='var(--color-orange-soft)',GradientType=0);
background-color:var(--color-orange-warm);
}
.butt_error_ventilation:active {
position:relative;
top:1px;
}
.butt_error2_ventilation {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_ventilation:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.butt_error2_ventilation:active {
position:relative;
top:1px;
}
.butt_error_autre {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-soft)), color-stop(1, var(--color-orange-warm)));
background:-moz-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-o-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-ms-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-soft)', endColorstr='var(--color-orange-warm)',GradientType=0);
background-color:var(--color-orange-soft);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_autre:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-warm)), color-stop(1, var(--color-orange-soft)));
background:-moz-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-o-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-ms-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-warm)', endColorstr='var(--color-orange-soft)',GradientType=0);
background-color:var(--color-orange-warm);
}
.butt_error_autre:active {
position:relative;
top:1px;
}
.butt_error2_autre {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_autre:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.butt_error2_autre:active {
position:relative;
top:1px;
}
.butt_error_valhn {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
box-shadow:inset 0px 1px 0px 0px var(--color-orange-tint);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-soft)), color-stop(1, var(--color-orange-warm)));
background:-moz-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-o-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:-ms-linear-gradient(top, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
background:linear-gradient(to bottom, var(--color-orange-soft) 5%, var(--color-orange-warm) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-soft)', endColorstr='var(--color-orange-warm)',GradientType=0);
background-color:var(--color-orange-soft);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-gold-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-gold-deep);
}
.butt_error_valhn:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-orange-warm)), color-stop(1, var(--color-orange-soft)));
background:-moz-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-webkit-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-o-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:-ms-linear-gradient(top, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
background:linear-gradient(to bottom, var(--color-orange-warm) 5%, var(--color-orange-soft) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-orange-warm)', endColorstr='var(--color-orange-soft)',GradientType=0);
background-color:var(--color-orange-warm);
}
.butt_error_valhn:active {
position:relative;
top:1px;
}
.butt_error2_valhn {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:8px 17px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.butt_error2_valhn:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.butt_error2_valhn:active {
position:relative;
top:1px;
}
.but_annuler_popup {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-red-pale);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-red-pale);
box-shadow:inset 0px 1px 0px 0px var(--color-red-pale);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-red-strong)), color-stop(1, var(--color-red-strong)));
background:-moz-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:-o-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:-ms-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-red-strong)', endColorstr='var(--color-red-strong)',GradientType=0);
background-color:var(--color-red-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-red-hover);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 19px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-red-shadow);
}
.but_annuler_popup:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-red-strong)), color-stop(1, var(--color-red-strong)));
background:-moz-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:-o-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:-ms-linear-gradient(top, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
background:linear-gradient(to bottom, var(--color-red-strong) 5%, var(--color-red-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-red-strong)', endColorstr='var(--color-red-strong)',GradientType=0);
background-color:var(--color-red-strong);
}
.but_annuler_popup:active {
position:relative;
top:1px;
}
.but_conserver_popup {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-info);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-info);
box-shadow:inset 0px 1px 0px 0px var(--color-info);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-info);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-info);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-brand-secondary-hover);
}
.but_conserver_popup:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-info)), color-stop(1, var(--color-info)));
background:-moz-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-webkit-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-o-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:-ms-linear-gradient(top, var(--color-info) 5%, var(--color-info) 100%);
background:linear-gradient(to bottom, var(--color-info) 5%, var(--color-info) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-info)', endColorstr='var(--color-info)',GradientType=0);
background-color:var(--color-info);
}
.but_conserver_popup:active {
position:relative;
top:1px;
}
.but_corriger_popup {
-moz-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
-webkit-box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
box-shadow:inset 0px 1px 0px 0px var(--color-green-strong);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
-moz-border-radius: var(--radius-md);
-webkit-border-radius: var(--radius-md);
border-radius: var(--radius-md);
border:1px solid var(--color-green-strong);
display:inline-block;
cursor:pointer;
color:var(--color-white);
font-family: var(--font-family-base);
font-size:13px;
font-weight:bold;
padding:6px 19px;
text-decoration:none;
text-shadow:0px 1px 0px var(--color-green-strong);
}
.but_corriger_popup:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-green-strong)), color-stop(1, var(--color-green-strong)));
background:-moz-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-webkit-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-o-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:-ms-linear-gradient(top, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
background:linear-gradient(to bottom, var(--color-green-strong) 5%, var(--color-green-strong) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-green-strong)', endColorstr='var(--color-green-strong)',GradientType=0);
background-color:var(--color-green-strong);
}
.but_corriger_popup:active {
position:relative;
top:1px;
}
#popupVarAnn{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupVarAnn_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupValHN{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupValHN_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupAbsenceMS{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupAbsenceMS_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupVentilation{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupVentilation_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
#popupAutre{
position:fixed;
/*HACK IE6*/
_position:absolute;
display:none;
min-height:300px;
width:450px;
background-color: var(--color-gray-100);
-moz-border-radius: var(--radius-lg);
-webkit-border-radius: var(--radius-lg);
border-radius: var(--radius-lg);
border:solid 1px var(--color-gray-300);
padding-bottom:10px;
}
.popupAutre_content{
font-size:13px;
text-align:center;
margin-left:0px;
}
.plus_minus {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus:hover {
color: var(--color-info);
}
.plus_minus2 {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus2:hover {
color: var(--color-info);
}
.plus_minusedit {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minusedit:hover {
color: var(--color-info);
}
.plus_minusedit_s {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minusedit_s:hover {
color: var(--color-info);
}
.plus_minusactif_s {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minusactif_s:hover {
color: var(--color-info);
}
.plus_minus3 {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus3:hover {
color: var(--color-info);
}
.plus_minus4 {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minus4:hover {
color: var(--color-info);
}
.plus_minussupp {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minussupp_s {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
cursor: pointer;
}
.plus_minussupp_s_o {
color: var(--color-brand-primary-hover);
-webkit-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 100ms cubic-bezier(0.42, 0, 0.58, 1);
}
.etiquette_t_left{
float:left;
text-align: left;
width: 60%;
}
.etiquette_t_left2{
float:left;
text-align: left;
width: 70%;
}
.etiquette_t_left3{
float:left;
text-align: left;
width: 90%;
}
.etiquette_titre{
float:left;
text-align: center;
width: 100%;
}
#md1, #md2, #md1_e, #md2_e{
width: 85%;
}
#select_profil{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: right;
z-index: var(--z-header-chip);
width: 150px;
height: 15px;
cursor: pointer;
margin-top: -25px;
margin-right: 10px;
padding: 5px;
border: 1px solid var(--color-white);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs);
font: normal 12px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background-color: var(--color-gray-100);
-webkit-box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
-webkit-transition: 0.5s; /* Safari */
transition: 0.1s;
}
/* =============================================================================
SECTION 98 — SUSPECTÉS INUTILES
-----------------------------------------------------------------------------
Blocs déplacés depuis les sections 04, 05 ou ailleurs lors du rangement.
Validation : grep PHP/HTML + test navigateur avant suppression définitive.
============================================================================= */
/**
* .id_button — ancien style bouton connexion (gradient, voisin historique de
* #connexion et .id_button dans les anciennes maquettes).
* Réf. JS : library/js/gestion_id.js (~l.135) $(".id_button").click pour
* ouvrir/fermer #container_login_window si isLoginPopupMode().
* Marquage : aucune classe id_button dans les fichiers .php du dépôt au dernier
* contrôle ; le header non connecté utilise #connexion + .home_menu--public-cta.
* Risque : retirer ces règles sans ajuster le JS = handler mort ; sans impact
* visuel si aucun nœud .id_button n’existe.
*/
.id_button {
-moz-box-shadow: 0px 0px 2px 2px var(--color-gray-50);
-webkit-box-shadow: 0px 0px 2px 2px var(--color-gray-50);
box-shadow: 0px 0px 2px 2px var(--color-gray-50);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--fo-cta-fill-start)), color-stop(1, var(--fo-cta-fill-end)));
background:-moz-linear-gradient(top, var(--fo-cta-fill-start) 5%, var(--fo-cta-fill-end) 100%);
background:-webkit-linear-gradient(top, var(--fo-cta-fill-start) 5%, var(--fo-cta-fill-end) 100%);
background:-o-linear-gradient(top, var(--fo-cta-fill-start) 5%, var(--fo-cta-fill-end) 100%);
background:-ms-linear-gradient(top, var(--fo-cta-fill-start) 5%, var(--fo-cta-fill-end) 100%);
background:linear-gradient(to bottom, var(--fo-cta-fill-start) 5%, var(--fo-cta-fill-end) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-brand-secondary)', endColorstr='var(--color-brand-secondary)',GradientType=0);
background-color: var(--fo-cta-fill-start);
-moz-border-radius: var(--radius-sm);
-webkit-border-radius: var(--radius-sm);
border-radius: var(--radius-sm);
border:1px solid var(--color-info);
display:inline-block;
cursor:pointer;
color:var(--fo-cta-text-color);
font-family:var(--font-family-base);
font-size:15px;
font-weight:bold;
padding-top: 5px;
padding-bottom: 7px;
padding-left: 32px;
padding-right:10px;
text-decoration:none;
}
.id_button:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, var(--color-brand-secondary-hover)), color-stop(1, var(--color-brand-secondary-hover)));
background:-moz-linear-gradient(top, var(--color-white) 5%, var(--color-white) 100%);
background:-webkit-linear-gradient(top, var(--color-white) 5%, var(--color-white) 100%);
background:-o-linear-gradient(top, var(--color-white) 5%, var(--color-white) 100%);
background:-ms-linear-gradient(top, var(--color-white) 5%, var(--color-white) 100%);
background:linear-gradient(to bottom, var(--color-white) 5%, var(--color-white) 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--color-brand-secondary-hover)', endColorstr='var(--color-brand-secondary-hover)',GradientType=0);
background-color:var(--color-white);
color:var(--color-info);
}
.id_button:active {
position:relative;
top:1px;
}
/**
* .button_id — bouton vert type « valider » historiquement associé au bloc login.
* Aucune occurrence dans les fichiers .php du projet (grep) ; pas de sélecteur JS
* dédié trouvé hors feuilles de style. Suspect : remplacé par les CTA §17 ou
* markup sans cette classe.
*/
.button_id {
margin-top: 25px;
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
width: 175px;
cursor: pointer;
padding: 10px 20px;
border: 1px solid var(--color-success-dark);
-webkit-border-radius: var(--radius-pill);
border-radius: var(--radius-pill);
font: normal normal bold 16px/normal var(--font-family-base);
color: var(--overlay-white-90);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background: var(--color-success);
}
.button_id:hover {
background-color:var(--color-white);
color:var(--color-success);
}
/**
* #home_menu.home_menu--public #connexion — annule float/marge hérités de SECTION 17
* (#connexion) dans la barre « Mon espace » publique.
* Suspect : si le markup ou les bases §17 n’imposent plus de float sur #connexion
* dans ce contexte, ces déclarations sont redondantes.
*/
#home_menu.home_menu--public #connexion {
float: none;
margin: 0;
}
/**
* Survol des liens menu header (#h_accueil… #h_ratiospdf) — effet halo + couleur
* brand hover. Suspect : doublon partiel avec .home_menu_icon_link:hover ou règles
* plus spécifiques ailleurs ; valider FO/BO (ids présents dans divers.php).
*/
#h_accueil:hover,
#h_compte:hover,
#h_MesDocuments:hover,
#h_champs:hover,
#h_recap:hover,
#h_deco:hover,
#h_backoffice:hover,
#h_profilbo:hover,
#h_donnees:hover,
#h_exports:hover,
#h_emails:hover,
#h_modele:hover,
#h_ratiospdf:hover {
background: radial-gradient(circle, var(--color-white) 0%, var(--overlay-white-82) 58%, var(--overlay-white-20) 85%, var(--overlay-white-00) 100%);
box-shadow: 0 0 16px 2px var(--overlay-white-90);
color: var(--color-brand-primary-hover);
}
/**
* Ancienne SECTION 05 — puces multi/header (#etablissement*, #n_adherent) et
* choix de section multi/subheader (.nav_dual, .lien_nav_sh, #titre_nav…).
* Suspect : préfixes -webkit- / doublons de ombre, styles recouverts par inline
* ou par d’autres feuilles ; les ids/classes existent encore (grep .php).
* Déplacé en fin de fichier : ordre cascade modifié — tester parcours multi + popup section.
*/
#etablissement{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: right;
z-index: var(--z-header-chip);
width: 150px;
height: 15px;
position: fixed;
cursor: pointer;
top: 55px;
right: 5px;
padding: 5px;
border: 1px solid var(--color-white);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs);
font: normal 12px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background-color: var(--color-gray-100);
-webkit-box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
-webkit-transition: 0.5s; /* Safari */
transition: 0.1s;
}
#etablissement_erreur{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: right;
z-index: var(--z-header-chip);
width: 150px;
height: 15px;
cursor: pointer;
padding: 5px;
border: 1px solid var(--color-white);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs);
font: normal 12px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background-color: var(--color-gray-100);
-webkit-box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
-webkit-transition: 0.5s; /* Safari */
transition: 0.1s;
}
#etablissement3{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: right;
z-index: var(--z-header-chip);
width: 150px;
height: 15px;
position: fixed;
cursor: pointer;
top: 55px;
right: 5px;
padding: 5px;
border: 1px solid var(--color-white);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs);
font: normal 12px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background-color: var(--color-gray-100);
-webkit-box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
-webkit-transition: 0.5s; /* Safari */
transition: 0.1s;
}
#n_adherent{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: right;
z-index: var(--z-header-under);
width: 150px;
height: 20px;
position: fixed;
cursor: default;
top: 5px;
right: 60px;
padding: 5px;
border: 1px solid var(--color-white);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs);
font: normal 15px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background-color: var(--color-gray-100);
-webkit-box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
}
/* --- Ex-05.2 Choix de section (popup) — multi/subheader.php (#popup_nav…) --- */
.nav_dual{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.nav_left{
width: 400px;
display: block;
text-align: center;
}
.nav_right{
width: 400px;
display: block;
text-align: center;
margin-left: auto;
margin-right: auto;
}
.lien_nav_sh{
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
width: 400px;
cursor: pointer;
right: 60px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
margin-bottom: 10px;
border: 1px solid var(--color-gray-100);
-webkit-border-radius: var(--radius-xs);
border-radius: var(--radius-xs);
font: normal 16px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
background-color: var(--color-white);
-webkit-box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
box-shadow: 0 0 20px 2px var(--overlay-frost-58) inset, 0 0 6px 2px var(--overlay-frost-58) ;
}
#btn_link_nav{
background-color: transparent;
border: 0;
cursor: pointer;
}
#btn_link_nav:hover {
color: var(--color-brand-primary-hover);
}
.nav_fields{
position: relative;
padding: 25px;
}
.nav_page_title{
font: normal 25px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
margin-left: 25px;
}
#titre_nav{
font: normal 35px/normal var(--font-family-base);
color: var(--color-brand-primary-hover);
}
/* =============================================================================
SECTION 99 — CONFIRMÉS INUTILES
-----------------------------------------------------------------------------
Règles validées comme non utilisées (références HTML/PHP supprimées,
doublons morts). Prêtes à être retirées du rendu ou archivées ; ne pas
compter sur leur ordre en cascade pour le site actif.
============================================================================= */