/* ============================================================================ AXELIA — Habillage de l'interface Agora-Project Sidebar retractable + top bar + theme clair/sombre. Ce fichier est volontairement place hors de "app/" : une mise a jour d'Agora remplace "app", "docs" et "index.php", mais pas "custom/". Apres une mise a jour, seules les 2 lignes d'inclusion dans app/Common/VueStructure.php sont a remettre. Principe : aucune vue PHP n'est reecrite. On repositionne en CSS les elements existants (#headerBar, #headerBarRight...). Sous 1200px, on ne touche a rien : le menu mobile natif d'Agora continue de fonctionner. ============================================================================ */ :root{ /* --- Marque AXELIA --- */ --ax-navy-900:#0A213D; --ax-navy-800:#122E52; --ax-navy-700:#143A6C; --ax-blue:#032A65; --ax-cyan:#00C6D6; --ax-cyan-600:#0094C4; /* --- Gabarit --- */ --ax-sb-w:300px; --ax-sb-w-min:64px; --ax-top-h:50px; /* --- Surfaces, theme clair --- */ --ax-bg:#f4f6f9; --ax-surface:#ffffff; --ax-surface-2:#eef1f6; --ax-border:#e0e5ec; --ax-text:#1e2937; --ax-text-dim:#67717f; --ax-accent:var(--ax-cyan-600); --ax-accent-soft:rgba(0,148,196,.10); --ax-shadow:0 1px 3px rgba(16,32,56,.10); } html[data-theme="dark"]{ --ax-bg:#0d1117; --ax-surface:#161b22; --ax-surface-2:#1c232c; --ax-border:#2a323d; --ax-text:#e4ebf2; --ax-text-dim:#94a1b0; --ax-accent:var(--ax-cyan); --ax-accent-soft:rgba(0,198,214,.12); --ax-shadow:0 1px 3px rgba(0,0,0,.5); } /* ============================================================================ 1. THEME SOMBRE — reprend les regles de black.css en les conditionnant a l'attribut data-theme, pour un basculement cote client sans rechargement. white.css reste la base : ces selecteurs sont plus specifiques donc gagnent. ============================================================================ */ html[data-theme="dark"] body, html[data-theme="dark"] a, html[data-theme="dark"] .link {color:var(--ax-text);} html[data-theme="dark"] #htmlLightbox, html[data-theme="dark"] .objContent, html[data-theme="dark"] .miscContent, html[data-theme="dark"] .menuContext, html[data-theme="dark"] #menuMobileMain {background:var(--ax-surface);} html[data-theme="dark"] body {background:var(--ax-bg);} html[data-theme="dark"] .objLines .objContent {border-bottom:solid 1px var(--ax-border);} html[data-theme="dark"] .menuContext, html[data-theme="dark"] .tox-tinymce {border:solid 1px var(--ax-border)!important;} html[data-theme="dark"] .objLines .objContent:hover, html[data-theme="dark"] .menuContext .menuLine:hover, html[data-theme="dark"] .lineHover:hover, html[data-theme="dark"] .lineSelect {background:var(--ax-surface-2);} html[data-theme="dark"] .objContentSelected, html[data-theme="dark"] #objSelectMenu {background:#26303c!important;} html[data-theme="dark"] .tippy-box {background:var(--ax-surface)!important; color:var(--ax-text)!important; box-shadow:0 4px 16px rgba(0,0,0,.6)!important;} html[data-theme="dark"] a:hover, html[data-theme="dark"] .link:hover, html[data-theme="dark"] .linkSelect, html[data-theme="dark"] .menuContextLaunch:hover, html[data-theme="dark"] [onclick]:hover, html[data-theme="dark"] button:hover, html[data-theme="dark"] label:hover, html[data-theme="dark"] input:checked+label, html[data-theme="dark"] .optionSelect {color:var(--ax-cyan);} html[data-theme="dark"] .accessRead {color:#9ccaff;} html[data-theme="dark"] .accessWrite {color:#f8a8a8;} html[data-theme="dark"] .optionSelect, html[data-theme="dark"] .option:hover {border:solid 1px var(--ax-border);} html[data-theme="dark"] .optionSelect {background:var(--ax-surface-2);} html[data-theme="dark"] input:not([type=radio],[type=checkbox]), html[data-theme="dark"] textarea, html[data-theme="dark"] select, html[data-theme="dark"] button {background:var(--ax-surface-2); border:1px solid var(--ax-border); color:var(--ax-text);} html[data-theme="dark"] input:hover, html[data-theme="dark"] textarea:hover, html[data-theme="dark"] select:hover {box-shadow:0 0 4px rgba(0,0,0,.5);} html[data-theme="dark"] input:focus, html[data-theme="dark"] textarea:focus, html[data-theme="dark"] select:focus {box-shadow:0 0 0 2px var(--ax-accent-soft); border-color:var(--ax-cyan);} html[data-theme="dark"] button {background:var(--ax-surface-2);} html[data-theme="dark"] button:hover:not(.f-button) {background:#232c37;} html[data-theme="dark"] .tox-edit-area__iframe {background:var(--ax-surface-2)!important;} html[data-theme="dark"] .objMenuTab, html[data-theme="dark"] .objMenuMain, html[data-theme="dark"] fieldset {background:var(--ax-surface-2); border:solid 1px var(--ax-border);} html[data-theme="dark"] .objMenuTab {background:transparent;} html[data-theme="dark"] .objMenuTab:hover, html[data-theme="dark"] .objMenuTabSelect {background:var(--ax-surface-2);} html[data-theme="dark"] .objMenuTab:not(.objMenuTabSelect) {border-color:var(--ax-border);} html[data-theme="dark"] hr {background:linear-gradient(90deg,var(--ax-border),#3a4553,var(--ax-border));} html[data-theme="dark"] .lightboxTitle {border-bottom:solid 1px var(--ax-border);} html[data-theme="dark"] .jconfirm-box {background:var(--ax-surface)!important; box-shadow:0 8px 24px rgba(0,0,0,.6)!important;} html[data-theme="dark"] ::-webkit-scrollbar {background:var(--ax-surface);} html[data-theme="dark"] ::-webkit-scrollbar-thumb {background:#3d4855;} /* Le fond d'ecran clair d'Agora est neutralise en sombre pour rester sobre */ html[data-theme="dark"] {background:var(--ax-bg)!important;} /* ============================================================================ 2. SOBRIETE GENERALE — on retire les degrades et ombres marquees d'Agora ============================================================================ */ #htmlMainPage body, #htmlLightbox body {color:var(--ax-text);} #htmlMainPage {background:var(--ax-bg)!important;} #headerBar, .objContent, .miscContent, .menuContext, #messengerMain, .tox-tinymce, .ui-datepicker {box-shadow:var(--ax-shadow)!important;} .menuContext {border:1px solid var(--ax-border)!important;} button {background:var(--ax-surface)!important; border:1px solid var(--ax-border)!important; border-radius:8px;} button:hover:not(.f-button) {background:var(--ax-surface-2)!important; border-color:var(--ax-accent)!important;} input:not([type=radio],[type=checkbox]), textarea, select {border-radius:8px;} input:focus, textarea:focus, select:focus {box-shadow:0 0 0 3px var(--ax-accent-soft)!important; border-color:var(--ax-accent)!important;} /* ============================================================================ 3. DESKTOP (>=1200px) : SIDEBAR RETRACTABLE + TOP BAR Sous ce seuil, aucune de ces regles ne s'applique : le comportement mobile natif d'Agora est preserve tel quel. ============================================================================ */ @media screen and (min-width:1200px){ /* --- Top bar --- */ #htmlMainPage #headerBarContainer {padding-left:var(--ax-sb-w); transition:padding-left .18s ease;} #htmlMainPage #headerBar {background:var(--ax-surface)!important; height:var(--ax-top-h); border-bottom:1px solid var(--ax-border); box-shadow:none!important;} #htmlMainPage #headerMainLogo {display:none;} /* le logo vit dans l'entete de la sidebar */ #htmlMainPage #headerBarLeft {padding-inline:18px 20px;} #htmlMainPage #headerSpaceLabel {font-weight:600; letter-spacing:.2px;} #htmlMainPage #headerUserLabel {color:var(--ax-text-dim);} /* --- Entete de la sidebar : logo AXELIA + bouton de repli --- */ #axSbHead {position:fixed; top:0; left:0; z-index:102; width:var(--ax-sb-w); height:var(--ax-top-h); display:flex; align-items:center; gap:8px; padding:0 10px 0 14px; background:var(--ax-surface); border-bottom:1px solid var(--ax-border); border-right:1px solid var(--ax-border); transition:width .18s ease;} #axSbHead .axLogo, #axSbHead .axLogoInv {height:26px; width:auto; flex:0 0 auto; object-fit:contain;} #axSbHead .axLogoInv {display:none;} /* variante claire, pour le theme sombre */ html[data-theme="dark"] #axSbHead .axLogo {display:none;} html[data-theme="dark"] #axSbHead .axLogoInv {display:block;} #axSbHead .axLogoMark {height:28px; width:28px; flex:0 0 auto; display:none; border-radius:6px;} #axSbHead .axSpacer {flex:1 1 auto;} /* --- La sidebar : c'est la liste des modules d'Agora, repositionnee --- */ #htmlMainPage #headerBarRight {position:fixed; top:var(--ax-top-h); left:0; bottom:0; z-index:101; width:var(--ax-sb-w); padding:12px 10px 24px; background:var(--ax-surface); border-right:1px solid var(--ax-border); overflow-x:hidden; overflow-y:auto; text-align:left!important; transition:width .18s ease;} #htmlMainPage #headerBarRight .vHeaderModule {display:flex!important; align-items:center; gap:12px; width:100%; margin:2px 0; padding:9px 12px; border:1px solid transparent!important; border-radius:8px; background:transparent!important; text-align:left; color:var(--ax-text);} #htmlMainPage #headerBarRight .vHeaderModule:hover {background:var(--ax-surface-2)!important; color:var(--ax-accent);} #htmlMainPage #headerBarRight .vHeaderModule img {flex:0 0 22px; width:22px; height:22px; object-fit:contain;} #htmlMainPage #headerBarRight .vHeaderModule label {display:inline-block!important; margin:0; min-width:0; flex:1 1 auto; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; font-size:.86rem;} #htmlMainPage #headerBarRight .vHeaderModuleCurrent {background:var(--ax-accent-soft)!important; color:var(--ax-accent); font-weight:600; box-shadow:inset 3px 0 0 var(--ax-cyan);} /* --- Decalage du contenu --- */ #htmlMainPage body#bodyMainPage {padding-left:var(--ax-sb-w); transition:padding-left .18s ease;} #htmlMainPage #pageFooterHtml, #htmlMainPage #pageFooterIcon {margin-left:var(--ax-sb-w);} /* --- Etat replie --- */ #htmlMainPage.axSbCollapsed {--ax-sb-w:var(--ax-sb-w-min);} #htmlMainPage.axSbCollapsed #headerBarRight .vHeaderModule {justify-content:center; padding-inline:0;} #htmlMainPage.axSbCollapsed #headerBarRight .vHeaderModule label {display:none!important;} #htmlMainPage.axSbCollapsed #axSbHead {padding-inline:0; justify-content:center;} #htmlMainPage.axSbCollapsed #axSbHead .axLogo, #htmlMainPage.axSbCollapsed #axSbHead .axLogoInv {display:none!important;} #htmlMainPage.axSbCollapsed #axSbHead .axLogoMark {display:block;} #htmlMainPage.axSbCollapsed #axSbHead .axSpacer, #htmlMainPage.axSbCollapsed #axSbToggle {display:none;} /* En replie, le bouton de depli est rendu par l'entete elle-meme */ #htmlMainPage.axSbCollapsed #axSbHead {cursor:pointer;} } /* Sous 1200px : pas de sidebar. On masque l'entete injectee et on rend au menu mobile d'Agora l'alignement a droite que lui prend #axTopActions. */ @media screen and (max-width:1199px){ #axSbHead {display:none;} #headerBar>div:nth-last-child(2) {text-align:right;} #axTopActions {padding-right:10px;} } /* ============================================================================ 4. BOUTONS INJECTES (repli, theme) ============================================================================ */ .axBtn {display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; flex:0 0 32px; border:1px solid var(--ax-border); border-radius:8px; background:var(--ax-surface); color:var(--ax-text-dim); cursor:pointer; padding:0; line-height:0; transition:background .15s ease, color .15s ease, border-color .15s ease;} .axBtn:hover {background:var(--ax-surface-2); color:var(--ax-accent); border-color:var(--ax-accent);} .axBtn svg {width:17px; height:17px; display:block;} .axBtn svg * {stroke:currentColor;} /* ---------------------------------------------------------------------------- Rattrapages du theme sombre. Agora choisit son skin cote serveur et ecrit la couleur en dur dans les vues (ex. ModFile/VueIndex.php : "background-color:", ou le NOM du skin sert litteralement de couleur CSS). Un theme cote client ne peut donc pas l'emporter sans ces surcharges ciblees. ---------------------------------------------------------------------------- */ html[data-theme="dark"] .objBlocks .objLabel {background-color:var(--ax-surface);} html[data-theme="dark"] .vMonthDayCell {background:var(--ax-surface)!important; border-color:var(--ax-border)!important; color:var(--ax-text)!important;} /* Barre de progression : son degrade est genere en style INLINE par Tool::progressBar() (vert = taux de remplissage). Inutile d'essayer de le remplacer, on garderait une jauge sans information. On garde la piste claire et on remet un texte sombre, lisible dessus. */ html[data-theme="dark"] .progressBar {color:#1e2937; border-color:#b8c0cc;} html[data-theme="dark"] .ui-datepicker .ui-state-highlight {background:var(--ax-surface-2); color:var(--ax-text);} html[data-theme="dark"] .ui-datepicker {background:var(--ax-surface); border-color:var(--ax-border);} /* ============================================================================ 3 bis. ICONES — jeu monochrome AXELIA (#5A6674), genere dans app/img/. En theme sombre ce gris-bleu manque de contraste : on l'eclaircit. Les logos de marque sont exclus, leur colorimetrie ne doit pas bouger. ============================================================================ */ html[data-theme="dark"] img[src^="app/img/"]:not([src*="logo"]):not([src*="favicon"]), html[data-theme="dark"] img[src^="/app/img/"]:not([src*="logo"]):not([src*="favicon"]) {filter:brightness(1.9);} /* Logo de pied de page : Agora l'affiche a sa taille native (200x80), ce qui empiete sur le contenu. On le ramene a une taille de signature. */ #pageFooterIcon {bottom:10px; right:14px;} #pageFooterIcon img {max-height:30px; width:auto; opacity:.85;} #pageFooterIcon img:hover {opacity:1;} /* Logo de la page de connexion */ .miscContent img[src*="logoConnect"], .miscContent img[src*="axelia-wordmark"] {max-width:320px; height:auto;} #axTopActions {white-space:nowrap; padding-right:16px;} #axTopActions .axBtn {margin-left:8px;} /* Icone soleil en clair, lune en sombre */ #axThemeToggle .axIconDark {display:none;} html[data-theme="dark"] #axThemeToggle .axIconLight {display:none;} html[data-theme="dark"] #axThemeToggle .axIconDark {display:block;} /* ============================================================================ AXELIA — Icones en couleur (dossiers + types de fichiers) Les PNG d'Agora sont monochromes : on les teinte en CSS (brightness(0) puis colorisation par filtres), donc aucune image n'est modifiee dans app/. ============================================================================ */ img[src*='app/img/folder/folder']{filter:brightness(0) saturate(100%) invert(69%) sepia(56%) saturate(651%) hue-rotate(357deg) brightness(97%) contrast(90%);} /* dossiers : ambre */ img[src$='fileType/pdf.png']{filter:brightness(0) saturate(100%) invert(25%) sepia(87%) saturate(2360%) hue-rotate(351deg) brightness(94%) contrast(92%);} /* PDF : rouge */ img[src$='fileType/textEditor.png']{filter:brightness(0) saturate(100%) invert(29%) sepia(29%) saturate(1897%) hue-rotate(193deg) brightness(94%) contrast(93%);} /* Word : bleu */ img[src$='fileType/calc.png']{filter:brightness(0) saturate(100%) invert(33%) sepia(61%) saturate(504%) hue-rotate(96deg) brightness(94%) contrast(94%);} /* Excel : vert */ img[src$='fileType/presentation.png']{filter:brightness(0) saturate(100%) invert(35%) sepia(74%) saturate(1793%) hue-rotate(350deg) brightness(92%) contrast(94%);} /* PowerPoint : orange */ img[src$='fileType/image.png']{filter:brightness(0) saturate(100%) invert(16%) sepia(59%) saturate(4590%) hue-rotate(287deg) brightness(89%) contrast(94%);} /* images : violet */ img[src$='fileType/archive.png']{filter:brightness(0) saturate(100%) invert(46%) sepia(9%) saturate(742%) hue-rotate(332deg) brightness(93%) contrast(87%);} /* archives : brun */ img[src$='fileType/audio.png']{filter:brightness(0) saturate(100%) invert(20%) sepia(75%) saturate(4083%) hue-rotate(324deg) brightness(89%) contrast(96%);} /* audio : rose */ img[src$='fileType/video.png']{filter:brightness(0) saturate(100%) invert(31%) sepia(94%) saturate(1349%) hue-rotate(158deg) brightness(93%) contrast(101%);} /* video : sarcelle */ img[src$='fileType/text.png']{filter:brightness(0) saturate(100%) invert(43%) sepia(9%) saturate(875%) hue-rotate(155deg) brightness(93%) contrast(85%);} /* texte : ardoise */ /* ============================================================================ AXELIA — Sélecteur d'espace en tête de sidebar ============================================================================ */ #axSpaceSwitch{order:-1; margin:0 0 12px; padding:0 2px;} #axSpaceSwitch .axSpaceTag{font-size:10px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--ax-cyan-600); margin:2px 6px 6px;} #axSpaceCur{display:flex; align-items:center; gap:9px; width:100%; text-align:left; border:1px solid rgba(0,0,0,.10); background:var(--ax-surface); color:inherit; border-radius:10px; padding:10px 10px; font-weight:600; font-size:13px; line-height:1.25; cursor:pointer;} #axSpaceCur svg{flex:0 0 auto; width:17px; height:17px;} #axSpaceCur span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} #axSpaceCur .axCaret{margin-left:auto; width:14px; height:14px; transition:transform .15s;} #axSpaceSwitch.axOpen #axSpaceCur .axCaret{transform:rotate(180deg);} #axSpaceCur:hover{background:var(--ax-surface-2); color:var(--ax-accent);} #axSpaceList{display:none; margin:6px 0 0; border-radius:10px; overflow:hidden; border:1px solid rgba(0,0,0,.10); background:var(--ax-surface);} #axSpaceSwitch.axOpen #axSpaceList{display:block;} #axSpaceList a{display:block; padding:9px 11px; font-size:13px; text-decoration:none; color:inherit;} #axSpaceList a:hover{background:var(--ax-surface-2);} #axSpaceList a.axCur{background:rgba(0,198,214,.16); font-weight:700;} html.axSbCollapsed #axSpaceSwitch .axSpaceTag, html.axSbCollapsed #axSpaceCur span, html.axSbCollapsed #axSpaceCur .axCaret, html.axSbCollapsed #axSpaceList{display:none;} html.axSbCollapsed #axSpaceCur{justify-content:center; padding:10px 0;} html[data-theme='dark'] #axSpaceCur, html[data-theme='dark'] #axSpaceList{border-color:rgba(255,255,255,.14);} /* ============================================================================ AXELIA — Circuit de visa (pastilles + panneau) ============================================================================ */ .axVisa{display:inline-flex; align-items:center; gap:5px; margin:6px auto 2px; padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:700; letter-spacing:.02em; cursor:pointer; user-select:none; border:1px solid transparent; line-height:1.4;} .objContent .axVisa{display:table; margin-left:auto; margin-right:auto;} .axVisa-aviser{color:#5a6472; border-color:rgba(90,100,114,.45); background:transparent;} .axVisa-aviser:hover{color:var(--ax-accent); border-color:var(--ax-accent);} .axVisa-ok{color:#fff; background:#1e8e3e;} .axVisa-observations{color:#5f4200; background:#ffd54f;} .axVisa-refuse{color:#fff; background:#d93025;} #axVisaPanel{position:absolute; z-index:9999; width:320px; background:var(--ax-surface); border:1px solid rgba(0,0,0,.14); border-radius:12px; box-shadow:0 12px 32px rgba(10,33,61,.18); padding:12px;} #axVisaPanel .axVisaPanelTitle{font-weight:700; font-size:13px; margin-bottom:9px;} #axVisaPanel .axVisaChoices{display:flex; gap:6px; margin-bottom:8px;} #axVisaPanel .axVisaChoices button{flex:1; padding:7px 4px; font-size:12px; font-weight:600; border-radius:8px; border:1px solid rgba(0,0,0,.15); background:transparent; color:inherit; cursor:pointer;} #axVisaPanel .axVisaChoices button[data-st=ok].axSel{background:#1e8e3e; color:#fff; border-color:#1e8e3e;} #axVisaPanel .axVisaChoices button[data-st=observations].axSel{background:#ffd54f; color:#5f4200; border-color:#e8b300;} #axVisaPanel .axVisaChoices button[data-st=refuse].axSel{background:#d93025; color:#fff; border-color:#d93025;} #axVisaPanel textarea{width:100%; min-height:64px; resize:vertical; border:1px solid rgba(0,0,0,.15); border-radius:8px; padding:7px; font:inherit; font-size:12.5px; background:transparent; color:inherit; box-sizing:border-box;} #axVisaPanel .axVisaActions{display:flex; gap:6px; margin-top:8px;} #axVisaPanel .axVisaSend{flex:1; padding:8px; border-radius:8px; border:none; background:var(--ax-blue)!important; color:#fff!important; font-weight:700; cursor:pointer;} #axVisaPanel .axVisaSend:disabled{opacity:.45; cursor:default;} #axVisaPanel .axVisaCancel{padding:8px 12px; border-radius:8px; border:1px solid rgba(0,0,0,.15); background:transparent; color:inherit; cursor:pointer;} #axVisaPanel .axVisaErr{color:#d93025; font-size:12px; margin-top:6px; min-height:14px;} html[data-theme='dark'] #axVisaPanel{border-color:rgba(255,255,255,.16);} html[data-theme='dark'] #axVisaPanel .axVisaChoices button, html[data-theme='dark'] #axVisaPanel textarea, html[data-theme='dark'] #axVisaPanel .axVisaCancel{border-color:rgba(255,255,255,.2);} /* Priorite sur la regle globale button{...!important} du theme */ #axVisaPanel .axVisaChoices button[data-st=ok].axSel{background:#1e8e3e!important; color:#fff!important; border-color:#1e8e3e!important;} #axVisaPanel .axVisaChoices button[data-st=observations].axSel{background:#ffd54f!important; color:#5f4200!important; border-color:#e8b300!important;} #axVisaPanel .axVisaChoices button[data-st=refuse].axSel{background:#d93025!important; color:#fff!important; border-color:#d93025!important;} #axVisaPanel .axVisaSend:hover{background:var(--ax-navy-700)!important; border-color:transparent!important;} /* Boite a plans : l'agenda (y compris personnel) est masque pour tous */ .vHeaderModule[onclick*='ctrl=calendar']{display:none!important;} /* ============================================================================ AXELIA — Visa v2 : pastille en surimpression + processus dans la bulle ============================================================================ */ /* Pastille : badge en surimpression, lisible sur les vignettes, cliquable */ .objContent{position:relative;} .objContent .axVisa{display:inline-flex; position:absolute; top:6px; left:6px; margin:0; z-index:30; box-shadow:0 1px 4px rgba(10,33,61,.28); cursor:pointer;} .axVisa-aviser{background:var(--ax-surface)!important; color:#3d4756;} html[data-theme='dark'] .axVisa-aviser{color:#c7d0dc;} /* Icones de l'arborescence : taille contenue */ .vTreeFolderIcon img{width:18px; height:18px; object-fit:contain;} .vTreeFolderIcon .vIconOpen{width:12px; height:12px;} /* Boite a plans : messagerie instantanee masquee (cache de session compris) */ #headerModuleMessenger{display:none!important;} /* Bloc visa dans la bulle commentaires */ #axVisaBox{margin:0 0 14px; padding:12px 12px 10px; border:1px solid rgba(0,0,0,.12); border-radius:12px; background:var(--ax-surface);} #axVisaBox .axVisaBoxTitle{font-weight:700; font-size:14px; margin-bottom:8px;} #axVisaBox .axVisaEtat{font-size:12.5px; margin-bottom:10px; display:flex; align-items:center; gap:8px; flex-wrap:wrap;} #axVisaBox .axVisaEtat .axVisa{position:static; cursor:default; box-shadow:none;} #axVisaBox .axVisaMeta{opacity:.75;} #axVisaBox .axVisaComm{width:100%; font-style:italic; opacity:.85; margin-top:2px;} #axVisaBox .axVisaChoices{display:flex; gap:6px; margin-bottom:8px;} #axVisaBox .axVisaChoices button{flex:1; padding:8px 4px; font-size:12.5px; font-weight:600; border-radius:8px; cursor:pointer;} #axVisaBox .axVisaChoices button[data-st=ok].axSel{background:#1e8e3e!important; color:#fff!important; border-color:#1e8e3e!important;} #axVisaBox .axVisaChoices button[data-st=observations].axSel{background:#ffd54f!important; color:#5f4200!important; border-color:#e8b300!important;} #axVisaBox .axVisaChoices button[data-st=refuse].axSel{background:#d93025!important; color:#fff!important; border-color:#d93025!important;} #axVisaBox textarea{width:100%; min-height:56px; resize:vertical; border:1px solid rgba(0,0,0,.15); border-radius:8px; padding:7px; font:inherit; font-size:12.5px; background:transparent; color:inherit; box-sizing:border-box;} #axVisaBox .axVisaActions{margin-top:8px;} #axVisaBox .axVisaSend{width:100%; padding:9px; border-radius:8px; border:none!important; background:var(--ax-blue)!important; color:#fff!important; font-weight:700; cursor:pointer;} #axVisaBox .axVisaSend:disabled{opacity:.45; cursor:default;} #axVisaBox .axVisaErr{color:#d93025; font-size:12px; margin-top:6px; min-height:14px;} #axVisaBox .axVisaOk{color:#1e8e3e; font-weight:600;} html[data-theme='dark'] #axVisaBox{border-color:rgba(255,255,255,.16);} /* Lien synthese des visas (sidebar) */ #axVisaRapport{display:flex; align-items:center; gap:9px; margin:0 2px 12px; padding:9px 10px; border-radius:10px; border:1px dashed rgba(0,0,0,.18); color:inherit; text-decoration:none; font-weight:600; font-size:13px;} #axVisaRapport svg{flex:0 0 auto; width:16px; height:16px;} #axVisaRapport:hover{border-color:var(--ax-accent); color:var(--ax-accent); border-style:solid;} html.axSbCollapsed #axVisaRapport span{display:none;} html.axSbCollapsed #axVisaRapport{justify-content:center; padding:9px 0;} html[data-theme='dark'] #axVisaRapport{border-color:rgba(255,255,255,.22);} /* Lien administration visas (sidebar, admins seulement) */ #axVisaAdmin{display:flex; align-items:center; gap:9px; margin:0 2px 12px; padding:9px 10px; border-radius:10px; border:1px dashed rgba(0,0,0,.18); color:inherit; text-decoration:none; font-weight:600; font-size:13px;} #axVisaAdmin svg{flex:0 0 auto; width:16px; height:16px;} #axVisaAdmin:hover{border-color:var(--ax-accent); color:var(--ax-accent); border-style:solid;} html.axSbCollapsed #axVisaAdmin span{display:none;} html.axSbCollapsed #axVisaAdmin{justify-content:center; padding:9px 0;} html[data-theme='dark'] #axVisaAdmin{border-color:rgba(255,255,255,.22);} /* ============================================================================ AXELIA — Environnement client épuré (html.axClient : ni admin d'espace, ni admin général). Annuaire et listes nominatives de droits masqués. Le blocage réel de l'annuaire est côté serveur (patch CtrlUser). ============================================================================ */ html.axClient .vHeaderModule[onclick*='ctrl=user']{display:none!important;} html.axClient .menuLine.accessWrite, html.axClient .menuLine.accessRead{display:none!important;} /* Correctif spécificité : la barre latérale force .vHeaderModule en flex ; pour un client on masque réellement Utilisateurs et Agenda. */ html.axClient #headerBarRight .vHeaderModule[onclick*='ctrl=user'], html.axClient #headerBarRight .vHeaderModule[onclick*='ctrl=calendar'], #htmlMainPage #headerBarRight .vHeaderModule[onclick*='ctrl=calendar']{display:none!important;} #htmlMainPage.axClient #headerBarRight .vHeaderModule[onclick*='ctrl=user']{display:none!important;} /* ============================================================================ AXELIA — Visibilité par fichier (pastille admin + panneau) ============================================================================ */ .objContent .axVis{display:inline-flex;position:absolute;top:6px;right:6px;margin:0;z-index:31;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:700;cursor:pointer;box-shadow:0 1px 4px rgba(10,33,61,.28);white-space:nowrap;} .axVis-herite{background:#eef1f6;color:#3d4756;} .axVis-restreint{background:#d93025;color:#fff;} .axVis-charge{background:#eef1f6;color:#8a93a1;} #axVisPanel{position:absolute;z-index:9999;width:300px;background:var(--ax-surface);border:1px solid rgba(0,0,0,.14);border-radius:12px;box-shadow:0 12px 32px rgba(10,33,61,.18);padding:12px;font-size:13px;} #axVisPanel .axVisTitle{font-weight:700;margin-bottom:8px;} #axVisPanel .axVisMode{display:block;margin-bottom:5px;font-size:12.5px;} #axVisPanel .axVisList{max-height:210px;overflow:auto;margin:7px 0;border:1px solid rgba(0,0,0,.10);border-radius:8px;padding:6px 8px;} #axVisPanel .axVisU{display:block;font-size:12.5px;padding:2px 0;} #axVisPanel .axVisAdm{font-size:10px;color:#0094C4;font-weight:700;} #axVisPanel .axVisAct{display:flex;gap:6px;align-items:center;margin-top:8px;} #axVisPanel .axVisSave{padding:7px 12px;border-radius:8px;border:none;background:var(--ax-blue);color:#fff;font-weight:700;cursor:pointer;} #axVisPanel .axVisCancel{padding:7px 10px;border-radius:8px;border:1px solid rgba(0,0,0,.15);background:transparent;color:inherit;cursor:pointer;} #axVisPanel .axVisMsg{font-size:11.5px;}#axVisPanel .axVisMsg.ok{color:#1e8e3e;font-weight:700;}#axVisPanel .axVisMsg.err{color:#d93025;font-weight:700;} html[data-theme='dark'] #axVisPanel{border-color:rgba(255,255,255,.16);} /* Lien Diffusion (qui voit quoi) — même gabarit que les autres liens sidebar */ #axDiffusion{display:flex;align-items:center;gap:9px;margin:0 2px 12px;padding:9px 10px;border-radius:10px;border:1px dashed rgba(0,0,0,.18);color:inherit;text-decoration:none;font-weight:600;font-size:13px;} #axDiffusion svg{flex:0 0 auto;width:16px;height:16px;} #axDiffusion:hover{border-color:var(--ax-accent);color:var(--ax-accent);border-style:solid;} html.axSbCollapsed #axDiffusion span{display:none;} html.axSbCollapsed #axDiffusion{justify-content:center;padding:9px 0;} html[data-theme='dark'] #axDiffusion{border-color:rgba(255,255,255,.22);} /* ---- Encapsulation des outils GED (iframe dans la zone de contenu) ---- */ #axEmbed{position:fixed;right:0;bottom:0;display:none;flex-direction:column;z-index:60;background:#eef1f6;box-shadow:-1px 0 0 rgba(10,33,61,.08);} /* Pendant l'encapsulation, masquer les pastilles de la liste derriere (sinon elles transpercent l'iframe) */ html.axEmbedOpen .axVis{display:none!important;} #axEmbed.axOn{display:flex;} #axEmbedBar{display:flex;align-items:center;gap:10px;padding:8px 14px;background:#fff;border-bottom:2px solid #0A213D;} #axEmbedTitle{flex:1;font-weight:600;font-size:14px;color:#0A213D;} #axEmbedClose{flex:0 0 auto;width:30px;height:30px;border-radius:8px;border:1px solid #c8cfda;background:#fff;color:#0A213D;font-size:14px;line-height:1;cursor:pointer;} #axEmbedClose:hover{background:#0A213D;color:#fff;border-color:#0A213D;} #axEmbedFrame{flex:1;width:100%;border:0;background:#eef1f6;} #axVisaRapport.axEmbActive,#axDiffusion.axEmbActive,#axVisaAdmin.axEmbActive{border-style:solid;border-color:var(--ax-accent);color:var(--ax-accent);background:rgba(10,33,61,.06);} html[data-theme='dark'] #axEmbedBar{background:#12233b;} html[data-theme='dark'] #axEmbedTitle{color:#eef1f6;} html[data-theme='dark'] #axEmbedClose{background:#0e1b2e;color:#eef1f6;border-color:rgba(255,255,255,.22);} /* ======== SIDEBAR UNIQUE : fusion de la colonne du milieu (#pageMenu) dans la sidebar ======== */ #htmlMainPage #headerBarRight{overflow-y:auto;overflow-x:hidden;} html.axFused #pageFull{display:block!important;} html.axFused #pageContent{display:block!important;width:auto!important;min-width:0!important;} html.axFused #headerBarRight #pageMenu{width:auto!important;min-width:0!important;max-width:none!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:2px 0 10px!important;} html.axFused #headerBarRight #pageMenu .miscContent{padding:0 4px 0 0!important;background:transparent!important;border:0!important;box-shadow:none!important;} html.axFused #headerBarRight #pageMenu hr{margin:9px 10px!important;border:0!important;border-top:1px solid var(--ax-border)!important;} /* (ancien libellé ::before remplacé par #axDossLabel injecté en v2) */ html.axFused #headerBarRight #pageMenu .miscContent::before{content:none;} /* ======== v4 : UNE SEULE barre en haut = l'en-tête, tout aligné (flex + order) ======== On déplace dans l'en-tête : fil d'Ariane (nav dossier) + grille/ligne (icônes) + tri + compteur/disque + thème. Ordre visuel fixé par `order`. Les segments du fil d'Ariane sont forcés en flex -> zéro superposition ; le dossier courant tronque proprement si la place manque. */ html.axFused #headerBar{display:flex!important;align-items:center;gap:10px;padding-right:14px;} html.axFused #headerBar>#headerBarLeft{order:0;flex:0 0 auto;white-space:nowrap;min-width:0;} /* fil d'Ariane : ne prend que la largeur nécessaire (ne s'étale plus vide à la racine) */ html.axFused #headerBar .pathMenu{order:1;display:flex!important;align-items:center;flex:0 1 auto;min-width:0;margin:0!important;padding:0!important;gap:0;overflow:hidden;} /* icône ☰ héritée collée au nom d'espace : inutile (remplacée par la roue dentée ⚙) */ html.axFused #headerSpaceLabel img{display:none!important;} html.axFused #headerBar .pathMenu>div{display:inline-flex!important;align-items:center;gap:3px;width:auto!important;padding:0 5px!important;white-space:nowrap;flex:0 0 auto;} html.axFused #headerBar .pathMenu>div:nth-last-child(2){flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;} html.axFused #headerBar .pathMenu>div:nth-last-child(2)>span{overflow:hidden;text-overflow:ellipsis;} html.axFused #headerBar .pathMenu img{max-height:16px!important;width:auto;margin:0 2px!important;} html.axFused #headerBar .pathMenu .pathMenuAdd{flex:0 0 auto;} html.axFused #headerBar .pathMenu .menuContextLaunch{cursor:pointer;} /* contrôles grille/ligne (icônes seules) + tri */ html.axFused #headerBar #axToolbarR{order:4;display:flex;align-items:center;gap:2px;flex:0 0 auto;position:relative;} html.axFused #headerBar #axToolbarR .menuLine{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:8px;cursor:pointer;margin:0;color:var(--ax-text-dim);font-size:12.5px;font-weight:600;white-space:nowrap;} html.axFused #headerBar #axToolbarR .menuLine.option>div:not(.menuIcon), html.axFused #headerBar #axToolbarR .menuLine.optionSelect>div:not(.menuIcon){display:none;} html.axFused #headerBar #axToolbarR .menuLine:hover{background:var(--ax-surface-2);color:var(--ax-text);} html.axFused #headerBar #axToolbarR .menuLine.optionSelect{background:var(--ax-accent-soft);color:var(--ax-accent);} html.axFused #headerBar #axToolbarR .menuLine .menuIcon img{width:16px;height:16px;object-fit:contain;} html.axFused #headerBar #axToolbarR .menuContext{right:0;left:auto;} html.axFused #headerBar #axTopActions{order:5;flex:0 0 auto;margin-left:0;} /* neutralise l'ancienne barre autonome */ html.axFused #axToolbar{display:none!important;} /* action « + Nouveau » mise en avant, en haut de la sidebar */ #axActions{margin:0 2px 4px;} #axActions .menuLine{background:var(--ax-accent-soft);color:var(--ax-accent);border-radius:9px;margin:2px 0;padding:9px 12px;font-weight:700;display:flex;align-items:center;gap:9px;cursor:pointer;} #axActions .menuLine:hover{filter:brightness(.97);} #axActions .menuLine .menuIcon img{width:18px;height:18px;object-fit:contain;} #axActions hr{display:none;} /* libellés de section */ .axSecLabel{font:600 11px/1 "Segoe UI",system-ui,sans-serif;letter-spacing:.06em;color:var(--ax-text-dim);text-transform:uppercase;padding:14px 10px 6px;} /* groupe « Suivi & administration » en bas */ #axTools{margin-top:8px;border-top:1px solid var(--ax-border);padding-top:2px;} html.axSbCollapsed #axActions .menuLine span,html.axSbCollapsed .axSecLabel{display:none;} html.axSbCollapsed #axActions .menuLine{justify-content:center;padding:9px 0;} /* infos compteur + jauge disque : dans l'en-tête, compactes, alignées (order 3) */ html.axFused #headerBar #axHeaderInfo{order:3;display:flex;align-items:center;gap:12px;margin:0 0 0 auto;flex:0 0 auto;} html.axFused #headerBar #axHeaderInfo .menuLine{display:flex;align-items:center;gap:6px;padding:0;margin:0;font-size:12px;font-weight:600;color:var(--ax-text-dim);white-space:nowrap;cursor:default;background:none;} html.axFused #headerBar #axHeaderInfo .menuLine:hover{background:none;} html.axFused #headerBar #axHeaderInfo .menuLine .menuIcon{flex:0 0 auto;width:auto;height:auto;} html.axFused #headerBar #axHeaderInfo .menuLine .menuIcon img{width:15px;height:15px;object-fit:contain;} html.axFused #headerBar #axHeaderInfo .progressBar{width:auto;min-width:0;max-width:170px;font-size:11px;font-weight:600;padding:3px 9px;border:1px solid var(--ax-border);border-radius:999px;color:var(--ax-text);white-space:nowrap;} @media (max-width:1440px){ html.axFused #headerBar #axHeaderInfo .menuLine:not(:last-child){display:none;} } html.axFused #pageMenu .menuLine{display:flex!important;align-items:center;gap:9px;border-radius:9px;padding:7px 10px;margin:1px 0;color:var(--ax-text);cursor:pointer;font-weight:600;font-size:12px;} html.axFused #pageMenu .menuLine:hover{background:var(--ax-surface-2);} html.axFused #pageMenu .menuLine .menuIcon{flex:0 0 18px;} html.axFused #pageMenu .menuLine .menuIcon img{width:18px;height:18px;object-fit:contain;} html.axFused #pageMenu .menuTree a{display:flex;align-items:center;gap:8px;border-radius:9px;padding:7px 10px;color:var(--ax-text);text-decoration:none;font-size:13px;} html.axFused #pageMenu .menuTree a:hover{background:var(--ax-surface-2);} /* Arbre de dossiers natif (.vTreeFolder) dans la sidebar : noms longs qui passent à la ligne au lieu d'être tronqués/coupés. On NE touche PAS au display (none/table géré par le JS natif pour replier/déplier) : on garde la table, on fait juste wrapper la cellule libellé et on borne la largeur à la sidebar. */ html.axFused #headerBarRight #pageMenu #treeFolders{width:100%;padding:2px 2px 8px 0;} /* table à colonnes FIXES : la cellule icône fait toujours 20px -> tous les libellés démarrent exactement au même endroit (robuste quel que soit le contenu de la cellule, flèche ou non). */ html.axFused #headerBarRight #pageMenu .vTreeFolder{width:100%;max-width:100%;table-layout:fixed;} html.axFused #headerBarRight #pageMenu .vTreeFolder>div{padding:3px 2px;vertical-align:top;} html.axFused #headerBarRight #pageMenu .vTreeFolderIcon{white-space:nowrap;} html.axFused #headerBarRight #pageMenu .vTreeFolderLabel{white-space:normal;overflow-wrap:anywhere;word-break:break-word;line-height:1.2;border-radius:7px;padding:3px 6px;cursor:pointer;font-size:11.5px;} html.axFused #headerBarRight #pageMenu .vTreeFolderLabel:hover{background:var(--ax-surface-2);} html.axFused #headerBarRight #pageMenu .vTreeFolderLabel.linkSelect{color:var(--ax-accent);background:var(--ax-accent-soft);font-weight:700;} /* arbre resserré + aligné à gauche (icônes plus petites, cellules compactes) */ html.axFused #headerBarRight #pageMenu .vTreeFolder>div{padding:2px 0;vertical-align:middle;} /* alignement à GAUCHE pour tous les espaces (CSS pur, l'emporte sur l'indentation inline posée par Agora) : cellule icône à largeur FIXE 20px (padding nul, débordement masqué), flèche d'ouverture supprimée. */ html.axFused #headerBarRight #pageMenu .vTreeFolderIcon{width:20px!important;max-width:20px;padding:0!important;white-space:nowrap;overflow:hidden;text-align:left;} html.axFused #headerBarRight #pageMenu .vTreeFolderIcon img{width:15px;height:15px;vertical-align:middle;} html.axFused #headerBarRight #pageMenu .vTreeFolderIcon .vIconOpen{display:none!important;} html.axFused #headerBarRight #pageMenu .vTreeFolderLabel{text-align:left!important;padding-left:5px!important;} /* bouton « + » (ajouter fichier/dossier) déplacé à côté du libellé « Dossiers » */ #axDossLabel.axDossAdd{display:flex;align-items:center;justify-content:space-between;gap:8px;} #axDossLabel .pathMenuAdd{width:auto;flex:0 0 auto;text-align:right;cursor:pointer;position:relative;padding:0;} #axDossLabel .pathMenuAdd .menuContextLaunch,#axDossLabel .pathMenuAdd>img{width:17px;height:17px;opacity:.6;cursor:pointer;vertical-align:middle;} #axDossLabel .pathMenuAdd .menuContextLaunch:hover{opacity:1;} #axDossLabel .pathMenuAdd .menuContext{text-transform:none;letter-spacing:normal;font-weight:500;z-index:6000;box-shadow:0 12px 32px rgba(10,33,61,.22);border-radius:10px;} html.axSbCollapsed.axFused #headerBarRight #pageMenu{display:none;} /* ======== Menu « Administration » : roue dentée en topbar + popup ======== */ #axGear{order:6;} /* à droite, après le thème (#axTopActions order 5) */ #axGear svg{width:18px;height:18px;display:block;} #axGear[aria-expanded="true"]{background:var(--ax-surface-2);color:var(--ax-accent);border-color:var(--ax-accent);} #axAdminPopup{position:fixed;top:0;right:8px;z-index:4000;width:280px;max-width:92vw;max-height:80vh;overflow:auto; background:var(--ax-surface);border:1px solid var(--ax-border);border-radius:12px; box-shadow:0 14px 40px rgba(10,33,61,.20);padding:8px;display:none;overscroll-behavior:contain;} #axAdminPopup.axOpen{display:block;} #axAdminPopup .axAdminHd{font:700 11px/1 "Segoe UI",system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase; color:var(--ax-text-dim);padding:6px 10px 8px;} #axAdminPopup .axAdminBody .menuLine{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px; cursor:pointer;color:var(--ax-text);font-size:13px;font-weight:600;text-decoration:none;} #axAdminPopup .axAdminBody .menuLine:hover{background:var(--ax-surface-2);color:var(--ax-accent);} #axAdminPopup .axAdminBody .menuLine a{color:inherit;text-decoration:none;display:flex;align-items:center;gap:10px;flex:1 1 auto;} #axAdminPopup .axAdminBody .menuLine .menuIcon{flex:0 0 20px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;} #axAdminPopup .axAdminBody .menuLine .menuIcon img, #axAdminPopup .axAdminBody .menuLine img{width:18px;height:18px;object-fit:contain;} #axAdminPopup .axAdminBody hr{border:0;border-top:1px solid var(--ax-border);margin:6px 4px;} html[data-theme="dark"] #axAdminPopup{border-color:rgba(255,255,255,.16);} /* ======== Pastille de visibilité : décalée pour ne PAS chevaucher le menu ⋮ ======== */ .objContent .axVis{top:7px;right:34px;padding:2px 7px;font-size:10px;z-index:29;max-width:72px;overflow:hidden;text-overflow:ellipsis;} .objContent .axVis.axVis-herite{opacity:.78;} /* « Tous » (défaut) discret ; « Restreint » reste bien visible */ /* ===== Mode LISTE (displayMode=line) : colonnes alignees, zero chevauchement ===== Chaque ligne est un independant : on fige la mise en page (table-layout:fixed + largeurs de colonnes par classe) pour que TOUTES les lignes s'alignent, et on sort les badges injectes (.axVisa "A viser" a gauche, .axVis "Tous" a droite) du flux du tableau pour qu'ils ne chevauchent plus l'auteur ni la vignette. */ .objLines .objContent{position:relative;min-height:50px;padding-left:72px;padding-right:46px;box-sizing:border-box;} /* La ligne native est un
: ses enfants non-cellules (badge "Tous" injecte) deviennent des CELLULES ANONYMES qui decalent les colonnes. On passe la ligne en FLEX : chaque colonne est maitrisee, et le badge devient un simple item en fin de ligne. */ .objLines .objContentTab, .objLines .objContentTab.objFiles, .objLines .objContentTab.objFolders{display:flex!important;align-items:center;width:100%!important;min-height:48px;margin:0!important;} .objLines .objContentTab > .objIcon{flex:0 0 42px;display:flex!important;align-items:center;justify-content:center;padding:0!important;} .objLines .objContentTab > .objIcon img{max-width:34px;max-height:34px;width:auto;height:auto;} .objLines .objContentTab > .objLabel{flex:1 1 auto;min-width:0;display:block!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 16px 0 8px!important;} .objLines .objContentTab > .objLabel a{white-space:nowrap;} .objLines .objContentTab > .objDetails{flex:0 0 96px;display:block!important;text-align:right;white-space:nowrap;color:#5a6472;padding-right:18px!important;font-variant-numeric:tabular-nums;} .objLines .objContentTab > .objAutorDate{flex:0 0 200px;display:block!important;text-align:right;white-space:nowrap;font-size:12px;line-height:1.25;color:#5a6472;} .objLines .objContentTab > .axVis{flex:0 0 auto;order:9;position:static!important;left:auto!important;right:auto!important;top:auto!important;transform:none!important;margin:0 0 0 12px!important;box-shadow:none;} /* chip visa « À viser » : absolu a gauche, centre vertical (hors ligne flex) */ .objLines .objContent .axVisa{position:absolute!important;left:8px;top:50%;transform:translateY(-50%);margin:0!important;z-index:5;} /* menu ⋮ : centre vertical */ .objLines .menuContextLaunchFloat{top:50%!important;margin-top:0!important;transform:translateY(-50%);} html[data-theme='dark'] .objLines .objContentTab > .objDetails, html[data-theme='dark'] .objLines .objContentTab > .objAutorDate{color:#9aa4b2;} /* ===== Mode TUILE (grille) : cartes nettes et bien distinctes, y compris en sombre ===== */ .objBlocks .objContent{border:1px solid var(--ax-border)!important;border-radius:12px;background:var(--ax-surface);box-shadow:0 1px 2px rgba(16,32,56,.06);transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;} .objBlocks .objContent:hover{border-color:var(--ax-accent)!important;box-shadow:0 6px 18px rgba(16,32,56,.13);transform:translateY(-1px);} .objBlocks .objLabel{border-top:1px solid var(--ax-border);background:var(--ax-surface);} /* Sombre : tuile PLUS CLAIRE que le fond de page + bordure lisible => bien detachee */ html[data-theme="dark"] .objBlocks .objContent{background:var(--ax-surface-2)!important;border-color:#3a4553!important;box-shadow:0 1px 2px rgba(0,0,0,.45);} html[data-theme="dark"] .objBlocks .objContent:hover{border-color:var(--ax-accent)!important;box-shadow:0 8px 22px rgba(0,0,0,.6);} html[data-theme="dark"] .objBlocks .objLabel{background:var(--ax-surface-2)!important;border-top-color:#3a4553;}