/* ═══════════════════════════════════════════════════════
   Platforma Digitaliada v2 — Shell
   Loaded on every v2 page (sidebar, topbar, layout)
   ═══════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ── */
/* All colors in OKLCH: L (lightness 0-1), C (chroma 0-0.4), H (hue 0-360)
   Same hue family → just change L and C to get shades.               */
:root {

  /* ═══ SEMANTIC PALETTE ═══════════════════════════════════════════
     primary     = brand orange   (H ≈ 57)
     secondary   = sky blue       (H ≈ 237)
     accent      = purple         (H ≈ 300)
     success     = green          (H ≈ 162)
     warning     = yellow         (H ≈ 95)
     error       = red            (H ≈ 27)
     info        = alias of secondary
     neutral     = achromatic dark
     base-*      = achromatic surfaces
     ═══════════════════════════════════════════════════════════════ */

  /* ── Primary (orange H≈57) ── */
  --v2-primary:         oklch(0.686 0.181 57);  /* #FF7900 */
  --v2-primary-dark:    oklch(0.650 0.175 56);  /* #F16E00 */
  --v2-primary-light:   oklch(0.960 0.030 75);  /* #FFF0E0 */
  --v2-primary-mid:     oklch(0.890 0.070 68);  /* #FFD5A8 */
  --v2-primary-content: oklch(1 0 0);           /* #FFF */

  /* ── Secondary (sky H≈237) ── */
  --v2-secondary:         oklch(0.735 0.105 237);         /* #4BB4E6 */
  --v2-secondary-dark:    oklch(0.600 0.120 237);         /* #1E88C9 */
  --v2-secondary-light:   oklch(0.970 0.015 230);         /* #E8F6FD */
  --v2-secondary-alpha:   oklch(0.600 0.120 237 / 0.13);  /* sky @ 13% */
  --v2-secondary-content: oklch(1 0 0);

  /* ── Accent (purple H≈300) ── */
  --v2-accent:         oklch(0.660 0.120 300);  /* #A885D8 */
  --v2-accent-light:   oklch(0.955 0.025 300);  /* #F3EEFF */
  --v2-accent-content: oklch(1 0 0);

  /* ── Success (green H≈162) ── */
  --v2-success:         oklch(0.730 0.120 162);  /* #50BE87 */
  --v2-success-light:   oklch(0.970 0.020 162);  /* #E8F7F0 */
  --v2-success-dark:    oklch(0.390 0.080 162);  /* #1a5c3a */
  --v2-success-content: oklch(1 0 0);

  /* ── Warning (yellow H≈95) ── */
  --v2-warning:         oklch(0.880 0.180 95);   /* #FFD200 */
  --v2-warning-light:   oklch(0.980 0.030 100);  /* #FFFBE6 */
  --v2-warning-content: oklch(0.440 0.100 65);   /* #854D0E */

  /* ── Error (red H≈27) ── */
  --v2-error:         oklch(0.550 0.220 27);   /* #DC2626 */
  --v2-error-light:   oklch(0.970 0.010 20);   /* #FEF2F2 */
  --v2-error-content: oklch(1 0 0);

  /* ── Info (alias of secondary) ── */
  --v2-info:         var(--v2-secondary);
  --v2-info-content: var(--v2-secondary-content);

  /* ── Neutral / Base (achromatic, C=0) ── */
  --v2-neutral:         oklch(0.470 0 0);  /* #595959 */
  --v2-neutral-content: oklch(1 0 0);
  --v2-base-50:         oklch(0.985 0 0);  /* #FAFAFA */
  --v2-base-100:        oklch(1 0 0);      /* #FFF    */
  --v2-base-200:        oklch(0.975 0 0);  /* #F6F6F6 */
  --v2-base-300:        oklch(0.950 0 0);  /* #EEEEEE */
  --v2-base-400:        oklch(0.900 0 0);  /* #DDDDDD */
  --v2-base-bg:         oklch(0.965 0 0);  /* #F2F2F2 */
  --v2-base-content:    oklch(0.180 0 0);  /* #1a1a1a */

  /* ── Gradients ── */
  --v2-grad-sky:     linear-gradient(135deg, var(--v2-secondary), var(--v2-secondary-dark));
  --v2-grad-green:   linear-gradient(135deg, var(--v2-success-light), var(--v2-success));
  --v2-grad-purple:  linear-gradient(135deg, var(--v2-accent-light), var(--v2-accent));
  --v2-grad-warm:    linear-gradient(135deg, var(--v2-primary-light), var(--v2-primary-mid));
  --v2-grad-red:     linear-gradient(135deg, var(--v2-error-light), oklch(0.700 0.150 25));
  --v2-grad-sky-bar: linear-gradient(90deg, var(--v2-secondary), var(--v2-secondary-dark));

  /* Spacing */
  --v2-sp-1:  0.0625rem;
  --v2-sp-2:  0.125rem;
  --v2-sp-4:  0.25rem;
  --v2-sp-6:  0.375rem;
  --v2-sp-8:  0.5rem;
  --v2-sp-10: 0.625rem;
  --v2-sp-12: 0.75rem;
  --v2-sp-14: 0.875rem;
  --v2-sp-16: 1rem;
  --v2-sp-18: 1.125rem;
  --v2-sp-20: 1.25rem;
  --v2-sp-24: 1.5rem;
  --v2-sp-28: 1.75rem;
  --v2-sp-32: 2rem;
  --v2-sp-48: 3rem;

  /* Radii */
  --v2-radius:      1rem;
  --v2-radius-sm:   0.625rem;
  --v2-radius-xs:   0.375rem;
  --v2-radius-pill:  6.25rem;

  /* Shadows */
  --v2-shadow:       0 0.125rem 1rem rgba(0, 0, 0, 0.07);
  --v2-shadow-md:    0 0.25rem  1.5rem rgba(0, 0, 0, 0.10);
  --v2-shadow-hover: 0 0.5rem  2rem rgba(0, 0, 0, 0.13);

  /* Layout */
  --v2-sidebar-w:     4.25rem;
  --v2-sidebar-w-exp: 15rem;
  --v2-topbar-h:      4rem;

  /* Motion */
  --v2-ease:     cubic-bezier(.4, 0, .2, 1);
  --v2-dur:      0.28s;
  --v2-dur-fast: 0.15s;

  /* Fluid type */
  --v2-text-xs:   clamp(0.5rem,    0.45rem + 0.25vw, 0.5625rem);
  --v2-text-sm:   clamp(0.5625rem, 0.5rem  + 0.3vw,  0.625rem);
  --v2-text-base: clamp(0.625rem,  0.55rem + 0.35vw, 0.6875rem);
  --v2-text-md:   clamp(0.6875rem, 0.6rem  + 0.4vw,  0.75rem);
  --v2-text-lg:   clamp(0.75rem,   0.65rem + 0.45vw, 0.8125rem);
  --v2-text-xl:   clamp(0.875rem,  0.75rem + 0.55vw, 1.0625rem);
  --v2-text-2xl:  clamp(1.125rem,  0.9rem  + 0.8vw,  1.25rem);
  --v2-text-3xl:  clamp(1.25rem,   1rem    + 1vw,    1.375rem);
  --v2-text-4xl:  clamp(1.375rem,  1rem    + 1.3vw,  1.75rem);
  --v2-text-stat: clamp(1.5rem,    1.1rem  + 1.5vw,  1.75rem);

  --v2-font: 'DM Sans', sans-serif;

}


/* ── RESET — scoped to v2 shell, not global (BS3 content untouched) ── */
.sidebar, .sidebar *, .sidebar *::before, .sidebar *::after,
.topbar, .topbar *, .topbar *::before, .topbar *::after,
.overlay { margin: 0; padding: 0; box-sizing: border-box; }

/* v2-only pages set html 16px via inline style in the layout.
   Legacy pages keep html 10px from style.css.
   Shell components (sidebar, topbar) use px to work in both contexts. */

html { font-size: 16px; }

body {
  font-family: var(--v2-font);
  background: var(--v2-base-bg);
  color: var(--v2-base-content);
  min-height: 100vh;
  overflow-x: hidden;
  font-size: var(--v2-text-lg);
  line-height: 1.5;
}


/* ══════════════════════════════════════════════════════
   SIDEBAR
   ══════════════════════════════════════════════════════ */
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--v2-sidebar-w);
  background: oklch(0 0 0);
  display: flex;
  flex-direction: column;
  z-index: 200;
  transition: width var(--v2-dur) var(--v2-ease);
  overflow: hidden;
}

/* Expanded via click */
.sidebar--open { width: var(--v2-sidebar-w-exp); }
.sidebar--open .sidebar__brand-text,
.sidebar--open .sidebar__section-label,
.sidebar--open .nav-item__label,
.sidebar--open .sidebar__user-info { opacity: 1; }
.sidebar--open .sidebar__section-label { height: auto; overflow: visible; }

/* Toggle button */
.sidebar__toggle {
  background: transparent;
  border: none;
  width: var(--v2-sidebar-w);
  height: var(--v2-sp-48);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: oklch(0.60 0 0);
  font-size: var(--v2-text-xl);
  transition: all var(--v2-dur-fast);
  flex-shrink: 0;
  border-bottom: var(--v2-sp-1) solid oklch(1 0 0 / 0.07);
}
.sidebar__toggle:hover { background: oklch(1 0 0 / 0.06); color: var(--v2-base-100); }

/* Brand */
.sidebar__brand {
  display: flex;
  align-items: center;
  padding: var(--v2-sp-14);
  border-bottom: var(--v2-sp-1) solid oklch(1 0 0 / 0.07);
  min-height: 3.75rem;
  flex-shrink: 0;
  gap: var(--v2-sp-10);
  overflow: hidden;
}
.sidebar__brand-mark {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  background: var(--v2-primary);
  border-radius: var(--v2-radius-xs);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: var(--v2-text-xl);
  color: var(--v2-base-100);
}
.sidebar__brand-text {
  font-size: var(--v2-text-lg);
  font-weight: 700;
  color: var(--v2-base-100);
  white-space: nowrap;
  opacity: 0;
  transition: opacity var(--v2-dur-fast);
}

/* Nav sections */
.sidebar__section-label {
  font-size: var(--v2-text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: oklch(0.35 0 0);
  padding: var(--v2-sp-12) var(--v2-sp-20) var(--v2-sp-4);
  white-space: nowrap;
  opacity: 0;
  transition: opacity var(--v2-dur-fast);
  height: 0;
  overflow: hidden;
}

/* Nav list */
.sidebar__nav {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: var(--v2-sp-6) 0;
  overflow-y: auto;
  overflow-x: hidden;
  gap: var(--v2-sp-1);
  scrollbar-width: none;
}
.sidebar__nav::-webkit-scrollbar { width: 0; }

/* Nav item */
a.nav-item, a.nav-item:hover, a.nav-item:focus { text-decoration: none; color: inherit; }

.nav-item {
  display: flex;
  align-items: center;
  padding: var(--v2-sp-10) var(--v2-sp-18);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  gap: var(--v2-sp-12);
  transition: background var(--v2-dur-fast);
  flex-shrink: 0;
  text-decoration: none;
}
.nav-item:hover { background: oklch(0.686 0.181 57 / 0.1); }
.nav-item--active { background: oklch(0.686 0.181 57 / 0.15); }
.nav-item--active::before {
  content: '';
  position: absolute;
  left: 0;
  inset-block: 0;
  width: 0.1875rem;
  background: var(--v2-primary);
  border-radius: 0 var(--v2-sp-2) var(--v2-sp-2) 0;
}

/* Icon */
.nav-item__icon {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nav-item__icon svg { width: 1.125rem; height: 1.125rem; }
.nav-item__icon svg * { stroke: oklch(0.50 0 0); transition: stroke var(--v2-dur-fast); }
.nav-item--active .nav-item__icon svg *,
.nav-item:hover .nav-item__icon svg * { stroke: var(--v2-primary); }

/* Label */
.nav-item__label {
  font-size: var(--v2-text-lg);
  font-weight: 500;
  color: oklch(0.60 0 0);
  opacity: 0;
  transition: opacity var(--v2-dur-fast);
  white-space: nowrap;
}
.nav-item--active .nav-item__label { color: var(--v2-primary); }
.nav-item:hover .nav-item__label { color: var(--v2-base-100); }

/* Tooltip on collapsed sidebar */
.nav-item__tooltip {
  display: none;
  position: absolute;
  left: calc(var(--v2-sidebar-w) + 0.5rem);
  top: 50%;
  transform: translateY(-50%);
  background: oklch(0 0 0);
  color: var(--v2-base-100);
  font-size: var(--v2-text-sm);
  font-weight: 600;
  padding: var(--v2-sp-4) var(--v2-sp-10);
  border-radius: var(--v2-radius-xs);
  white-space: nowrap;
  pointer-events: none;
  z-index: 201;
  box-shadow: var(--v2-shadow-md);
}
.sidebar:not(.sidebar--open) .nav-item:hover .nav-item__tooltip { display: block; }

/* User chip */
a.sidebar__user, a.sidebar__user:hover, a.sidebar__user:focus { text-decoration: none; color: inherit; }
.sidebar__user {
  padding: var(--v2-sp-12) var(--v2-sp-14);
  border-top: var(--v2-sp-1) solid oklch(1 0 0 / 0.07);
  display: flex;
  align-items: center;
  gap: var(--v2-sp-10);
  overflow: hidden;
  flex-shrink: 0;
}
.sidebar__user-avatar {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--v2-radius-sm);
  flex-shrink: 0;
  overflow: hidden;
  background: linear-gradient(135deg, var(--v2-secondary-light), var(--v2-secondary));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--v2-text-xl);
}
.sidebar__user-info { opacity: 0; transition: opacity var(--v2-dur-fast); white-space: nowrap; }
.sidebar__user-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sidebar__user-name { font-size: var(--v2-text-md); font-weight: 700; color: var(--v2-base-100); }
.sidebar__user-meta { font-size: var(--v2-text-sm); color: oklch(0.50 0 0); }

/* Language selector */
.sidebar__lang {
  display: flex;
  gap: var(--v2-sp-6);
  padding: var(--v2-sp-10) var(--v2-sp-14);
  border-top: var(--v2-sp-1) solid oklch(1 0 0 / 0.07);
  flex-shrink: 0;
}
.sidebar__lang-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--v2-sp-4) var(--v2-sp-10);
  border-radius: var(--v2-radius-xs);
  font-size: var(--v2-text-sm);
  font-weight: 500;
  color: oklch(1 0 0 / 0.5);
  text-decoration: none;
  transition: background var(--v2-dur-fast), color var(--v2-dur-fast);
}
.sidebar__lang-btn:hover,
.sidebar__lang-btn:focus {
  color: var(--v2-base-100);
  background: oklch(1 0 0 / 0.08);
  text-decoration: none;
}
.sidebar__lang-btn--active,
.sidebar__lang-btn--active:hover,
.sidebar__lang-btn--active:focus {
  color: var(--v2-base-100);
  background: oklch(1 0 0 / 0.15);
  font-weight: 700;
}


.sidebar__help {
  display: none;
  flex-direction: column;
  padding: var(--v2-sp-10) var(--v2-sp-14);
  border-top: var(--v2-sp-1) solid oklch(1 0 0 / 0.07);
  gap: var(--v2-sp-4);
  flex-shrink: 0;
}
.sidebar__help-link {
  display: flex;
  align-items: center;
  gap: var(--v2-sp-8);
  padding: var(--v2-sp-8) var(--v2-sp-10);
  border-radius: var(--v2-radius-xs);
  color: oklch(1 0 0 / 0.7);
  font-size: var(--v2-text-sm);
  font-weight: 500;
  text-decoration: none;
  transition: background var(--v2-dur-fast), color var(--v2-dur-fast);
}
.sidebar__help-link:hover { background: oklch(1 0 0 / 0.08); color: var(--v2-base-100); text-decoration: none; }
.sidebar__help-link svg { width: 16px; height: 16px; }

/* ══════════════════════════════════════════════════════
   TOPBAR
   ══════════════════════════════════════════════════════ */
.topbar {
  position: fixed;
  top: 0;
  left: var(--v2-sidebar-w);
  right: 0;
  height: var(--v2-topbar-h);
  background: var(--v2-base-100);
  border-bottom: var(--v2-sp-1) solid var(--v2-base-300);
  display: flex;
  align-items: center;
  padding: 0 var(--v2-sp-28);
  z-index: 100;
  transition: left var(--v2-dur) var(--v2-ease);
  gap: var(--v2-sp-16);
}
.topbar--shifted { left: var(--v2-sidebar-w-exp); }

.topbar__logo--primary   { height: 2.125rem; object-fit: contain; }
.topbar__logo--secondary { height: 1.75rem;  object-fit: contain; }
.topbar__divider { width: var(--v2-sp-1); height: 1.625rem; background: var(--v2-base-300); }
.topbar__spacer  { flex: 1; }

.topbar__timer {
  display: flex;
  align-items: center;
  gap: var(--v2-sp-6);
  font-size: var(--v2-text-md);
  color: var(--v2-neutral);
}
.topbar__timer-dot {
  width: 0.4375rem;
  height: 0.4375rem;
  border-radius: 50%;
  background: var(--v2-success);
  animation: v2-pulse 2s ease-in-out infinite;
}
@keyframes v2-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }

.topbar__action {
  width: 2.375rem;
  height: 2.375rem;
  border-radius: 50%;
  border: var(--v2-sp-1) solid var(--v2-base-300);
  background: var(--v2-base-50);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: all var(--v2-dur-fast);
  text-decoration: none;
}
.topbar__action:hover { background: var(--v2-base-300); }

.topbar__btn {
  display: inline-flex;
  align-items: center;
  padding: 0.375rem 0.875rem;
  border-radius: var(--v2-radius-pill);
  background: var(--v2-primary);
  color: var(--v2-primary-content);
  font-size: var(--v2-text-sm);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: background var(--v2-dur-fast);
}
.topbar__btn:hover { background: var(--v2-primary-dark); color: var(--v2-primary-content); text-decoration: none; }

.badge--notification {
  position: absolute;
  top: -0.1875rem;
  right: -0.1875rem;
  min-width: 1.0625rem;
  height: 1.0625rem;
  border-radius: 50%;
  background: var(--v2-primary);
  border: 0.125rem solid var(--v2-base-100);
  font-size: var(--v2-text-xs);
  font-weight: 700;
  color: var(--v2-base-100);
  display: flex;
  align-items: center;
  justify-content: center;
}

.topbar__avatar-wrap {
  position: relative;
  flex-shrink: 0;
}
.topbar__avatar {
  width: 2.375rem;
  height: 2.375rem;
  border-radius: 50%;
  overflow: hidden;
  background: linear-gradient(135deg, var(--v2-secondary-light), var(--v2-secondary));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--v2-text-md);
  font-weight: 700;
  color: var(--v2-base-100);
  cursor: pointer;
  flex-shrink: 0;
  border: none;
  padding: 0;
  transition: box-shadow var(--v2-dur-fast);
}
.topbar__avatar:hover,
.avatar-open .topbar__avatar { box-shadow: 0 0 0 3px var(--v2-secondary-alpha); }
.topbar__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Avatar dropdown menu */
.topbar__avatar-menu {
  display: none;
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  min-width: 13rem;
  background: var(--v2-base-100);
  border-radius: var(--v2-radius-md);
  box-shadow: 0 4px 24px oklch(0 0 0 / 0.13);
  border: 1px solid var(--v2-base-300);
  z-index: 1100;
  overflow: hidden;
}
.avatar-open .topbar__avatar-menu { display: block; }
.topbar__avatar-header {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--v2-base-300);
}
.topbar__avatar-name {
  font-size: var(--v2-text-md);
  font-weight: 700;
  color: var(--v2-base-content);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.topbar__avatar-role {
  font-size: var(--v2-text-sm);
  color: var(--v2-neutral);
  margin-top: 0.125rem;
}
.topbar__avatar-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem;
  font-size: var(--v2-text-md);
  color: var(--v2-neutral);
  text-decoration: none;
  transition: background var(--v2-dur-fast), color var(--v2-dur-fast);
}
.topbar__avatar-item:hover { background: var(--v2-base-200); color: var(--v2-base-content); }
.topbar__avatar-item--danger { color: var(--v2-error); }
.topbar__avatar-item--danger:hover { background: var(--v2-error-light); color: var(--v2-error); }
.topbar__avatar-divider { height: 1px; background: var(--v2-base-300); margin: 0.25rem 0; }

.topbar__hamburger {
  display: none;
  background: none;
  border: none;
  font-size: var(--v2-text-2xl);
  cursor: pointer;
  padding: var(--v2-sp-4);
  color: var(--v2-neutral);
}


/* ══════════════════════════════════════════════════════
   OVERLAY
   ══════════════════════════════════════════════════════ */
.overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: oklch(0 0 0 / 0.4);
  z-index: 199;
}
.overlay--visible { display: block; }


/* ══════════════════════════════════════════════════════
   LAYOUT
   ══════════════════════════════════════════════════════ */
.layout {
  margin-left: var(--v2-sidebar-w);
  padding-top: var(--v2-topbar-h);
  min-height: 100vh;
  transition: margin-left var(--v2-dur) var(--v2-ease);
}
.layout--shifted { margin-left: var(--v2-sidebar-w-exp); }

.layout__content {
  padding: var(--v2-sp-24) var(--v2-sp-28) var(--v2-sp-48);
  display: flex;
  flex-direction: column;
  gap: var(--v2-sp-20);
}


/* ══════════════════════════════════════════════════════
   RESPONSIVE — shell only
   ══════════════════════════════════════════════════════ */

/* Desktop: sidebar open by default */
@media (min-width: 48.0625rem) {
  .sidebar { width: var(--v2-sidebar-w-exp); }
  .sidebar .sidebar__brand-text,
  .sidebar .sidebar__section-label,
  .sidebar .nav-item__label,
  .sidebar .sidebar__user-info { opacity: 1; }
  .sidebar .sidebar__section-label { height: auto; overflow: visible; }
  .topbar { left: var(--v2-sidebar-w-exp); }
  .layout { margin-left: var(--v2-sidebar-w-exp); }

  /* User explicitly collapsed it */
  html.v2-sb-collapsed .sidebar { width: var(--v2-sidebar-w); }
  html.v2-sb-collapsed .sidebar .sidebar__brand-text,
  html.v2-sb-collapsed .sidebar .sidebar__section-label,
  html.v2-sb-collapsed .sidebar .nav-item__label,
  html.v2-sb-collapsed .sidebar .sidebar__user-info { opacity: 0; }
  html.v2-sb-collapsed .sidebar .sidebar__section-label { height: 0; overflow: hidden; }
  html.v2-sb-collapsed .topbar { left: var(--v2-sidebar-w); }
  html.v2-sb-collapsed .layout { margin-left: var(--v2-sidebar-w); }
}

@media (max-width: 64rem) {
  .topbar__timer { display: none; }
  .topbar__btn { display: none; }
  .sidebar__help { display: flex; }
}

@media (max-width: 48rem) {
  :root {
    --v2-sidebar-w: 0rem;
    --v2-sidebar-w-exp: 16.25rem;
  }

  .sidebar { width: 0; box-shadow: none; }
  .sidebar--open { width: 16.25rem; box-shadow: 0.5rem 0 2rem oklch(0 0 0 / 0.25); }

  .topbar { left: 0 !important; padding: 0 var(--v2-sp-12); gap: var(--v2-sp-8); }
  .layout { margin-left: 0 !important; }

  .topbar__hamburger { display: flex; width: 2.5rem; height: 2.5rem; align-items: center; justify-content: center; border-radius: var(--v2-sp-8); }
  .topbar__hamburger:hover { background: var(--v2-base-200); }
  .topbar__divider { display: none; }
  .topbar__timer { display: none; }
  .topbar__logo--primary { height: 1.625rem; }
  .topbar__logo--secondary { height: 1.375rem; }

  .layout__content { padding: var(--v2-sp-14) var(--v2-sp-14) 2.5rem; gap: var(--v2-sp-14); }

  .nav-item { padding: var(--v2-sp-12) var(--v2-sp-18); }
  .topbar__action { width: 2.5rem; height: 2.5rem; }
  .nav-item__tooltip { display: none !important; }
}

@media (max-width: 25rem) {
  .layout__content { padding: var(--v2-sp-12) var(--v2-sp-10) 2.5rem; }
}

/* Impersonation banner */
.impersonate-banner {
  background: var(--v2-primary, #ff6b00);
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: var(--v2-radius-md, 0.5rem);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.875rem;
}
.impersonate-banner__back {
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
}
.impersonate-banner__back:hover {
  opacity: 0.85;
}