/* HYDPOLL V1 - Liquid glass global skin
   Reference: pale frosted background with large translucent glass planes. */

:root {
  --hyd-lg-bg: #f8fafc;
  --hyd-lg-bg-2: #eef4fb;
  --hyd-lg-ink: #0b1b33;
  --hyd-lg-muted: #64748b;
  --hyd-lg-surface: rgba(255, 255, 255, 0.58);
  --hyd-lg-surface-strong: rgba(255, 255, 255, 0.78);
  --hyd-lg-border: rgba(255, 255, 255, 0.74);
  --hyd-lg-hairline: rgba(120, 145, 175, 0.13);
  --hyd-lg-shadow: 0 24px 70px rgba(67, 86, 112, 0.13);
  --hyd-lg-shadow-soft: 0 14px 36px rgba(67, 86, 112, 0.09);
}

html,
body {
  color-scheme: light;
  background: var(--hyd-lg-bg) !important;
}

body {
  position: relative;
  isolation: isolate;
  color: var(--hyd-lg-ink);
}

body::before,
body::after {
  content: "";
  position: fixed;
  pointer-events: none;
  z-index: 0;
}

body::before {
  inset: 0;
  background:
    radial-gradient(1100px 760px at 92% -10%, rgba(229, 237, 249, 0.95) 0%, rgba(248, 250, 252, 0.55) 48%, transparent 74%),
    radial-gradient(900px 620px at 15% 86%, rgba(224, 237, 248, 0.9) 0%, rgba(246, 249, 252, 0.42) 58%, transparent 80%),
    radial-gradient(780px 520px at 58% 47%, rgba(255, 255, 255, 0.95) 0%, rgba(239, 244, 250, 0.5) 64%, transparent 86%),
    linear-gradient(138deg, #f7f9fd 0%, #eef4f9 42%, #fbfbfd 74%, #f4f2f6 100%);
}

body::after {
  width: min(980px, 82vw);
  height: min(760px, 58vh);
  left: -70px;
  bottom: -220px;
  border-radius: 34px;
  transform: rotate(-39deg);
  background:
    linear-gradient(135deg, rgba(229, 242, 250, 0.66), rgba(255, 255, 255, 0.16) 64%),
    radial-gradient(circle at 32% 36%, rgba(255, 255, 255, 0.75), transparent 2px),
    radial-gradient(circle at 58% 48%, rgba(255, 255, 255, 0.62), transparent 1.6px),
    radial-gradient(circle at 42% 72%, rgba(255, 255, 255, 0.55), transparent 1.4px);
  border: 1px solid rgba(255, 255, 255, 0.92);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    inset 0 -38px 80px rgba(218, 230, 243, 0.34),
    0 -1px 2px rgba(255, 255, 255, 0.8),
    0 34px 90px rgba(76, 99, 128, 0.13);
}

body > *,
#app,
.app-shell,
.public-app,
.login-shell,
.app-splash,
.modal,
.toast,
.hydai-fab,
.hydrogenius,
.cmdk,
.drawer,
.edge-panel {
  position: relative;
  z-index: 1;
}

/* Global modal guard: keep app dialogs out of normal page flow. */
body > .modal#modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  overflow: auto !important;
}

body > .modal#modal.open,
body > .modal#modal[style*="display: flex"],
body > .modal#modal[style*="display:flex"] {
  display: flex !important;
}

body > .modal#modal .mbox {
  position: relative !important;
  margin: auto !important;
  max-height: calc(100vh - 48px) !important;
  overflow: auto !important;
}

@media (max-width: 640px) {
  body > .modal#modal {
    align-items: flex-end !important;
    padding: 12px 0 0 !important;
  }

  body > .modal#modal .mbox {
    margin: 0 !important;
    max-height: 92vh !important;
  }
}

#app,
.app-shell,
main,
.main,
.app-main,
.content-area,
.workspace,
.module-shell,
.page-shell,
.dashboard-shell,
body.public-mode #app {
  background: transparent !important;
}

.hdr,
header,
.app-hdr,
.topbar,
.tabs,
.tabbar,
.sidebar,
.app-sidebar,
nav.left-nav,
.left-nav {
  background: rgba(255, 255, 255, 0.46) !important;
  border-color: var(--hyd-lg-border) !important;
  box-shadow: var(--hyd-lg-shadow-soft) !important;
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
}

.sidebar,
.app-sidebar,
nav.left-nav,
.left-nav {
  background:
    radial-gradient(440px 340px at 88% -10%, rgba(226, 236, 248, 0.88) 0%, rgba(248, 250, 252, 0.46) 52%, transparent 76%),
    radial-gradient(360px 300px at 12% 92%, rgba(219, 234, 247, 0.82) 0%, rgba(246, 249, 252, 0.40) 58%, transparent 82%),
    linear-gradient(138deg, rgba(247, 249, 253, 0.94) 0%, rgba(238, 244, 249, 0.90) 44%, rgba(251, 251, 253, 0.96) 76%, rgba(245, 242, 246, 0.92) 100%) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.74), 8px 0 34px rgba(67, 86, 112, 0.12) !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none;
}

.sidebar::-webkit-scrollbar,
.app-sidebar::-webkit-scrollbar,
nav.left-nav::-webkit-scrollbar,
.left-nav::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.sidebar .tab.on,
.sidebar .tab.is-active,
.sidebar .tab.active,
.sidebar .tab.selected,
.sidebar [aria-current="page"],
.sidebar [aria-selected="true"],
.app-sidebar .tab.on,
.app-sidebar .tab.is-active,
.app-sidebar .tab.active,
.app-sidebar .tab.selected,
.app-sidebar [aria-current="page"],
.app-sidebar [aria-selected="true"],
nav.left-nav .tab.on,
nav.left-nav .tab.is-active,
nav.left-nav .tab.active,
nav.left-nav .tab.selected,
nav.left-nav [aria-current="page"],
nav.left-nav [aria-selected="true"],
.left-nav .tab.on,
.left-nav .tab.is-active,
.left-nav .tab.active,
.left-nav .tab.selected,
.left-nav [aria-current="page"],
.left-nav [aria-selected="true"] {
  background: linear-gradient(135deg, #1d70b7 0%, #0b5e9e 100%) !important;
  color: #fff !important;
  border-color: rgba(29, 112, 183, 0.96) !important;
  box-shadow: 0 10px 26px rgba(29, 112, 183, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.20) !important;
}

.hdr,
header.app-hdr,
.topbar {
  color: var(--hyd-lg-ink) !important;
}

.hdr-brand h1,
.hdr-brand p,
.today-badge,
.user-pill,
.icon-btn {
  color: var(--hyd-lg-ink) !important;
}

.today-badge,
.user-pill,
.icon-btn,
.tab,
.btn.bd,
.btn.ghost,
.search,
.searchbox,
.cmdk-input,
input,
select,
textarea {
  background: rgba(255, 255, 255, 0.62) !important;
  border-color: var(--hyd-lg-border) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 10px 24px rgba(67, 86, 112, 0.07) !important;
  backdrop-filter: blur(18px) saturate(1.16);
  -webkit-backdrop-filter: blur(18px) saturate(1.16);
}

.icon-btn:hover,
.btn.bd:hover,
.tab:hover {
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: 0 16px 38px rgba(67, 86, 112, 0.12) !important;
}

.card,
.panel,
.surface-card,
.module-card,
.kpi-card,
.dash-card,
.stat-card,
.dtlux-wrap,
.fact2-kpi,
.fact2-table-wrap,
.fact2-toolbar,
.fact2-tabs,
.f2p-switcher,
.f2p-mini-card,
.planning-hero,
.planning-member-card,
.kp-day,
.month-day,
.gantt-row,
.aff-kpi,
.help-card,
.dir-panel,
.ch-section,
.ch-fiche-row,
.modal .mbox,
.mbox,
.drawer-panel,
.edge-panel,
.cmdk-panel,
.portal-card,
.login-card {
  background: var(--hyd-lg-surface) !important;
  border: 1px solid var(--hyd-lg-border) !important;
  box-shadow: var(--hyd-lg-shadow) !important;
  backdrop-filter: blur(26px) saturate(1.18);
  -webkit-backdrop-filter: blur(26px) saturate(1.18);
}

.card:hover,
.panel:hover,
.surface-card:hover,
.module-card:hover,
.kpi-card:hover,
.dash-card:hover,
.stat-card:hover,
.fact2-kpi:hover,
.planning-member-card:hover,
.ch-fiche-row:hover {
  box-shadow: 0 28px 80px rgba(67, 86, 112, 0.16) !important;
}

.ch,
.card .ch,
.panel-header,
.card-header,
.modal-header,
.fact2-header,
.fact2-table thead th,
table thead,
thead {
  background: rgba(255, 255, 255, 0.36) !important;
  border-color: var(--hyd-lg-hairline) !important;
  color: var(--hyd-lg-ink) !important;
}

table,
.dtlux,
.fact2-table {
  background: rgba(255, 255, 255, 0.35) !important;
}

tbody tr,
.list-row,
.devis-list-row,
.fact2-table tbody tr,
.cmdk-item,
.activity-row {
  background: rgba(255, 255, 255, 0.34) !important;
  border-color: rgba(121, 143, 170, 0.10) !important;
}

tbody tr:hover,
.list-row:hover,
.devis-list-row:hover,
.fact2-table tbody tr:hover,
.cmdk-item:hover,
.activity-row:hover {
  background: rgba(255, 255, 255, 0.68) !important;
}

.bp,
.btn.bp,
button.bp,
.primary,
.btn-primary {
  background: linear-gradient(135deg, rgba(29, 112, 183, 0.92), rgba(63, 167, 224, 0.88)) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.48) !important;
  box-shadow: 0 18px 42px rgba(29, 112, 183, 0.22) !important;
}

.bp:hover,
.btn.bp:hover,
button.bp:hover,
.primary:hover,
.btn-primary:hover {
  box-shadow: 0 22px 52px rgba(29, 112, 183, 0.28) !important;
  transform: translateY(-1px);
}

.tab.on,
.tab.is-active,
.fact2-tab.is-active,
.nav-item.active,
.sidebar .active {
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--hyd-lg-ink) !important;
  border-color: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 16px 34px rgba(67, 86, 112, 0.12), inset 0 1px 0 rgba(255,255,255,.88) !important;
}

.muted,
.sub,
.subtitle,
.fact2-subtitle,
.fact2-kpi__sub,
.fact2-toolbar__count,
.hp-sub,
.gray,
.text-muted {
  color: var(--hyd-lg-muted) !important;
}

::-webkit-scrollbar-thumb {
  background: rgba(174, 190, 211, 0.7) !important;
  border: 2px solid rgba(255, 255, 255, 0.62);
}

@media (max-width: 900px) {
  body::after {
    width: 92vw;
    height: 46vh;
    left: -28vw;
    bottom: -120px;
    border-radius: 28px;
  }

  .card,
  .panel,
  .surface-card,
  .module-card,
  .kpi-card,
  .fact2-kpi,
  .fact2-table-wrap {
    backdrop-filter: blur(20px) saturate(1.14);
    -webkit-backdrop-filter: blur(20px) saturate(1.14);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* Login screen: first viewport must use the same pale frosted world. */
#login-screen {
  background: #f8fafc !important;
  color: var(--hyd-lg-ink) !important;
  overflow: hidden !important;
}

#login-screen::before,
#login-screen::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  pointer-events: none !important;
}

#login-screen::before {
  inset: 0 !important;
  z-index: 0 !important;
  background:
    radial-gradient(1050px 740px at 92% -14%, rgba(228, 236, 248, 0.98) 0%, rgba(248, 250, 252, 0.56) 50%, transparent 74%),
    radial-gradient(880px 620px at 11% 86%, rgba(224, 238, 248, 0.92) 0%, rgba(246, 249, 252, 0.44) 60%, transparent 82%),
    radial-gradient(720px 520px at 58% 45%, rgba(255, 255, 255, 0.96) 0%, rgba(239, 244, 250, 0.48) 66%, transparent 88%),
    linear-gradient(138deg, #f7f9fd 0%, #eef4f9 44%, #fbfbfd 76%, #f5f2f6 100%) !important;
  animation: none !important;
}

#login-screen::after {
  width: min(1040px, 86vw) !important;
  height: min(780px, 62vh) !important;
  left: -90px !important;
  bottom: -230px !important;
  z-index: 1 !important;
  border-radius: 36px !important;
  transform: rotate(-39deg) !important;
  background:
    linear-gradient(135deg, rgba(229, 242, 250, 0.7), rgba(255, 255, 255, 0.18) 66%),
    radial-gradient(circle at 22% 34%, rgba(255, 255, 255, 0.72), transparent 2px),
    radial-gradient(circle at 38% 58%, rgba(255, 255, 255, 0.6), transparent 1.5px),
    radial-gradient(circle at 56% 46%, rgba(255, 255, 255, 0.62), transparent 1.6px),
    radial-gradient(circle at 68% 72%, rgba(255, 255, 255, 0.5), transparent 1.3px) !important;
  border: 1px solid rgba(255, 255, 255, 0.94) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    inset 0 -40px 80px rgba(218, 230, 243, 0.34),
    0 34px 90px rgba(76, 99, 128, 0.13) !important;
}

#login-screen > .lc-bg-light,
#login-screen > .lc-bubbles,
#login-screen > .lc-waves,
#login-screen .lc-light {
  display: none !important;
}

#login-screen .lc-container {
  z-index: 2 !important;
}

#login-screen .lc-hero {
  color: var(--hyd-lg-ink) !important;
  background: transparent !important;
}

#login-screen .lc-brand-logo {
  background: rgba(255, 255, 255, 0.68) !important;
  border: 1px solid rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 24px 70px rgba(67, 86, 112, 0.13) !important;
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

#login-screen .lc-hero-pill,
#login-screen .lc-hero-foot span {
  color: var(--hyd-lg-ink) !important;
  background: rgba(255, 255, 255, 0.54) !important;
  border: 1px solid rgba(255, 255, 255, 0.82) !important;
  box-shadow: 0 12px 30px rgba(67, 86, 112, 0.08) !important;
}

#login-screen .lc-hero-title,
#login-screen .lc-hero-title em {
  color: var(--hyd-lg-ink) !important;
  text-shadow: none !important;
}

#login-screen .lc-hero-title {
  max-width: min(1120px, 72vw) !important;
  letter-spacing: -0.01em !important;
}

#login-screen .lc-hero-title em {
  display: inline-block !important;
  color: #1d70b7 !important;
  -webkit-text-fill-color: #1d70b7 !important;
  background: none !important;
  background-clip: initial !important;
  -webkit-background-clip: initial !important;
  padding-inline: 0.04em !important;
  margin-inline: 0.02em !important;
}

#login-screen .lc-hero-baseline,
#login-screen .lc-form-sub,
#login-screen .lc-divider,
#login-screen .lc-form-eyebrow {
  color: var(--hyd-lg-muted) !important;
}

#login-screen .lc-form-side {
  background: transparent !important;
}

#login-screen .lc-form-card {
  background: rgba(255, 255, 255, 0.62) !important;
  border: 1px solid rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 28px 86px rgba(67, 86, 112, 0.16) !important;
  backdrop-filter: blur(28px) saturate(1.2);
  -webkit-backdrop-filter: blur(28px) saturate(1.2);
}

#login-screen .lc-ms-btn,
#login-screen .lc-field-input {
  background: rgba(255, 255, 255, 0.7) !important;
  border-color: rgba(255, 255, 255, 0.92) !important;
  color: var(--hyd-lg-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 12px 28px rgba(67, 86, 112, 0.08) !important;
}

#login-screen .lc-login-btn {
  background: linear-gradient(135deg, rgba(29,112,183,.92), rgba(63,167,224,.88)) !important;
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 18px 46px rgba(29, 112, 183, 0.24) !important;
}

body.login-mode #app,
body.login-mode #tabs-bar,
body.login-mode #t2-footer,
body.login-mode #hydai-bubble,
body.login-mode #hydai-panel,
body.login-mode .qafab2-btn,
body.login-mode .qafab2-pop,
body.login-mode .qafab2-bd,
body.login-mode #pwa-install-fab,
body.login-mode #nav-back-chip,
body.login-mode .nav-back-chip,
body.login-mode .help-toggle-btn,
body.login-mode .header-nav-pack,
body.login-mode .user-pill,
body.login-mode .icon-btn[title='Déconnexion'],
body.login-mode #online-avatars-wrap,
body.login-mode #mob-bottom-nav,
body.login-mode #mobile-bottom-nav,
body.login-mode .mf-bottom-nav {
  display: none !important;
}

body:has(#login-screen:not([style*="display: none"])) #app,
body:has(#login-screen:not([style*="display: none"])) #tabs-bar,
body:has(#login-screen:not([style*="display: none"])) #t2-footer,
body:has(#login-screen:not([style*="display: none"])) #hydai-bubble,
body:has(#login-screen:not([style*="display: none"])) #hydai-panel,
body:has(#login-screen:not([style*="display: none"])) .qafab2-btn,
body:has(#login-screen:not([style*="display: none"])) .qafab2-pop,
body:has(#login-screen:not([style*="display: none"])) .qafab2-bd,
body:has(#login-screen:not([style*="display: none"])) #pwa-install-fab,
body:has(#login-screen:not([style*="display: none"])) #nav-back-chip,
body:has(#login-screen:not([style*="display: none"])) .nav-back-chip,
body:has(#login-screen:not([style*="display: none"])) .help-toggle-btn,
body:has(#login-screen:not([style*="display: none"])) .header-nav-pack,
body:has(#login-screen:not([style*="display: none"])) .user-pill,
body:has(#login-screen:not([style*="display: none"])) .icon-btn[title='Déconnexion'],
body:has(#login-screen:not([style*="display: none"])) #online-avatars-wrap,
body:has(#login-screen:not([style*="display: none"])) #mob-bottom-nav,
body:has(#login-screen:not([style*="display: none"])) #mobile-bottom-nav,
body:has(#login-screen:not([style*="display: none"])) .mf-bottom-nav {
  display: none !important;
}

@media (max-width: 900px) {
  #login-screen::after {
    width: 96vw !important;
    height: 48vh !important;
    left: -32vw !important;
    bottom: -120px !important;
  }
}

/* ERP KPI shutdown: keep workflows, lists, filters and forms; remove metric strips. */
.kpi-grid,
.kpi-row,
.kpi-mini-row,
.stat-card-row,
.dlux-kpis,
.terrain-luxe-kpis,
.mod-hero-kpis,
.planning-hero-kpis,
.dir-kpi-ribbon,
.portal-lux-kpis,
.bulletin-kpi-grid,
.aff-dashboard-kpis,
.devis-editor-summary-kpis,
.me2-kpis,
.sal2-kpis,
.aud-kpis,
.temps2-recap-tiles,
.dv2-kpis,
.biz2-kpis,
.fact2-kpis,
.devis2-kpis,
.cli2-kpis,
.dir2-kpis,
.home-kpis,
.dashboard-kpis,
.commercial-kpis,
.finance-kpis,
.hc-kpis {
  display: none !important;
}

.kpi-card,
.kpi,
.kpi-mini,
.stat-card,
.metric-card,
.metric,
.dlux-kpi,
.terrain-luxe-kpi,
.mod-hero-kpi,
.planning-hero-kpi,
.dir-kpi,
.portal-lux-kpi,
.bulletin-kpi,
.aff-kpi,
.devis-editor-summary-kpi,
.me2-kpi,
.sal2-kpi,
.aud-kpi,
.temps2-kpi,
.dv2-kpi,
.biz2-kpi,
.fact2-kpi,
.devis2-kpi,
.cli2-kpi,
.dir2-kpi,
.home-metric,
.crm-kpi,
.commercial-kpi,
.finance-kpi,
.itv-command-metric,
.planning-team-metric,
.kp-kanban-metric,
.hc-kpi,
[class*="-kpi"],
[class*="__kpi"],
[class*="kpi-"] {
  display: none !important;
}