/* Here, the content of the common custom CSS defined into Home - Setup - Display - CSS*/
/* ==========================================================================
 THEME PERSONNALISÉ DOLIBARR - LEO CRM
 Optimisé et Nettoyé
 ========================================================================== */

/* --- 1. MASQUAGE ÉLÉMENTS SYSTÈME --- */

/* Masquer Version et Titre Login par défaut */
.aversion, 
a.login_table_title {
 display: none !important;
}

/* Masquer Logo Print (Zone centrale) */
div[title="Afficher page d'impression de la zone centrale"],
.clearboth {
 display: none !important;
}

/* --- 2. LAYOUT & SCROLL GLOBAL --- */

html, body {
 margin: 0;
 padding: 0;
 height: 100%;
 overflow-y: auto; /* Autorise le scroll global */
}

/* Menu haut : fixe en hauteur */
.tmenudiv {
 height: 60px;
 flex-shrink: 0;
}

/* Conteneurs principaux */
#id-right, #id-content, .content-wrapper {
 height: calc(100vh - 60px);
 overflow-y: auto;
}

/* --- 3. COULEURS & LABELS STATUS --- */

/* Classes manuelles */
.ancien_client {
 outline: 2px solid red;
 color: red !important;
}

/* Couleur Loupe Recherche Globale */
.fa-search {
 color: #6EC8C5 !important;
}

/* Lettre pour Prospect : P (Turquoise) */
.customer-back[title="Prospect"] {
 background: #6EC8C5 !important;
 color: #000;
 padding: 2px 8px;
}

/* Lettre pour Client : C (Bleu Avenelink) */
.customer-back[title="Client"] {
 background: #2D85A3 !important;
 color: #fff;
 padding: 2px 8px;
}

/* Lettre pour Fournisseur : F (Rouge) */
.customer-back[title="Fournisseur"] {
 background: #FF0000 !important;
 color: #fff;
 padding: 2px 8px;
}

/* --- 4. FORMULAIRES & SAISIE (TWEAKS) --- */

/* Heure : Palier 15 min uniquement */
select[id$="min"] option:not([value="0"]):not([value="00"]):not([value="15"]):not([value="30"]):not([value="45"]) {
 display: none;
}

/* Masquer Projets et Tâches (Sélecteurs avancés :has) */
.divsearchfield:has(select[name="search_projectid"]) { display: none !important; }

tr:has([name="projectid"]), div.form-group:has([name="projectid"]),
tr:has([name="taskid"]), div.form-group:has([name="taskid"]) {
 display: none !important;
 pointer-events: none; /* Sécurité anti-clic */
}

/* Renommer les Filtres (Placeholders) */
/* Commercial */
#select2-search_filtert-container .placeholder { visibility: hidden; position: relative; }
#select2-search_filtert-container .placeholder::after {
 content: "Commercial"; visibility: visible; position: absolute; left: 0;
 top: 50%; transform: translateY(-50%); color: #999;
}
/* Groupe */
#select2-usergroup-container .placeholder { visibility: hidden; position: relative; }
#select2-usergroup-container .placeholder::after {
 content: "Groupe"; visibility: visible; position: absolute; left: 0;
 top: 50%; transform: translateY(-50%); color: #999;
}
/* Raison Sociale */
#search_search_socid::placeholder { color: transparent !important; opacity: 0; }
.divsearchfield:has(#search_search_socid) { position: relative; }
.divsearchfield:has(#search_search_socid)::after {
 content: "Raison Sociale"; position: absolute; left: 32px;
 top: 50%; transform: translateY(-50%); color: #999; pointer-events: none; font-size: 13px;
}
.divsearchfield:has(#search_search_socid:focus)::after,
.divsearchfield:has(#search_search_socid:not(:placeholder-shown))::after { display: none; }

/* Menu "Tous" dans les listes */
ul[id*="search_filtert-results"] li:first-child,
ul[id*="usergroup-results"] li:first-child,
ul[id*="categ_search_categ_cus-results"] li:first-child {
 font-size: 0 !important; position: relative; min-height: 30px;
}
ul[id*="search_filtert-results"] li:first-child::after,
ul[id*="usergroup-results"] li:first-child::after,
ul[id*="categ_search_categ_cus-results"] li:first-child::after {
 content: "Tous"; font-size: 13px !important; position: absolute;
 left: 10px; top: 50%; transform: translateY(-50%);
 color: #444 !important; font-weight: bold; opacity: 1 !important;
}

/* --- 5. BOUTONS D'ACTION --- */

/* Bouton Rechercher (Loupe) -> Vert */
button[name="button_search"], .button_search {
 background-color: #6ea42d !important;
 border: 1px solid #5c8a26 !important;
 border-radius: 4px !important;
 padding: 0 15px !important; height: 32px !important;
 margin-left: 10px !important;
 box-shadow: 0 2px 4px rgba(0,0,0,0.15); transition: transform 0.1s;
}
button[name="button_search"] span, .button_search span { color: #ffffff !important; }
button[name="button_search"]:hover, .button_search:hover { transform: scale(1.05); cursor: pointer; }

/* Bouton + (Nouvel événement) -> Bleu #2D85A3 */
.btnTitlePlus {
 background-color: #2D85A3 !important;
 border: 1px solid #20657c !important;
 border-radius: 4px !important;
 padding: 0 !important; width: 34px !important; height: 32px !important;
 display: inline-flex !important; align-items: center; justify-content: center;
 box-shadow: 0 2px 4px rgba(0,0,0,0.2); margin-left: 10px !important;
 text-decoration: none !important; transition: transform 0.1s;
}
.btnTitlePlus span.fa-plus-circle { color: #ffffff !important; font-size: 16px !important; }
.btnTitlePlus:hover { background-color: #26738d !important; transform: scale(1.05); }

/* --- 6. HEADER (TOP MENU) DESIGN --- */

#id-top {
 box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
 border-bottom: none !important;
 background-color: #2e85a3 !important;
 position: fixed !important; /* Sticky Header */
 top: 0; left: 0; width: 100%;
 z-index: 10001 !important;
}

/* Onglets */
li.tmenu, li.tmenusel { margin: 0 3px !important; vertical-align: top !important; min-width: 70px; }
li.tmenu .tmenucenter, li.tmenusel .tmenucenter {
 display: block !important; text-align: center !important;
 margin-top: 8px !important; margin-bottom: 12px !important;
 padding: 5px 8px !important; height: auto !important;
 border-radius: 12px !important; background-image: none !important;
 transition: all 0.2s ease-in-out !important;
}

/* Suppression décorations Eldy */
li.tmenu::after, li.tmenu::before, li.tmenusel::after, li.tmenusel::before,
.tmenuimage::after, .tmenulabel::after { content: none !important; display: none !important; border: none !important; }

/* Hover Onglets */
li.tmenu:not(.tmenucompanylogo):not(.tmenusel):hover .tmenucenter {
 background: rgba(255, 255, 255, 0.15) !important;
 transform: translateY(-2px) !important;
}
li.tmenu:not(.tmenucompanylogo):hover .tmenuimage span, 
li.tmenu:not(.tmenucompanylogo):hover .tmenuimage i,
li.tmenu:not(.tmenucompanylogo):hover .mainmenuaspan {
 color: #ffffff !important; text-shadow: 0 0 8px rgba(255,255,255,0.5) !important;
}

/* Onglet Actif */
li.tmenusel .tmenucenter {
 background: #ffffff !important; box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
}
li.tmenusel .tmenuimage span, li.tmenusel .tmenuimage i, li.tmenusel .mainmenuaspan {
 color: #2D85A3 !important; font-weight: 700 !important;
}

/* Logo Entreprise (Zoom & Ombre) */
li.tmenucompanylogo .tmenucenter { margin: 0 !important; background: transparent !important; padding: 0 10px !important; }
.tmenucompanylogo img {
 height: 42px !important; width: auto !important;
 transform: scale(1.1); transform-origin: center left;
 filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2)); transition: transform 0.3s ease;
}
.tmenucompanylogo img:hover { transform: scale(1.15); }

/* Droite Header (Login block) */
.login_block a:hover i, .login_block a:hover span { color: #6EC8C5 !important; transition: all 0.2s; }
.userimg img.userphoto {
 border-radius: 50% !important; border: 2px solid rgba(255,255,255,0.2) !important;
 width: 35px !important; height: 35px !important; transition: all 0.3s ease;
}
.userimg:hover img.userphoto { border-color: #6EC8C5 !important; transform: scale(1.1) rotate(5deg); }

/* --- 7. DROPDOWNS (RECHERCHE, AJOUT RAPIDE, MARQUE-PAGES) --- */

/* Style global des dropdowns */
.dropdown-search, .dropdown-menu:has(.dropdown-quickadd-list), .dropdown-menu:has(.bookmark-header) {
 padding: 15px !important; border-radius: 12px !important;
 border: 1px solid #e0e0e0 !important; box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
}
.dropdown-search { min-width: 520px !important; }
.dropdown-menu:has(.dropdown-quickadd-list) { min-width: 380px !important; overflow: hidden !important; }
.dropdown-menu:has(.bookmark-header) { min-width: 400px !important; }

/* Champs de recherche internes */
#top-global-search-input, #top-bookmark-search-input {
 width: 100% !important; padding: 10px 15px !important;
 border-radius: 8px !important; border: 2px solid #eee !important;
 background-color: #fcfcfc !important; box-sizing: border-box !important;
 transition: border-color 0.3s;
}
#top-global-search-input:focus, #top-bookmark-search-input:focus { border-color: #2D85A3 !important; outline: none; }
#top-global-search-input { height: 45px !important; }
#top-bookmark-search-input { height: 40px !important; font-size: 13px !important; }

/* Items des listes (Tuiles & Lignes) */
.global-search-item, .quickadd-item, .bookmark-item, .top-menu-dropdown-link {
 border-radius: 8px !important; background: #ffffff !important;
 border: 1px solid #f0f0f0 !important; color: #444 !important;
 transition: all 0.2s ease-in-out !important;
}
.global-search-item { width: calc(50% - 6px) !important; padding: 12px !important; display: flex !important; align-items: center !important; }
.quickadd-item { width: 100% !important; padding: 12px 15px !important; display: flex !important; align-items: center !important; }

/* Hover effets */
.global-search-item:hover, .quickadd-item:hover, .bookmark-item:hover {
 background-color: #f9f9f9 !important; border-color: #2D85A3 !important;
 color: #2D85A3 !important; box-shadow: 0 4px 8px rgba(45, 133, 163, 0.1) !important;
}
.global-search-item:hover .pictofixedwidth, .quickadd-item:hover span { color: #6EC8C5 !important; }

/* Grilles et Layouts Dropdowns */
.search-dropdown-header, .bookmark-header { width: 100% !important; margin: 0 !important; }
.dropdown-global-search-button-list { display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; gap: 10px !important; margin-top: 10px !important; }
.dropdown-quickadd-list { display: flex !important; flex-direction: column !important; gap: 8px !important; }
.bookmark-footer { display: flex !important; flex-direction: column !important; gap: 8px !important; border-bottom: 1px solid #f0f0f0 !important; margin-bottom: 10px !important; }
#dropdown-bookmarks-list { display: flex !important; flex-direction: column !important; gap: 6px !important; }
#top-bookmark-search-nothing-found { display: block !important; padding: 20px !important; text-align: center !important; color: #999 !important; font-style: italic !important; }

/* Menu Utilisateur (User Dropdown) */
.dropdown-menu:has(.user-header) { border-radius: 15px !important; padding: 0 !important; min-width: 320px !important; overflow: hidden !important; }
.user-header { background: linear-gradient(135deg, #2D85A3 0%, #1e5a6f 100%) !important; padding: 20px !important; text-align: center !important; color: #ffffff !important; }
.user-header img.photouserphoto { width: 80px !important; height: 80px !important; border-radius: 50% !important; border: 3px solid rgba(255, 255, 255, 0.3) !important; object-fit: cover; }
.user-body { padding: 15px !important; max-height: 400px; overflow-y: auto; }
#topmenulogincompanyinfo-btn, #topmenuloginmoreinfo-btn { display: block !important; background: #f4f8fb !important; padding: 8px 12px !important; border-radius: 8px !important; color: #2D85A3 !important; font-weight: bold !important; margin-bottom: 5px !important; }
.user-footer { background: #f8fbfe !important; padding: 12px !important; border-top: 1px solid #eee !important; display: flex !important; justify-content: space-between !important; }
.button-top-menu-dropdown { padding: 8px 15px !important; border-radius: 8px !important; font-weight: bold !important; text-decoration: none !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; }
.user-footer .pull-left .button-top-menu-dropdown { background: #ffffff !important; color: #2D85A3 !important; border: 1px solid #2D85A3 !important; }
.user-footer .pull-left .button-top-menu-dropdown:hover { background: #2D85A3 !important; color: #ffffff !important; }
.user-footer .pull-right .button-top-menu-dropdown { background: #fff5f5 !important; color: #e74c3c !important; border: 1px solid #fed7d7 !important; }
.user-footer .pull-right .button-top-menu-dropdown:hover { background: #e74c3c !important; color: #ffffff !important; }
.user-header .fa-star { color: #f1c40f !important; margin-right: 5px; }

/* --- 8. WIDGETS ACCUEIL --- */

.box-flex-container { gap: 20px !important; padding: 10px !important; }

/* Cartes Info (Haut de page) */
.info-box {
 background-color: #ffffff !important; border: 1px solid #e0e0e0 !important;
 border-radius: 12px !important; box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important;
 overflow: hidden !important; transition: all 0.3s ease-in-out !important;
}
.info-box:hover { transform: translateY(-5px) !important; border-color: #2D85A3 !important; box-shadow: 0 15px 30px rgba(45, 133, 163, 0.15) !important; }

/* Icones & Textes Cartes */
.info-box-icon, .bg-infobox-action, .bg-infobox-project, .bg-infobox-expensereport {
 background-color: #f4f8fb !important; color: #2D85A3 !important; border-right: none !important;
 border-top-left-radius: 12px !important; border-bottom-left-radius: 12px !important;
}
.info-box-title { text-transform: uppercase !important; font-size: 10px !important; font-weight: 700 !important; color: #999 !important; letter-spacing: 1px !important; }
.info-box .info-box-text, .info-box .info-box-number, .info-box a { color: #333 !important; font-weight: 600 !important; text-decoration: none !important; }
.info-box a:hover { color: #2D85A3 !important; }

/* Badges Cartes */
.info-box .badge { border-radius: 10px !important; padding: 3px 8px !important; font-size: 10px !important; border: none !important; }
.info-box .badge-info { background-color: #6EC8C5 !important; color: white !important; }
.info-box .badge-warning { background-color: #fff0f0 !important; color: #d63031 !important; border: 1px solid #fab1a0 !important; }

/* Météo */
.info-box-weather {
 background: linear-gradient(135deg, #2D85A3 0%, #6EC8C5 100%) !important; color: white !important;
 border: none !important; border-radius: 12px !important;
}
.info-box-weather .info-box-title, .info-box-weather .info-box-number, .info-box-weather .progress-description, .info-box-weather .fa {
 color: white !important; text-shadow: none !important;
}
.info-box-weather .info-box-icon { background: transparent !important; color: white !important; }

/* Listes / Tableaux Widgets */
.box {
 background-color: #ffffff !important; border: 1px solid #e0e0e0 !important;
 border-radius: 12px !important; box-shadow: 0 4px 10px rgba(0,0,0,0.03) !important;
 margin-bottom: 20px !important; overflow: hidden !important; padding: 0 !important;
 transition: border-color 0.3s ease !important;
}
.box:hover { border-color: #2D85A3 !important; }
.box .divboxtable, .box table, .box table.boxtable { border: none !important; margin: 0 !important; padding: 0 !important; width: 100% !important; box-shadow: none !important; border-collapse: collapse !important; }

/* Titres Widgets */
.box_titre { background-color: #f4f8fb !important; border-bottom: 1px solid #dcebf0 !important; height: 45px !important; border-top: none !important; }
.box_titre th { color: #2D85A3 !important; font-family: sans-serif !important; font-size: 11px !important; font-weight: 800 !important; text-transform: uppercase !important; padding: 0 15px !important; border: none !important; }
.box_titre .fas, .box_titre .far { color: #a0a0a0 !important; }
.box_titre .fas:hover { color: #2D85A3 !important; }

/* Contenu Widgets */
.box table.boxtable tr.oddeven { background-color: #ffffff !important; border-bottom: 1px solid #f0f0f0 !important; transition: background-color 0.2s !important; }
.box table.boxtable tr.oddeven:nth-child(even) { background-color: #fafafa !important; }
.box table.boxtable tr.oddeven:hover { background-color: #f0f7f9 !important; }
.box td { padding: 10px 15px !important; border: none !important; }
.box a, .box td { color: #444 !important; font-size: 13px !important; text-decoration: none !important; font-weight: 500 !important; }
.box a:hover { color: #2D85A3 !important; }

/* Icones Widgets */
.box td .fas, .box td .far, .box td .fa { color: #2D85A3 !important; opacity: 0.9 !important; width: 16px !important; text-align: center !important; }
.box td .fa-exclamation-triangle { color: #ff9f43 !important; }
.boxclose .fa-times { color: #e74c3c !important; } /* Croix fermeture */
.boxhandle.fa-arrows-alt { color: #6EC8C5 !important; } /* Drag */
#idsubimgbookmarks.fa-star { color: #f1c40f !important; } /* Favori */
#idsubimglastrssinfos.fa-external-link-alt { color: #2D85A3 !important; } /* RSS */

/* --- 9. MENU GAUCHE & NAVIGATION --- */

div.vmenu { padding: 5px 0 !important; width: 95% !important; }
.blockvmenu { border: none !important; margin: 0 0 2px 0 !important; padding: 0 !important; }
.menu_top, .menu_end { display: none !important; }

/* Titres sections gauche */
.menu_titre a.vmenu {
 display: flex !important; align-items: center !important; padding: 6px 10px !important;
 margin: 2px 5px !important; border-radius: 6px !important;
 background-color: #f4f8fb !important; color: #2D85A3 !important;
 font-weight: 800 !important; font-size: 12px !important; text-transform: uppercase !important;
 text-decoration: none !important; white-space: nowrap !important;
}
.menu_titre .fa, .menu_titre .fas, .menu_titre .far { width: 20px !important; text-align: center !important; margin-right: 8px !important; font-size: 14px !important; color: #2D85A3 !important; }
.menu_titre a.vmenu:hover { background-color: #2D85A3 !important; color: #ffffff !important; }
.menu_titre a.vmenu:hover .fa, .menu_titre a.vmenu:hover .fas, .menu_titre a.vmenu:hover .far { color: #ffffff !important; }

/* Liens menu gauche */
div.id-left, .side-nav { text-align: left !important; }
a.vsmenu { text-decoration: none !important; position: relative !important; transition: all 0.2s ease-out !important; }
a.vsmenu:hover { color: #2D85A3 !important; left: 5px !important; background-color: transparent !important; }

/* Fixation Header & Contenu */
#body_main, .fiche, .active-scroll { margin-top: 65px !important; }
#id-left, .side-nav { padding-top: 25px !important; top: 0 !important; z-index: 900 !important; height: calc(100vh - 65px) !important; }
.pagination, .tabs, .tabsElem, .div-table-responsive { position: relative; z-index: 10; }

/* --- 10. AGENDA (NAVIGATION) --- */

.navmode {
 background-color: #f4f8fb !important; padding: 6px !important;
 border-radius: 12px !important; display: inline-flex !important;
 align-items: flex-end !important; border: 1px solid #e0e0e0 !important;
}

/* Boutons de vue */
a.btnTitle:not(.btnTitlePlus) {
 display: flex !important; flex-direction: column !important; align-items: center !important;
 justify-content: center !important; padding: 8px 10px !important; margin: 0 2px !important;
 border-radius: 10px !important; background: transparent !important; border: none !important;
 color: #555 !important; text-decoration: none !important; transition: all 0.2s ease !important;
 min-width: 80px !important;
}
a.btnTitle:not(.btnTitlePlus) .imgforviewmode { font-size: 16px !important; margin-bottom: 4px !important; color: #2D85A3 !important; }
a.btnTitle:not(.btnTitlePlus) .btnTitle-label { font-size: 10px !important; text-transform: uppercase !important; font-weight: 700 !important; color: inherit !important; }
a.btnTitle:not(.btnTitlePlus):hover { background-color: rgba(45, 133, 163, 0.08) !important; }

/* Bouton actif */
a.btnTitleSelected { background-color: #2D85A3 !important; box-shadow: 0 3px 8px rgba(45, 133, 163, 0.3) !important; }
a.btnTitleSelected, a.btnTitleSelected .imgforviewmode, a.btnTitleSelected .btnTitle-label, a.btnTitleSelected span { color: #ffffff !important; }

/* --- 11. LOGIN PAGE (DESKTOP) --- */

body.bodylogin {
 font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
 position: relative; backdrop-filter: blur(3px);
}
body.bodylogin::before {
 content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
 background: rgba(20, 30, 40, 0.5); z-index: -1;
}
body.bodylogin .login_vertical_align { display: flex !important; justify-content: center; align-items: center; height: 100vh !important; padding: 20px !important; box-sizing: border-box; }
body.bodylogin .login_center { width: 100% !important; max-width: 420px !important; }
body.bodylogin .login_table {
 background: #ffffff !important; border: none !important; border-radius: 16px !important;
 box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important; padding: 40px !important;
 display: flex !important; flex-direction: column !important; margin: 0 auto !important;
}

/* Logo Login */
body.bodylogin #login_left { float: none !important; text-align: center !important; margin-bottom: 30px !important; width: 100% !important; }
body.bodylogin #img_logo {
 max-height: 80px !important; width: auto !important;
 transform: scale(1.5); /* Ajusté pour éviter flou extrême */
 margin-top: 10px; margin-bottom: 10px;
 filter: drop-shadow(0 4px 6px rgba(0,0,0,0.1));
}

/* Inputs Login */
body.bodylogin #login_line1, body.bodylogin #login_right, body.bodylogin .tagtable, body.bodylogin .trinputlogin { display: block !important; width: 100% !important; padding: 0 !important; margin: 0 !important; border: none !important; }
body.bodylogin .trinputlogin { margin-bottom: 20px !important; }
body.bodylogin .tdinputlogin {
 display: flex !important; align-items: center !important; background-color: #f4f6f9 !important;
 border: 2px solid transparent !important; border-radius: 12px !important; padding: 5px 15px !important;
 transition: all 0.3s ease !important;
}
body.bodylogin .tdinputlogin:focus-within { background-color: #ffffff !important; border-color: #2D85A3 !important; box-shadow: 0 0 0 4px rgba(45, 133, 163, 0.15) !important; }
body.bodylogin .tdinputlogin .fa { color: #a0aec0 !important; font-size: 1.1rem !important; margin-right: 15px !important; width: 20px !important; text-align: center !important; }

/* Protection Inputs (Uniquement login) */
body.bodylogin input[type="text"], body.bodylogin input[type="password"] {
 border: none !important; background: transparent !important; outline: none !important;
 box-shadow: none !important; font-size: 15px !important; color: #2d3748 !important;
 width: 100% !important; height: 45px !important; font-weight: 500 !important;
}

/* Bouton Connexion */
body.bodylogin #login_line2 { text-align: center !important; padding-top: 10px !important; }
body.bodylogin input[type="submit"] {
 background: linear-gradient(135deg, #2D85A3 0%, #1a5c72 100%) !important;
 border: none !important; color: #ffffff !important; font-size: 16px !important; font-weight: 700 !important;
 text-transform: uppercase !important; letter-spacing: 0.5px !important; padding: 15px 0 !important;
 width: 100% !important; border-radius: 50px !important; cursor: pointer !important;
 box-shadow: 0 10px 20px rgba(45, 133, 163, 0.3) !important; transition: all 0.3s ease !important;
 margin-bottom: 20px !important;
}
body.bodylogin input[type="submit"]:hover { transform: translateY(-2px) !important; box-shadow: 0 15px 25px rgba(45, 133, 163, 0.4) !important; }

/* Liens et Captcha */
body.bodylogin .alogin { color: #718096 !important; font-size: 14px !important; text-decoration: none !important; transition: color 0.2s !important; }
body.bodylogin .alogin:hover { color: #2D85A3 !important; text-decoration: underline !important; }
body.bodylogin #securitycode { width: 100% !important; }
body.bodylogin .tdinputlogin img { margin-left: 10px !important; border-radius: 4px !important; }

/* ==========================================================================
 ZONE RESPONSIVE & MOBILE (REGROUPÉ)
 ========================================================================== */

@media (max-width: 768px) {

 /* --- A. AGENDA COMPACT --- */
 .navmode { padding: 4px !important; border-radius: 8px !important; display: flex !important; flex-wrap: wrap !important; justify-content: center !important; }
 a.btnTitle:not(.btnTitlePlus) { min-width: 40px !important; height: 40px !important; padding: 0 !important; margin: 2px !important; flex-direction: row !important; }
 a.btnTitle:not(.btnTitlePlus) .btnTitle-label { display: none !important; }
 a.btnTitle:not(.btnTitlePlus) .imgforviewmode { font-size: 18px !important; margin-bottom: 0 !important; }
 a.btnTitleSelected { box-shadow: 0 2px 5px rgba(45, 133, 163, 0.2) !important; }

 /* --- B. MENU PRINCIPAL MOBILE --- */
 #id-top, #mainmenutd { display: block !important; height: 0 !important; position: static !important; visibility: visible !important; }
 .side-nav, #id-left, .login_block, .titre-page, .top-menu-extra { display: none !important; }
 ul.tmenu > li:nth-child(-n+2), li.tmenucompanylogo { display: none !important; }

 /* Barre navigation basse */
 ul.tmenu {
 display: flex !important; position: fixed !important; bottom: 0 !important; left: 0 !important;
 width: 100vw !important; height: 55px !important; background: #2D85A3 !important;
 border-top: 3px solid #6EC8C5 !important; box-shadow: 0 -4px 15px rgba(0,0,0,0.2) !important;
 z-index: 9999 !important; overflow-x: auto !important; overflow-y: hidden !important;
 margin: 0 !important; padding: 0 5px !important; list-style: none !important;
 }
 ul.tmenu::-webkit-scrollbar { display: none; }
 li.mainmenu_home { order: 1 !important; display: flex !important; }
 li.mainmenu_action { order: 2 !important; display: flex !important; }
 ul.tmenu > li { order: 3; flex: 0 0 60px !important; height: 55px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: transparent !important; border: none !important; position: relative; }
 ul.tmenu i, ul.tmenu span { color: #ffffff !important; font-size: 24px !important; background: none !important; border: none !important; }
 .tmenucenter, .tmenuimage { background: none !important; border: none !important; padding: 0 !important; margin: 0 !important; }
 .tmenulabel, .mainmenuaspan b, .mainmenuaspan span:not(.fas):not(.far) { display: none !important; }
 ul.tmenu > li.tmenusel::after { content: ''; position: absolute; bottom: 0; width: 20px; height: 3px; background: #6EC8C5; border-radius: 2px; }
 #body_main { padding-bottom: 70px !important; }

 /* --- C. MENU LATÉRAL GLISSANT --- */
 .side-nav {
 display: block !important; position: fixed !important; top: 0 !important; left: -250px !important;
 width: 230px !important; height: 100vh !important; background: transparent !important;
 z-index: 10000 !important; transition: left 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
 visibility: hidden !important; border: none !important; box-shadow: none !important; overflow: visible !important;
 }
 .side-nav:hover, .side-nav:focus-within { left: 0 !important; visibility: visible !important; background: #ffffff !important; box-shadow: 5px 0 20px rgba(0,0,0,0.2) !important; }
 
 /* Poignée Menu */
 .side-nav::after {
 content: "\f0c9" !important; font-family: "Font Awesome 5 Free" !important; font-weight: 900 !important;
 position: fixed !important; top: 50% !important; transform: translateY(-50%) !important; left: 0 !important;
 width: 40px !important; height: 45px !important; background: #2D85A3 !important; color: white !important;
 display: flex !important; align-items: center !important; justify-content: center !important;
 border-radius: 0 8px 8px 0 !important; box-shadow: 2px 0 5px rgba(0,0,0,0.2) !important;
 cursor: pointer !important; visibility: visible !important; z-index: 10001 !important; transition: opacity 0.2s !important;
 }
 .side-nav:hover::after, .side-nav:focus-within::after { opacity: 0 !important; pointer-events: none !important; }
 #id-left { display: block !important; width: 230px !important; background: #ffffff !important; border: none !important; }

 /* --- D. POPUP STATS --- */
 div[style*="position: fixed"][style*="bottom: 20px"] {
 bottom: 65px !important; right: 10px !important; left: 10px !important; width: auto !important;
 min-width: 0 !important; padding: 8px 15px !important; flex-direction: row !important;
 justify-content: space-around !important; gap: 15px !important; z-index: 9998 !important;
 }
 div[style*="position: fixed"][style*="bottom: 20px"] > div { border: none !important; margin: 0 !important; padding: 0 !important; width: auto !important; gap: 8px !important; }
 div[style*="position: fixed"][style*="bottom: 20px"] span { font-size: 0.8em !important; white-space: nowrap !important; }

 /* --- E. LOGIN MOBILE --- */
 body.bodylogin { background: #ffffff !important; overflow: hidden !important; height: 100% !important; width: 100% !important; position: fixed !important; }
 body.bodylogin::before, .login_table_title { display: none !important; }
 .login_vertical_align { padding: 0 20px !important; height: 100vh !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }
 .login_center, .login_table { width: 100% !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; }
 #img_logo { max-height: 80px !important; margin-bottom: 40px !important; }
 
 /* Inputs flex */
 .tdinputlogin { width: 100% !important; box-sizing: border-box !important; background: #f4f6f8 !important; border-radius: 12px !important; margin-bottom: 20px !important; padding: 10px 15px !important; border: 1px solid #e0e0e0 !important; display: flex !important; flex-flow: row wrap !important; align-items: center !important; }
 .tdinputlogin .fa { width: 30px !important; font-size: 1.4rem !important; color: #2D85A3 !important; text-align: center !important; margin-right: 10px !important; }
 input[type="text"], input[type="password"], .span-icon-security { flex-grow: 1 !important; width: auto !important; min-width: 50px !important; height: 45px !important; font-size: 19px !important; background: transparent !important; border: none !important; color: #333 !important; }
 .span-icon-security input { width: 100% !important; }
 
 /* Captcha sous-jacent */
 .tdinputlogin .nowrap.inline-block { flex-basis: 100% !important; width: 100% !important; display: flex !important; justify-content: center !important; align-items: center !important; margin-top: 10px !important; padding-top: 10px !important; border-top: 1px dashed #ddd !important; }
 #img_securitycode { height: 40px !important; width: auto !important; }
 
 input[type="submit"] { width: 100% !important; padding: 20px !important; font-size: 18px !important; font-weight: bold !important; border-radius: 12px !important; margin-top: 10px !important; }
 .alogin { margin-top: 25px !important; color: #999 !important; }
}

/* ==========================================================================
 DATEPICKER / CALENDRIER (JQUERY UI) - LEO CRM DESIGN
 ========================================================================== */

/* 1. CONTENEUR PRINCIPAL - ÉLARGI */
#ui-datepicker-div, .ui-datepicker {
 background-color: #ffffff !important;
 border: 1px solid #e0e0e0 !important;
 border-radius: 12px !important;
 box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
 padding: 5px !important; /* Ajout d'un peu de marge interne */
 font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
 
 /* C'est ici qu'on change la largeur */
 width: 20em !important; /* Passé de 17em à 20em pour faire entrer le dimanche */
 
 z-index: 9999 !important;
 box-sizing: border-box !important; /* Assure que le padding ne casse pas la largeur */
}

/* 2. EN-TÊTE (MOIS / ANNÉE) */
.ui-datepicker-header {
 background: #2D85A3 !important; /* Bleu Avenelink */
 border: none !important;
 border-radius: 12px 12px 0 0 !important; /* Arrondi haut */
 padding: 10px 0 !important;
 position: relative !important; /* Important pour les flèches absolues */
}

.ui-datepicker-title {
 color: #ffffff !important;
 line-height: 1.2 !important;
 display: flex !important;
 justify-content: center !important;
 align-items: center !important;
 gap: 5px !important;
 margin: 0 35px !important; /* Marge pour ne pas toucher les flèches */
}

/* Listes déroulantes */
.ui-datepicker-title select {
 background: rgba(255, 255, 255, 0.2) !important;
 border: none !important;
 border-radius: 4px !important;
 color: #ffffff !important;
 font-size: 13px !important;
 font-weight: 600 !important;
 height: 24px !important;
 cursor: pointer !important;
 padding: 0 5px !important;
}
.ui-datepicker-title select option { color: #333 !important; background: #fff !important; }

/* 3. FLÈCHES NAVIGATION (CORRIGÉES) */
.ui-datepicker-prev, .ui-datepicker-next {
 position: absolute !important;
 top: 50% !important;
 width: 30px !important;
 height: 30px !important;
 transform: translateY(-50%) !important; /* Centrage vertical parfait */
 background: transparent !important;
 border: none !important;
 cursor: pointer !important;
 
 /* CRITIQUE : Cacher le texte "Précédent/Suivant" */
 font-size: 0 !important; 
 color: transparent !important;
 text-indent: -9999px !important; /* Sécurité double */
 overflow: visible !important; /* Pour voir la flèche générée */
 
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 border-radius: 50% !important;
}

.ui-datepicker-prev { left: 5px !important; }
.ui-datepicker-next { right: 5px !important; }

/* Effet hover sur le rond de la flèche */
.ui-datepicker-prev:hover, .ui-datepicker-next:hover {
 background: rgba(255,255,255,0.2) !important;
}

/* On cache l'icône span par défaut de jQuery UI qui pose problème */
.ui-datepicker-prev span, .ui-datepicker-next span {
 display: none !important;
}

/* On recrée les flèches proprement sur le lien lui-même */
.ui-datepicker-prev::after, .ui-datepicker-next::after {
 font-family: monospace !important; /* Assure un rendu net */
 font-size: 16px !important;
 font-weight: bold !important;
 color: #ffffff !important;
 
 /* Réinitialisation des propriétés de texte cachées plus haut */
 text-indent: 0 !important;
 display: block !important;
 line-height: 1 !important;
}

.ui-datepicker-prev::after { content: "❮"; }
.ui-datepicker-next::after { content: "❯"; }

/* 4. TABLEAU DES JOURS */
.ui-datepicker-calendar {
 margin: 5px 0 10px 0 !important;
}

/* Jours de la semaine (Lu, Ma, Me...) */
.ui-datepicker-calendar th {
 color: #6EC8C5 !important; /* Turquoise (Rappel widgets) */
 font-size: 11px !important;
 font-weight: 800 !important;
 text-transform: uppercase !important;
 padding: 8px 0 !important;
}

/* Cellules des jours */
.ui-datepicker-calendar td {
 padding: 2px !important;
}

/* Le lien (le numéro du jour) */
.ui-datepicker-calendar td a.ui-state-default {
 background: transparent !important;
 border: none !important;
 color: #444 !important;
 text-align: center !important;
 font-weight: 500 !important;
 border-radius: 50% !important; /* Rond parfait */
 width: 30px !important;
 height: 30px !important;
 line-height: 30px !important;
 margin: 0 auto !important;
 transition: all 0.2s !important;
}

/* Force le tableau à prendre toute la largeur disponible */
.ui-datepicker-calendar {
 width: 100% !important; 
 margin: 5px 0 10px 0 !important;
 table-layout: fixed !important; /* Répartit les colonnes équitablement */
}

/* 5. ÉTATS INTERACTIFS */

/* Survol d'un jour */
.ui-datepicker-calendar td a.ui-state-default:hover {
 background-color: #f0f7f9 !important;
 color: #2D85A3 !important;
 font-weight: bold !important;
}

/* Aujourd'hui (Cercle Turquoise) */
.ui-datepicker-calendar td.ui-datepicker-today a.ui-state-default {
 background: transparent !important;
 border: 2px solid #6EC8C5 !important;
 color: #6EC8C5 !important;
 font-weight: bold !important;
}

/* Jour Sélectionné (Rond plein Bleu Avenelink) */
.ui-datepicker-calendar td.ui-datepicker-current-day a.ui-state-default,
.ui-datepicker-calendar td a.ui-state-active {
 background: #2D85A3 !important;
 color: #ffffff !important;
 box-shadow: 0 4px 8px rgba(45, 133, 163, 0.3) !important;
 border: none !important;
}

/* Autres mois (Grisé) */
.ui-datepicker-other-month .ui-state-default {
 opacity: 0.3 !important;
}

/* ==========================================================================
 AGENDA / VUE MOIS - CORRECTIF HAUTEUR & LISIBILITÉ
 ========================================================================== */
 
 /* ==========================================================================
 ETAPE 1 : DESIGN DES EN-TÊTES (JOURS DE LA SEMAINE)
 ========================================================================== */

/* On cible spécifiquement les cellules contenant les noms des jours */
.cal_month tr.liste_titre td.tdfordaytitle {
 background-color: #2D85A3 !important; /* Bleu Avenelink */
 color: #ffffff !important; /* Texte Blanc */
 font-family: 'Segoe UI', sans-serif !important;
 font-weight: 700 !important;
 font-size: 13px !important;
 text-transform: uppercase !important;
 letter-spacing: 1px !important;
 padding: 12px 0 !important; /* Aération verticale */
 border: none !important; /* On supprime les bordures grises par défaut */
 border-radius: 6px !important; /* Arrondis sur chaque jour */
 
 /* Astuce pour créer l'espace blanc entre les jours même dans un tableau */
 border-left: 3px solid #fff !important;
 border-right: 3px solid #fff !important;
 background-clip: padding-box !important;
}

/* On traite la petite colonne "#" (numéro de semaine) pour qu'elle soit discrète */
.cal_month tr.liste_titre td.center:first-child {
 background: transparent !important;
 color: #bbbbbb !important;
 font-size: 11px !important;
 border: none !important;
 vertical-align: middle !important;
}

/* ==========================================================================
 ETAPE 2 : DESIGN DES ÉVÉNEMENTS (LES CARTES) - VERSION COMPACTE
 ========================================================================== */

/* 1. ESPACEMENT & CONTENEUR */
div.event {
 margin: 0 0 6px 0 !important; /* Marge externe réduite */
 padding: 0 !important;
 background: transparent !important;
 border: none !important;
}

/* 2. LA CARTE (TABLEAU) */
table.cal_event {
 background-color: #ffffff !important;
 border-radius: 6px !important;
 box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
 
 border-left-width: 4px !important; /* Barre couleur un peu plus fine */
 border-top: 1px solid #f0f0f0 !important;
 border-right: 1px solid #f0f0f0 !important;
 border-bottom: 1px solid #f0f0f0 !important;
 
 width: 100% !important;
 margin: 0 !important;
 transition: all 0.2s ease !important;
}

table.cal_event:hover {
 transform: translateY(-1px) !important;
 box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
 z-index: 99 !important;
}

/* 3. CONTENU TEXTE (COMPACTÉ) */
td.cal_event {
 padding: 3px 6px !important; /* Padding très réduit (Haut/Bas 3px, Gauche/Droite 6px) */
 vertical-align: top !important;
 line-height: 1.1 !important; /* Interligne très serré */
}

/* 4. LE TITRE (HEURE + LIBELLÉ) */
a.cal_event_title {
 display: block !important;
 color: #2D85A3 !important;
 font-family: 'Segoe UI', sans-serif !important;
 font-weight: 700 !important;
 font-size: 11px !important; /* Légèrement plus petit */
 text-decoration: none !important;
 margin-bottom: 1px !important; /* Quasiment pas d'espace sous le titre */
 padding-bottom: 0 !important;
}

/* 5. NETTOYAGE VISUEL */
td.cal_event > span.fas.fa-user-cog {
 display: none !important;
}

/* 6. INFOS SECONDAIRES (UTILISATEUR / PROSPECT) */
td.cal_event a:not(.cal_event_title) {
 color: #666 !important;
 font-size: 10px !important; /* Police plus petite pour les infos secondaires */
 display: inline-block !important;
 margin-right: 5px !important;
 text-decoration: none !important;
 vertical-align: middle !important;
}

/* Icônes secondaires */
td.cal_event a .fas {
 color: #bbb !important;
 font-size: 9px !important;
 margin-right: 2px !important;
}

/* 7. AVATAR UTILISATEUR */
.userphotosmall {
 width: 16px !important; /* Avatar plus petit */
 height: 16px !important;
 border-radius: 50% !important;
 vertical-align: middle !important;
 border: 1px solid #eee !important;
 margin-right: 3px !important;
}

/* 8. PASTILLE DE STATUT */
td.cal_event_right_status {
 width: 8px !important;
 padding: 4px 2px 0 0 !important;
 vertical-align: top !important;
}

/* ==========================================================================
 ETAPE 3 : DESIGN DE LA POPUP (TOOLTIP AU SURVOL)
 ========================================================================== */

/* 1. LE CONTENEUR PRINCIPAL DE LA POPUP */
.ui-tooltip {
 background: #ffffff !important; /* Fond blanc pur */
 border: 1px solid #e0e0e0 !important; /* Bordure subtile */
 border-radius: 12px !important; /* Arrondis cohérents avec le reste */
 box-shadow: 0 10px 40px rgba(45, 133, 163, 0.25) !important; /* Belle ombre portée bleutée */
 color: #555 !important; /* Texte gris foncé */
 font-family: 'Segoe UI', sans-serif !important;
 font-size: 12px !important;
 line-height: 1.5 !important; /* Bonne lisibilité */
 padding: 0 !important; /* Le padding est géré dans le contenu */
 max-width: 400px !important; /* Assez large pour bien lire */
 z-index: 10000 !important; /* Toujours au-dessus de tout */
}

/* 2. LE CONTENU INTERNE */
.ui-tooltip-content {
 padding: 12px 15px !important;
 position: relative !important;
}

/* Petite barre de couleur en haut pour rappeler la marque */
.ui-tooltip-content::before {
 content: '';
 display: block;
 width: 100%;
 height: 4px;
 background: #2D85A3; /* Bleu Avenelink */
 position: absolute;
 top: 0;
 left: 0;
 border-radius: 12px 12px 0 0;
}

/* 3. MISE EN FORME DES DONNÉES (Style spécifique Dolibarr) */

/* Les titres de lignes (ex: "Client:", "Réf:", "Titre:") qui sont en balise */
.ui-tooltip-content b {
 color: #2D85A3 !important; /* Bleu Avenelink */
 font-weight: 700 !important;
 display: inline-block !important;
 margin-top: 4px !important;
}

/* Les icônes FontAwesome dans la popup */
.ui-tooltip-content .fas,
.ui-tooltip-content .fa {
 color: #6EC8C5 !important; /* Turquoise */
 margin-right: 6px !important;
}

/* Suppression des retours à la ligne inutiles si besoin */
.ui-tooltip-content br {
 content: "" !important;
 display: block !important;
 margin: 2px 0 !important;
}