#viewFlightFollowing { --navy:#0A1628; --navy-2:#0F2036; --navy-3:#152a45; --gold:#F0A500; --gold-dim:#c98900; --red:#C0392B; --orange:#E67E22; --yellow:#E0C22A; --green:#27AE60; --line:#22354f; --txt:#E8EDF4; --txt-dim:#8fa2bd; } #viewFlightFollowing * {box-sizing:border-box;} #viewFlightFollowing {height:100%;margin:0;background:var(--navy);color:var(--txt);font-family:'Montserrat',sans-serif;overflow:hidden;} #viewFlightFollowing #app {display:grid;grid-template-rows:52px 1fr 26px;grid-template-columns:310px 1fr 320px;height:100%;} #viewFlightFollowing #topbar { grid-column:1/4;grid-row:1; background:linear-gradient(90deg,var(--navy-2),var(--navy-3)); border-bottom:1px solid var(--line); display:flex;align-items:center;justify-content:space-between; padding:0 16px;z-index:1000; } #viewFlightFollowing #topbar .brand {display:flex;align-items:center;gap:10px;} #viewFlightFollowing #topbar .brand .logo { width:30px;height:30px;border-radius:6px; background:linear-gradient(135deg,var(--gold),var(--gold-dim)); display:flex;align-items:center;justify-content:center; font-family:'Zilla Slab',serif;font-weight:700;color:var(--navy);font-size:15px; } #viewFlightFollowing #topbar .brand .title {font-family:'Zilla Slab',serif;font-weight:700;font-size:16px;letter-spacing:.5px;} #viewFlightFollowing #topbar .brand .title span {color:var(--gold);} #viewFlightFollowing #topbar .brand .sub {font-size:10px;color:var(--txt-dim);letter-spacing:1.5px;margin-top:-2px;} #viewFlightFollowing #topbar .center-group {display:flex;align-items:center;gap:18px;} #viewFlightFollowing #searchbox { background:var(--navy);border:1px solid var(--line);border-radius:6px; padding:6px 10px;color:var(--txt);font-family:'JetBrains Mono',monospace;font-size:12px; width:200px;letter-spacing:1px; } #viewFlightFollowing #searchbox::placeholder {color:var(--txt-dim);} #viewFlightFollowing #searchbox:focus {outline:none;border-color:var(--gold);} #viewFlightFollowing .timemult {display:flex;background:var(--navy);border:1px solid var(--line);border-radius:6px;overflow:hidden;} #viewFlightFollowing .timemult button { background:transparent;border:none;color:var(--txt-dim);padding:6px 10px;font-size:11px; font-family:'JetBrains Mono',monospace;cursor:pointer;border-right:1px solid var(--line); } #viewFlightFollowing .timemult button:last-child {border-right:none;} #viewFlightFollowing .timemult button.active {background:var(--gold);color:var(--navy);font-weight:700;} #viewFlightFollowing #utcclock { font-family:'JetBrains Mono',monospace;font-size:15px;letter-spacing:1px; background:var(--navy);border:1px solid var(--line);border-radius:6px;padding:6px 12px;color:var(--gold); } #viewFlightFollowing #utcclock small {color:var(--txt-dim);font-size:9px;display:block;letter-spacing:2px;margin-top:1px;} #viewFlightFollowing .role-badge { font-size:9px;letter-spacing:1px;color:var(--txt-dim);border:1px solid var(--line); padding:4px 8px;border-radius:4px;font-weight:600; } #viewFlightFollowing #left { grid-column:1;grid-row:2;background:var(--navy-2);border-right:1px solid var(--line); display:flex;flex-direction:column;overflow:hidden; } #viewFlightFollowing .panel-head { padding:10px 14px 8px;border-bottom:1px solid var(--line); display:flex;justify-content:space-between;align-items:center; } #viewFlightFollowing .panel-head h3 {margin:0;font-size:11px;letter-spacing:1.5px;color:var(--gold);font-weight:700;} #viewFlightFollowing .panel-head .count {font-size:10px;color:var(--txt-dim);font-family:'JetBrains Mono',monospace;} #viewFlightFollowing #sms-dashboard {padding:10px 14px;border-bottom:1px solid var(--line);} #viewFlightFollowing #sms-dashboard .dash-title {font-size:9px;color:var(--gold);letter-spacing:1.5px;margin-bottom:8px;font-weight:700;} #viewFlightFollowing .dash-grid {display:grid;grid-template-columns:repeat(4,1fr);gap:6px;} #viewFlightFollowing .dash-cell {border-radius:6px;padding:7px 4px;text-align:center;border:1px solid var(--line);} #viewFlightFollowing .dash-cell .n {font-family:'JetBrains Mono',monospace;font-size:16px;font-weight:700;} #viewFlightFollowing .dash-cell .l {font-size:8px;letter-spacing:.5px;color:var(--txt-dim);margin-top:2px;text-transform:uppercase;} #viewFlightFollowing .sortbar {padding:8px 14px;border-bottom:1px solid var(--line);display:flex;gap:6px;} #viewFlightFollowing .sortbar button { flex:1;background:var(--navy);border:1px solid var(--line);color:var(--txt-dim); padding:5px;font-size:10px;border-radius:5px;cursor:pointer;letter-spacing:.5px; } #viewFlightFollowing .sortbar button.active {background:var(--gold);color:var(--navy);font-weight:700;border-color:var(--gold);} #viewFlightFollowing #flightlist {overflow:visible;flex:none;} #viewFlightFollowing #left{overflow-y:auto;} #viewFlightFollowing .fcard { padding:10px 14px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s; border-left:3px solid transparent; } #viewFlightFollowing .fcard:hover {background:var(--navy-3);} #viewFlightFollowing .fcard.selected {background:var(--navy-3);border-left-color:var(--gold);} #viewFlightFollowing .fcard-top {display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:3px;}.fcard-top .risk-chip{flex-shrink:0;} #viewFlightFollowing .fcard-call {font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px;letter-spacing:.5px;color:#EAF1FB;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} #viewFlightFollowing .risk-chip { font-size:9px;font-weight:700;padding:2px 7px;border-radius:10px;letter-spacing:.5px; } #viewFlightFollowing .fcard-route {font-size:11px;color:var(--txt-dim);font-family:'JetBrains Mono',monospace;} #viewFlightFollowing .fcard-meta {display:flex;justify-content:space-between;font-size:10px;color:var(--txt-dim);margin-top:4px;} #viewFlightFollowing .fcard-op {font-size:9px;color:var(--gold-dim);letter-spacing:.5px;text-transform:uppercase;margin-top:2px;} #viewFlightFollowing .fcard-factors {display:flex;gap:4px;margin-top:5px;flex-wrap:wrap;} #viewFlightFollowing .factor-tag {font-size:8px;padding:1px 5px;border-radius:3px;background:var(--navy);border:1px solid var(--line);color:var(--txt-dim);} #viewFlightFollowing .factor-tag.hot {border-color:var(--red);color:#ff9d90;} #viewFlightFollowing .factor-tag.warm {border-color:var(--orange);color:#ffbf80;} #viewFlightFollowing .legend-box {padding:10px 14px;border-top:1px solid var(--line);font-size:10px;color:var(--txt-dim);} #viewFlightFollowing .legend-row {display:flex;align-items:center;gap:6px;margin-bottom:5px;} #viewFlightFollowing .legend-row .dot {width:8px;height:8px;border-radius:50%;flex-shrink:0;} #viewFlightFollowing #mapwrap {grid-column:2;grid-row:2;position:relative;background:#000;} #viewFlightFollowing #map {width:100%;height:100%;background:#050a12;} #viewFlightFollowing .layers-wrap {position:relative;} #viewFlightFollowing .layers-btn { display:flex;align-items:center;gap:6px; background:var(--navy);border:1px solid var(--line);border-radius:6px; padding:6px 10px;color:var(--txt-dim);cursor:pointer;font-size:10px;letter-spacing:1px; font-family:'Montserrat',sans-serif;font-weight:600;transition:border-color .15s,color .15s; } #viewFlightFollowing .layers-btn:hover {color:var(--txt);border-color:var(--gold-dim);} #viewFlightFollowing .layers-btn.open {color:var(--gold);border-color:var(--gold);} #viewFlightFollowing .layers-btn svg {width:14px;height:14px;flex-shrink:0;} #viewFlightFollowing #layerctl { position:absolute;top:calc(100% + 8px);right:0;z-index:1200; background:rgba(10,22,40,.97);border:1px solid var(--line);border-radius:8px; width:230px;backdrop-filter:blur(4px); box-shadow:0 8px 24px rgba(0,0,0,.5); opacity:0;transform:translateY(-6px);pointer-events:none; transition:opacity .15s ease,transform .15s ease; } #viewFlightFollowing #layerctl.open {opacity:1;transform:translateY(0);pointer-events:auto;} #viewFlightFollowing .lc-head { padding:9px 12px;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:1.5px;color:var(--gold);font-weight:700; } #viewFlightFollowing .lc-item {padding:8px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:12px;} #viewFlightFollowing .lc-item:last-child {border-bottom:none;} #viewFlightFollowing .lc-item label {display:flex;align-items:center;gap:8px;cursor:pointer;flex:1;} #viewFlightFollowing .switch {position:relative;width:32px;height:17px;flex-shrink:0;} #viewFlightFollowing .switch input {opacity:0;width:0;height:0;} #viewFlightFollowing .slider {position:absolute;cursor:pointer;inset:0;background:var(--line);border-radius:20px;transition:.2s;} #viewFlightFollowing .slider:before {content:"";position:absolute;width:13px;height:13px;left:2px;top:2px;background:#8fa2bd;border-radius:50%;transition:.2s;} #viewFlightFollowing input:checked + .slider {background:var(--gold-dim);} #viewFlightFollowing input:checked + .slider:before {transform:translateX(15px);background:var(--navy);} #viewFlightFollowing .lc-icon {width:14px;text-align:center;opacity:.8;} #viewFlightFollowing .lc-sub {padding:6px 12px 10px;} #viewFlightFollowing .lc-sub input[type=range] {width:100%;accent-color:var(--gold);} #viewFlightFollowing .lc-sub-label {font-size:9px;color:var(--txt-dim);display:flex;justify-content:space-between;margin-bottom:3px;} #viewFlightFollowing #basemap-switch { position:absolute;bottom:12px;left:12px;z-index:800; display:flex;background:rgba(10,22,40,.92);border:1px solid var(--line);border-radius:8px;overflow:hidden; } #viewFlightFollowing #basemap-switch button { background:transparent;border:none;color:var(--txt-dim);padding:8px 12px;font-size:10px;letter-spacing:1px; cursor:pointer;border-right:1px solid var(--line);font-family:'Montserrat',sans-serif;font-weight:600; } #viewFlightFollowing #basemap-switch button:last-child {border-right:none;} #viewFlightFollowing #basemap-switch button.active {background:var(--gold);color:var(--navy);} #viewFlightFollowing #wx-anim-ctl { position:absolute;bottom:12px;right:12px;z-index:800;display:none; background:rgba(10,22,40,.92);border:1px solid var(--line);border-radius:8px; padding:8px 12px;align-items:center;gap:10px;font-size:10px;color:var(--txt-dim); } #viewFlightFollowing #wx-anim-ctl.show {display:flex;} #viewFlightFollowing #wx-anim-ctl button {background:var(--gold);border:none;color:var(--navy);width:26px;height:26px;border-radius:50%;cursor:pointer;font-weight:700;} #viewFlightFollowing #wx-anim-ctl .wxtime {font-family:'JetBrains Mono',monospace;color:var(--gold);min-width:56px;} #viewFlightFollowing .map-note { position:absolute;top:12px;left:12px;z-index:800; background:rgba(10,22,40,.85);border:1px solid var(--line);border-radius:6px; padding:6px 10px;font-size:9.5px;color:var(--txt-dim);max-width:280px;letter-spacing:.2px;line-height:1.4; } #viewFlightFollowing #right {grid-column:3;grid-row:2;background:var(--navy-2);border-left:1px solid var(--line);overflow-y:auto;} #viewFlightFollowing .empty-state {padding:40px 20px;text-align:center;color:var(--txt-dim);font-size:12px;line-height:1.6;} #viewFlightFollowing .empty-state .ico {font-size:30px;margin-bottom:10px;opacity:.5;} #viewFlightFollowing .detail-head {padding:16px;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;justify-content:space-between;gap:12px;background:var(--navy-2);position:static;margin:0;} #viewFlightFollowing .detail-head-main{min-width:0;flex:1;} #viewFlightFollowing .detail-call {font-family:'JetBrains Mono',monospace;font-size:22px;font-weight:800;letter-spacing:1px;color:#EAF1FB;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} #viewFlightFollowing .detail-op {font-size:10px;color:var(--gold);letter-spacing:1px;text-transform:uppercase;margin-top:4px;line-height:1.4;word-break:break-word;} #viewFlightFollowing .detail-badge { flex-shrink:0;margin-top:2px;padding:6px 12px;border-radius:20px;font-size:11px; font-weight:800;letter-spacing:.5px;white-space:nowrap; } #viewFlightFollowing .detail-grid {padding:14px 16px;display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;} #viewFlightFollowing .dg-item {} #viewFlightFollowing .dg-label {font-size:9px;color:var(--txt-dim);letter-spacing:1px;text-transform:uppercase;margin-bottom:3px;} #viewFlightFollowing .dg-val {font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:600;} #viewFlightFollowing .dg-val.small {font-size:12px;font-weight:400;} #viewFlightFollowing .detail-sect {padding:12px 16px;border-top:1px solid var(--line);} #viewFlightFollowing .detail-sect h4 {margin:0 0 8px;font-size:10px;color:var(--gold);letter-spacing:1.5px;} #viewFlightFollowing .route-line { flex:none;height:auto;position:static;margin:0;background:none; font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--txt-dim); line-height:1.7;word-break:break-word;overflow-wrap:break-word;white-space:normal; } #viewFlightFollowing .progressbar {height:5px;background:var(--navy);border-radius:3px;overflow:hidden;margin-top:8px;} #viewFlightFollowing .progressbar-fill {height:100%;background:linear-gradient(90deg,var(--gold-dim),var(--gold));} #viewFlightFollowing .followbtn { margin:18px 16px 14px;width:calc(100% - 32px);padding:9px;background:var(--gold);color:var(--navy); border:none;border-radius:6px;font-weight:700;font-size:11px;letter-spacing:1px;cursor:pointer; } #viewFlightFollowing .followbtn:hover {background:#ffb520;} #viewFlightFollowing .rf-item {margin-bottom:12px;} #viewFlightFollowing .rf-label {font-size:10px;color:var(--txt-dim);margin-bottom:5px;display:flex;justify-content:space-between;} #viewFlightFollowing .rf-label b {color:var(--txt);font-weight:600;} #viewFlightFollowing .rf-options {display:flex;gap:4px;} #viewFlightFollowing .rf-opt { flex:1;text-align:center;font-size:9px;padding:6px 2px;border-radius:5px;border:1px solid var(--line); background:var(--navy);color:var(--txt-dim);cursor:pointer;line-height:1.3; } #viewFlightFollowing .rf-opt.active {background:var(--gold);color:var(--navy);font-weight:700;border-color:var(--gold);} #viewFlightFollowing .rf-opt.active.sev3 {background:var(--orange);} #viewFlightFollowing .rf-opt.active.sev4, #viewFlightFollowing .rf-opt.active.sev5 {background:var(--red);} #viewFlightFollowing .risk-summary { margin:0 16px 14px;padding:12px;border-radius:8px;border:1px solid var(--line);background:var(--navy); } #viewFlightFollowing .risk-summary-row {display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;} #viewFlightFollowing .risk-summary-row:last-child {margin-bottom:0;} #viewFlightFollowing .risk-summary-label {font-size:10px;color:var(--txt-dim);} #viewFlightFollowing .risk-summary-val {font-family:'JetBrains Mono',monospace;font-weight:700;font-size:13px;} #viewFlightFollowing .risk-action { margin-top:10px;padding:8px 10px;border-radius:6px;font-size:10.5px;line-height:1.5;font-weight:600; } #viewFlightFollowing .matrix5 { display:grid;grid-template-columns:repeat(5,1fr);gap:2px;margin-top:8px; } #viewFlightFollowing .matrix5 .mcell { aspect-ratio:1;border-radius:3px;display:flex;align-items:center;justify-content:center; font-size:9px;font-family:'JetBrains Mono',monospace;color:rgba(0,0,0,.55);font-weight:700; position:relative; } #viewFlightFollowing .matrix5 .mcell.current {outline:2px solid #fff;outline-offset:-2px;color:#0A1628;} #viewFlightFollowing .matrix-axis {font-size:8px;color:var(--txt-dim);text-align:center;margin-top:4px;letter-spacing:1px;} #viewFlightFollowing #statusbar { grid-column:1/4;grid-row:3;background:var(--navy);border-top:1px solid var(--line); display:flex;align-items:center;justify-content:space-between;padding:0 14px; font-size:10px;color:var(--txt-dim);letter-spacing:.5px; } /* ── v226.170 — LE PANNEAU DE DETAIL RESTE DANS LE CADRE ─────────────────── Mesure du 17/09 : le panneau recevait son contenu mais vivait a x=1640 pour une fenetre de 1700, et s'etirait sur 10 226 px de haut. Il devient collant en haut et a droite du cadre de la vue : toujours visible, a la hauteur de son contenu, defilant en lui-meme au-dela de l'ecran ([558]). */ #viewCrewSchedule .crew-layout, #viewCrewManagement .cm-layout, #viewTraining .cm-layout{ align-items:flex-start; } #viewCrewSchedule #crewDetailPanel, #viewCrewManagement #cmDetailPanel, #viewTraining #trDetailPanel{ position:sticky; top:0; right:0; align-self:flex-start; z-index:60; max-height:calc(100vh - 77px); overflow-y:auto; box-shadow:-14px 0 24px -18px rgba(10,26,64,.5); } /* ── v226.170 — LES FILTRES DE CREW SCHEDULING TIENNENT SUR UNE LIGNE ──── */ #viewCrewSchedule .controlbar{ padding:10px 26px; row-gap:8px; } #viewCrewSchedule .cs-filters{ flex-wrap:nowrap; flex-shrink:0; gap:7px; } #viewCrewSchedule .cs-filters select, #viewCrewSchedule .cs-filters input{ padding:4px 6px; } #viewCrewSchedule .cs-filters label{ white-space:nowrap; } #viewCrewSchedule .cs-filters #csSearch{ min-width:150px; } /* La legende prend sa propre ligne, pleine largeur : treize reperes tiennent alors sur UNE rangee au lieu de trois colonnes serrees a droite, et la barre redescend a la hauteur d'une barre d'outils. */ #viewCrewSchedule .controlbar{ flex-wrap:wrap; } #viewCrewSchedule .datenav{ flex-shrink:0; } #viewCrewSchedule .datenav .today{ white-space:nowrap; min-width:0; } #viewCrewSchedule .legend{ flex:1 0 100%; margin-left:0; flex-wrap:wrap; justify-content:flex-start; gap:4px 14px; min-width:0; padding-top:2px; border-top:1px solid var(--line); } #viewCrewSchedule .legend-item{ font-size:10px; white-space:nowrap; } /* ── v226.181 — LA GRILLE DU ROSTER VA JUSQU'AU BORD DU CADRE ────────────── Mesure du 19/09 : cadre 1 680 px, grille 1 204 px, 476 px de blanc a droite. Cause : `flex:0 0 auto` pose par l'etape 111 sur une rangee, ou `flex` gouverne la LARGEUR et non la hauteur — le meme defaut que l'etape 112 avait corrige pour les vues Crew, le Roster ayant ete oublie. Le defilement vertical de la vue n'est pas touche : il ne depend pas de `flex` ici. */ #viewRoster #roster-root .r-gridwrap{ flex:1 1 auto; width:100%; min-width:0; } /* `table-layout:fixed` : les largeurs viennent de la RANGEE D'EN-TETE. Sans cela la colonne des noms — une `td` en `display:flex`, donc hors du calcul de table — s'etirait a 355 px en mangeant les colonnes de jour (mesure du 19/09). */ #viewRoster #roster-root table.r-table{ width:100%; table-layout:fixed; } #viewRoster #roster-root .r-corner{ width:214px; } /* les colonnes de jour partagent la largeur rendue au lieu d'etre plafonnees a 33 px ; le PLANCHER de 33 px reste, donc une fenetre etroite defile comme avant */ #viewRoster #roster-root th.r-daycol, #viewRoster #roster-root td.r-cell{ max-width:none; } /* la colonne des noms garde sa largeur, son accroche et son debordement masque */ #viewRoster #roster-root td.r-namecell{ min-width:0; max-width:none; width:214px; overflow:hidden; } /* les cellules respirent a proportion de la largeur gagnee */ #viewRoster #roster-root td.r-cell{ height:44px; } #viewRoster #roster-root td.r-cell .cell-lbl{ font-size:9.4px; } #viewRoster #roster-root td.r-cell .cell-lbl.sub{ font-size:8.2px; } #viewRoster #roster-root th.r-daycol{ font-size:11.5px; padding:7px 2px 8px; } #viewRoster #roster-root th.r-daycol .dow{ font-size:8px; } /* ── v226.169 — LE MODULE CREW DEFILE D'UN BLOC ──────────────────────────── Mesure du 17/09 : chaque vue etait figee (overflow:hidden) et tout le defilement vivait dans un panneau interne de 441 a 579 px de haut — la moitie de l'ecran perdue en cartes et en filtres qu'on ne pouvait pas faire defiler. Desormais il n'y a qu'UNE zone de defilement par vue : la vue. Les panneaux internes rendent leur hauteur imposee ; les en-tetes de colonnes et la colonne des noms, deja en position sticky, s'accrochent a la vue et restent figes pendant que tout l'ecran defile ([557]). */ #viewCrewSchedule .crew-scroll, #viewRoster .r-gridwrap, #viewCrewManagement .cm-main, #viewTraining #trMain{ flex:0 0 auto; height:auto; max-height:none; overflow:visible; } /* Les parents ne bornent plus la hauteur de leur enfant : sans cela le panneau garderait la hauteur du cadre et rien n'aurait change. */ #viewCrewSchedule .crew-layout, #viewCrewManagement .cm-layout, #viewTraining .cm-layout, #viewRoster .r-body, #viewRoster #roster-root{ min-height:0; height:auto; max-height:none; overflow:visible; flex:0 0 auto; } /* ── v226.168 — FLIGHT FOLLOWING : LA CARTE D'ABORD ──────────────────────── 1. les commandes du module vivent dans le bandeau du produit, et seulement dans cette vue (body.fw-topbar) ; 2. la carte occupe tout le cadre : la liste et le detail sont des tiroirs ; 3. LAYERS est pose sur la carte, la ou on le cherche. */ #fwTopHost{ --navy:#0A1628; --navy-2:#0F2036; --navy-3:#152a45; --gold:#F0A500; --gold-dim:#c98900; --line:#22354f; --txt:#E8EDF4; --txt-dim:#8fa2bd; display:none; align-items:center; gap:9px; flex-wrap:nowrap; flex-shrink:0; } body.fw-topbar #fwTopHost{ display:flex; } /* Une commande ne se laisse pas rogner par le titre : chaque piece garde sa taille, c'est le titre qui s'abrege (il est deja dans l'onglet et dans le menu). */ #fwTopHost > *{ flex-shrink:0; } /* le bouton ERP est injecte avec un style en ligne : seul !important peut aligner sa hauteur sur celle de ses voisins. */ body.fw-topbar #fw-erp-btn{ white-space:nowrap; padding:6px 10px !important; } body.fw-topbar #fw-live-btn{ white-space:nowrap; } body.fw-topbar .topbar-left{ min-width:0; } body.fw-topbar .topbar-left h1, body.fw-topbar .topbar-left p{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } #fwTopHost #searchbox{ background:var(--navy); border:1px solid var(--line); border-radius:6px; padding:6px 10px; color:var(--txt); font-family:'JetBrains Mono',monospace; font-size:11px; width:136px; letter-spacing:.4px; } #fwTopHost #searchbox::placeholder{ color:var(--txt-dim); } #fwTopHost #searchbox:focus{ outline:none; border-color:var(--gold); } #fwTopHost .timemult{ display:flex; background:var(--navy); border:1px solid var(--line); border-radius:6px; overflow:hidden; } #fwTopHost .timemult button{ background:transparent; border:none; color:var(--txt-dim); padding:6px 7px; font-size:10.5px; font-family:'JetBrains Mono',monospace; cursor:pointer; border-right:1px solid var(--line); } #fwTopHost .timemult button:last-child{ border-right:none; } #fwTopHost .timemult button.active{ background:var(--gold); color:var(--navy); font-weight:700; } #fwTopHost #utcclock{ font-family:'JetBrains Mono',monospace; font-size:14px; letter-spacing:1px; text-align:center; background:var(--navy); border:1px solid var(--line); border-radius:6px; padding:4px 8px; color:var(--gold); } #fwTopHost #utcclock small{ color:var(--txt-dim); font-size:9px; display:block; letter-spacing:2px; margin-top:1px; } #fwTopHost .fw-listbtn{ display:flex; align-items:center; gap:6px; white-space:nowrap; background:var(--navy); border:1px solid var(--line); border-radius:6px; padding:6px 11px; color:var(--txt-dim); cursor:pointer; font-size:10px; letter-spacing:1px; font-family:'Montserrat',sans-serif; font-weight:600; transition:border-color .15s, color .15s; } #fwTopHost .fw-listbtn svg{ width:14px; height:14px; flex-shrink:0; } #fwTopHost .fw-listbtn:hover{ color:var(--txt); border-color:var(--gold-dim); } #fwTopHost .fw-listbtn:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; } #fwTopHost .fw-listbtn.on{ background:var(--gold); border-color:var(--gold); color:var(--navy); font-weight:700; } /* ── la carte, plein cadre ─────────────────────────────────────────────── */ #viewFlightFollowing #app{ grid-template-rows:1fr; grid-template-columns:1fr; position:relative; } #viewFlightFollowing #mapwrap{ grid-column:1; grid-row:1; } /* le tiroir de detail recouvre le coin haut-droit de la carte : LAYERS se decale pour rester atteignable tant qu'il est ouvert. */ #viewFlightFollowing #mapwrap .layers-btn{ background:rgba(10,22,40,.92); } /* ── v226.173 — FRANCHISSEMENTS FIR ET VUE TABLEAU ─────────────────────────*/ #viewFlightFollowing .fw-fir-l{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-family:'JetBrains Mono',monospace; font-size:11.5px; padding:2px 0; } #viewFlightFollowing .fw-fir-l span{ font-family:'Montserrat',sans-serif; font-size:9.5px; color:var(--txt-dim); white-space:nowrap; } /* Le tableau couvre la carte, mais PAS la barre qui l'a ouvert : sans quoi le bouton reste allume et devient injoignable ([553] — on ne cache jamais la sortie). */ #viewFlightFollowing #fw-watch-ctl{ z-index:1100; } #viewFlightFollowing #fw-table{ position:absolute; inset:0 0 46px 0; z-index:1000; display:none; flex-direction:column; background:rgba(10,22,40,.97); } #viewFlightFollowing #fw-table.on{ display:flex; } #viewFlightFollowing .fw-tab-head{ display:flex; align-items:center; justify-content:space-between; padding:10px 16px; border-bottom:1px solid var(--line); font-size:11px; letter-spacing:1.5px; color:var(--gold); } #viewFlightFollowing .fw-tab-head button{ background:transparent; border:1px solid var(--line); color:var(--txt-dim); border-radius:6px; width:26px; height:26px; font-size:16px; line-height:1; cursor:pointer; } #viewFlightFollowing .fw-tab-head button:hover{ color:var(--txt); border-color:var(--gold-dim); } #viewFlightFollowing .fw-tab-body{ flex:1; overflow:auto; padding:0 16px 16px; } #viewFlightFollowing .fw-tab-t{ width:100%; border-collapse:collapse; font-size:11.5px; } #viewFlightFollowing .fw-tab-t th{ position:sticky; top:0; background:var(--navy-2); text-align:left; padding:8px; font-size:9px; letter-spacing:1px; color:var(--txt-dim); text-transform:uppercase; border-bottom:1px solid var(--line); font-family:'Montserrat',sans-serif; font-weight:600; } #viewFlightFollowing .fw-tab-t td{ padding:8px; border-bottom:1px solid rgba(34,53,79,.6); font-family:'JetBrains Mono',monospace; } #viewFlightFollowing .fw-tab-t tbody tr{ cursor:pointer; } #viewFlightFollowing .fw-tab-t tbody tr:hover{ background:var(--navy-3); } /* ── v226.172 — FILTRES, AGE DE LA POSITION, REJEU ET RAPPORT ──────────────*/ #viewFlightFollowing .fw-filters{ display:flex; flex-wrap:wrap; gap:5px; padding:8px 14px; border-bottom:1px solid var(--line); } #viewFlightFollowing .fw-filters select, #viewFlightFollowing .fw-filters button{ flex:1 1 auto; min-width:0; background:var(--navy); border:1px solid var(--line); color:var(--txt-dim); border-radius:5px; padding:4px 6px; font-size:10px; font-family:'Montserrat',sans-serif; cursor:pointer; } #viewFlightFollowing .fw-filters button{ flex:0 0 auto; letter-spacing:.5px; font-weight:600; } #viewFlightFollowing .fw-filters button:hover{ color:var(--txt); border-color:var(--gold-dim); } #viewFlightFollowing .fw-filters select:focus-visible, #viewFlightFollowing .fw-filters button:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; } /* ── la source et l'age de la position ──────────────────────────────────── */ /* Le temoin se pose a droite de la commande de zoom, et la note FIR descend sous lui : deux encarts d'information empiles, jamais superposes. */ #viewFlightFollowing .map-note{ top:66px; } #viewFlightFollowing #fw-feed-age{ position:absolute; top:12px; left:58px; z-index:820; max-width:330px; background:rgba(10,22,40,.9); border:1px solid var(--line); border-left:3px solid var(--txt-dim); border-radius:6px; padding:6px 10px; font-size:10px; line-height:1.45; color:var(--txt-dim); } #viewFlightFollowing #fw-feed-age b{ color:var(--txt); font-size:9px; letter-spacing:1px; display:block; } #viewFlightFollowing #fw-feed-age.ok{ border-left-color:var(--green); } #viewFlightFollowing #fw-feed-age.ok .age{ color:var(--green); } #viewFlightFollowing #fw-feed-age.warn{ border-left-color:var(--orange); } #viewFlightFollowing #fw-feed-age.warn .age{ color:var(--orange); } #viewFlightFollowing #fw-feed-age.stale{ border-left-color:var(--red); } #viewFlightFollowing #fw-feed-age.stale .age{ color:#ff9d90; } #viewFlightFollowing #fw-speed-badge{ position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:830; background:rgba(224,194,42,.16); border:1px solid var(--yellow); color:var(--yellow); border-radius:6px; padding:5px 12px; font-size:10px; font-weight:800; letter-spacing:1.2px; } /* ── les commandes de veille ────────────────────────────────────────────── */ #viewFlightFollowing #fw-watch-ctl{ position:absolute; bottom:12px; left:50%; transform:translateX(-50%); z-index:800; display:flex; gap:6px; } #viewFlightFollowing #fw-watch-ctl button{ background:rgba(10,22,40,.92); border:1px solid var(--line); color:var(--txt-dim); border-radius:8px; padding:7px 12px; font-size:10px; letter-spacing:1px; font-weight:600; font-family:'Montserrat',sans-serif; cursor:pointer; } #viewFlightFollowing #fw-watch-ctl button:hover{ color:var(--txt); border-color:var(--gold-dim); } #viewFlightFollowing #fw-watch-ctl button:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; } #viewFlightFollowing #fw-replay-btn.on{ background:var(--gold); border-color:var(--gold); color:var(--navy); font-weight:800; } #viewFlightFollowing #fw-replay{ position:absolute; bottom:52px; left:50%; transform:translateX(-50%); z-index:800; display:none; align-items:center; gap:9px; background:rgba(10,22,40,.94); border:1px solid var(--line); border-radius:8px; padding:7px 12px; font-size:10px; color:var(--txt-dim); min-width:420px; } #viewFlightFollowing #fw-replay.on{ display:flex; } #viewFlightFollowing #fw-replay .fw-rp-l{ letter-spacing:1px; font-weight:700; color:var(--gold); } #viewFlightFollowing #fw-replay input[type=range]{ flex:1; accent-color:var(--gold); } #viewFlightFollowing #fw-replay .fw-rp-at{ font-family:'JetBrains Mono',monospace; color:var(--txt); min-width:130px; text-align:right; } #viewFlightFollowing #fw-replay .fw-rp-msg{ color:var(--orange); } /* ── le rapport de veille ───────────────────────────────────────────────── */ #viewFlightFollowing #fw-report-ov{ position:absolute; inset:0; z-index:1400; display:none; background:rgba(4,10,22,.72); backdrop-filter:blur(2px); } #viewFlightFollowing #fw-report-ov.on{ display:flex; align-items:center; justify-content:center; } #viewFlightFollowing .fw-rep-box{ width:min(960px, 92%); max-height:86%; display:flex; flex-direction:column; background:var(--navy-2); border:1px solid var(--line); border-radius:10px; overflow:hidden; box-shadow:0 24px 60px -30px rgba(0,0,0,.9); } #viewFlightFollowing .fw-rep-bar{ display:flex; justify-content:flex-end; gap:6px; padding:9px 12px; border-bottom:1px solid var(--line); } #viewFlightFollowing .fw-rep-bar button{ background:var(--navy); border:1px solid var(--line); color:var(--txt-dim); border-radius:6px; padding:5px 11px; font-size:10px; letter-spacing:.5px; font-weight:600; cursor:pointer; font-family:'Montserrat',sans-serif; } #viewFlightFollowing .fw-rep-bar button:hover{ color:var(--txt); border-color:var(--gold-dim); } #viewFlightFollowing .fw-rep-body{ overflow:auto; padding:16px 20px 22px; } #viewFlightFollowing .fw-rep h3{ margin:0; font-size:14px; letter-spacing:2px; color:var(--gold); } #viewFlightFollowing .fw-rep-sub{ font-size:10.5px; color:var(--txt-dim); margin:4px 0 14px; } #viewFlightFollowing .fw-rep h4{ margin:16px 0 6px; font-size:10px; letter-spacing:1.5px; color:var(--gold); } #viewFlightFollowing .fw-rep-t{ width:100%; border-collapse:collapse; font-size:11px; } #viewFlightFollowing .fw-rep-t th{ text-align:left; font-size:9px; letter-spacing:1px; color:var(--txt-dim); text-transform:uppercase; border-bottom:1px solid var(--line); padding:5px 7px; font-weight:600; } #viewFlightFollowing .fw-rep-t td{ padding:5px 7px; border-bottom:1px solid rgba(34,53,79,.55); font-family:'JetBrains Mono',monospace; } #viewFlightFollowing .fw-rep-note{ margin-top:14px; font-size:10px; color:var(--txt-dim); line-height:1.5; } /* ── v226.171 — LE PANNEAU D'UN VOL SUIVI ────────────────────────────────── Les heures d'abord : c'est la premiere question d'un poste de veille. */ #viewFlightFollowing .fw-times{ display:grid; grid-template-columns:auto 1fr auto 1fr; gap:5px 10px; align-items:baseline; font-family:'JetBrains Mono',monospace; font-size:12.5px; } #viewFlightFollowing .fw-times .l{ font-size:9px; letter-spacing:1px; color:var(--txt-dim); text-transform:uppercase; font-family:'Montserrat',sans-serif; } #viewFlightFollowing .fw-times b{ font-weight:600; } #viewFlightFollowing .fw-rev{ color:var(--orange); } #viewFlightFollowing .fw-ok{ color:var(--green); font-family:'Montserrat',sans-serif; font-size:11px; font-weight:600; } #viewFlightFollowing .fw-late{ color:var(--orange); } #viewFlightFollowing .fw-early{ color:var(--green); } #viewFlightFollowing .fw-eta{ margin-top:9px; padding:6px 9px; border-radius:6px; background:var(--navy); border:1px solid var(--line); font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--gold); } #viewFlightFollowing .fw-src{ color:var(--txt-dim); font-size:9.5px; } #viewFlightFollowing .fw-links{ display:flex; flex-wrap:wrap; gap:6px; } #viewFlightFollowing .fw-link{ background:var(--navy); border:1px solid var(--line); color:var(--txt-dim); cursor:pointer; border-radius:6px; padding:5px 9px; font-size:10px; letter-spacing:.5px; font-weight:600; font-family:'Montserrat',sans-serif; } #viewFlightFollowing .fw-link:hover{ color:var(--txt); border-color:var(--gold-dim); } #viewFlightFollowing .fw-link:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; } /* ── la pile d'alertes ──────────────────────────────────────────────────── */ #viewFlightFollowing .fw-al{ display:flex; align-items:flex-start; gap:8px; cursor:pointer; padding:5px 0; border-bottom:1px solid rgba(192,57,43,.22); } #viewFlightFollowing .fw-al:last-child{ border-bottom:none; } #viewFlightFollowing .fw-al:hover .fw-al-txt{ color:#ffd9d2; } #viewFlightFollowing .fw-al.ack{ opacity:.62; } #viewFlightFollowing .fw-al-txt{ flex:1; min-width:0; } #viewFlightFollowing .fw-al-btn{ flex-shrink:0; background:rgba(192,57,43,.25); border:1px solid rgba(192,57,43,.65); color:#ffd9d2; border-radius:5px; padding:2px 8px; font-size:9.5px; font-weight:700; letter-spacing:.5px; cursor:pointer; font-family:'Montserrat',sans-serif; } #viewFlightFollowing .fw-al-btn:hover{ background:rgba(192,57,43,.45); color:#fff; } #viewFlightFollowing .fw-al-btn:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; } #viewFlightFollowing .fw-al-ack{ flex-shrink:0; font-size:9px; letter-spacing:.5px; color:var(--green); font-weight:700; font-family:'Montserrat',sans-serif; white-space:nowrap; padding-top:2px; } /* ── v226.169 — LES COMMANDES DE LA CARTE VIVENT SUR LA CARTE ────────────── Recherche, multiplicateurs de temps et LAYERS forment un seul groupe en haut a droite : ce sont trois commandes de la CARTE, elles n'ont rien a faire dans le bandeau du produit ([554]). Le groupe se decale quand le tiroir de detail recouvre ce coin, comme LAYERS le faisait deja. */ #viewFlightFollowing #fwMapCtl{ position:absolute; top:12px; right:12px; z-index:900; display:flex; align-items:center; gap:8px; transition:right .22s ease; } #viewFlightFollowing #app.fw-right-open #mapwrap #fwMapCtl{ right:332px; } #viewFlightFollowing #fwMapCtl .layers-wrap{ position:relative; top:auto; right:auto; } #viewFlightFollowing #fwMapCtl #searchbox{ background:rgba(10,22,40,.92); border:1px solid var(--line); border-radius:6px; padding:6px 10px; color:var(--txt); font-family:'JetBrains Mono',monospace; font-size:11px; width:186px; letter-spacing:.4px; } #viewFlightFollowing #fwMapCtl #searchbox::placeholder{ color:var(--txt-dim); } #viewFlightFollowing #fwMapCtl #searchbox:focus{ outline:none; border-color:var(--gold); } #viewFlightFollowing #fwMapCtl .timemult{ background:rgba(10,22,40,.92); border:1px solid var(--line); border-radius:6px; overflow:hidden; } #viewFlightFollowing #fwMapCtl .timemult button{ padding:6px 9px; font-size:10.5px; } /* la note FIR recouvrait la commande de zoom : elle se pose a sa droite. */ #viewFlightFollowing .map-note{ left:58px; } /* ── les deux tiroirs ──────────────────────────────────────────────────── */ #viewFlightFollowing #left, #viewFlightFollowing #right{ position:absolute; top:0; bottom:0; width:320px; z-index:1100; grid-column:auto; grid-row:auto; box-shadow:0 0 28px rgba(0,0,0,.55); transition:transform .22s ease, visibility .22s; visibility:hidden; } #viewFlightFollowing #left{ left:0; transform:translateX(-102%); } #viewFlightFollowing #right{ right:0; transform:translateX(102%); } #viewFlightFollowing #left.fw-open, #viewFlightFollowing #right.fw-open{ transform:translateX(0); visibility:visible; } #viewFlightFollowing .fw-head{ position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px 10px 14px; background:var(--navy-3); border-bottom:1px solid var(--line); } #viewFlightFollowing .fw-head h3{ margin:0; font-size:11px; letter-spacing:1.5px; color:var(--gold); font-weight:700; } #viewFlightFollowing .fw-x{ background:transparent; border:1px solid var(--line); border-radius:6px; color:var(--txt-dim); width:24px; height:24px; line-height:1; font-size:16px; cursor:pointer; flex-shrink:0; } #viewFlightFollowing .fw-x:hover{ color:var(--txt); border-color:var(--gold-dim); } #viewFlightFollowing .fw-x:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; } #viewFlightFollowing ::-webkit-scrollbar {width:6px;} #viewFlightFollowing ::-webkit-scrollbar-track {background:var(--navy-2);} #viewFlightFollowing ::-webkit-scrollbar-thumb {background:var(--line);border-radius:3px;} #viewFlightFollowing .leaflet-popup-content-wrapper {background:var(--navy-2);color:var(--txt);border-radius:6px;} #viewFlightFollowing .leaflet-popup-tip {background:var(--navy-2);} #viewFlightFollowing .leaflet-popup-content {font-family:'Montserrat',sans-serif;font-size:12px;} #viewFlightFollowing .leaflet-popup-content b {color:var(--gold);} #viewFlightFollowing .leaflet-control-attribution {background:rgba(10,22,40,.7) !important;color:var(--txt-dim) !important;font-size:9px !important;} #viewFlightFollowing .leaflet-control-attribution a {color:var(--gold-dim) !important;} #viewFlightFollowing .fir-label { background:transparent;border:none;box-shadow:none; color:#9db3d1;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:1px; text-shadow:0 0 4px #000,0 0 4px #000;font-weight:600; } #viewFlightFollowing .apt-label { background:transparent;border:none;box-shadow:none; color:#dfe8f5;font-family:'Montserrat',sans-serif;font-size:9px;font-weight:600; text-shadow:0 0 3px #000,0 0 3px #000;white-space:nowrap; } /* ── SAFETY REPORTS + SAFETY PROMOTION — scoped module styles ─────────────── Every rule is prefixed with one of the two module roots so nothing can leak into the host application, which is what the previous iframe was protecting against. */ #viewSafeOps, #viewSafetyPromotion{ flex-direction:column; overflow-y:auto; } #safetyreports-root, #safetypromo-root{ --sr-navy:#0F1B3D; --sr-navy2:#1B2D6B; --sr-cyan:#00b4d8; --sr-gold:#C9A227; --sr-line:#e2e8f0; --sr-bg:#f4f7fb; --sr-card:#fff; --sr-text:#1e293b; --sr-dim:#64748b; --sr-faint:#94a3b8; font-family:'Montserrat',system-ui,sans-serif; background:var(--sr-bg); min-height:100%; display:flex; flex-direction:column; } #safetyreports-root *, #safetypromo-root *{ box-sizing:border-box; } /* top bar — horizontal, mirroring the Safety Manager rather than a side rail */ #safetyreports-root .sr-topbar, #safetypromo-root .sr-topbar{ background:var(--sr-navy); min-height:50px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:6px 18px; border-bottom:2px solid var(--sr-cyan); position:sticky; top:0; z-index:40; } #safetyreports-root .sr-brand, #safetypromo-root .sr-brand{ display:flex; align-items:center; gap:9px; } #safetyreports-root .sr-mark, #safetypromo-root .sr-mark{ width:26px; height:26px; border-radius:7px; background:var(--sr-cyan); display:flex; align-items:center; justify-content:center; flex-shrink:0; } #safetyreports-root .sr-mark svg, #safetypromo-root .sr-mark svg{ width:15px; height:15px; fill:none; stroke:var(--sr-navy); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } #safetyreports-root .sr-b1, #safetypromo-root .sr-b1{ font-size:13.5px; font-weight:700; color:#fff; line-height:1.2; } #safetyreports-root .sr-b2, #safetypromo-root .sr-b2{ font-size:9px; color:#8ba6cc; } #safetyreports-root .sr-nav, #safetypromo-root .sr-nav{ display:flex; gap:3px; flex-wrap:wrap; } #safetyreports-root .sr-tab, #safetypromo-root .sr-tab{ font-size:11.5px; font-weight:500; color:#b9cbe6; padding:6px 12px; border-radius:6px; cursor:pointer; white-space:nowrap; display:flex; align-items:center; gap:5px; } #safetyreports-root .sr-tab:hover, #safetypromo-root .sr-tab:hover{ background:rgba(255,255,255,.07); color:#fff; } #safetyreports-root .sr-tab.on, #safetypromo-root .sr-tab.on{ background:var(--sr-cyan); color:var(--sr-navy); font-weight:600; } #safetyreports-root .sr-count, #safetypromo-root .sr-count{ font-size:8.5px; font-weight:800; background:rgba(255,255,255,.18); color:#fff; border-radius:9px; padding:1px 5px; min-width:16px; text-align:center; } #safetyreports-root .sr-tab.on .sr-count, #safetypromo-root .sr-tab.on .sr-count{ background:rgba(15,27,61,.18); color:var(--sr-navy); } #safetyreports-root .sr-count.red{ background:#C0392B; color:#fff; } #safetyreports-root .sr-who, #safetypromo-root .sr-who{ margin-left:auto; display:flex; align-items:center; gap:7px; } #safetyreports-root .sr-who label{ font-size:9px; color:#8ba6cc; text-transform:uppercase; letter-spacing:.4px; font-weight:700; } #safetyreports-root .sr-who select{ font-family:inherit; font-size:11px; padding:5px 8px; border-radius:6px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.08); color:#fff; max-width:280px; } #safetyreports-root .sr-who select option, #safetyreports-root .sr-who select optgroup{ color:#1e293b; background:#fff; } #safetypromo-root .sr-ro{ font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:#8ba6cc; border:1px solid rgba(255,255,255,.2); border-radius:10px; padding:3px 9px; } /* page frame */ #safetyreports-root .sr-page, #safetypromo-root .sr-page{ padding:16px 20px 40px; } #safetyreports-root .sr-head, #safetypromo-root .sr-head{ margin-bottom:14px; } #safetyreports-root .sr-h1, #safetypromo-root .sr-h1{ font-size:19px; font-weight:700; color:var(--sr-navy); } #safetyreports-root .sr-h2, #safetypromo-root .sr-h2{ font-size:11px; color:var(--sr-dim); margin-top:2px; max-width:900px; } #safetyreports-root .sr-grid, #safetypromo-root .sr-grid{ display:grid; grid-template-columns:1fr 300px; gap:14px; align-items:start; } #safetyreports-root .sr-main, #safetypromo-root .sr-main{ min-width:0; } #safetyreports-root .sr-side, #safetypromo-root .sr-side{ min-width:0; } #safetyreports-root .sr-card, #safetypromo-root .sr-card{ background:var(--sr-card); border:1px solid var(--sr-line); border-radius:11px; padding:14px 16px; margin-bottom:12px; } #safetyreports-root .sr-sec, #safetypromo-root .sr-sec{ font-size:11px; font-weight:700; color:var(--sr-navy); text-transform:uppercase; letter-spacing:.5px; margin-bottom:10px; padding-bottom:7px; border-bottom:1px solid var(--sr-line); } #safetyreports-root .sr-sub{ font-size:9px; font-weight:700; color:var(--sr-faint); text-transform:uppercase; letter-spacing:.4px; margin:12px 0 5px; } #safetyreports-root .sr-body, #safetypromo-root .sr-body{ font-size:11px; line-height:1.7; color:var(--sr-text); white-space:pre-wrap; } #safetyreports-root .sr-body.q{ background:rgba(230,126,34,.07); border-left:3px solid #E67E22; padding:9px 11px; border-radius:0 7px 7px 0; } #safetyreports-root .sr-note, #safetypromo-root .sr-note{ font-size:10px; line-height:1.6; color:var(--sr-dim); background:#f8fafc; border-left:3px solid var(--sr-cyan); border-radius:0 7px 7px 0; padding:9px 11px; margin-top:10px; } #safetyreports-root .sr-empty, #safetypromo-root .sr-empty{ padding:26px 14px; text-align:center; font-size:11px; color:var(--sr-faint); } /* form controls */ #safetyreports-root .sr-fg{ margin-bottom:11px; } #safetyreports-root .sr-f2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } #safetyreports-root .sr-f3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; } #safetyreports-root .sr-fg label{ display:block; font-size:10px; font-weight:600; color:var(--sr-navy); margin-bottom:4px; } #safetyreports-root .sr-fg label i{ font-style:normal; font-weight:500; color:#C0392B; font-size:9px; margin-left:4px; } #safetyreports-root .sr-inp, #safetyreports-root .sr-ta{ width:100%; font-family:inherit; font-size:11.5px; color:var(--sr-text); border:1px solid var(--sr-line); border-radius:7px; padding:7px 9px; background:#fff; } #safetyreports-root .sr-inp:focus, #safetyreports-root .sr-ta:focus{ outline:none; border-color:var(--sr-cyan); box-shadow:0 0 0 2px rgba(0,180,216,.12); } #safetyreports-root .sr-ta{ resize:vertical; line-height:1.6; } #safetyreports-root .sr-count{ font-size:9px; color:var(--sr-faint); text-align:right; margin-top:3px; background:none; } #safetyreports-root .sr-chk{ display:flex; align-items:center; gap:7px; font-size:10.5px; font-weight:500; color:var(--sr-text); margin-bottom:6px; cursor:pointer; } #safetyreports-root .sr-static{ font-size:11.5px; font-weight:600; color:var(--sr-navy); background:#f8fafc; border:1px solid var(--sr-line); border-radius:7px; padding:7px 9px; } #safetyreports-root .sr-static span{ display:block; font-size:9.5px; font-weight:400; color:var(--sr-dim); margin-top:2px; } #safetyreports-root .sr-static.warn{ background:rgba(230,126,34,.07); border-color:rgba(230,126,34,.3); color:#9a3412; font-weight:500; } #safetyreports-root .sr-resolve{ font-size:9.5px; color:var(--sr-faint); margin-top:4px; line-height:1.4; } #safetyreports-root .sr-resolve.ok{ color:#166534; font-weight:600; } #safetyreports-root .sr-resolve.bad{ color:#C0392B; font-weight:600; } /* report type picker */ #safetyreports-root .sr-types{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:7px; } #safetyreports-root .sr-type{ border:1px solid var(--sr-line); border-radius:8px; padding:8px 10px; cursor:pointer; transition:border-color .12s, background .12s; background:#fff; } #safetyreports-root .sr-types.static .sr-type{ cursor:default; } #safetyreports-root .sr-type:hover{ border-color:var(--sr-cyan); } #safetyreports-root .sr-type.on{ border-color:var(--sr-cyan); background:rgba(0,180,216,.06); box-shadow:inset 0 0 0 1px var(--sr-cyan); } #safetyreports-root .sr-type b{ display:block; font-size:11px; font-weight:600; color:var(--sr-navy); } #safetyreports-root .sr-type span{ display:block; font-size:9.5px; color:var(--sr-dim); line-height:1.45; margin-top:2px; } /* buttons */ #safetyreports-root .sr-actions, #safetypromo-root .sr-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; } #safetyreports-root .sr-btn, #safetypromo-root .sr-btn{ font-family:inherit; font-size:11px; font-weight:600; padding:7px 14px; border-radius:7px; border:1px solid var(--sr-line); background:#fff; color:var(--sr-dim); cursor:pointer; } #safetyreports-root .sr-btn:hover, #safetypromo-root .sr-btn:hover{ border-color:var(--sr-navy2); color:var(--sr-navy); } #safetyreports-root .sr-btn.primary, #safetypromo-root .sr-btn.primary{ background:var(--sr-cyan); border-color:var(--sr-cyan); color:#fff; } #safetyreports-root .sr-btn.primary:hover, #safetypromo-root .sr-btn.primary:hover{ background:#0098bb; color:#fff; } #safetyreports-root .sr-btn.tiny, #safetypromo-root .sr-btn.tiny{ font-size:9.5px; padding:4px 9px; margin-left:5px; } /* lists and tables */ #safetyreports-root .sr-tbl{ width:100%; border-collapse:collapse; } #safetyreports-root .sr-tbl th{ text-align:left; font-size:9px; font-weight:700; color:var(--sr-faint); text-transform:uppercase; letter-spacing:.4px; padding:7px 8px; background:#f8fafc; border-bottom:1px solid var(--sr-line); } #safetyreports-root .sr-tbl td{ font-size:10.5px; color:var(--sr-text); padding:8px; border-bottom:1px solid #f1f5f9; vertical-align:top; } #safetyreports-root .sr-tbl tr.q td{ background:rgba(230,126,34,.05); } #safetyreports-root .sr-tbl .mono{ font-family:monospace; font-weight:700; font-size:9.5px; color:var(--sr-dim); white-space:nowrap; } #safetyreports-root .sr-band{ font-size:9px; font-weight:700; padding:2px 7px; border-radius:9px; white-space:nowrap; } #safetyreports-root .sr-qflag{ font-size:9px; font-weight:600; color:#9a3412; margin-top:2px; } #safetyreports-root .sr-draft{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid #f1f5f9; } #safetyreports-root .sr-draft:last-child{ border-bottom:none; } #safetyreports-root .sr-draft b{ font-size:11px; color:var(--sr-navy); } #safetyreports-root .sr-draft span{ display:block; font-size:9px; color:var(--sr-faint); } #safetyreports-root .sr-steps, #safetyreports-root .sr-tips{ margin:0; padding-left:17px; font-size:10.5px; line-height:1.75; color:var(--sr-text); } #safetyreports-root .sr-urgent{ border-left:3px solid #C0392B; } #safetyreports-root .sr-kv{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:8px; } #safetyreports-root .sr-kv > div{ background:#f8fafc; border-radius:7px; padding:7px 9px; } #safetyreports-root .sr-kv span{ display:block; font-size:8.5px; color:var(--sr-faint); text-transform:uppercase; letter-spacing:.4px; font-weight:700; } #safetyreports-root .sr-kv b{ display:block; font-size:11px; color:var(--sr-navy); margin-top:2px; } #safetyreports-root .sr-detail{ border:1px solid var(--sr-cyan); } #safetyreports-root .sr-q{ border-left:3px solid #E67E22; } #safetyreports-root .sr-tl{ padding-left:4px; } #safetyreports-root .sr-tli{ display:flex; gap:9px; padding:5px 0; font-size:10px; } #safetyreports-root .sr-tld{ width:7px; height:7px; border-radius:50%; background:var(--sr-cyan); flex-shrink:0; margin-top:4px; } #safetyreports-root .sr-tli b{ font-size:9px; color:var(--sr-faint); font-weight:700; } #safetyreports-root .sr-tli div div{ color:var(--sr-text); line-height:1.5; } /* promotion board */ #safetypromo-root .pr-item{ border-left:3px solid var(--sr-cyan); } #safetypromo-root .pr-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:8px; } #safetypromo-root .pr-t{ font-size:13px; font-weight:700; color:var(--sr-navy); } #safetypromo-root .pr-m{ font-size:9.5px; color:var(--sr-faint); margin-top:2px; } #safetypromo-root .pr-k{ font-size:9px; font-weight:700; padding:3px 9px; border-radius:10px; white-space:nowrap; } #safetypromo-root .pr-body{ font-size:11px; line-height:1.75; color:var(--sr-text); margin-bottom:11px; } #safetypromo-root .pr-foot{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding-top:9px; border-top:1px solid #f1f5f9; } #safetypromo-root .pr-aud{ font-size:9.5px; color:var(--sr-dim); } #safetypromo-root .pr-bar{ flex:1; min-width:90px; height:5px; background:#e2e8f0; border-radius:3px; overflow:hidden; } #safetypromo-root .pr-bar div{ height:100%; border-radius:3px; } #safetypromo-root .pr-n{ font-size:9.5px; font-weight:700; color:var(--sr-navy); } #safetypromo-root .pr-done{ font-size:9.5px; font-weight:700; color:#166534; } #safetypromo-root .pr-obj{ display:flex; align-items:center; justify-content:space-between; gap:9px; padding:6px 0; border-bottom:1px solid #f8fafc; font-size:10px; } #safetypromo-root .pr-obj:last-of-type{ border-bottom:none; } #safetypromo-root .pr-obj span{ color:var(--sr-dim); } /* sidebar badge on the main navigation */ .nav-item .nav-badge{ margin-left:auto; min-width:17px; height:17px; padding:0 5px; border-radius:9px; background:#C8202F; color:#fff; font-size:9.5px; font-weight:800; display:none; align-items:center; justify-content:center; line-height:1; } /* ── SAFETY REPORTS — statistics, filters, REX, forms and guidance ────────── */ #safetyreports-root .sr-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:14px} #safetyreports-root .sr-stats.three{grid-template-columns:repeat(3,1fr)} #safetyreports-root .sr-stat{background:var(--sr-card);border:1px solid var(--sr-line);border-bottom:3px solid var(--sr-line);border-radius:10px;padding:12px 14px} #safetyreports-root .sr-stat-l{font-size:10px;color:var(--sr-dim);font-weight:500} #safetyreports-root .sr-stat-v{font-size:26px;font-weight:700;line-height:1.15;margin-top:2px} #safetyreports-root .sr-stat-s{font-size:9px;color:var(--sr-faint);margin-top:1px} #safetyreports-root .sr-filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px} #safetyreports-root .sr-chip{font-size:10.5px;font-weight:500;padding:5px 12px;border-radius:7px;border:1px solid var(--sr-line);background:var(--sr-card);color:var(--sr-dim);cursor:pointer;white-space:nowrap} #safetyreports-root .sr-chip:hover{border-color:var(--sr-cyan);color:var(--sr-navy)} #safetyreports-root .sr-chip.on{background:var(--sr-cyan);border-color:var(--sr-cyan);color:#fff;font-weight:600} #safetyreports-root .sr-sm{font-size:9.5px;color:var(--sr-faint);margin-top:1px} #safetyreports-root .sr-st{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:2px 8px;border-radius:9px;white-space:nowrap;background:#f1f5f9;color:var(--sr-dim)} #safetyreports-root .sr-st.st-new,#safetyreports-root .sr-st.st-triage{background:rgba(0,180,216,.12);color:#0e7490} #safetyreports-root .sr-st.st-investigation{background:rgba(192,57,43,.12);color:#991b1b} #safetyreports-root .sr-st.st-capa{background:rgba(230,126,34,.14);color:#9a3412} #safetyreports-root .sr-st.st-monitoring{background:rgba(124,58,237,.12);color:#6d28d9} #safetyreports-root .sr-st.st-closed{background:rgba(31,157,92,.12);color:#166534} #safetyreports-root .sr-hint{font-size:9px;color:var(--sr-faint);margin-top:3px} #safetyreports-root .sr-cnt{font-size:9px;color:var(--sr-faint);text-align:right;margin-top:3px} #safetyreports-root .sr-callout{display:flex;gap:11px;align-items:flex-start;background:rgba(124,58,237,.06);border-left:3px solid #7c3aed;border-radius:0 9px 9px 0;padding:11px 14px;margin-bottom:14px;font-size:10.5px;line-height:1.7;color:var(--sr-text)} #safetyreports-root .sr-callout-i{font-size:17px;color:#7c3aed;line-height:1} /* action required */ #safetyreports-root .sr-qh{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px} #safetyreports-root .sr-qt{font-size:13px;font-weight:700;color:var(--sr-navy)} #safetyreports-root .sr-qm{font-size:9.5px;color:var(--sr-faint);margin-top:2px} #safetyreports-root .sr-pending{font-size:8.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;background:rgba(230,126,34,.14);color:#9a3412;border-radius:9px;padding:3px 9px;white-space:nowrap} #safetyreports-root .sr-qbox{background:#f8fafc;border-radius:8px;padding:11px 14px} #safetyreports-root .sr-qlead{font-size:10.5px;color:var(--sr-text);margin-bottom:7px} #safetyreports-root .sr-qlist{margin:0;padding-left:19px;font-size:10.5px;line-height:1.8;color:var(--sr-text)} #safetyreports-root .sr-qfoot{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:11px;padding-top:10px;border-top:1px solid #f1f5f9} #safetyreports-root .sr-deadline{font-size:9.5px;font-weight:600;color:#9a3412;margin-right:auto} #safetyreports-root .sr-deadline.late{color:#C0392B} #safetyreports-root .sr-replybox{margin-top:11px;padding-top:11px;border-top:1px solid #f1f5f9} /* REX cards */ #safetyreports-root .rx-card{border-left:3px solid #7c3aed} #safetyreports-root .rx-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:8px} #safetyreports-root .rx-ref{font-family:monospace;font-size:9px;font-weight:700;color:var(--sr-faint);letter-spacing:.4px} #safetyreports-root .rx-my{background:rgba(124,58,237,.14);color:#6d28d9;border-radius:7px;padding:0 5px;font-size:8px;letter-spacing:.4px} #safetyreports-root .rx-t{font-size:13px;font-weight:700;color:var(--sr-navy);margin-top:2px} #safetyreports-root .rx-m{font-size:9.5px;color:var(--sr-faint);margin-top:2px} #safetyreports-root .rx-pub{font-size:8.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;background:rgba(31,157,92,.12);color:#166534;border-radius:9px;padding:3px 9px;white-space:nowrap} #safetyreports-root .rx-what{font-size:10.5px;line-height:1.7;color:var(--sr-text);margin-bottom:10px} #safetyreports-root .rx-lessons{background:#f8fafc;border-left:3px solid #1f9d5c;border-radius:0 8px 8px 0;padding:10px 13px} #safetyreports-root .rx-ll{font-size:8.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--sr-faint);margin-bottom:6px} #safetyreports-root .rx-l{display:flex;gap:8px;align-items:flex-start;font-size:10.5px;line-height:1.6;color:var(--sr-text);padding:3px 0} #safetyreports-root .rx-tick{color:#1f9d5c;font-weight:800;flex-shrink:0} #safetyreports-root .rx-rec{font-size:10px;line-height:1.6;color:var(--sr-text);background:rgba(0,180,216,.06);border-radius:7px;padding:8px 11px;margin-top:9px} #safetyreports-root .rx-f{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;padding-top:9px;border-top:1px solid #f1f5f9} #safetyreports-root .rx-cat{font-size:9px;font-weight:600;background:rgba(124,58,237,.1);color:#6d28d9;border-radius:9px;padding:2px 9px} #safetyreports-root .rx-reads{font-size:9.5px;color:var(--sr-faint)} #safetyreports-root .rx-full{border-top:1px solid var(--sr-line);margin-top:11px;padding-top:4px} /* forms and guidance */ #safetyreports-root .sr-forms{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:9px} #safetyreports-root .sr-form{display:flex;align-items:center;gap:11px;border:1px solid var(--sr-line);border-radius:9px;padding:10px 13px;cursor:pointer;background:#fff;transition:border-color .12s,box-shadow .12s} #safetyreports-root .sr-form:hover{border-color:var(--sr-cyan);box-shadow:0 2px 9px rgba(15,27,61,.06)} #safetyreports-root .sr-form.rex{border-color:rgba(124,58,237,.3)} #safetyreports-root .sr-form-i{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0} #safetyreports-root .sr-form b{display:block;font-size:11.5px;font-weight:600;color:var(--sr-navy)} #safetyreports-root .sr-form span{display:block;font-size:9.5px;color:var(--sr-faint)} #safetyreports-root .sr-form-a{margin-left:auto;color:var(--sr-faint);font-size:16px} #safetyreports-root .sr-doc{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 0;border-bottom:1px solid #f1f5f9} #safetyreports-root .sr-doc:last-of-type{border-bottom:none} #safetyreports-root .sr-doc-i{width:26px;height:26px;border-radius:7px;background:rgba(0,180,216,.1);color:#0e7490;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0} #safetyreports-root .sr-doc-t{flex:1;min-width:180px} #safetyreports-root .sr-doc-t b{display:block;font-size:11px;font-weight:600;color:var(--sr-navy)} #safetyreports-root .sr-doc-t span{display:block;font-size:9.5px;color:var(--sr-faint)} #safetyreports-root .sr-doc-body{flex-basis:100%;margin-top:8px} #safetyreports-root .sr-pre{font-family:'Montserrat',system-ui,sans-serif;font-size:10.5px;line-height:1.75;color:var(--sr-text);background:#f8fafc;border-radius:8px;padding:13px 15px;white-space:pre-wrap;margin:0;max-height:420px;overflow-y:auto} @media (max-width:1280px){ #safetyreports-root .sr-stats,#safetyreports-root .sr-stats.three{grid-template-columns:repeat(2,1fr)} } @media (max-width:1280px){ #safetyreports-root .sr-grid, #safetypromo-root .sr-grid{ grid-template-columns:1fr; } #safetyreports-root .sr-f3{ grid-template-columns:1fr 1fr; } } /* ── EMERGENCY RESPONSE PLAN — crisis console ────────────────────────────── Light theme, aligned with the rest of the platform. The urgency is carried by colour, weight and structure — a red hero, hard status colours, monospace figures — not by a black background. A crisis console that looks nothing like the tool people use every day is a console they misread under pressure. Scoped to #erp-root, plus the global banner and the dashboard panel. */ #viewERP{ flex-direction:column; overflow-y:auto; } #erp-root{ --e-navy:#0d1b3e; --e-navy2:#1B2D6B; --e-gold:#a9811d; --e-gold2:#C9A227; --e-red:#C8202F; --e-red2:#9a1823; --e-org:#b8790a; --e-yel:#c9a227; --e-grn:#1f9d5c; --e-blu:#2f6fb0; --e-purple:#7b4fc9; --e-bg:#eef1f6; --e-card:#ffffff; --e-soft:#f6f8fb; --e-raised:#eef1f6; --e-line:#dfe4ee; --e-line2:#eef1f6; --e-tx:#16203d; --e-dim:#5b6178; --e-mute:#939aad; --e-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace; background:var(--e-bg); color:var(--e-tx); min-height:100%; font-family:'Montserrat',system-ui,sans-serif; display:flex; flex-direction:column; } #erp-root *{ box-sizing:border-box; } /* top bar — navy, like the other module headers */ #erp-root .erp-bar{ background:var(--e-navy); border-bottom:2px solid var(--e-red); display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:7px 18px; position:sticky; top:0; z-index:30; } #erp-root .erp-id{ display:flex; align-items:center; gap:10px; } #erp-root .erp-mark{ width:28px; height:28px; border-radius:7px; flex-shrink:0; background:var(--e-red); display:flex; align-items:center; justify-content:center; } #erp-root .erp-mark svg{ width:16px; height:16px; fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } #erp-root .erp-t1{ font-size:13.5px; font-weight:700; color:#fff; letter-spacing:.3px; } #erp-root .erp-t2{ font-size:9px; color:#8ba6cc; font-family:var(--e-mono); } #erp-root .erp-nav{ display:flex; gap:2px; flex-wrap:wrap; } #erp-root .erp-tab{ font-size:11.5px; font-weight:500; color:#b9cbe6; padding:6px 12px; border-radius:6px; cursor:pointer; white-space:nowrap; display:flex; align-items:center; gap:6px; } #erp-root .erp-tab:hover{ color:#fff; background:rgba(255,255,255,.08); } #erp-root .erp-tab.on{ background:var(--e-red); color:#fff; font-weight:600; } #erp-root .erp-nb{ font-size:8.5px; font-weight:800; background:rgba(255,255,255,.22); color:#fff; border-radius:8px; padding:1px 5px; } #erp-root .erp-nb.red{ background:var(--e-red); color:#fff; } #erp-root .erp-tab.on .erp-nb{ background:rgba(0,0,0,.28); } #erp-root .erp-status{ margin-left:auto; } #erp-root .erp-armed{ display:flex; align-items:center; gap:7px; font-size:10.5px; font-weight:700; letter-spacing:.5px; color:#7ddcae; border:1px solid rgba(31,157,92,.45); background:rgba(31,157,92,.14); border-radius:7px; padding:5px 11px; } #erp-root .erp-armed .erp-sub{ color:#8ba6cc; font-weight:400; letter-spacing:0; } #erp-root .erp-dot{ width:8px; height:8px; border-radius:50%; background:#3fd08a; flex-shrink:0; } #erp-root .erp-dot.pulse{ background:currentColor; animation:erpPulse 1.4s infinite; } @keyframes erpPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } } #erp-root .erp-live-chip{ display:flex; align-items:center; gap:9px; border-radius:7px; padding:5px 12px; border:1px solid currentColor; background:rgba(255,255,255,.08); } #erp-root .erp-live-chip.lv0{ color:#7ddcae; } #erp-root .erp-live-chip.lv1{ color:#ffd766; } #erp-root .erp-live-chip.lv2{ color:#ffab5e; } #erp-root .erp-live-chip.lv3{ color:#ff8b94; } #erp-root .erp-live-chip.lv4{ color:#ff6472; } #erp-root .erp-lv{ font-size:11px; font-weight:800; letter-spacing:.5px; } #erp-root .erp-live-chip .erp-sub{ font-size:9px; color:#8ba6cc; font-family:var(--e-mono); } /* page frame */ #erp-root .erp-page{ padding:16px 20px 60px; } #erp-root .erp-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; flex-wrap:wrap; } #erp-root .erp-h1{ font-size:19px; font-weight:700; color:var(--e-navy); } #erp-root .erp-h2{ font-size:11px; color:var(--e-dim); margin-top:3px; max-width:840px; line-height:1.6; } #erp-root .erp-card{ background:var(--e-card); border:1px solid var(--e-line); border-radius:11px; padding:14px 16px; margin-bottom:13px; } #erp-root .erp-card.editing{ border-color:var(--e-gold2); box-shadow:0 0 0 2px rgba(201,162,39,.12); } #erp-root .erp-ch{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:11px; padding-bottom:9px; border-bottom:1px solid var(--e-line); flex-wrap:wrap; } #erp-root .erp-ch > span{ font-size:10.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--e-navy); } #erp-root .erp-chbtn{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; } #erp-root .erp-cols{ display:grid; grid-template-columns:1fr 330px; gap:13px; align-items:start; } #erp-root .erp-cols.wide{ grid-template-columns:1fr 380px; } #erp-root .erp-note{ font-size:10px; line-height:1.65; color:var(--e-dim); background:var(--e-soft); border-left:3px solid var(--e-gold2); border-radius:0 7px 7px 0; padding:9px 12px; margin-top:10px; } #erp-root .erp-warn{ font-size:11px; line-height:1.65; color:#8c1620; background:rgba(200,32,47,.07); border:1px solid rgba(200,32,47,.3); border-radius:9px; padding:11px 14px; margin-bottom:13px; } #erp-root .erp-warn.amber{ color:#8a5a08; background:rgba(184,121,10,.08); border-color:rgba(184,121,10,.3); } #erp-root .erp-empty{ padding:22px; text-align:center; font-size:11px; color:var(--e-mute); } #erp-root .erp-empty.small{ padding:12px; font-size:10.5px; } #erp-root .erp-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:11px; align-items:center; } #erp-root .erp-hint{ font-size:9.5px; color:var(--e-mute); } #erp-root .erp-mono{ font-family:var(--e-mono); font-size:10px; color:var(--e-dim); } /* buttons */ #erp-root .erp-btn{ font-family:inherit; font-size:11px; font-weight:600; padding:7px 14px; border-radius:7px; border:1px solid var(--e-line); background:var(--e-card); color:var(--e-dim); cursor:pointer; white-space:nowrap; } #erp-root .erp-btn:hover{ border-color:var(--e-navy2); color:var(--e-navy); } #erp-root .erp-btn.danger{ background:var(--e-red); border-color:var(--e-red); color:#fff; } #erp-root .erp-btn.danger:hover{ background:var(--e-red2); color:#fff; border-color:var(--e-red2); } #erp-root .erp-btn.ghost{ background:transparent; } #erp-root .erp-bar .erp-btn.ghost{ color:#b9cbe6; border-color:rgba(255,255,255,.22); } #erp-root .erp-bar .erp-btn.ghost:hover{ color:#fff; border-color:#fff; } #erp-root .erp-btn.tiny{ font-size:9.5px; padding:4px 9px; } #erp-root .erp-btn.big{ font-size:13px; padding:11px 20px; letter-spacing:.4px; } #erp-root .erp-btn.block{ width:100%; display:block; margin-top:6px; } /* armed / idle */ #erp-root .erp-armedhero{ background:linear-gradient(135deg,#fff,#f2f6fc); border:1px solid var(--e-line); border-left:4px solid var(--e-grn); border-radius:12px; padding:30px 26px; text-align:center; margin-bottom:14px; } #erp-root .erp-ah-l{ display:inline-flex; align-items:center; gap:8px; font-size:10.5px; font-weight:800; letter-spacing:.9px; color:#166534; background:rgba(31,157,92,.1); border:1px solid rgba(31,157,92,.3); border-radius:20px; padding:5px 15px; } #erp-root .erp-ah-l .erp-dot{ background:var(--e-grn); } #erp-root .erp-ah-t{ font-size:23px; font-weight:700; color:var(--e-navy); margin-top:13px; } #erp-root .erp-ah-s{ font-size:11.5px; color:var(--e-dim); max-width:660px; margin:8px auto 0; line-height:1.7; } #erp-root .erp-ah-b{ display:flex; gap:9px; justify-content:center; margin-top:17px; flex-wrap:wrap; } #erp-root .erp-idle{ text-align:center; padding:52px 20px; } #erp-root .erp-idle-i svg{ width:42px; height:42px; fill:none; stroke:var(--e-line); stroke-width:1.4; } #erp-root .erp-idle-t{ font-size:15px; font-weight:700; color:var(--e-navy); margin-top:10px; } #erp-root .erp-idle-s{ font-size:11px; color:var(--e-mute); margin:6px 0 16px; } #erp-root .erp-rrow{ display:flex; align-items:center; gap:9px; padding:6px 0; border-bottom:1px solid var(--e-line2); font-size:10.5px; } #erp-root .erp-rrow:last-child{ border-bottom:none; } #erp-root .erp-rdot{ width:7px; height:7px; border-radius:50%; flex-shrink:0; } #erp-root .erp-rdot.ok{ background:var(--e-grn); } #erp-root .erp-rdot.bad{ background:var(--e-red); } #erp-root .erp-rn{ flex:1; } #erp-root .erp-rl{ color:var(--e-mute); font-family:var(--e-mono); font-size:9.5px; } #erp-root .erp-hrow{ display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-hrow:last-child{ border-bottom:none; } #erp-root .erp-hrow div{ flex:1; min-width:0; } #erp-root .erp-hrow b{ display:block; font-size:11px; font-weight:600; color:var(--e-navy); } #erp-root .erp-hrow span{ display:block; font-size:9.5px; color:var(--e-mute); } #erp-root .erp-hlv{ font-family:var(--e-mono); font-size:9px; font-weight:800; padding:3px 7px; border-radius:5px; background:var(--e-raised); color:var(--e-dim); flex-shrink:0; } #erp-root .erp-hlv.lv3{ background:rgba(200,32,47,.1); color:var(--e-red); } #erp-root .erp-hlv.lv4{ background:rgba(200,32,47,.18); color:var(--e-red2); } #erp-root .erp-hlv.drill{ background:rgba(47,111,176,.1); color:var(--e-blu); } #erp-root .erp-hst{ font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--e-mute); } #erp-root .erp-hst.closed{ color:var(--e-grn); } #erp-root .erp-hst.planned{ color:var(--e-blu); } /* live hero */ #erp-root .erp-hero{ display:grid; grid-template-columns:1fr auto auto; gap:20px; align-items:center; border-radius:12px; padding:17px 22px; margin-bottom:13px; color:#fff; background:linear-gradient(100deg,var(--e-red2),var(--e-red) 60%,#d94452); } #erp-root .erp-hero.lv2{ background:linear-gradient(100deg,#8a5a08,var(--e-org) 60%,#d99a2b); } #erp-root .erp-hero.lv1{ background:linear-gradient(100deg,#8a7414,var(--e-yel) 60%,#e0c355); } #erp-root .erp-hero.lv0{ background:linear-gradient(100deg,#12683c,var(--e-grn) 60%,#3fc07d); } #erp-root .erp-hero-lv{ font-family:var(--e-mono); font-size:10.5px; font-weight:800; letter-spacing:2px; opacity:.9; } #erp-root .erp-hero-nm{ font-size:25px; font-weight:800; letter-spacing:.3px; line-height:1.15; } #erp-root .erp-hero-ev{ font-size:12px; opacity:.92; margin-top:3px; } #erp-root .erp-hero-c{ text-align:right; } #erp-root .erp-hero-ref{ font-family:var(--e-mono); font-size:11px; opacity:.85; letter-spacing:1px; } #erp-root .erp-hero-clock{ font-family:var(--e-mono); font-size:27px; font-weight:700; letter-spacing:1px; } #erp-root .erp-hero-since{ font-size:9.5px; opacity:.8; } #erp-root .erp-hero-r{ display:flex; flex-direction:column; gap:6px; } #erp-root .erp-hero .erp-btn{ background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.4); color:#fff; } #erp-root .erp-hero .erp-btn:hover{ background:rgba(255,255,255,.3); color:#fff; border-color:#fff; } #erp-root .erp-hero .erp-btn.danger{ background:#fff; color:var(--e-red); border-color:#fff; } #erp-root .erp-hero .erp-btn.danger:hover{ background:#ffe9eb; color:var(--e-red2); } /* stats */ #erp-root .erp-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:11px; margin-bottom:13px; } #erp-root .erp-stat{ background:var(--e-card); border:1px solid var(--e-line); border-bottom:3px solid var(--c); border-radius:10px; padding:11px 14px; } #erp-root .erp-st-l{ font-size:9px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--e-mute); } #erp-root .erp-st-v{ font-family:var(--e-mono); font-size:24px; font-weight:700; color:var(--c); line-height:1.25; } #erp-root .erp-st-s{ font-size:9.5px; color:var(--e-dim); } #erp-root .erp-st-b{ height:3px; background:var(--e-raised); border-radius:2px; margin-top:7px; overflow:hidden; } #erp-root .erp-st-b div{ height:100%; background:var(--c); border-radius:2px; } /* subject aircraft */ #erp-root .erp-acgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:9px; } #erp-root .erp-fld{ background:var(--e-soft); border:1px solid var(--e-line2); border-radius:7px; padding:8px 10px; } #erp-root .erp-fld.empty{ background:rgba(184,121,10,.06); border-color:rgba(184,121,10,.25); border-style:dashed; } #erp-root .erp-fld span{ display:block; font-size:8.5px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--e-mute); } #erp-root .erp-fld b{ display:block; font-size:12px; font-family:var(--e-mono); color:var(--e-navy); margin-top:2px; } #erp-root .erp-fld.empty b{ color:#a5751a; font-weight:500; font-style:italic; font-family:inherit; font-size:11px; } #erp-root .erp-riskline{ font-size:10.5px; color:var(--e-dim); margin-top:10px; padding-top:9px; border-top:1px solid var(--e-line2); } #erp-root .erp-riskline b{ color:var(--e-org); } #erp-root .erp-editlog{ font-size:9.5px; color:var(--e-mute); margin-top:8px; } /* situation reports */ #erp-root .erp-sitbox{ background:var(--e-soft); border-radius:9px; padding:11px 12px; } #erp-root .erp-sitlist{ margin-top:11px; } #erp-root .erp-sit{ border-left:3px solid var(--e-line); padding:8px 0 8px 12px; margin-bottom:4px; } #erp-root .erp-sit.latest{ border-left-color:var(--e-red); background:rgba(200,32,47,.03); border-radius:0 7px 7px 0; } #erp-root .erp-sit-h{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:3px; } #erp-root .erp-sit-t{ font-family:var(--e-mono); font-size:10px; font-weight:700; color:var(--e-navy); } #erp-root .erp-sit-badge{ font-size:8px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; background:var(--e-red); color:#fff; border-radius:8px; padding:1px 7px; } #erp-root .erp-sit-lv,#erp-root .erp-sit-by{ font-size:9px; color:var(--e-mute); } #erp-root .erp-sit-x{ font-size:11px; line-height:1.65; color:var(--e-tx); white-space:pre-wrap; } /* evolution strip */ #erp-root .erp-evo{ position:relative; padding-left:4px; } #erp-root .erp-evo-gap{ font-size:8.5px; font-family:var(--e-mono); color:var(--e-mute); margin:1px 0 1px 88px; } #erp-root .erp-evo-row{ display:grid; grid-template-columns:54px 26px 1fr auto; gap:9px; align-items:flex-start; padding:6px 0; position:relative; } #erp-root .erp-evo-row:not(:last-child)::after{ content:''; position:absolute; left:66px; top:26px; bottom:-6px; width:2px; background:var(--e-line); } #erp-root .erp-evo-t{ font-family:var(--e-mono); font-size:10.5px; font-weight:700; color:var(--e-navy); padding-top:2px; } #erp-root .erp-evo-m{ display:flex; justify-content:center; } #erp-root .erp-evo-i{ width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; background:var(--e-raised); color:var(--e-dim); border:2px solid var(--e-card); box-shadow:0 0 0 1px var(--e-line); } #erp-root .erp-evo-row.k-activated .erp-evo-i,#erp-root .erp-evo-row.k-escalated .erp-evo-i{ background:var(--e-red); color:#fff; box-shadow:0 0 0 1px var(--e-red); } #erp-root .erp-evo-row.k-deescalated .erp-evo-i{ background:var(--e-grn); color:#fff; box-shadow:0 0 0 1px var(--e-grn); } #erp-root .erp-evo-row.k-sitrep .erp-evo-i{ background:var(--e-blu); color:#fff; box-shadow:0 0 0 1px var(--e-blu); } #erp-root .erp-evo-row.k-notified .erp-evo-i{ background:var(--e-purple); color:#fff; box-shadow:0 0 0 1px var(--e-purple); } #erp-root .erp-evo-row.k-phase0 .erp-evo-i{ background:var(--e-grn); color:#fff; box-shadow:0 0 0 1px var(--e-grn); } #erp-root .erp-evo-x b{ display:block; font-size:11px; font-weight:600; color:var(--e-navy); } #erp-root .erp-evo-x span{ display:block; font-size:10px; color:var(--e-dim); line-height:1.55; margin-top:1px; } #erp-root .erp-evo-lv{ font-family:var(--e-mono); font-size:8.5px; font-weight:800; padding:2px 6px; border-radius:5px; background:var(--e-raised); color:var(--e-dim); height:fit-content; } #erp-root .erp-evo-lv.lv2{ background:rgba(184,121,10,.12); color:var(--e-org); } #erp-root .erp-evo-lv.lv3{ background:rgba(200,32,47,.1); color:var(--e-red); } #erp-root .erp-evo-lv.lv4{ background:rgba(200,32,47,.2); color:var(--e-red2); } /* cells */ #erp-root .erp-cells{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:9px; } #erp-root .erp-cell{ background:var(--e-soft); border:1px solid var(--e-line); border-left:3px solid var(--c); border-radius:8px; padding:9px 11px; cursor:pointer; transition:box-shadow .12s,transform .12s; } #erp-root .erp-cell:hover{ transform:translateY(-1px); box-shadow:0 4px 12px rgba(13,27,62,.09); } #erp-root .erp-cell.done{ background:rgba(31,157,92,.05); border-color:rgba(31,157,92,.3); } #erp-root .erp-cell-h{ display:flex; justify-content:space-between; gap:6px; align-items:baseline; } #erp-root .erp-cell-n{ font-size:10.5px; font-weight:600; color:var(--e-navy); } #erp-root .erp-cell-p{ font-family:var(--e-mono); font-size:9.5px; color:var(--e-dim); } #erp-root .erp-cell-b{ height:3px; background:var(--e-line); border-radius:2px; margin:7px 0 5px; overflow:hidden; } #erp-root .erp-cell-b div{ height:100%; background:var(--c); border-radius:2px; } #erp-root .erp-cell-l{ font-size:9px; color:var(--e-mute); } /* priorities / auth / mini log */ #erp-root .erp-pr{ display:flex; align-items:flex-start; gap:9px; font-size:10.5px; line-height:1.55; padding:8px 0; border-bottom:1px solid var(--e-line2); cursor:pointer; } #erp-root .erp-pr:last-child{ border-bottom:none; } #erp-root .erp-pr span{ width:7px; height:7px; border-radius:50%; background:var(--c); flex-shrink:0; margin-top:5px; } #erp-root .erp-pr:hover{ color:var(--e-red); } #erp-root .erp-auth > div{ padding:7px 0; border-bottom:1px solid var(--e-line2); font-size:11px; } #erp-root .erp-auth > div:last-child{ border-bottom:none; } #erp-root .erp-auth span{ display:block; font-size:8.5px; text-transform:uppercase; letter-spacing:.5px; color:var(--e-mute); } #erp-root .erp-auth b{ font-size:12px; color:var(--e-navy); } #erp-root .erp-auth i{ font-style:normal; font-size:9.5px; color:var(--e-dim); } #erp-root .erp-override{ color:#8c1620; background:rgba(200,32,47,.07); border-radius:6px; padding:7px 9px; font-size:10px; } #erp-root .erp-smslink{ font-size:10px; color:var(--e-dim); display:flex; align-items:center; gap:8px; flex-wrap:wrap; } #erp-root .erp-smslink b{ color:var(--e-gold); font-family:var(--e-mono); } #erp-root .erp-loglite .erp-lg{ display:flex; gap:9px; font-size:10px; padding:5px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-loglite .erp-lg:last-child{ border-bottom:none; } #erp-root .erp-lg-t{ font-family:var(--e-mono); color:var(--e-gold); flex-shrink:0; } #erp-root .erp-lg-x{ color:var(--e-dim); line-height:1.45; } /* assessment */ #erp-root .erp-evgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; } #erp-root .erp-evcat-t{ font-size:9px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; color:var(--e-mute); margin-bottom:5px; } #erp-root .erp-ev{ display:flex; align-items:center; gap:7px; background:var(--e-soft); border:1px solid var(--e-line); border-radius:7px; padding:7px 9px; margin-bottom:4px; cursor:pointer; font-size:10.5px; } #erp-root .erp-ev:hover{ border-color:var(--e-navy2); } #erp-root .erp-ev.on{ border-color:var(--e-red); background:rgba(200,32,47,.06); box-shadow:inset 0 0 0 1px var(--e-red); font-weight:600; } #erp-root .erp-ev-l{ flex:1; } #erp-root .erp-ev-b{ font-family:var(--e-mono); font-size:8.5px; font-weight:800; padding:2px 5px; border-radius:4px; background:var(--e-raised); color:var(--e-dim); } #erp-root .erp-ev-b.lv1{ background:rgba(201,162,39,.14); color:#8a7414; } #erp-root .erp-ev-b.lv2{ background:rgba(184,121,10,.14); color:var(--e-org); } #erp-root .erp-ev-b.lv3{ background:rgba(200,32,47,.12); color:var(--e-red); } #erp-root .erp-ev-b.lv4{ background:rgba(200,32,47,.22); color:var(--e-red2); } #erp-root .erp-ev-s{ font-family:var(--e-mono); font-size:8.5px; color:var(--e-red); font-weight:700; } #erp-root .erp-evnote{ font-size:10.5px; color:var(--e-dim); line-height:1.65; margin-top:11px; padding-top:10px; border-top:1px solid var(--e-line2); } #erp-root .erp-q{ padding:9px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-q:last-child{ border-bottom:none; } #erp-root .erp-q-t{ font-size:11px; font-weight:600; color:var(--e-navy); margin-bottom:6px; } #erp-root .erp-q-o{ display:flex; gap:5px; flex-wrap:wrap; } #erp-root .erp-opt{ display:flex; align-items:center; gap:6px; font-size:10px; padding:5px 10px; border-radius:6px; border:1px solid var(--e-line); background:var(--e-card); color:var(--e-dim); cursor:pointer; } #erp-root .erp-opt:hover{ color:var(--e-navy); border-color:var(--e-navy2); } #erp-root .erp-opt.on{ background:var(--e-navy); border-color:var(--e-navy); color:#fff; font-weight:600; } #erp-root .erp-opt-l{ font-family:var(--e-mono); font-size:8px; font-weight:800; opacity:.75; } #erp-root .erp-qprog{ font-family:var(--e-mono); font-size:10px; color:var(--e-dim); } /* verdict */ #erp-root .erp-verdict{ text-align:center; border-width:2px; } #erp-root .erp-verdict.lv0{ border-color:var(--e-grn); } #erp-root .erp-verdict.lv1{ border-color:var(--e-yel); } #erp-root .erp-verdict.lv2{ border-color:var(--e-org); } #erp-root .erp-verdict.lv3{ border-color:var(--e-red); } #erp-root .erp-verdict.lv4{ border-color:var(--e-red2); box-shadow:0 0 0 3px rgba(200,32,47,.1); } #erp-root .erp-vd-l{ font-size:9px; font-weight:800; letter-spacing:.9px; text-transform:uppercase; color:var(--e-mute); } #erp-root .erp-vd-n{ font-family:var(--e-mono); font-size:56px; font-weight:800; line-height:1; margin:2px 0; color:var(--e-navy); } #erp-root .erp-verdict.lv4 .erp-vd-n,#erp-root .erp-verdict.lv3 .erp-vd-n{ color:var(--e-red); } #erp-root .erp-verdict.lv2 .erp-vd-n{ color:var(--e-org); } #erp-root .erp-verdict.lv1 .erp-vd-n{ color:#8a7414; } #erp-root .erp-verdict.lv0 .erp-vd-n{ color:var(--e-grn); } #erp-root .erp-vd-t{ font-size:15px; font-weight:800; color:var(--e-navy); letter-spacing:.4px; } #erp-root .erp-vd-d{ font-size:10.5px; color:var(--e-dim); line-height:1.6; margin-top:7px; } #erp-root .erp-vd-a{ font-size:10px; color:var(--e-tx); background:var(--e-soft); border-radius:7px; padding:8px 10px; margin-top:9px; line-height:1.55; } #erp-root .erp-vd-s{ font-size:9.5px; color:var(--e-mute); margin-top:7px; line-height:1.55; } #erp-root .erp-vd-esc{ font-size:9.5px; color:var(--e-org); margin-top:8px; font-weight:600; } #erp-root .erp-vd-warn{ font-size:9.5px; color:#8a7414; margin-top:6px; } #erp-root .erp-drv .erp-drow{ display:flex; gap:9px; align-items:flex-start; padding:6px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-drv .erp-drow:last-child{ border-bottom:none; } #erp-root .erp-dlv{ font-family:var(--e-mono); font-size:8.5px; font-weight:800; padding:2px 5px; border-radius:4px; background:var(--e-raised); color:var(--e-dim); } #erp-root .erp-dlv.lv3,#erp-root .erp-dlv.lv4{ background:rgba(200,32,47,.12); color:var(--e-red); } #erp-root .erp-dlv.lv2{ background:rgba(184,121,10,.14); color:var(--e-org); } #erp-root .erp-drow b{ display:block; font-size:10.5px; font-weight:500; color:var(--e-tx); } #erp-root .erp-drow span{ display:block; font-size:9px; color:var(--e-mute); } #erp-root .erp-auth-card{ border-color:rgba(200,32,47,.3); } #erp-root .erp-authnote{ font-size:9.5px; color:var(--e-mute); line-height:1.6; margin-bottom:10px; } #erp-root .erp-authmsg{ margin:8px 0; } #erp-root .erp-authbad{ font-size:10px; color:#8c1620; background:rgba(200,32,47,.07); border:1px solid rgba(200,32,47,.3); border-radius:6px; padding:8px 10px; line-height:1.55; } #erp-root .erp-cancelrow{ font-size:9.5px; color:var(--e-mute); margin-top:12px; padding-top:10px; border-top:1px solid var(--e-line2); display:flex; align-items:center; gap:8px; flex-wrap:wrap; } /* form controls */ #erp-root .erp-fg{ margin-bottom:10px; } #erp-root .erp-f2{ display:grid; grid-template-columns:1fr 1fr; gap:11px; } #erp-root .erp-f3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:11px; } #erp-root .erp-fg label{ display:block; font-size:9px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--e-mute); margin-bottom:4px; } #erp-root .erp-inp,#erp-root .erp-ta{ width:100%; font-family:inherit; font-size:11.5px; color:var(--e-tx); background:var(--e-card); border:1px solid var(--e-line); border-radius:7px; padding:7px 9px; } #erp-root .erp-inp:focus,#erp-root .erp-ta:focus{ outline:none; border-color:var(--e-navy2); box-shadow:0 0 0 2px rgba(27,45,107,.1); } #erp-root .erp-ta{ resize:vertical; line-height:1.65; } #erp-root .erp-ta.mono{ font-family:var(--e-mono); font-size:10.5px; } #erp-root .erp-inp.small{ width:auto; min-width:130px; } /* checklists */ #erp-root .erp-p0.active{ border-left:3px solid var(--e-org); } #erp-root .erp-p0.done{ border-left:3px solid var(--e-grn); } #erp-root .erp-p0p{ font-family:var(--e-mono); font-size:11px; color:var(--e-navy); font-weight:700; } #erp-root .erp-p0bar{ height:4px; background:var(--e-raised); border-radius:3px; overflow:hidden; margin-bottom:10px; } #erp-root .erp-p0bar div{ height:100%; background:linear-gradient(90deg,var(--e-org),var(--e-grn)); border-radius:3px; transition:width .25s; } #erp-root .erp-item{ display:flex; align-items:flex-start; gap:10px; padding:8px 6px; border-radius:7px; cursor:pointer; border-bottom:1px solid var(--e-line2); font-size:11px; line-height:1.55; } #erp-root .erp-item:last-child{ border-bottom:none; } #erp-root .erp-item:hover{ background:var(--e-soft); } #erp-root .erp-item.done .erp-item-t{ color:var(--e-mute); text-decoration:line-through; } #erp-root .erp-box{ width:17px; height:17px; border-radius:5px; border:1px solid var(--e-line); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:11px; color:#fff; font-weight:800; margin-top:1px; background:var(--e-card); } #erp-root .erp-item.done .erp-box{ background:var(--e-grn); border-color:var(--e-grn); } #erp-root .erp-item-t{ flex:1; } #erp-root .erp-item-d{ font-family:var(--e-mono); font-size:8.5px; font-weight:800; padding:2px 6px; border-radius:4px; background:var(--e-raised); color:var(--c,var(--e-dim)); flex-shrink:0; } #erp-root .erp-item-l{ font-family:var(--e-mono); font-size:8.5px; color:var(--e-mute); flex-shrink:0; } #erp-root .erp-item-l.lv3,#erp-root .erp-item-l.lv4{ color:var(--e-red); } #erp-root .erp-item-w{ font-size:9px; color:var(--e-mute); font-family:var(--e-mono); flex-shrink:0; } #erp-root .erp-locked{ font-size:11px; color:#8a5a08; background:rgba(184,121,10,.07); border:1px dashed rgba(184,121,10,.4); border-radius:9px; padding:12px 15px; margin-bottom:13px; text-align:center; } #erp-root .erp-deptbar{ display:flex; gap:5px; flex-wrap:wrap; margin-bottom:12px; } #erp-root .erp-dtab{ display:flex; align-items:center; gap:6px; font-size:10.5px; padding:6px 11px; border-radius:7px; border:1px solid var(--e-line); background:var(--e-card); color:var(--e-dim); cursor:pointer; border-left:3px solid var(--c); } #erp-root .erp-dtab:hover{ color:var(--e-navy); } #erp-root .erp-dtab.on{ background:var(--e-navy); color:#fff; font-weight:600; } #erp-root .erp-dtab.on span{ color:rgba(255,255,255,.7); } #erp-root .erp-dtab.lock{ opacity:.4; pointer-events:none; } #erp-root .erp-dtab span{ font-family:var(--e-mono); font-size:9px; color:var(--e-mute); } #erp-root .erp-deptmeta{ font-size:10px; color:var(--e-dim); line-height:1.7; background:var(--e-soft); border-radius:7px; padding:9px 11px; margin-bottom:9px; } #erp-root .erp-deptmeta b{ color:var(--e-navy); font-weight:600; } /* tables */ #erp-root .erp-tbl{ width:100%; border-collapse:collapse; } #erp-root .erp-tbl th{ text-align:left; font-size:8.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--e-mute); padding:8px 9px; background:var(--e-soft); border-bottom:1px solid var(--e-line); } #erp-root .erp-tbl td{ font-size:10.5px; padding:9px; border-bottom:1px solid var(--e-line2); vertical-align:top; } #erp-root .erp-tbl tr.due td{ background:rgba(200,32,47,.035); } #erp-root .erp-tsub{ font-size:9px; color:var(--e-mute); margin-top:2px; line-height:1.5; } #erp-root .erp-within{ font-family:var(--e-mono); font-size:10px; color:var(--e-red); font-weight:700; white-space:nowrap; } #erp-root .erp-basis{ font-size:9.5px; color:var(--e-dim); } #erp-root .erp-badge{ font-size:9px; font-weight:700; padding:3px 8px; border-radius:9px; white-space:nowrap; } #erp-root .erp-badge.ok{ background:rgba(31,157,92,.12); color:#166534; } #erp-root .erp-badge.due{ background:rgba(200,32,47,.1); color:var(--e-red); } /* comms */ #erp-root .erp-tpl{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 11px; border:1px solid var(--e-line); border-radius:8px; background:var(--e-soft); margin-bottom:6px; cursor:pointer; } #erp-root .erp-tpl:hover{ border-color:var(--e-navy2); } #erp-root .erp-tpl b{ display:block; font-size:11px; color:var(--e-navy); } #erp-root .erp-tpl span{ display:block; font-size:9.5px; color:var(--e-mute); } #erp-root .erp-tpl-l{ font-family:var(--e-mono); font-size:8.5px; color:var(--e-mute); } /* log */ #erp-root .erp-logadd{ display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; } #erp-root .erp-logadd .erp-inp{ flex:1; min-width:220px; } #erp-root .erp-logfull{ max-height:640px; overflow-y:auto; } #erp-root .erp-le{ display:grid; grid-template-columns:78px 92px 1fr; gap:11px; padding:8px 4px; border-bottom:1px solid var(--e-line2); border-left:3px solid transparent; } #erp-root .erp-le.k-decision{ border-left-color:var(--e-gold2); } #erp-root .erp-le.k-escalation{ border-left-color:var(--e-red); } #erp-root .erp-le.k-notification{ border-left-color:var(--e-purple); } #erp-root .erp-le.k-comms{ border-left-color:var(--e-blu); } #erp-root .erp-le.k-sitrep{ border-left-color:var(--e-blu); } #erp-root .erp-le.k-update{ border-left-color:var(--e-org); } #erp-root .erp-le-t{ font-family:var(--e-mono); font-size:11px; color:var(--e-navy); font-weight:600; } #erp-root .erp-le-t span{ display:block; font-size:8.5px; color:var(--e-mute); font-weight:400; } #erp-root .erp-le-k{ font-size:8.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:var(--e-mute); padding-top:2px; } #erp-root .erp-le-x{ font-size:10.5px; line-height:1.55; } #erp-root .erp-le-x span{ display:block; font-size:9px; color:var(--e-mute); margin-top:2px; } /* reference */ #erp-root .erp-reftabs{ display:flex; gap:5px; flex-wrap:wrap; margin-bottom:13px; } #erp-root .erp-rt{ font-size:10.5px; padding:6px 12px; border-radius:7px; border:1px solid var(--e-line); background:var(--e-card); color:var(--e-dim); cursor:pointer; } #erp-root .erp-rt:hover{ color:var(--e-navy); } #erp-root .erp-rt.on{ background:var(--e-navy); border-color:var(--e-navy); color:#fff; font-weight:600; } #erp-root .erp-lvrow{ display:flex; gap:13px; padding:11px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-lvrow:last-child{ border-bottom:none; } #erp-root .erp-lvbadge{ font-family:var(--e-mono); font-size:15px; font-weight:800; width:44px; height:44px; flex-shrink:0; display:flex; align-items:center; justify-content:center; border-radius:9px; background:var(--e-raised); color:var(--e-dim); } #erp-root .erp-lvrow.lv4 .erp-lvbadge{ background:var(--e-red2); color:#fff; } #erp-root .erp-lvrow.lv3 .erp-lvbadge{ background:var(--e-red); color:#fff; } #erp-root .erp-lvrow.lv2 .erp-lvbadge{ background:var(--e-org); color:#fff; } #erp-root .erp-lvrow.lv1 .erp-lvbadge{ background:var(--e-yel); color:#fff; } #erp-root .erp-lvrow.lv0 .erp-lvbadge{ background:var(--e-grn); color:#fff; } #erp-root .erp-lvrow b{ font-size:13px; color:var(--e-navy); } #erp-root .erp-lvd{ font-size:10.5px; color:var(--e-dim); line-height:1.6; margin:3px 0 5px; } #erp-root .erp-lva{ font-size:10px; color:var(--e-tx); line-height:1.55; margin-top:3px; } #erp-root .erp-lva span{ display:inline-block; min-width:106px; font-size:8.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:var(--e-mute); } #erp-root .erp-evref{ display:flex; gap:10px; align-items:flex-start; padding:8px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-evref:last-child{ border-bottom:none; } #erp-root .erp-evref b{ font-size:11px; color:var(--e-navy); } #erp-root .erp-evref i{ font-style:normal; font-family:var(--e-mono); font-size:9px; color:var(--e-red); } #erp-root .erp-evref span{ display:block; font-size:10px; color:var(--e-dim); line-height:1.6; margin-top:2px; } #erp-root .erp-orggrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; } #erp-root .erp-org{ background:var(--e-soft); border:1px solid var(--e-line); border-left:3px solid var(--c); border-radius:8px; padding:11px 12px; } #erp-root .erp-org-n{ font-size:11.5px; font-weight:700; color:var(--e-navy); } #erp-root .erp-org-l{ font-size:11px; color:var(--e-gold); font-family:var(--e-mono); margin-top:3px; } #erp-root .erp-org-r{ font-size:9px; color:var(--e-mute); } #erp-root .erp-org-s{ font-size:9.5px; color:var(--e-dim); line-height:1.6; margin-top:6px; } #erp-root .erp-refitem{ display:flex; gap:9px; align-items:flex-start; font-size:10.5px; line-height:1.6; padding:6px 0; border-bottom:1px solid var(--e-line2); } #erp-root .erp-refitem:last-child{ border-bottom:none; } /* ── global crisis banner ── */ .erp-banner{ position:fixed; left:0; right:0; bottom:0; z-index:9998; display:flex; align-items:center; gap:13px; padding:8px 18px; background:linear-gradient(90deg,#9a1823,#C8202F 45%,#9a1823); color:#fff; font-family:'Montserrat',system-ui,sans-serif; font-size:11.5px; box-shadow:0 -3px 16px rgba(200,32,47,.3); border-top:1px solid #e0616c; } .erp-banner.lv2{ background:linear-gradient(90deg,#8a5a08,#b8790a 45%,#8a5a08); border-top-color:#e0aa4a; } .erp-banner.lv1{ background:linear-gradient(90deg,#8a7414,#c9a227 45%,#8a7414); border-top-color:#e6d089; } .erp-banner b{ font-weight:800; letter-spacing:.6px; } .erp-bpulse{ width:9px; height:9px; border-radius:50%; background:#fff; animation:erpPulse 1.2s infinite; flex-shrink:0; } .erp-bref,.erp-bev,.erp-bac{ font-size:10.5px; opacity:.92; } .erp-bref{ font-family:'JetBrains Mono',ui-monospace,monospace; letter-spacing:.4px; } .erp-bev{ border-left:1px solid rgba(255,255,255,.35); padding-left:13px; } .erp-bac{ border-left:1px solid rgba(255,255,255,.35); padding-left:13px; font-family:'JetBrains Mono',ui-monospace,monospace; } .erp-btime{ margin-left:auto; font-family:'JetBrains Mono',ui-monospace,monospace; font-size:13px; font-weight:700; } .erp-bbtn{ background:rgba(0,0,0,.25); color:#fff; border:1px solid rgba(255,255,255,.45); border-radius:6px; padding:5px 12px; font:600 10.5px 'Montserrat',system-ui,sans-serif; cursor:pointer; } .erp-bbtn:hover{ background:rgba(0,0,0,.42); } body.erp-live{ padding-bottom:40px; } @media (max-width:1400px){ #erp-root .erp-cols,#erp-root .erp-cols.wide{ grid-template-columns:1fr; } #erp-root .erp-stats{ grid-template-columns:repeat(2,1fr); } #erp-root .erp-hero{ grid-template-columns:1fr; } #erp-root .erp-hero-c{ text-align:left; } #erp-root .erp-f3{ grid-template-columns:1fr 1fr; } } /* ── aircraft status control (CAMO authority) ── */ .tail-status-clickable{ cursor:pointer; transition:transform .12s, box-shadow .12s; } .tail-status-clickable:hover{ transform:scale(1.5); box-shadow:0 0 0 3px rgba(200,32,47,.18); } .acs-ov{ position:fixed; inset:0; z-index:10000; background:rgba(13,27,62,.5); display:flex; align-items:center; justify-content:center; padding:20px; font-family:'Montserrat',system-ui,sans-serif; } .acs-box{ background:#fff; border-radius:12px; width:100%; max-width:560px; overflow:hidden; box-shadow:0 24px 70px rgba(0,0,0,.3); max-height:92vh; display:flex; flex-direction:column; } .acs-hd{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:14px 18px; color:#fff; } .acs-t{ font-size:15px; font-weight:800; letter-spacing:.3px; } .acs-s{ font-size:9.5px; opacity:.85; margin-top:2px; } .acs-x{ background:rgba(255,255,255,.2); border:none; color:#fff; width:26px; height:26px; border-radius:6px; font-size:17px; line-height:1; cursor:pointer; flex-shrink:0; } .acs-x:hover{ background:rgba(255,255,255,.35); } .acs-bd{ padding:15px 18px; overflow-y:auto; } .acs-cur{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:13px; } .acs-cur > div{ background:#f6f8fb; border-radius:7px; padding:8px 10px; } .acs-cur span{ display:block; font-size:8.5px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:#939aad; } .acs-cur b{ display:block; font-size:11.5px; color:#16203d; margin-top:2px; } .acs-blockers{ background:rgba(200,32,47,.06); border:1px solid rgba(200,32,47,.3); border-radius:8px; padding:10px 13px; margin-bottom:13px; font-size:10.5px; color:#8c1620; } .acs-blockers b{ display:block; margin-bottom:5px; } .acs-blockers ul{ margin:0; padding-left:17px; line-height:1.7; } .acs-fg{ margin-bottom:10px; } .acs-f2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; } .acs-fg label{ display:block; font-size:9px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:#939aad; margin-bottom:4px; } .acs-fg label i{ font-style:normal; color:#C8202F; font-size:8.5px; margin-left:4px; } .acs-fg input, .acs-fg select{ width:100%; font-family:inherit; font-size:11.5px; color:#16203d; border:1px solid #dfe4ee; border-radius:7px; padding:7px 9px; background:#fff; } .acs-fg input:focus, .acs-fg select:focus{ outline:none; border-color:#1B2D6B; box-shadow:0 0 0 2px rgba(27,45,107,.1); } .acs-note{ font-size:9.5px; line-height:1.6; color:#5b6178; background:#f6f8fb; border-left:3px solid #C9A227; border-radius:0 7px 7px 0; padding:9px 11px; margin-top:10px; } .acs-refused{ background:rgba(184,121,10,.07); border:1px solid rgba(184,121,10,.3); border-radius:9px; padding:13px 15px; font-size:11px; line-height:1.7; color:#8a5a08; } .acs-refused b{ color:#7a4f07; } .acs-refused p{ margin:7px 0 0; } .acs-err{ font-size:10.5px; color:#8c1620; background:rgba(200,32,47,.07); border:1px solid rgba(200,32,47,.3); border-radius:6px; padding:8px 10px; margin-top:9px; } .acs-ft{ display:flex; gap:8px; justify-content:flex-end; padding:12px 18px; border-top:1px solid #dfe4ee; background:#f6f8fb; } .acs-btn{ font:600 11px 'Montserrat',system-ui,sans-serif; padding:8px 15px; border-radius:7px; border:1px solid #dfe4ee; background:#fff; color:#5b6178; cursor:pointer; } .acs-btn:hover{ border-color:#1B2D6B; color:#0d1b3e; } .acs-btn.primary{ background:#C8202F; border-color:#C8202F; color:#fff; } .acs-btn.primary:hover{ background:#9a1823; border-color:#9a1823; } @media (max-width:640px){ .acs-cur, .acs-f2{ grid-template-columns:1fr; } } /* ── CAMO Administration ─────────────────────────────────────────────────── */ #viewCAMOAdmin{ flex-direction:column; overflow:hidden; } #camoadm-root{ --c-navy:#0d1b3e; --c-navy2:#1B2D6B; --c-gold:#a9811d; --c-red:#C8202F; --c-grn:#1f9d5c; --c-org:#b8790a; --c-blu:#2f6fb0; --c-pur:#7b4fc9; --c-bg:#eef1f6; --c-card:#fff; --c-soft:#f6f8fb; --c-line:#dfe4ee; --c-line2:#eef1f6; --c-tx:#16203d; --c-dim:#5b6178; --c-mute:#939aad; --c-mono:'JetBrains Mono',ui-monospace,Menlo,monospace; background:var(--c-bg); color:var(--c-tx); font-family:'Montserrat',system-ui,sans-serif; display:flex; flex-direction:column; flex:1; min-height:0; } #camoadm-root *{ box-sizing:border-box; } /* horizontal navigation, light — the six sections on one line, each with its own drop-down. Same shape as the Safety Manager topnav, in this module's own light palette rather than the dark one. */ #camoadm-root .ca-topnav{ display:flex; align-items:stretch; gap:2px; flex-wrap:wrap; background:var(--c-card); border-bottom:1px solid var(--c-line); padding:0 14px; flex-shrink:0; position:relative; z-index:20; box-shadow:0 1px 0 rgba(13,27,62,.04); } #camoadm-root .ca-tnitems{ display:flex; align-items:stretch; gap:2px; flex-wrap:wrap; } #camoadm-root .ca-tn{ position:relative; } #camoadm-root .ca-tnh{ display:flex; align-items:center; gap:7px; height:100%; min-height:38px; padding:0 13px; cursor:pointer; user-select:none; white-space:nowrap; font-size:11px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--c-dim); border-bottom:2px solid transparent; } #camoadm-root .ca-tnh:hover{ color:var(--c-navy); background:var(--c-soft); } #camoadm-root .ca-tn.on .ca-tnh{ color:var(--c-navy); border-bottom-color:var(--c-gold); } #camoadm-root .ca-tn.open .ca-tnh{ color:var(--c-navy); background:var(--c-soft); } #camoadm-root .ca-tnico{ width:14px; height:14px; flex-shrink:0; opacity:.7; } #camoadm-root .ca-caret{ width:12px; height:12px; flex-shrink:0; opacity:.5; transition:transform .16s; } #camoadm-root .ca-tn.open .ca-caret{ transform:rotate(180deg); } #camoadm-root .ca-tnmenu{ display:none; position:absolute; top:100%; left:0; min-width:238px; background:var(--c-card); border:1px solid var(--c-line); border-radius:0 8px 8px 8px; box-shadow:0 12px 32px rgba(13,27,62,.14); padding:5px 0; z-index:30; } #camoadm-root .ca-tn.open .ca-tnmenu{ display:block; } #camoadm-root .ca-mi{ display:flex; align-items:center; gap:8px; font-size:11.5px; color:var(--c-dim); padding:7px 14px; cursor:pointer; border-left:3px solid transparent; white-space:nowrap; text-transform:none; letter-spacing:0; font-weight:400; } #camoadm-root .ca-mi:hover{ background:var(--c-soft); color:var(--c-navy); } #camoadm-root .ca-mi.on{ background:rgba(169,129,29,.09); color:var(--c-navy); font-weight:600; border-left-color:var(--c-gold); } #camoadm-root .ca-mb{ margin-left:auto; font-family:var(--c-mono); font-size:9px; color:var(--c-mute); background:var(--c-soft); border-radius:9px; padding:1px 6px; font-weight:400; } #camoadm-root .ca-mi .ca-mb{ background:var(--c-line2); } #camoadm-root .ca-mb.red{ background:rgba(200,32,47,.12); color:var(--c-red); font-weight:800; } #camoadm-root .ca-tnuser{ margin-left:auto; display:flex; align-items:center; gap:8px; padding:5px 0; } #camoadm-root .ca-ul{ font-size:8.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--c-mute); } #camoadm-root .ca-tnuser select{ font-family:inherit; font-size:10.5px; padding:5px 8px; border-radius:7px; border:1px solid var(--c-line); background:#fff; color:var(--c-tx); max-width:250px; } #camoadm-root .ca-rolechip{ font-size:9px; font-weight:800; border-radius:9px; padding:3px 9px; letter-spacing:.4px; text-transform:uppercase; background:var(--c-line2); color:var(--c-dim); white-space:nowrap; } #camoadm-root .ca-rolechip.camo{ background:rgba(31,157,92,.13); color:#166534; } #camoadm-root .ca-rolechip.out{ background:rgba(184,121,10,.14); color:#8a5a08; } #camoadm-root .ca-main{ flex:1; min-width:0; min-height:0; overflow-y:auto; } #camoadm-root .ca-page{ padding:16px 20px 50px; } #camoadm-root .ca-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; flex-wrap:wrap; } #camoadm-root .ca-h1{ font-size:19px; font-weight:700; color:var(--c-navy); } #camoadm-root .ca-h2{ font-size:11px; color:var(--c-dim); margin-top:3px; max-width:860px; line-height:1.6; } #camoadm-root .ca-hact{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; } #camoadm-root .ca-stamp{ font-size:9px; color:var(--c-mute); font-family:var(--c-mono); } #camoadm-root .ca-lock{ font-size:10px; color:var(--c-org); background:rgba(184,121,10,.09); border:1px solid rgba(184,121,10,.3); border-radius:7px; padding:5px 10px; } #camoadm-root .ca-search{ font-family:inherit; font-size:11px; padding:6px 10px; border-radius:7px; border:1px solid var(--c-line); background:#fff; color:var(--c-tx); min-width:150px; } #camoadm-root .ca-chk{ font-size:10px; color:var(--c-dim); display:flex; align-items:center; gap:5px; } #camoadm-root .ca-btn{ font-family:inherit; font-size:11px; font-weight:600; padding:6px 13px; border-radius:7px; border:1px solid var(--c-line); background:#fff; color:var(--c-dim); cursor:pointer; white-space:nowrap; } #camoadm-root .ca-btn:hover{ border-color:var(--c-navy2); color:var(--c-navy); } #camoadm-root .ca-btn.primary{ background:var(--c-navy); border-color:var(--c-navy); color:#fff; } #camoadm-root .ca-btn.primary:hover{ background:var(--c-navy2); } #camoadm-root .ca-btn.danger{ border-color:rgba(200,32,47,.4); color:var(--c-red); } #camoadm-root .ca-btn.danger:hover{ background:var(--c-red); color:#fff; border-color:var(--c-red); } #camoadm-root .ca-btn.tiny{ font-size:9.5px; padding:4px 9px; } #camoadm-root .ca-card{ background:var(--c-card); border:1px solid var(--c-line); border-radius:11px; padding:14px 16px; margin-bottom:13px; } #camoadm-root .ca-ch{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:11px; padding-bottom:9px; border-bottom:1px solid var(--c-line); flex-wrap:wrap; } #camoadm-root .ca-ch > span{ font-size:10.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--c-navy); } #camoadm-root .ca-note-inline{ font-size:9px; color:var(--c-mute); text-transform:none; letter-spacing:0; font-weight:400; } #camoadm-root .ca-empty{ padding:26px; text-align:center; font-size:11px; color:var(--c-mute); } #camoadm-root .ca-sub{ font-size:9px; color:var(--c-mute); } #camoadm-root .ca-mono{ font-family:var(--c-mono); font-size:10.5px; } #camoadm-root .bad{ color:var(--c-red); font-weight:600; } #camoadm-root .warn{ color:var(--c-org); font-weight:600; } #camoadm-root .ca-kpis{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-bottom:13px; } #camoadm-root .ca-kpi{ background:var(--c-card); border:1px solid var(--c-line); border-bottom:3px solid var(--c-line); border-radius:10px; padding:11px 13px; } #camoadm-root .ca-kpi.t-good{ border-bottom-color:var(--c-grn); } #camoadm-root .ca-kpi.t-warn{ border-bottom-color:var(--c-org); } #camoadm-root .ca-kpi.t-bad{ border-bottom-color:var(--c-red); } #camoadm-root .ca-kl{ font-size:9px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--c-mute); } #camoadm-root .ca-kv{ font-family:var(--c-mono); font-size:23px; font-weight:700; color:var(--c-navy); line-height:1.25; } #camoadm-root .ca-kpi.t-bad .ca-kv{ color:var(--c-red); } #camoadm-root .ca-kpi.t-warn .ca-kv{ color:var(--c-org); } #camoadm-root .ca-kpi.t-good .ca-kv{ color:var(--c-grn); } #camoadm-root .ca-ks{ font-size:9.5px; color:var(--c-dim); } #camoadm-root .ca-grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:13px; } #camoadm-root .ca-row{ display:flex; justify-content:space-between; align-items:center; gap:9px; padding:6px 0; border-bottom:1px solid var(--c-line2); font-size:10.5px; } #camoadm-root .ca-row:last-child{ border-bottom:none; } #camoadm-root .ca-row span{ color:var(--c-dim); } #camoadm-root .ca-row b{ font-family:var(--c-mono); font-size:12px; color:var(--c-navy); } #camoadm-root .ca-row.t-bad b{ color:var(--c-red); } #camoadm-root .ca-row.t-warn b{ color:var(--c-org); } #camoadm-root .ca-row.t-good b{ color:var(--c-grn); } #camoadm-root .ca-tbl{ width:100%; border-collapse:collapse; } #camoadm-root .ca-tbl th{ text-align:left; font-size:8.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--c-mute); padding:8px 9px; background:var(--c-soft); border-bottom:1px solid var(--c-line); white-space:nowrap; } #camoadm-root .ca-tbl th.sortable{ cursor:pointer; } #camoadm-root .ca-tbl th.sortable:hover{ color:var(--c-navy); } #camoadm-root .ca-tbl th.on{ color:var(--c-gold); } #camoadm-root .ca-tbl td{ font-size:10.5px; padding:8px 9px; border-bottom:1px solid var(--c-line2); vertical-align:top; } #camoadm-root .ca-tbl tr:hover td{ background:var(--c-soft); } #camoadm-root .ca-tbl tr.arch td{ opacity:.5; font-style:italic; } #camoadm-root .ca-actions{ white-space:nowrap; } #camoadm-root .ca-pill{ font-size:9px; font-weight:700; padding:2px 8px; border-radius:9px; white-space:nowrap; background:var(--c-soft); color:var(--c-dim); text-transform:capitalize; } #camoadm-root .ca-pill.good{ background:rgba(31,157,92,.12); color:#166534; } #camoadm-root .ca-pill.warn{ background:rgba(184,121,10,.14); color:#8a5a08; } #camoadm-root .ca-pill.bad,#camoadm-root .ca-pill.critical{ background:rgba(200,32,47,.11); color:var(--c-red); } #camoadm-root .ca-pill.high{ background:rgba(184,121,10,.16); color:#8a5a08; } #camoadm-root .ca-pill.medium{ background:rgba(201,162,39,.16); color:#7a6110; } #camoadm-root .ca-pill.act-create{ background:rgba(31,157,92,.12); color:#166534; } #camoadm-root .ca-pill.act-update{ background:rgba(47,111,176,.12); color:#1e4d7c; } #camoadm-root .ca-pill.act-delete{ background:rgba(200,32,47,.11); color:var(--c-red); } #camoadm-root .ca-pill.act-status{ background:rgba(123,79,201,.14); color:#5b32a3; } #camoadm-root .ca-pill.act-archive,#camoadm-root .ca-pill.act-restore{ background:rgba(184,121,10,.14); color:#8a5a08; } #camoadm-root .ca-chg{ font-size:9.5px; line-height:1.6; } #camoadm-root .ca-from{ color:var(--c-mute); text-decoration:line-through; } #camoadm-root .ca-to{ color:var(--c-navy); font-weight:600; } #camoadm-root .ca-rec{ border-color:var(--c-navy2); } #camoadm-root .ca-rec.editing{ border-color:var(--c-gold); box-shadow:0 0 0 2px rgba(201,162,39,.12); } #camoadm-root .ca-state{ border-radius:9px; padding:11px 13px; margin-bottom:12px; font-size:11px; line-height:1.6; } #camoadm-root .ca-state.ok{ background:rgba(31,157,92,.07); border:1px solid rgba(31,157,92,.3); color:#14532d; } #camoadm-root .ca-state.warn{ background:rgba(184,121,10,.07); border:1px solid rgba(184,121,10,.3); color:#7a4f07; } #camoadm-root .ca-state.bad{ background:rgba(200,32,47,.06); border:1px solid rgba(200,32,47,.3); color:#8c1620; } #camoadm-root .ca-state ul{ margin:6px 0 0; padding-left:18px; } #camoadm-root .ca-fields{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:9px; } #camoadm-root .ca-fv{ background:var(--c-soft); border-radius:7px; padding:7px 10px; } #camoadm-root .ca-fv span{ display:block; font-size:8.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--c-mute); } #camoadm-root .ca-fv b{ display:block; font-size:11.5px; color:var(--c-navy); margin-top:2px; font-weight:500; } #camoadm-root .ca-deps{ font-size:10px; color:var(--c-dim); background:var(--c-soft); border-left:3px solid var(--c-blu); border-radius:0 7px 7px 0; padding:9px 11px; margin-top:11px; line-height:1.6; } #camoadm-root .ca-trail{ max-height:280px; overflow-y:auto; } #camoadm-root .ca-te{ display:grid; grid-template-columns:150px 78px 110px 1fr; gap:9px; font-size:9.5px; padding:5px 0; border-bottom:1px solid var(--c-line2); align-items:start; color:var(--c-dim); } #camoadm-root .ca-te:last-child{ border-bottom:none; } #camoadm-root .ca-form{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:11px; } #camoadm-root .ca-fg.wide{ grid-column:1 / -1; } #camoadm-root .ca-fg label{ display:block; font-size:9px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--c-mute); margin-bottom:4px; } #camoadm-root .ca-fg label i{ font-style:normal; color:var(--c-red); font-size:8.5px; } #camoadm-root .ca-fg label u{ text-decoration:none; color:var(--c-dim); font-weight:400; } #camoadm-root .ca-fg input,#camoadm-root .ca-fg select,#camoadm-root .ca-fg textarea{ width:100%; font-family:inherit; font-size:11.5px; color:var(--c-tx); border:1px solid var(--c-line); border-radius:7px; padding:7px 9px; background:#fff; } #camoadm-root .ca-fg input:focus,#camoadm-root .ca-fg select:focus,#camoadm-root .ca-fg textarea:focus{ outline:none; border-color:var(--c-navy2); box-shadow:0 0 0 2px rgba(27,45,107,.1); } #camoadm-root .ca-fg textarea{ resize:vertical; line-height:1.6; } #camoadm-root .ca-help{ font-size:9px; color:var(--c-mute); margin-top:3px; line-height:1.45; } #camoadm-root .ca-err{ font-size:10.5px; color:#8c1620; background:rgba(200,32,47,.07); border:1px solid rgba(200,32,47,.3); border-radius:7px; padding:9px 11px; margin-top:11px; line-height:1.6; } @media (max-width:1500px){ #camoadm-root .ca-kpis{ grid-template-columns:repeat(3,1fr); } #camoadm-root .ca-grid3{ grid-template-columns:1fr; } } /* import wizard */ #camoadm-root .ca-steps{ display:flex; gap:6px; margin-bottom:13px; flex-wrap:wrap; } #camoadm-root .ca-step{ display:flex; align-items:center; gap:7px; font-size:10.5px; font-weight:600; color:var(--c-mute); background:var(--c-card); border:1px solid var(--c-line); border-radius:20px; padding:5px 13px 5px 5px; } #camoadm-root .ca-step span{ width:19px; height:19px; border-radius:50%; background:var(--c-line2); color:var(--c-dim); display:flex; align-items:center; justify-content:center; font-size:9.5px; font-weight:800; } #camoadm-root .ca-step.on{ border-color:var(--c-navy); color:var(--c-navy); } #camoadm-root .ca-step.on span{ background:var(--c-navy); color:#fff; } #camoadm-root .ca-step.done{ border-color:rgba(31,157,92,.4); color:#166534; } #camoadm-root .ca-step.done span{ background:var(--c-grn); color:#fff; } #camoadm-root .ca-fg input[type=file]{ padding:6px; font-size:10.5px; } #camoadm-root .ca-note{ font-size:10px; line-height:1.6; color:var(--c-dim); background:var(--c-soft); border-left:3px solid var(--c-gold); border-radius:0 7px 7px 0; padding:9px 11px; margin-top:10px; } /* connector screens */ #camoadm-root .ca-warn{ font-size:11px; line-height:1.7; color:#7a4f07; background:rgba(184,121,10,.08); border:1px solid rgba(184,121,10,.32); border-radius:9px; padding:12px 15px; margin-bottom:13px; } #camoadm-root .ca-warn b{ color:#63400a; } #camoadm-root .ca-warn code{ font-family:var(--c-mono); font-size:10px; background:rgba(0,0,0,.05); padding:1px 4px; border-radius:3px; } #camoadm-root .cx-vf{ width:100%; font-family:var(--c-mono); font-size:10.5px; padding:5px 7px; border:1px solid var(--c-line); border-radius:6px; } #camoadm-root .cx-sf{ width:100%; font-family:inherit; font-size:10.5px; padding:5px 7px; border:1px solid var(--c-line); border-radius:6px; background:#fff; } /* ── Administration (inside Settings) ────────────────────────────────────── */ .adm{ --a-navy:#0d1b3e; --a-navy2:#1B2D6B; --a-gold:#a9811d; --a-red:#C8202F; --a-grn:#1f9d5c; --a-org:#b8790a; --a-card:#fff; --a-soft:#f6f8fb; --a-line:#dfe4ee; --a-line2:#eef1f6; --a-tx:#16203d; --a-dim:#5b6178; --a-mute:#939aad; --a-mono:'JetBrains Mono',ui-monospace,Menlo,monospace; } .adm *{ box-sizing:border-box; } .adm-who{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; background:var(--a-card); border:1px solid var(--a-line); border-left:3px solid var(--a-gold); border-radius:10px; padding:11px 15px; margin-bottom:13px; } .adm-av{ width:36px; height:36px; border-radius:50%; background:var(--a-navy); color:#fff; display:flex; align-items:center; justify-content:center; font:800 13px 'Montserrat',system-ui,sans-serif; flex-shrink:0; letter-spacing:.5px; } .adm-av.sm{ width:27px; height:27px; font-size:10.5px; } .adm-av.xs{ width:22px; height:22px; font-size:9px; } .adm-wn{ font-size:13px; font-weight:700; color:var(--a-navy); } .adm-ws{ font-size:10px; color:var(--a-dim); } .adm-stats{ margin-left:auto; display:flex; gap:15px; flex-wrap:wrap; } .adm-stats span{ font-size:10px; color:var(--a-mute); } .adm-stats b{ font-family:var(--a-mono); font-size:13px; color:var(--a-navy); display:block; } .adm-tabs{ display:flex; gap:3px; flex-wrap:wrap; border-bottom:1px solid var(--a-line); margin-bottom:13px; } .adm-tab{ font-size:11.5px; font-weight:600; color:var(--a-dim); padding:8px 14px; cursor:pointer; border-bottom:2px solid transparent; white-space:nowrap; } .adm-tab:hover{ color:var(--a-navy); } .adm-tab.on{ color:var(--a-navy); border-bottom-color:var(--a-gold); } .adm-bar{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:11px; } .adm-inp{ font-family:inherit; font-size:11px; padding:6px 9px; border-radius:7px; border:1px solid var(--a-line); background:#fff; color:var(--a-tx); } .adm-inp.grow{ flex:1; min-width:190px; } .adm-seg{ display:flex; border:1px solid var(--a-line); border-radius:7px; overflow:hidden; } .adm-seg button{ font:600 10.5px 'Montserrat',system-ui,sans-serif; padding:6px 12px; border:none; background:#fff; color:var(--a-dim); cursor:pointer; } .adm-seg button.on{ background:var(--a-navy); color:#fff; } .adm-btn{ font:600 11px 'Montserrat',system-ui,sans-serif; padding:6px 13px; border-radius:7px; border:1px solid var(--a-line); background:#fff; color:var(--a-dim); cursor:pointer; white-space:nowrap; } .adm-btn:hover{ border-color:var(--a-navy2); color:var(--a-navy); } .adm-btn.primary{ background:var(--a-navy); border-color:var(--a-navy); color:#fff; } .adm-btn.primary:hover{ background:var(--a-navy2); } .adm-btn.danger{ border-color:rgba(200,32,47,.4); color:var(--a-red); } .adm-btn.danger:hover{ background:var(--a-red); color:#fff; } .adm-btn.tiny{ font-size:9.5px; padding:4px 9px; } .adm-lock{ font-size:10px; color:var(--a-org); background:rgba(184,121,10,.09); border:1px solid rgba(184,121,10,.3); border-radius:7px; padding:5px 10px; } .adm-count{ font-size:10px; color:var(--a-mute); margin-bottom:8px; } .adm-card{ background:var(--a-card); border:1px solid var(--a-line); border-radius:11px; padding:14px 16px; margin-bottom:13px; } .adm-ch{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:11px; padding-bottom:9px; border-bottom:1px solid var(--a-line); } .adm-ch > span:first-child{ font-size:10.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--a-navy); } .adm-ch2{ font-size:9.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--a-mute); margin:14px 0 7px; } .adm-act{ display:flex; gap:6px; flex-wrap:wrap; } .adm-empty{ padding:26px; text-align:center; font-size:11px; color:var(--a-mute); } .adm-sub{ font-size:9.5px; color:var(--a-mute); line-height:1.5; } .adm-mono{ font-family:var(--a-mono); font-size:10.5px; } .adm-note{ font-size:10px; line-height:1.65; color:var(--a-dim); background:var(--a-soft); border-left:3px solid var(--a-gold); border-radius:0 7px 7px 0; padding:9px 12px; margin-bottom:11px; } .adm-warn{ font-size:11px; line-height:1.7; color:#7a4f07; background:rgba(184,121,10,.08); border:1px solid rgba(184,121,10,.32); border-radius:9px; padding:12px 15px; margin-bottom:13px; } .adm-err{ font-size:10.5px; color:#8c1620; background:rgba(200,32,47,.07); border:1px solid rgba(200,32,47,.3); border-radius:7px; padding:9px 11px; margin-top:10px; } .adm-tbl{ width:100%; border-collapse:collapse; } .adm-tbl th{ text-align:left; font-size:8.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--a-mute); padding:8px 9px; background:var(--a-soft); border-bottom:1px solid var(--a-line); white-space:nowrap; } .adm-tbl td{ font-size:10.5px; padding:8px 9px; border-bottom:1px solid var(--a-line2); vertical-align:top; } .adm-tbl tr:hover td{ background:var(--a-soft); } .adm-pill{ font-size:9px; font-weight:700; padding:2px 8px; border-radius:9px; white-space:nowrap; background:var(--a-soft); color:var(--a-dim); text-transform:capitalize; } .adm-pill.act-create{ background:rgba(31,157,92,.12); color:#166534; } .adm-pill.act-update{ background:rgba(47,111,176,.12); color:#1e4d7c; } .adm-pill.act-delete{ background:rgba(200,32,47,.11); color:var(--a-red); } .adm-pill.act-login,.adm-pill.act-logout{ background:rgba(123,79,201,.13); color:#5b32a3; } .adm-pill.act-export,.adm-pill.act-import{ background:rgba(184,121,10,.14); color:#8a5a08; } .adm-dchip{ display:inline-block; font-size:9px; font-weight:700; padding:2px 7px; border-radius:8px; margin:1px 2px 1px 0; white-space:nowrap; } .adm-dchip.lg{ font-size:10px; padding:4px 10px; } .adm-rchip,.adm-gchip{ display:inline-block; font-size:10px; font-weight:600; padding:4px 10px; border-radius:8px; margin:2px 3px 2px 0; } .adm-rchip{ background:rgba(27,45,107,.09); color:var(--a-navy2); } .adm-gchip{ background:rgba(169,129,29,.12); color:#7a5c12; } .adm-chips{ display:flex; flex-wrap:wrap; gap:2px; } .adm-sysbadge{ font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.5px; background:var(--a-line2); color:var(--a-mute); border-radius:6px; padding:1px 5px; margin-left:5px; } .adm-abadge{ display:inline-block; font-size:8.5px; font-weight:700; background:rgba(31,157,92,.11); color:#166534; border-radius:6px; padding:2px 6px; margin:1px 2px 1px 0; } .adm-abadge.deny{ background:rgba(200,32,47,.12); color:var(--a-red); text-decoration:line-through; } .adm-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr)); gap:11px; } .adm-ucard{ background:var(--a-card); border:1px solid var(--a-line); border-top:3px solid var(--dc); border-radius:10px; padding:12px 13px; cursor:pointer; transition:box-shadow .12s, transform .12s; } .adm-ucard:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(13,27,62,.1); } .adm-uc-h{ display:flex; align-items:center; gap:9px; } .adm-uc-n{ font-size:12px; font-weight:700; color:var(--a-navy); } .adm-uc-j{ font-size:9.5px; color:var(--a-dim); } .adm-uc-h .adm-pill{ margin-left:auto; } .adm-uc-b{ display:grid; grid-template-columns:1fr 1fr; gap:7px; margin:10px 0 8px; } .adm-uc-b span{ display:block; font-size:8px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--a-mute); } .adm-uc-b b{ font-size:10.5px; color:var(--a-tx); font-family:var(--a-mono); } .adm-uc-f{ font-size:9.5px; color:var(--a-mute); border-top:1px solid var(--a-line2); padding-top:7px; } .adm-rec{ border-color:var(--a-navy2); } .adm-rec.editing{ border-color:var(--a-gold); box-shadow:0 0 0 2px rgba(201,162,39,.12); } .adm-fields{ display:grid; grid-template-columns:repeat(auto-fill,minmax(175px,1fr)); gap:8px; } .adm-fv{ background:var(--a-soft); border-radius:7px; padding:7px 10px; } .adm-fv span{ display:block; font-size:8.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--a-mute); } .adm-fv b{ display:block; font-size:11px; color:var(--a-navy); margin-top:2px; font-weight:500; } .adm-form{ display:grid; grid-template-columns:repeat(auto-fill,minmax(215px,1fr)); gap:11px; } .adm-fg.wide{ grid-column:1 / -1; } .adm-fg label{ display:block; font-size:9px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--a-mute); margin-bottom:4px; } .adm-fg label u{ text-decoration:none; color:var(--a-dim); font-weight:400; } .adm-fg input,.adm-fg select,.adm-ta{ width:100%; font-family:inherit; font-size:11.5px; color:var(--a-tx); border:1px solid var(--a-line); border-radius:7px; padding:7px 9px; background:#fff; } .adm-fg input:focus,.adm-fg select:focus{ outline:none; border-color:var(--a-navy2); box-shadow:0 0 0 2px rgba(27,45,107,.1); } .adm-fg input:disabled,.adm-fg select:disabled{ background:var(--a-soft); color:var(--a-mute); } .adm-ta{ font-family:var(--a-mono); font-size:10.5px; line-height:1.6; resize:vertical; } .adm-help{ font-size:9px; color:var(--a-mute); margin-top:3px; line-height:1.45; } .adm-checks{ display:flex; flex-wrap:wrap; gap:5px 13px; background:var(--a-soft); border-radius:7px; padding:9px 11px; } .adm-chk{ font-size:10.5px; color:var(--a-tx); display:flex; align-items:center; gap:5px; white-space:nowrap; } .adm-orggrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(252px,1fr)); gap:11px; } .adm-dept{ background:var(--a-soft); border:1px solid var(--a-line); border-left:3px solid var(--dc); border-radius:9px; overflow:hidden; } .adm-dept-h{ display:flex; justify-content:space-between; align-items:center; padding:8px 11px; font-size:10.5px; font-weight:700; color:var(--a-navy); background:#fff; border-bottom:1px solid var(--a-line2); } .adm-dept-h b{ font-family:var(--a-mono); color:var(--dc); } .adm-dept-b{ padding:5px 0; max-height:230px; overflow-y:auto; } .adm-dept-u{ display:flex; align-items:center; gap:8px; padding:5px 11px; cursor:pointer; } .adm-dept-u:hover{ background:#fff; } .adm-dept-u b{ display:block; font-size:10.5px; font-weight:600; color:var(--a-tx); } .adm-dept-u span{ display:block; font-size:9px; color:var(--a-mute); } .adm-dept-e{ padding:13px; font-size:9.5px; color:var(--a-mute); text-align:center; } .adm-tree{ overflow-x:auto; padding:8px 4px; } .adm-tree ul{ list-style:none; margin:0; padding-left:22px; } .adm-tree > ul{ padding-left:0; } .adm-tree li{ position:relative; padding:5px 0 5px 0; } .adm-tree ul ul li::before{ content:''; position:absolute; left:-12px; top:22px; width:12px; height:1px; background:var(--a-line); } .adm-tree ul ul{ border-left:1px solid var(--a-line); } .adm-node{ display:inline-flex; align-items:center; gap:9px; background:var(--a-card); border:1px solid var(--a-line); border-left:3px solid var(--dc); border-radius:8px; padding:7px 12px; cursor:pointer; } .adm-node:hover{ box-shadow:0 3px 10px rgba(13,27,62,.09); } .adm-node b{ display:block; font-size:11px; color:var(--a-navy); } .adm-node span{ display:block; font-size:9.5px; color:var(--a-dim); } .adm-node i{ display:block; font-style:normal; font-size:8.5px; color:var(--dc); font-weight:700; text-transform:uppercase; letter-spacing:.4px; } .adm-matwrap{ overflow-x:auto; } .adm-mat{ border-collapse:collapse; width:100%; min-width:820px; } .adm-mat th{ font-size:8px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; color:var(--a-mute); padding:7px 4px; background:var(--a-soft); border-bottom:1px solid var(--a-line); text-align:center; white-space:nowrap; } .adm-mat th.clk{ cursor:pointer; } .adm-mat th.clk:hover{ color:var(--a-navy); background:var(--a-line2); } .adm-mat td{ border-bottom:1px solid var(--a-line2); text-align:center; padding:0; } .adm-mat .adm-mh{ text-align:left; font-size:10.5px; padding:6px 10px; color:var(--a-tx); white-space:nowrap; background:#fff; } .adm-mat .adm-mh.clk{ cursor:pointer; } .adm-mat .adm-mh.clk:hover{ background:var(--a-soft); color:var(--a-navy); } .adm-mgrp td{ background:var(--a-navy); color:#fff; font-size:8.5px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; padding:5px 10px; text-align:left; } .adm-cell{ width:52px; height:26px; font-size:11px; color:var(--a-line); font-weight:800; } .adm-cell.clk{ cursor:pointer; } .adm-cell.on{ background:rgba(31,157,92,.11); color:var(--a-grn); } .adm-cell.clk:hover{ outline:2px solid var(--a-navy2); outline-offset:-2px; } @media (max-width:1400px){ .adm-form{ grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); } }