
/* GIVI GLOBAL UI V3 — replaces earlier V2 asset content */

:root{
  --givi-red:#e30613;
  --givi-red-2:#ff1f2d;
}

html[data-givi-theme="dark"]{
  color-scheme:dark;
  --givi-bg:#101215;
  --givi-surface:#191c20;
  --givi-surface-2:#202429;
  --givi-border:#343a42;
  --givi-text:#f3f4f6;
  --givi-muted:#adb5c0;
  --givi-field:#191c20;
}

html[data-givi-theme="light"]{
  color-scheme:light;
  --givi-bg:#f4f5f7;
  --givi-surface:#ffffff;
  --givi-surface-2:#f0f2f5;
  --givi-border:#dfe3e8;
  --givi-text:#20252d;
  --givi-muted:#5d6876;
  --givi-field:#ffffff;
}

html[data-givi-theme] body{
  background:var(--givi-bg)!important;
  color:var(--givi-text)!important;
}

/* ---------------- HEADER: do not move page navigation ---------------- */
.md-topbar,
header.givi-header,
.topbar,
.app-header{
  position:sticky!important;
  top:0!important;
  z-index:8500!important;
  background:var(--givi-surface)!important;
  color:var(--givi-text)!important;
  border-bottom:1px solid var(--givi-border)!important;
}

html[data-givi-theme="dark"] html[data-givi-theme="dark"] .md-topbar,
html[data-givi-theme="dark"] header.givi-header,
html[data-givi-theme="dark"] .topbar,
html[data-givi-theme="dark"] .app-header{
  box-shadow:inset 0 -2px 0 rgba(227,6,19,.78);
}

.givi-header-actions{
  margin-left:auto!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  flex:0 0 auto!important;
}

/* undo the earlier V2 layout helper if it exists */
.givi-header-tools{
  display:contents!important;
}

/* ---------------- EXCLUSIVE COMPACT CONTROLS ---------------- */
#givi-global-theme-toggle,
.givi-exclusive-logout{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  padding:0!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  position:static!important;
  inset:auto!important;
  border:1px solid var(--givi-border)!important;
  border-radius:9px!important;
  background:var(--givi-surface-2)!important;
  color:var(--givi-text)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  text-decoration:none!important;
  font-size:0!important;
}

#givi-global-theme-toggle:hover,
.givi-exclusive-logout:hover{
  border-color:var(--givi-red)!important;
  box-shadow:0 0 0 2px rgba(227,6,19,.08)!important;
}

#givi-global-theme-toggle svg,
.givi-exclusive-logout svg{
  width:15px!important;
  height:15px!important;
  display:block!important;
}

/* pages without a normal application header */
body.givi-auth-page #givi-global-theme-toggle{
  position:fixed!important;
  top:16px!important;
  right:16px!important;
  z-index:9000!important;
}

/* ---------------- DARK MODE: keep GIVI identity ---------------- */
html[data-givi-theme="dark"] [class*="card"],
html[data-givi-theme="dark"] [class*="panel"],
html[data-givi-theme="dark"] .md-panel,
html[data-givi-theme="dark"] .table-wrap,
html[data-givi-theme="dark"] .md-table-wrap,
html[data-givi-theme="dark"] table{
  background:var(--givi-surface)!important;
  color:var(--givi-text)!important;
  border-color:var(--givi-border)!important;
}

html[data-givi-theme="dark"] input,
html[data-givi-theme="dark"] select,
html[data-givi-theme="dark"] textarea{
  background:var(--givi-field)!important;
  color:var(--givi-text)!important;
  border-color:var(--givi-border)!important;
}

html[data-givi-theme="dark"] h1,
html[data-givi-theme="dark"] h2,
html[data-givi-theme="dark"] h3,
html[data-givi-theme="dark"] h4,
html[data-givi-theme="dark"] h5,
html[data-givi-theme="dark"] strong{
  color:var(--givi-text)!important;
}

html[data-givi-theme="dark"] p,
html[data-givi-theme="dark"] small,
html[data-givi-theme="dark"] .muted,
html[data-givi-theme="dark"] .subtitle{
  color:var(--givi-muted)!important;
}

html[data-givi-theme="dark"] a{
  text-decoration-color:rgba(227,6,19,.45);
}

html[data-givi-theme="dark"] .active,
html[data-givi-theme="dark"] [aria-current="page"]{
  border-color:var(--givi-red)!important;
}

/* ---------------- OFFICIAL G WATERMARK IN BOTH THEMES ---------------- */
body::after{
  background-image:url("/static/brand/LOGO_G_GIVI_WHITE.png")!important;
  background-repeat:no-repeat!important;
  background-position:right bottom!important;
  background-size:contain!important;
}

html[data-givi-theme="dark"] body::after{
  filter:none!important;
  opacity:.045!important;
}

html[data-givi-theme="light"] body::after{
  filter:invert(1) grayscale(1)!important;
  opacity:.055!important;
}

/* ---------------- SUBTLE INTERNAL SIGNATURE ---------------- */
#givi-author-signature{
  position:fixed;
  right:14px;
  bottom:10px;
  z-index:7800;
  pointer-events:none;
  user-select:none;
  display:flex;
  align-items:center;
  gap:6px;
  padding:4px 7px;
  border:1px solid color-mix(in srgb,var(--givi-border) 62%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--givi-surface) 72%,transparent);
  color:color-mix(in srgb,var(--givi-muted) 72%,transparent);
  opacity:.58;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  font:600 8px/1 "Segoe UI",Arial,sans-serif;
  letter-spacing:.10em;
  text-transform:uppercase;
  box-shadow:none;
}

#givi-author-signature::before{
  content:"";
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--givi-red);
  opacity:.72;
}

#givi-author-signature:hover{
  opacity:.82;
}

@media(max-width:768px){
  #givi-global-theme-toggle,
  .givi-exclusive-logout{
    width:29px!important;
    height:29px!important;
    min-width:29px!important;
    min-height:29px!important;
  }

  #givi-author-signature{
    right:9px;
    bottom:8px;
    font-size:7px;
    padding:4px 6px;
  }
}


/* GIVI_SHARED_HEADER_V1
   Single authority for application header layout/navigation.
   Replaces older sticky/header-action blocks. */

.md-topbar,
header.givi-header,
.topbar,
.app-header{
  position:sticky !important;
  top:0 !important;
  z-index:8500 !important;
  display:flex !important;
  align-items:center !important;
  height:72px !important;
  min-height:72px !important;
  padding:0 44px !important;
  gap:16px !important;
  border-bottom:1px solid var(--givi-border,#d6dfe5) !important;
  background:var(--givi-surface,#fff) !important;
  color:var(--givi-text,#17232c) !important;
}

html[data-givi-theme="dark"] html[data-givi-theme="dark"] .md-topbar,
html[data-givi-theme="dark"] header.givi-header,
html[data-givi-theme="dark"] .topbar,
html[data-givi-theme="dark"] .app-header{
  border-bottom:2px solid #e30613 !important;
}

/* Existing brand stays at left. */
.givi-shell-header-nav{
  margin-left:auto !important;
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  flex:0 0 auto !important;
}

.givi-shell-header-nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:30px !important;
  padding:0 10px !important;
  margin:0 !important;
  border:1px solid transparent !important;
  border-radius:8px !important;
  background:transparent !important;
  color:var(--givi-muted,#687985) !important;
  box-shadow:none !important;
  text-decoration:none !important;
  font:600 11px/1 "Segoe UI",Arial,sans-serif !important;
  white-space:nowrap !important;
}

.givi-shell-header-nav a:hover{
  color:#e30613 !important;
  background:rgba(227,6,19,.06) !important;
  border-color:rgba(227,6,19,.12) !important;
}

.givi-shell-header-nav a.is-current{
  color:#b80b15 !important;
  background:rgba(227,6,19,.075) !important;
  border-color:rgba(227,6,19,.14) !important;
}

html[data-givi-theme="dark"] .givi-shell-header-nav a{
  color:#aebdc7 !important;
}
html[data-givi-theme="dark"] .givi-shell-header-nav a:hover{
  color:#fff !important;
  background:rgba(227,6,19,.12) !important;
}
html[data-givi-theme="dark"] .givi-shell-header-nav a.is-current{
  color:#fff !important;
  background:rgba(227,6,19,.16) !important;
  border-color:rgba(227,6,19,.26) !important;
}

/* Right utility cluster: contextual nav, logout, theme. */
.givi-shell-header-actions{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  flex:0 0 auto !important;
}

#givi-global-theme-toggle,
.givi-shell-logout{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  padding:0 !important;
  margin:0 !important;
  position:static !important;
  inset:auto !important;
  display:grid !important;
  place-items:center !important;
  border:1px solid var(--givi-border,#d6dfe5) !important;
  border-radius:8px !important;
  background:transparent !important;
  color:var(--givi-text,#17232c) !important;
  text-decoration:none !important;
  box-shadow:none !important;
  cursor:pointer !important;
  font-size:0 !important;
}

#givi-global-theme-toggle:hover,
.givi-shell-logout:hover{
  border-color:rgba(227,6,19,.45) !important;
  background:rgba(227,6,19,.06) !important;
}

#givi-global-theme-toggle svg,
.givi-shell-logout svg{
  width:15px !important;
  height:15px !important;
  display:block !important;
}

/* Login has no normal application header. */
body.givi-auth-page #givi-global-theme-toggle{
  position:fixed !important;
  top:16px !important;
  right:16px !important;
  z-index:9000 !important;
}

@media (max-width:900px){
  .md-topbar,
  header.givi-header,
  .topbar,
  .app-header{
    padding-left:18px !important;
    padding-right:18px !important;
    gap:10px !important;
  }
  .givi-shell-header-nav{
    gap:3px !important;
  }
  .givi-shell-header-nav a{
    padding:0 7px !important;
    font-size:10px !important;
  }
}

@media (max-width:680px){
  .givi-shell-header-nav a span.givi-nav-long{
    display:none !important;
  }
}

/* === GIVI BACK OFFICE CANONICAL HEADER V70H.4S START === */
html.givi-back-office-family{
  --givi-back-header-h:72px;
  --givi-back-logo-size:52px;
  --givi-back-pad-x:44px;
}
.givi-back-office-header{
  position:sticky!important;top:0!important;z-index:90!important;
  height:var(--givi-back-header-h)!important;min-height:var(--givi-back-header-h)!important;
  display:grid!important;grid-template-columns:minmax(250px,1fr) auto auto!important;
  align-items:center!important;gap:18px!important;padding:0 var(--givi-back-pad-x)!important;
  box-sizing:border-box!important;background:var(--givi-app-surface,#fff)!important;
  color:var(--givi-app-text,#182733)!important;border-bottom:1px solid var(--givi-app-border,#dce3e8)!important;
}
.givi-back-office-brand{min-width:0!important;display:flex!important;align-items:center!important;gap:14px!important}
.givi-back-office-brand img{width:var(--givi-back-logo-size)!important;height:var(--givi-back-logo-size)!important;object-fit:contain!important;flex:0 0 var(--givi-back-logo-size)!important}
.givi-back-office-brand>div{display:grid!important;gap:3px!important;min-width:0!important}
.givi-back-office-brand strong{font-size:15px!important;font-weight:800!important;color:var(--givi-app-text,#182733)!important;white-space:nowrap!important}
.givi-back-office-brand small{font-size:10px!important;font-weight:600!important;color:var(--givi-app-muted,#7f8b95)!important;white-space:nowrap!important}

.givi-back-office-nav{height:44px!important;display:grid!important;grid-template-columns:repeat(4,minmax(112px,1fr))!important;overflow:hidden!important;border:1px solid var(--givi-app-border,#d8e0e5)!important;border-radius:12px!important;background:var(--givi-app-surface-2,#f8fafb)!important}
.givi-back-office-nav a{min-width:112px!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0 14px!important;border-right:1px solid var(--givi-app-border,#e1e7eb)!important;background:transparent!important;color:var(--givi-app-text,#2d3d48)!important;text-decoration:none!important;font-size:9px!important;font-weight:800!important;white-space:nowrap!important}
.givi-back-office-nav a:last-child{border-right:0!important}
.givi-back-office-nav a.is-active{background:var(--givi-app-red,#e30613)!important;color:#fff!important}

.givi-back-office-tools{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important}
.givi-back-office-account{position:relative!important}
.givi-back-office-gear{width:54px!important;height:46px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:3px!important;padding:0!important;border:1px solid var(--givi-app-border,#d8e0e5)!important;border-radius:11px!important;background:var(--givi-app-surface,#fff)!important;color:var(--givi-app-text,#273a47)!important;cursor:pointer!important}
.givi-back-office-gear>svg:first-child{width:19px!important;height:19px!important}
.givi-back-office-chevron{width:12px!important;height:12px!important;transition:transform .16s ease!important}
.givi-back-office-gear[aria-expanded="true"] .givi-back-office-chevron{transform:rotate(180deg)!important}

.givi-back-office-menu{position:absolute!important;top:calc(100% + 10px)!important;right:0!important;z-index:400!important;width:292px!important;display:none!important;overflow:hidden!important;border:1px solid var(--givi-app-border,#dce3e8)!important;border-radius:14px!important;background:var(--givi-app-surface,#fff)!important;box-shadow:0 18px 42px rgba(26,38,48,.16)!important}
.givi-back-office-menu.is-open{display:block!important}
.givi-back-office-identity{display:flex!important;align-items:center!important;gap:11px!important;padding:16px 16px 14px!important}
.givi-back-office-avatar{width:42px!important;height:42px!important;flex:0 0 42px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:#fff0f1!important;color:var(--givi-app-red,#e11a27)!important}
.givi-back-office-avatar svg{width:22px!important;height:22px!important}
.givi-back-office-identity-copy{min-width:0!important}
.givi-back-office-identity-copy strong,.givi-back-office-identity-copy small{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.givi-back-office-identity-copy strong{font-size:14px!important;font-weight:800!important;color:var(--givi-app-text,#182733)!important}
.givi-back-office-identity-copy small{margin-top:3px!important;font-size:10px!important;color:var(--givi-app-muted,#8a969f)!important}
.givi-back-office-menu-separator{height:1px!important;background:var(--givi-app-border,#e8edf0)!important}

.givi-back-office-menu-item,.givi-back-office-logout-button{width:100%!important;min-height:44px!important;display:flex!important;align-items:center!important;gap:11px!important;padding:0 15px!important;border:0!important;background:var(--givi-app-surface,#fff)!important;color:var(--givi-app-text,#34434d)!important;text-decoration:none!important;text-align:left!important;font:inherit!important;font-size:12px!important;font-weight:600!important;cursor:pointer!important;box-sizing:border-box!important}
.givi-back-office-menu-item:hover,.givi-back-office-logout-button:hover{background:var(--givi-app-surface-2,#f7f9fa)!important}
.givi-back-office-menu-icon{width:19px!important;height:19px!important;flex:0 0 19px!important;display:grid!important;place-items:center!important;color:var(--givi-app-muted,#6e7a83)!important}
.givi-back-office-menu-icon svg{width:18px!important;height:18px!important}

/* Same visual model as FRONT family toggle: 35x20 track + 14px thumb */
.givi-back-office-theme-label{flex:1!important}
.givi-back-office-switch{position:relative!important;width:35px!important;height:20px!important;margin-left:auto!important;flex:0 0 35px!important;border-radius:999px!important;background:#dfe4e8!important;transition:background .16s ease!important}
.givi-back-office-switch i{position:absolute!important;top:3px!important;left:3px!important;width:14px!important;height:14px!important;border-radius:50%!important;background:#fff!important;box-shadow:0 1px 3px rgba(0,0,0,.18)!important;transition:transform .16s ease!important}
.givi-back-office-theme-row.is-dark .givi-back-office-switch{background:var(--givi-app-red,#e11a27)!important}
.givi-back-office-theme-row.is-dark .givi-back-office-switch i{transform:translateX(15px)!important}

.givi-back-office-logout-form{margin:0!important;padding:10px!important}
.givi-back-office-logout-button{min-height:38px!important;justify-content:center!important;border:1px solid var(--givi-app-border,#dce3e8)!important;border-radius:9px!important}

@media(max-width:1150px){.givi-back-office-header{grid-template-columns:minmax(220px,1fr) auto!important}.givi-back-office-nav{display:none!important}}
@media(max-width:900px){html.givi-back-office-family{--givi-back-pad-x:18px}}
/* === GIVI BACK OFFICE CANONICAL HEADER V70H.4S END === */
