/* ============================================================================ * portal-base.css - TOUTE la mise en page du portail, en feuille STATIQUE. * ---------------------------------------------------------------------------- * Ces regles etaient injectees par portal-ui.js, charge en "defer" : elles * n'arrivaient qu'APRES la premiere peinture. La page naissait a 16px de racine, * topbar 56px et marges 32px, puis tout se resserrait d'un coup - d'ou * l'impression d'ecran qui saute a chaque navigation (decalage cumule mesure a * 0,834, quand 0,1 est deja consideré comme le seuil du visible). * Chargee en dans le , elle s'applique AVANT la premiere peinture : * la page s'affiche directement dans sa geometrie definitive. * * GENEREE depuis portal-ui.js (qui garde ses fonctions d'injection comme repli * pour les pages sans ce , ex. dashboard-mockups/demo/). Si une regle * change la-bas, regenerer ce fichier. * ========================================================================== */ /* ---- helia-densite-css ---- */ html{font-size:15px;}.rise{opacity:1!important;animation:none!important;transform:none!important;}header.h-14{height:48px!important;padding-left:16px!important;padding-right:16px!important;}main > div{padding-left:16px!important;padding-right:16px!important;padding-top:14px!important;padding-bottom:16px!important;}main > div.space-y-5 > * + *{margin-top:14px!important;}main .p-6{padding:1.15rem!important;} main .p-7{padding:1.25rem!important;}main .py-6{padding-top:1.05rem!important;padding-bottom:1.05rem!important;}main ::-webkit-scrollbar{width:8px;height:8px;}main ::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:8px;}main ::-webkit-scrollbar-track{background:transparent;} /* ---- helia-mobile-css ---- */ @media (max-width:640px){html,body{overflow-x:hidden!important;}main{overflow-x:hidden!important;}main *{max-width:100%;}main .overflow-auto,main .overflow-x-auto,main [class*="max-h-"]{overflow:visible!important;max-height:none!important;}main table{min-width:0!important;width:100%!important;}#helia-beta-banner{padding:4px 10px!important;font-size:10px!important;gap:6px!important;}#helia-beta-banner span span{display:none;}#brandCrumb,#brandCrumb + span{display:none!important;}header.h-14{padding-left:14px!important;padding-right:14px!important;}main > div{padding-left:14px!important;padding-right:14px!important;}main .p-6{padding:1rem!important;}main .p-7{padding:1.1rem!important;}.shadow-card,.shadow-soft{border-radius:1rem!important;}aside[data-sidebar]{z-index:9998!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;box-shadow:0 12px 44px rgba(15,23,42,.30)!important;}[data-sidebar-backdrop]{z-index:9997!important;}aside[data-sidebar] nav{flex:none!important;overflow:visible!important;padding-top:.4rem!important;padding-bottom:.4rem!important;}aside[data-sidebar] [data-fallback-help]{display:none!important;}aside[data-sidebar] .shrink-0.p-4{padding:.7rem 1rem!important;}aside[data-sidebar] nav a{padding-top:.4rem!important;padding-bottom:.4rem!important;}#viewToggle [data-view="list"]{display:none!important;}#siteSearch{width:100%!important;}#siteFilters{width:100%;}#docChips,#typeChips,#siteFilters,[id$="Chips"],[id$="Filters"]{flex-wrap:wrap!important;}#docTypeSel{flex-wrap:wrap!important;width:auto!important;}[data-spark]{flex-shrink:1!important;min-width:0!important;max-width:100%;}[data-spark] svg{width:100%!important;}main li.row-hover{flex-wrap:wrap!important;}main li.row-hover > div{flex:1 1 calc(100% - 3.4rem)!important;}main li.row-hover > [data-vu]{margin-left:3.125rem;margin-top:.5rem;}#tabs{flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;display:flex!important;width:100%;}#tabs::-webkit-scrollbar{display:none;}#tabs .tab-btn{white-space:nowrap;flex:0 0 auto;}[data-rate],[data-rate] > div{flex-wrap:wrap!important;}[data-rate] button{min-width:40px;min-height:40px;display:inline-grid;place-items:center;}[data-rate] + span,[data-rate] ~ span{white-space:nowrap;}#weekGrid.grid-cols-7 [title]{gap:0!important;}#weekGrid.grid-cols-7 [title] .truncate{display:none!important;}#weekGrid.grid-cols-7 .space-y-0\.5{display:flex!important;flex-wrap:wrap;gap:3px;}#weekGrid.grid-cols-7 .space-y-0\.5 > * + *{margin-top:0!important;}.mois-plus-mot{display:none;}#weekGrid{min-height:240px!important;}header button[aria-label="Ouvrir le menu"]{padding:.5rem!important;min-width:40px;min-height:40px;}.etiq-mois{font-size:10.5px!important;}main .text-\[9\.5px\]{font-size:10.5px!important;}.heros-verdict{min-height:144px;}.actions-tete{width:100%;justify-content:stretch!important;}.actions-tete > button{flex:1 1 100%;justify-content:center;padding-top:.6rem!important;padding-bottom:.6rem!important;}.mc-table thead{display:none!important;}.mc-table,.mc-table tbody{display:block!important;width:100%!important;}.mc-table tr{display:block!important;border:1px solid #ece9f7!important;border-radius:14px!important;background:#fff!important;padding:6px 12px!important;margin-bottom:10px!important;box-shadow:0 1px 2px rgba(1,48,66,.05);}.mc-table tr.zebra{background:#fff!important;}.mc-table td{display:flex!important;align-items:center;justify-content:space-between;gap:14px;width:auto!important;padding:6px 0!important;border:0!important;border-top:1px solid #f4f3fb!important;text-align:right!important;white-space:normal!important;font-size:13px;}.mc-table tr td:first-child{border-top:0!important;}.mc-table td::before{content:attr(data-label);font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;text-align:left;flex:0 0 auto;margin-right:auto;}.mc-table td:empty{display:none!important;}.mc-table td>*{text-align:right;}.mc-table tr.mc-sep{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:14px 0 4px!important;}.mc-table tr.mc-sep td{display:block!important;border:0!important;padding:0!important;text-align:left!important;}.mc-table tr.mc-sep td::before{display:none!important;}.mc-table td[data-label="N° rapport"],.mc-table td[data-label="Technicien"]{display:none!important;}tbody.data-rows > tr.data-row > td:first-child::before{display:none!important;}section .truncate{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;}} /* ---- helia-tablette-css ---- */ @media (min-width:641px) and (max-width:1023px){main table[class*="min-w-"]{min-width:0!important;}#tblInterv th:nth-child(4),#tblInterv tbody td:nth-child(4):not([colspan]),#tblInterv th:nth-child(6),#tblInterv tbody td:nth-child(6):not([colspan]),#tblDocs th:nth-child(1),#tblDocs tbody td:nth-child(1):not([colspan]),#tblDocs th:nth-child(3),#tblDocs tbody td:nth-child(3):not([colspan]){display:none!important;}main table th,main table td{padding-left:.5rem!important;padding-right:.5rem!important;}.dossier-carte{flex-direction:column!important;align-items:stretch!important;}.dossier-carte .dossier-cta,.dossier-carte > a{width:100%!important;}.site-tete{flex-wrap:wrap!important;}.site-meta{flex-wrap:wrap;gap:.35rem .75rem!important;}.site-meta > span{white-space:nowrap;}.heros-verdict{min-height:83px;}} /* ---- helia-skeleton-css ---- */ :root{--sk-bg:#e9e7f3;--sk-shine:rgba(255,255,255,.65);}.sk{position:relative;overflow:hidden;background:var(--sk-bg);border-radius:8px;display:block;}.sk-inline{display:inline-block;}.sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,var(--sk-shine),transparent);animation:helia-sk-sweep 1.5s ease-in-out infinite;}@keyframes helia-sk-sweep{100%{transform:translateX(100%);}}@keyframes helia-sk-pulse{0%,100%{opacity:1;}50%{opacity:.5;}}@media (prefers-reduced-motion:reduce){.sk::after{display:none;}.sk{animation:helia-sk-pulse 1.6s ease-in-out infinite;}} /* ---- helia-portal-dark-css ---- */ html[data-theme='dark']{--sk-bg:#132a35;--sk-shine:rgba(92,197,224,.10);} html[data-theme='dark'] .helia-wordmark{color:#E8F4F9!important;} html[data-theme='dark'] body,html[data-theme='dark'] .grain,html[data-theme='dark'] .bg-\[\#F4F8FA\]{background-color:#0b2530!important;} html[data-theme='dark'] .bg-white,html[data-theme='dark'] .bg-white\/85,html[data-theme='dark'] .bg-white\/90,html[data-theme='dark'] .bg-white\/70{background-color:#123040!important;} html[data-theme='dark'] .bg-\[\#fbfbfe\]\/95,html[data-theme='dark'] .bg-slate-50,html[data-theme='dark'] .bg-slate-50\/40,html[data-theme='dark'] .bg-slate-50\/60,html[data-theme='dark'] .bg-slate-50\/70,html[data-theme='dark'] .bg-slate-100{background-color:#16394a!important;} html[data-theme='dark'] .border-slate-100,html[data-theme='dark'] .border-slate-200,html[data-theme='dark'] .border-slate-200\/70,html[data-theme='dark'] .border-slate-300,html[data-theme='dark'] .divide-slate-100>:not([hidden])~:not([hidden]){border-color:#1e4a5c!important;} html[data-theme='dark'] .text-ink,html[data-theme='dark'] .text-ink-soft{color:#5CC5E0!important;} html[data-theme='dark'] .text-ink-deep{color:#BEE4F0!important;} html[data-theme='dark'] .bg-ink-50,html[data-theme='dark'] .bg-ink-50\/70,html[data-theme='dark'] .bg-ink\/5,html[data-theme='dark'] .bg-ink\/10{background-color:rgba(0,140,180,.20)!important;} html[data-theme='dark'] .border-ink{border-color:#2E9BC0!important;} html[data-theme='dark'] .text-euca{color:#5fd0a8!important;} html[data-theme='dark'] .bg-euca\/10,html[data-theme='dark'] .bg-euca\/15{background-color:rgba(95,208,168,.14)!important;} html[data-theme='dark'] .bg-\[\#E1F3F9\]{background-color:rgba(0,140,180,.18)!important;}html[data-theme='dark'] .border-\[\#A6D9E8\]{border-color:rgba(0,140,180,.40)!important;}html[data-theme='dark'] .text-\[\#008CB4\]{color:#7FD3E8!important;} html[data-theme='dark'] .bg-\[\#E0F5F4\]{background-color:rgba(20,168,159,.15)!important;}html[data-theme='dark'] .border-\[\#9CDDD9\]{border-color:rgba(20,168,159,.40)!important;}html[data-theme='dark'] .text-\[\#0E6E6A\]{color:#5eead4!important;} html[data-theme='dark'] .bg-\[\#FCE7F4\]{background-color:rgba(214,37,143,.15)!important;}html[data-theme='dark'] .border-\[\#F3B4D9\]{border-color:rgba(214,37,143,.42)!important;}html[data-theme='dark'] .text-\[\#A41E73\]{color:#f0abdc!important;} html[data-theme='dark'] .bg-\[\#E6ECFB\]{background-color:rgba(61,99,221,.15)!important;}html[data-theme='dark'] .border-\[\#B3C4F0\]{border-color:rgba(61,99,221,.42)!important;}html[data-theme='dark'] .text-\[\#2A4699\]{color:#9db4f5!important;} html[data-theme='dark'] [data-sema='1']{background:rgba(16,185,129,.16)!important;color:#6ee7b7!important;border-color:rgba(16,185,129,.42)!important;} html[data-theme='dark'] [data-sema='2']{background:rgba(132,204,22,.16)!important;color:#bef264!important;border-color:rgba(132,204,22,.42)!important;} html[data-theme='dark'] [data-sema='3']{background:rgba(245,158,11,.16)!important;color:#fcd34d!important;border-color:rgba(245,158,11,.42)!important;} html[data-theme='dark'] [data-sema='4']{background:rgba(249,115,22,.16)!important;color:#fdba74!important;border-color:rgba(249,115,22,.42)!important;} html[data-theme='dark'] [data-sema='5']{background:rgba(239,68,68,.16)!important;color:#fca5a5!important;border-color:rgba(239,68,68,.42)!important;} html[data-theme='dark'] [data-sema='0']{background:rgba(148,163,184,.15)!important;color:#cbd5e1!important;border-color:rgba(148,163,184,.34)!important;} html[data-theme='dark'] .shadow-card{box-shadow:0 1px 3px rgba(0,0,0,.35),0 1px 2px rgba(0,0,0,.25)!important;} html[data-theme='dark'] .nav-active{background:rgba(0,140,180,.20)!important;box-shadow:none!important;} html[data-theme='dark'] tbody.data-rows>tr.zebra,html[data-theme='dark'] tbody.data-rows>tr.data-row.zebra{background-color:rgba(255,255,255,.035)!important;} html[data-theme='dark'] .\[\&\>th\]\:bg-\[\#fbfbfe\]\/95>th{background-color:#16394a!important;} html[data-theme='dark'] .hero-sheen{opacity:0!important;} html[data-theme='dark'] #tfa-modal-box{background:#123040!important;color:#e2e8f0!important;} html[data-theme='dark'] #tfa-modal-box h2{color:#e2e8f0!important;}html[data-theme='dark'] #tfa-modal-box p{color:#94a3b8!important;}html[data-theme='dark'] #tfa-modal-box code{color:#BEE4F0!important;} html[data-theme='dark'] #tfa-modal-box input{background:#16394a!important;color:#e2e8f0!important;border-color:#1e4a5c!important;} html[data-theme='dark'] #tfa-modal-box #tfa-cancel{background:#16394a!important;color:#e2e8f0!important;border-color:#1e4a5c!important;} html[data-theme='dark'] ::-webkit-scrollbar-thumb{background-color:#4a4276;background-clip:content-box;} /* ---- navigation : l'effet APPLICATION (§fluidite-3, video Paul du 2026-08-07) ---- Reference : console Scaleway, ou le menu ne bouge JAMAIS entre deux pages. Deux pieces : 1) portal-tailwind.css (genere) : les classes Tailwind sont compilees en statique, la page nait STYLEE — la garde d'hier (`helia-attente`, qui masquait en attendant le CDN) est SUPPRIMEE : c'etait elle qui blanchissait l'ecran a chaque clic. 2) Transitions de vue entre documents (Chrome 126+, Safari 18.2+) : le rail et la topbar recoivent un nom de transition — identiques d'une page a l'autre, ils restent VISUELLEMENT FIGES pendant que le contenu fond en douceur. Navigateur plus ancien : navigation normale. */ @view-transition { navigation: auto; } @media (min-width:768px){ aside[data-sidebar]{view-transition-name:helia-rail;} header.h-14{view-transition-name:helia-topbar;} } ::view-transition-old(root),::view-transition-new(root){animation-duration:.16s;} @media (prefers-reduced-motion: reduce){ ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important;} } /* Le bloc d'actions du rail (Contacter Helia) est injecte par portal-extras apres la premiere peinture : sans place reservee, le pied du menu descendait de ~50px une fois le bouton pose. */ @media (min-width:768px){ .portal-actions{min-height:53px;} } /* ---- reservations §fluidite-3 : rien ne bouge apres la premiere peinture ---- 1) main est le SEUL ascenseur : quand le contenu arrive et depasse l'ecran, la barre apparaissait et resserrait toute la page de 8px (chaque ligne de tableau sursautait). La gouttiere est reservee en permanence. 2) topbar droite : le bouton de recherche ⌘K est insere par portal-ui APRES la peinture ; la cloche glissait de ~180px a chaque page. La place est reservee, alignee a droite. 3) grille des sites : les cartes remplacent leurs squelettes (82 -> ~370px chacune) ; la hauteur du parc de la demo (2 rangees) est reservee pour que le pied ne saute pas. */ main{scrollbar-gutter:stable;} @media (min-width:768px){ #topbar-right{min-width:196px;justify-content:flex-end;} #sitesGrid{min-height:947px;} /* Tant que la grille charge (aria-busy), ses rangées de squelettes prennent la hauteur d'une vraie carte : sans cela, auto-rows-fr étirait 6 squelettes sur toute la réserve (rangées de 460px) puis les 9 cartes retombaient à ~305px — tout l'écran ondulait. */ #sitesGrid[aria-busy]{grid-auto-rows:305px;align-content:start;} } /* Le bouton de recherche ⌘K, créé par portal-ui puis DÉPLACÉ à gauche de la cloche, gardait sa place pendant le trajet (visibility:hidden) : la topbar se réagençait deux fois par page. Tant qu'il n'est pas posé, il ne doit occuper AUCUNE place. */ [data-search-trigger]:not([data-placed]){display:none!important;} /* ---- rail replie : etat applique AVANT la premiere peinture ---- Le script en tete de page pose `rail-replie-init` sur d'apres le choix memorise. Sans lui, la barre laterale naissait a 225px puis sautait a 53px des que le shell s'executait. Les regles de repli elles-memes vivent dans portal-shell.js (elles sont posees sur l'aside) ; ici on ne fixe que la GEOMETRIE, seule responsable du saut. */ @media (min-width:768px){ html.rail-replie-init aside[data-sidebar]{width:3.5rem;} html.rail-replie-init aside[data-sidebar] .rail-texte{display:none;} html.rail-replie-init aside[data-sidebar] .rail-symbole{display:flex;} }