/* SELACV Entretien V3.6.9 — fond bleu nuit uniforme du thème sombre. */
@media screen {
  :root {
    --bg: #eaf6f5;
    --surface: #ffffff;
    --alt: #f4fbfa;
    --ink: #183b49;
    --muted: #52717b;
    --accent: #07576b;
    --accent2: #10adae;
    --soft: #e1f7f4;
    --line: #c6e2df;
    --green: #08745f;
    --green-bg: #e2f7ee;
    --blue: #0b7392;
    --blue-bg: #e2f5f9;
    --shadow: 0 12px 32px rgba(4,58,74,.10);
  }
  html {
    background: #0b3745;
  }
  body:not(.intro-active) {
    color: var(--ink);
    background: #0b3745!important;
  }
  .app-header {
    position: relative;
    border-bottom: 1px solid rgba(169,255,245,.26)!important;
    background: radial-gradient(circle at 6% -70%,rgba(78,230,216,.22),transparent 27%),
      radial-gradient(circle at 89% -60%,rgba(63,192,203,.2),transparent 31%),
      linear-gradient(110deg,#071e2e 0%,#093c4c 58%,#075b68 100%)!important;
    box-shadow: 0 15px 38px rgba(2,32,46,.24)!important;
  }
  .app-header .brand h1 {
    color: #f1fffc!important;
    letter-spacing: .025em;
  }
  .app-header .brand-subtitle {
    color: #8bf5e7!important;
    letter-spacing: .19em;
  }
  .app-header .brand-logo {
    box-shadow: 0 0 0 5px rgba(193,255,248,.16),0 12px 28px rgba(0,19,31,.43)!important;
  }
  .app-header .version {
    border: 1px solid rgba(178,255,242,.45);
    background: rgba(31,181,178,.24)!important;
    color: #d6fff7!important;
    box-shadow: 0 0 14px rgba(52,231,213,.16);
  }
  .app-header .connection {
    border: 1px solid rgba(164,255,243,.2);
    background: rgba(207,255,248,.12);
    color: #dbfff9;
    box-shadow: inset 0 1px rgba(255,255,255,.1);
  }
  .app-header .connection.ok {
    border-color: rgba(113,247,200,.32);
    background: rgba(49,184,141,.2);
    color: #adffe0;
  }
  .app-header .connection.error {
    border-color: rgba(255,170,173,.4);
    background: rgba(197,55,64,.2);
    color: #ffd9dc;
  }
  .app-header .fullscreen-header-btn {
    border-color: rgba(173,255,245,.5);
    background: rgba(174,255,243,.12);
    color: #e9fffb;
    box-shadow: none;
  }
  .app-header .fullscreen-header-btn:hover {
    border-color: #a8fff2;
    background: rgba(174,255,243,.23);
    color: #fff;
  }
  .app-header nav {
    gap: 5px;
    margin-top: 15px;
    padding-top: 3px;
  }
  .app-header nav button {
    gap: 6px;
    padding: 7px 8px;
    border-color: transparent;
    color: #c9e9e9!important;
    font-size: 12px;
    font-weight: 800;
  }
  .app-header nav button:hover {
    background: rgba(175,255,247,.13)!important;
    color: #fff!important;
  }
  .app-header nav button.active {
    border-color: rgba(171,255,246,.52)!important;
    background: linear-gradient(135deg,#098695,#0caeac)!important;
    color: #fff!important;
    box-shadow: 0 10px 27px rgba(0,19,31,.26),inset 0 1px rgba(255,255,255,.25)!important;
  }
  .app-header nav button.active:after {
    background: #c7fff4;
  }
  .app-header nav .icon {
    width: 27px;
    height: 27px;
    border-color: rgba(178,255,247,.32);
    background: rgba(207,255,249,.11);
    color: #bffff4;
  }
  .app-header nav button.active .icon {
    border-color: rgba(255,255,255,.33);
    background: rgba(255,255,255,.18);
    color: #fff;
  }
  .app-switcher .app-switch-icon {
    width: 31px;
    height: 31px;
    border: 1px solid rgba(255,255,255,.24);
    box-shadow: 0 4px 13px rgba(0,21,31,.33);
  }
  main {
    position: relative;
  }
  .view.active>.hero,.view.active .hero {
    border: 1px solid rgba(185,255,246,.5);
    background: radial-gradient(circle at 92% 12%,rgba(145,255,238,.26),transparent 23%),
      linear-gradient(118deg,#073446 0%,#096979 55%,#10a69f 100%)!important;
    box-shadow: 0 22px 48px rgba(4,47,63,.22),inset 0 1px rgba(255,255,255,.19)!important;
  }
  .hero h2 {
    color: #fff!important;
    letter-spacing: -.02em;
  }
  .hero p {
    color: #d9fff8!important;
  }
  .hero button:not(.action-main) {
    border-color: rgba(225,255,250,.45);
    background: rgba(255,255,255,.11);
    color: #fff;
  }
  .hero button:not(.action-main):hover {
    background: rgba(255,255,255,.2);
  }
  .top h2 {
    color: #103f51!important;
  }
  .top .subtitle {
    color: #547781;
  }
  .view:not(:has(.hero))>.top {
    padding: 4px 2px 12px;
  }
  .panel,.card,.kpi,.zoning-kpi,.analyse-kpi {
    border-color: #c3e2df!important;
    background: linear-gradient(155deg,#ffffff 0%,#f9fdfc 100%);
    box-shadow: 0 13px 33px rgba(4,66,77,.09),inset 0 1px rgba(255,255,255,.9)!important;
  }
  .dashboard-kpi {
    border-color: #c0e3df!important;
    border-top: 3px solid #2bc8bd!important;
    background: linear-gradient(145deg,#ffffff,#effaf8)!important;
    box-shadow: 0 12px 27px rgba(5,76,83,.11)!important;
  }
  .dashboard-kpi span,.zoning-kpi span,.analyse-kpi span {
    color: #4d737d!important;
  }
  .dashboard-kpi strong,.zoning-kpi strong,.analyse-kpi strong {
    color: #087d88;
  }
  .dashboard-kpi.todo strong {
    color: #9b6900;
  }
  .dashboard-kpi.routine strong {
    color: #654799;
  }
  .period-head,.zoning-campus-head {
    background: linear-gradient(110deg,#d7f4f0,#e8faf7)!important;
    border-bottom-color: #bbe1db!important;
  }
  .period-head h3,.card h3,.panel h3 {
    color: #075c70;
  }
  .count {
    background: #087e89;
    color: #fff;
  }
  .dash-ticket-pill.total {
    background: #dff7f3;
    border-color: #5bc9bf;
  }
  .dash-agent-card,.dashboard-item {
    background: #f3fbfa;
  }
  .dashboard-item {
    border-top-color: #c9e5e2;
  }
  .zoning-filters,.tickets-filters,.control-filters,.analyse-filters {
    border-color: #c3e2df;
  }
  main :is(input[type="text"],input[type="search"],input[type="number"],input[type="date"],input[type="email"],select,textarea),
  dialog :is(input[type="text"],input[type="search"],input[type="number"],input[type="date"],input[type="email"],select,textarea) {
    border-color: #b8dad8;
    background: #fff;
    color: #173b47;
  }
  main :is(input,select,textarea):focus-visible,dialog :is(input,select,textarea):focus-visible,
  main button:focus-visible,dialog button:focus-visible,.app-header nav button:focus-visible {
    outline: 3px solid #3ed3c2;
    outline-offset: 2px;
  }
  .action-main {
    border: 1px solid #66e8dc!important;
    background: linear-gradient(135deg,#0b93a0,#32cbbd)!important;
    color: #fff!important;
    box-shadow: 0 10px 24px rgba(9,148,154,.24)!important;
  }
  .action-main:hover {
    filter: brightness(1.08);
    box-shadow: 0 15px 28px rgba(9,148,154,.32)!important;
  }
  .ghost,.mini-btn {
    border-color: #a8d8d3;
    background: #fff;
    color: #086a76;
  }
  .ghost:hover,.mini-btn:hover {
    border-color: #37c5bb;
    background: #e8faf6;
  }
  .tickets-filters select,.tickets-filters input,.analyse-filters select,.zoning-filters select,.zoning-filters input,.control-filters select,.control-filters input {
    background: #fff;
    border-color: #b8dad8;
  }
  main table thead th {
    background: #104b5d;
    color: #f2fffc;
    border-color: rgba(255,255,255,.22);
  }
  .zoning-zone,.control-zone-card,.replacement-card,.dash-vacancy,.dash-agent-card {
    border-top-color: #d4eae8;
    border-right-color: #d4eae8;
    border-bottom-color: #d4eae8;
    box-shadow: 0 9px 20px rgba(6,66,76,.08);
  }
  .zoning-zone:hover,.control-zone-card:hover,.replacement-card:hover,.dash-vacancy:hover,.dash-agent-card:hover {
    box-shadow: 0 15px 30px rgba(6,66,76,.15);
  }
  .zoning-zone .zoning-agent {
    background: #e4f5ea;
    color: #167045;
  }
  .replacement-workflow>.panel:first-child {
    background: linear-gradient(150deg,#f8fdfc,#eaf8f5);
  }
  .replacement-tabs button.active {
    border-color: #10adae;
    background: linear-gradient(135deg,#08768a,#10a9a4);
    color: #fff;
  }
  .replacement-stage-heading,.replacement-mail-preview header {
    background: #e1f5f1;
    color: #075b6b;
  }
  .replacement-attachment {
    border-color: #42bfc0;
    background: linear-gradient(135deg,#effaf8,#fff);
  }
  .replacement-file-button {
    background: #087f8e;
    color: #fff;
  }
  dialog {
    border-color: #9fd4d1;
    background: #fafffe;
    box-shadow: 0 35px 100px rgba(2,33,45,.38);
  }
  dialog::backdrop {
    background: rgba(2,18,31,.72);
    backdrop-filter: blur(6px);
  }
  dialog .modal-head {
    border-bottom-color: #9bdad4;
    background: linear-gradient(115deg,#08364a,#087984);
  }
  dialog .modal-head h2 {
    color: #fff!important;
  }
  dialog .modal-head .close {
    color: #dcfff9;
  }
  dialog .modal-head .close:hover {
    color: #fff;
  }
  .version-entry.current-version {
    border-left: 4px solid #11b7ae;
    padding-left: 14px;
    background: linear-gradient(90deg,#e8f9f5,transparent);
  }
  .version-entry h3 {
    color: #075b6b;
  }
}

@media screen and (max-width:700px) {
  .app-header .header-top {
    gap: 10px;
  }
  .app-header nav {
    padding-bottom: 2px;
  }
  .app-header nav button {
    padding: 7px 10px;
  }
  .view.active>.hero,.view.active .hero {
    border-radius: 16px;
  }
  .dashboard-kpi {
    border-top-width: 2px!important;
  }
}

@media print {
  body {
    background: #fff!important;
  }
  .app-header {
    background: #fff!important;
    box-shadow: none!important;
  }
}
