/* lb-components-extra.css — components NOT in the original lb.css */

/* ==========================================================================
   Modal — generic shell with overlay, header, body, footer
   ========================================================================== */
.lb-modal { position: fixed; inset: 0; z-index: 1000; display: none; }
.lb-modal.is-open { display: block; }
.lb-modal__overlay {
  position: absolute; inset: 0;
  background: rgba(15,23,42,0.45);
  backdrop-filter: blur(2px);
}
.lb-modal__shell {
  position: relative; margin: 5vh auto;
  background: var(--lb-surface);
  border-radius: var(--lb-radius-lg);
  box-shadow: var(--lb-shadow-3);
  display: flex; flex-direction: column;
  max-height: 90vh;
}
.lb-modal__shell--sm { max-width: 420px; }
.lb-modal__shell--md { max-width: 640px; }
.lb-modal__shell--lg { max-width: 960px; }
.lb-modal__head {
  padding: 16px 20px;
  border-bottom: 1px solid var(--lb-divider);
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
}
.lb-modal__title { font-size: 16px; font-weight: 600; color: var(--lb-text); }
.lb-modal__body { padding: 20px; overflow-y: auto; }
.lb-modal__foot {
  padding: 12px 20px;
  border-top: 1px solid var(--lb-divider);
  display: flex; justify-content: flex-end; gap: 8px;
}

/* ==========================================================================
   Bulk action bar — appears above tables when selection > 0
   ========================================================================== */
.lb-bulk-bar {
  display: none;
  align-items: center; justify-content: space-between;
  padding: 10px 14px;
  background: var(--lb-accent-50);
  border: 1px solid var(--lb-accent-100);
  border-radius: var(--lb-radius-md);
  margin-bottom: 12px;
}
.lb-bulk-bar.is-visible { display: flex; }
.lb-bulk-bar__count { font-weight: 600; color: var(--lb-text); }

/* ==========================================================================
   Upload zone — dropzone for Excel/CSV with preview
   ========================================================================== */
.lb-upload-zone {
  border: 2px dashed var(--lb-border-strong);
  border-radius: var(--lb-radius-md);
  padding: 32px;
  text-align: center;
  background: var(--lb-surface-2);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.lb-upload-zone:hover, .lb-upload-zone.is-dragover {
  background: var(--lb-accent-50);
  border-color: var(--lb-accent);
}
.lb-upload-zone__icon { color: var(--lb-text-muted); margin-bottom: 12px; }
.lb-upload-zone__hint { color: var(--lb-text-muted); font-size: 13px; }

.lb-upload-preview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 16px 0; }
.lb-upload-preview .lb-kpi { padding: 12px; }

/* ==========================================================================
   Tip selector — 4-card grid for cheltuiala type selection
   ========================================================================== */
.lb-tip-selector { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.lb-tip-selector__card {
  background: var(--lb-surface);
  border: 1px solid var(--lb-border);
  border-radius: var(--lb-radius-md);
  padding: 20px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.lb-tip-selector__card:hover {
  border-color: var(--lb-accent);
  box-shadow: var(--lb-shadow-2);
  transform: translateY(-2px);
}
.lb-tip-selector__icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  margin-bottom: 12px;
}
.lb-tip-selector__icon--accent { background: var(--lb-accent-50); color: var(--lb-accent); }
.lb-tip-selector__icon--info { background: var(--lb-info-50); color: var(--lb-info); }
.lb-tip-selector__icon--warn { background: var(--lb-warn-50); color: var(--lb-warn); }
.lb-tip-selector__icon--success { background: var(--lb-success-50); color: var(--lb-success); }
.lb-tip-selector__title { font-weight: 600; color: var(--lb-text); margin-bottom: 4px; }
.lb-tip-selector__desc { font-size: 12px; color: var(--lb-text-muted); }

/* ==========================================================================
   Banner-diff — effective ≠ requested (transport pricing)
   ========================================================================== */
.lb-banner-diff {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 16px;
  background: var(--lb-warn-50);
  border: 1px solid var(--lb-warn-100);
  border-left: 3px solid var(--lb-warn);
  border-radius: var(--lb-radius-md);
  margin-bottom: 16px;
}
.lb-banner-diff__icon { color: var(--lb-warn); flex: 0 0 auto; margin-top: 2px; }
.lb-banner-diff__body { flex: 1; }
.lb-banner-diff__title { font-weight: 600; color: var(--lb-text); margin-bottom: 4px; }
.lb-banner-diff__pair { font-size: 13px; color: var(--lb-text-2); }
.lb-banner-diff__pair strong { color: var(--lb-text); font-variant-numeric: tabular-nums; }

/* ==========================================================================
   Picker — autocomplete for nomenclator
   ========================================================================== */
.lb-picker { position: relative; }
.lb-picker__list {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 50;
  background: var(--lb-surface);
  border: 1px solid var(--lb-border);
  border-radius: var(--lb-radius-md);
  box-shadow: var(--lb-shadow-3);
  max-height: 280px; overflow-y: auto;
  display: none;
}
.lb-picker.is-open .lb-picker__list { display: block; }
.lb-picker__item {
  padding: 10px 12px;
  cursor: pointer;
  border-bottom: 1px solid var(--lb-divider);
  display: flex; align-items: center; gap: 8px;
}
.lb-picker__item:hover, .lb-picker__item.is-active {
  background: var(--lb-accent-50);
}
.lb-picker__item:last-child { border-bottom: none; }
.lb-picker__sku {
  font-size: 11px; color: var(--lb-text-muted);
  font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Transport quote summary
   ========================================================================== */
.lb-transport-quote {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--lb-border);
  border: 1px solid var(--lb-border);
  border-radius: var(--lb-radius-md);
  overflow: hidden;
}
.lb-transport-quote__cell { padding: 12px; background: var(--lb-surface); }
.lb-transport-quote__label { font-size: 11px; color: var(--lb-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.lb-transport-quote__value { font-size: 16px; font-weight: 600; color: var(--lb-text); font-variant-numeric: tabular-nums; }

/* ==========================================================================
   BNR refresh in input suffix
   ========================================================================== */
.lb-input-suffix--bnr {
  cursor: pointer;
  color: var(--lb-info);
  background: var(--lb-info-50);
  padding: 4px 8px;
  border-radius: var(--lb-radius-sm);
  font-size: 11px;
  font-weight: 600;
  border: none;
}
.lb-input-suffix--bnr:hover { background: var(--lb-info-100); }

/* ==========================================================================
   Numeric pager (1 2 3 ... »)
   ========================================================================== */
.lb-pager--numeric { display: flex; align-items: center; gap: 4px; }
.lb-pager--numeric button {
  min-width: 32px; height: 32px;
  padding: 0 8px;
  border: 1px solid var(--lb-border);
  background: var(--lb-surface);
  color: var(--lb-text-2);
  border-radius: var(--lb-radius-sm);
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}
.lb-pager--numeric button.is-active {
  background: var(--lb-accent);
  color: #fff;
  border-color: var(--lb-accent);
}
.lb-pager--numeric button:disabled { opacity: 0.4; cursor: not-allowed; }
.lb-pager--numeric .lb-pager__ellipsis { padding: 0 4px; color: var(--lb-text-muted); }

/* ==========================================================================
   Toast notifications
   ========================================================================== */
.lb-toast-stack {
  position: fixed; bottom: 24px; right: 24px; z-index: 2000;
  display: flex; flex-direction: column; gap: 8px;
  pointer-events: none;
}
.lb-toast {
  background: var(--lb-text);
  color: #fff;
  padding: 12px 16px;
  border-radius: var(--lb-radius-md);
  box-shadow: var(--lb-shadow-3);
  font-size: 13px;
  pointer-events: auto;
  min-width: 240px;
  animation: lb-toast-in 0.2s ease-out;
}
.lb-toast--success { background: var(--lb-success); }
.lb-toast--danger { background: var(--lb-danger); }
.lb-toast--warn { background: var(--lb-warn); color: #fff; }
@keyframes lb-toast-in {
  from { transform: translateY(8px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* ==========================================================================
   Result panel (calculator + import detail)
   ========================================================================== */
.lb-result {
  background: linear-gradient(180deg, var(--lb-success-50) 0%, var(--lb-surface) 80%);
  border: 1px solid var(--lb-success-100);
  border-radius: var(--lb-radius-lg);
  padding: 24px;
  position: sticky; top: 80px;
}
.lb-result__title { font-size: 13px; color: var(--lb-text-muted); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 8px; }
.lb-result__metric { font-size: 28px; font-weight: 700; color: var(--lb-success); font-variant-numeric: tabular-nums; }
.lb-result__metric--neutral { color: var(--lb-text); }
.lb-result__metric--negative { color: var(--lb-danger); }
.lb-result__row {
  display: flex; justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--lb-divider);
  font-size: 13px;
}
.lb-result__row:last-child { border-bottom: none; }
.lb-result__row strong { color: var(--lb-text); font-variant-numeric: tabular-nums; }

/* Helper for input + suffix layout */
.lb-input-with-suffix { display: flex; align-items: center; gap: 4px; }
.lb-input-with-suffix .lb-input { flex: 1; }
/* ============================================================
   Auth pages — login / signup / forgot
   Stand-alone layer on top of lb.css (uses lb tokens & components).
============================================================ */

/* Hard reset */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

.lb-auth {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 16px 64px;
  background: var(--lb-bg);
  position: relative;
  overflow: hidden;
}

.lb-auth__card {
  position: relative;
  z-index: 1;
  width: min(100%, 440px);
  box-sizing: border-box;
  background: var(--lb-surface);
  border: 1px solid var(--lb-border);
  border-radius: 16px;
  box-shadow: 0 10px 32px rgba(15,23,42,0.08), 0 2px 8px rgba(15,23,42,0.04);
  padding: 36px;
}
.lb-auth__card--wide { width: min(100%, 520px); }

/* === Variant backgrounds === */
.lb-auth[data-variant="bold"]::before,
.lb-auth[data-variant="mesh"]::before,
.lb-auth[data-variant="grid"]::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
}
.lb-auth[data-variant="bold"]::before {
  background:
    radial-gradient(900px 520px at 12% 0%, rgba(109,74,254,0.18), transparent 60%),
    radial-gradient(800px 600px at 100% 100%, rgba(8,145,178,0.16), transparent 60%);
}
.lb-auth[data-variant="mesh"]::before {
  background:
    radial-gradient(circle at 22% 28%, rgba(109,74,254,0.20), transparent 30%),
    radial-gradient(circle at 78% 22%, rgba(8,145,178,0.16), transparent 32%),
    radial-gradient(circle at 52% 88%, rgba(245,158,11,0.10), transparent 35%);
  filter: blur(2px);
}
.lb-auth[data-variant="grid"]::before {
  background-image:
    linear-gradient(to right, rgba(109,74,254,0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(109,74,254,0.06) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 0%, transparent 80%);
}

/* Decorative corner mark */
.lb-auth__corner {
  position: absolute; top: 24px; left: 24px;
  display: flex; align-items: center; gap: 10px;
  font-size: 13px; color: var(--lb-text-2); font-weight: 600;
  z-index: 2;
}
.lb-auth__corner-dot {
  width: 28px; height: 28px; border-radius: 7px;
  background: linear-gradient(135deg, var(--lb-accent) 0%, #8b6dff 100%);
  color: white; display: grid; place-items: center;
  font-size: 12px; font-weight: 700; letter-spacing: 0.04em;
  box-shadow: 0 4px 14px rgba(109,74,254,0.35);
}
.lb-auth__corner-suffix {
  font-size: 10px; padding: 2px 6px; border-radius: 4px;
  background: var(--lb-accent-50); color: var(--lb-accent);
  font-weight: 700; letter-spacing: 0.06em;
}

.lb-auth__legal {
  position: absolute; bottom: 18px; left: 0; right: 0;
  text-align: center; font-size: 11.5px; color: var(--lb-text-faint);
  z-index: 2;
}
.lb-auth__legal a { color: var(--lb-text-muted); text-decoration: none; }
.lb-auth__legal a:hover { color: var(--lb-accent); }

/* === Card (defined above near .lb-auth) === */

.lb-auth__head {
  text-align: center;
  margin-bottom: 26px;
}
.lb-auth__logo {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: 18px;
}
.lb-auth__logo-mark {
  width: 38px; height: 38px;
  background: linear-gradient(135deg, var(--lb-accent) 0%, #8b6dff 100%);
  color: white; border-radius: 9px;
  display: grid; place-items: center;
  font-size: 14px; font-weight: 700; letter-spacing: 0.04em;
  box-shadow: 0 6px 18px rgba(109,74,254,0.35);
}
.lb-auth__logo-text {
  font-size: 14px; font-weight: 700; color: var(--lb-text);
  letter-spacing: 0.02em;
}
.lb-auth__logo-text span { opacity: 0.5; font-weight: 600; }

.lb-auth__title {
  font-size: 22px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--lb-text); margin: 0 0 6px 0;
}
.lb-auth__subtitle {
  font-size: 13px; color: var(--lb-text-muted);
  margin: 0;
}

/* === Form === */
.lb-auth__form { display: flex; flex-direction: column; gap: 14px; width: 100%; }

.lb-auth__check {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 12.5px; color: var(--lb-text-2);
  cursor: pointer; user-select: none;
  line-height: 1.5; width: 100%;
}
.lb-auth__check input {
  margin-top: 2px; flex-shrink: 0;
  width: 16px; height: 16px; accent-color: var(--lb-accent);
}
.lb-auth__check span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb-auth__check a { color: var(--lb-accent); text-decoration: none; font-weight: 600; }
.lb-auth__check a:hover { text-decoration: underline; }
.lb-auth__field { display: flex; flex-direction: column; gap: 6px; }
.lb-auth__label {
  font-size: 12px; font-weight: 600;
  color: var(--lb-text-2); letter-spacing: 0.01em;
  display: flex; align-items: center; justify-content: space-between;
}
.lb-auth__label-link {
  font-size: 11.5px; font-weight: 600;
  color: var(--lb-accent); text-decoration: none;
}
.lb-auth__label-link:hover { text-decoration: underline; }
.lb-auth__hint {
  font-size: 11px; color: var(--lb-text-faint); margin-top: 2px;
}
.lb-auth__error {
  font-size: 12px; color: var(--lb-danger);
  display: flex; align-items: center; gap: 4px;
  margin-top: 2px;
}

/* Input wrapper for icon + show/hide */
.lb-auth__input-wrap {
  position: relative;
}
.lb-auth__input-wrap > .lb-auth__input-icon {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--lb-text-faint); pointer-events: none;
}
.lb-auth__input-wrap > .lb-auth__input-icon i {
  width: 15px; height: 15px;
}
.lb-auth__input-wrap > .lb-input { padding-left: 38px; }
/* Select din wrap-ul auth: padding-left mic (icon-ul ocupă spațiu) + chevron
   custom în dreapta, browser-ul nu mai afișează săgeata default.
   text-overflow: ellipsis ca județe lungi (Caraș-Severin, Bistrița-Năsăud) să nu spargă layout-ul. */
.lb-auth__input-wrap > .lb-select {
  padding-left: 36px;
  padding-right: 30px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lb-auth__input-wrap > .lb-select:focus {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236d4afe' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
}
/* Când există un toggle (show/hide parolă), rezervă spațiu la dreapta în input
   ca textul să nu treacă pe sub buton. */
.lb-auth__input-wrap:has(> .lb-auth__toggle) > .lb-input { padding-right: 40px; }
.lb-auth__input-wrap > .lb-auth__toggle {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px;
  display: grid; place-items: center;
  background: transparent; border: 0; padding: 0;
  color: var(--lb-text-faint); cursor: pointer; border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}
.lb-auth__input-wrap > .lb-auth__toggle:hover,
.lb-auth__input-wrap > .lb-auth__toggle:focus-visible {
  color: var(--lb-text-2); background: rgba(15,23,42,0.06);
  outline: none;
}
.lb-auth__input-wrap > .lb-auth__toggle i { width: 15px; height: 15px; }

.lb-input--error { border-color: var(--lb-danger) !important; }
.lb-input--success { border-color: var(--lb-success) !important; }

/* Password strength */
.lb-auth__strength {
  display: flex; gap: 4px; margin-top: 2px;
}
.lb-auth__strength-bar {
  flex: 1; height: 4px; border-radius: 2px;
  background: var(--lb-divider); transition: background 0.2s;
}
.lb-auth__strength-bar--weak    { background: var(--lb-danger); }
.lb-auth__strength-bar--medium  { background: var(--lb-warn); }
.lb-auth__strength-bar--strong  { background: var(--lb-success); }
.lb-auth__strength-label {
  font-size: 11px; color: var(--lb-text-faint); margin-top: 2px;
}

/* Checkbox — defined above near .lb-auth__form */

/* Submit + alt link */
.lb-auth__submit {
  width: 100%;
  justify-content: center;
  padding: 11px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  margin-top: 4px;
}
.lb-auth__alt {
  text-align: center;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--lb-divider);
  font-size: 13px; color: var(--lb-text-muted);
}
.lb-auth__alt a {
  color: var(--lb-accent); font-weight: 600;
  text-decoration: none;
}
.lb-auth__alt a:hover { text-decoration: underline; }

/* === Stepper === */
.lb-auth__stepper {
  display: flex; align-items: center; justify-content: center;
  gap: 6px; margin-bottom: 24px;
}
.lb-auth__step-dot {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 600;
  color: var(--lb-text-faint);
}
.lb-auth__step-num {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--lb-divider); color: var(--lb-text-faint);
  display: grid; place-items: center;
  font-size: 11px; font-weight: 700;
  transition: all 0.2s;
}
.lb-auth__step-dot--active .lb-auth__step-num {
  background: var(--lb-accent); color: white;
  box-shadow: 0 0 0 4px var(--lb-accent-50);
}
.lb-auth__step-dot--active { color: var(--lb-accent); }
.lb-auth__step-dot--done .lb-auth__step-num {
  background: var(--lb-success); color: white;
}
.lb-auth__step-dot--done { color: var(--lb-success); }
.lb-auth__step-line {
  width: 28px; height: 2px;
  background: var(--lb-divider); border-radius: 1px;
}
.lb-auth__step-line--done { background: var(--lb-success); }

/* === Two-col field === */
.lb-auth__row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}

/* === Tax-regime cards (signup step 3) === */
.lb-auth__regime-list {
  display: flex; flex-direction: column; gap: 10px;
}
.lb-auth__regime {
  display: flex; align-items: flex-start; gap: 12px;
  border: 1px solid var(--lb-border);
  border-radius: 12px;
  padding: 14px 14px;
  cursor: pointer;
  transition: all 0.15s;
  background: var(--lb-surface);
}
.lb-auth__regime:hover { border-color: var(--lb-border-strong); background: var(--lb-surface-2); }
.lb-auth__regime input { margin-top: 3px; accent-color: var(--lb-accent); }
.lb-auth__regime input:checked + .lb-auth__regime-body { color: inherit; }
.lb-auth__regime:has(input:checked) {
  border-color: var(--lb-accent);
  background: var(--lb-accent-50);
  box-shadow: 0 0 0 3px rgba(109,74,254,0.10);
}
.lb-auth__regime-body { flex: 1; }
.lb-auth__regime-title {
  font-size: 13.5px; font-weight: 600; color: var(--lb-text);
  margin: 0 0 2px 0;
  display: flex; align-items: center; gap: 8px;
}
.lb-auth__regime-tag {
  font-size: 10px; padding: 2px 6px; border-radius: 4px;
  background: var(--lb-info-50); color: var(--lb-info);
  font-weight: 700; letter-spacing: 0.04em;
}
.lb-auth__regime-msg {
  font-size: 12px; color: var(--lb-text-muted);
  margin: 0; line-height: 1.5;
}

/* === Success / sent state === */
.lb-auth__icon-circle {
  width: 64px; height: 64px; border-radius: 50%;
  display: grid; place-items: center;
  margin: 0 auto 16px;
}
.lb-auth__icon-circle--success {
  background: var(--lb-success-50); color: var(--lb-success);
}
.lb-auth__icon-circle--info {
  background: var(--lb-info-50); color: var(--lb-info);
}
.lb-auth__icon-circle i { width: 28px; height: 28px; }

/* === Variant: card on bold background gets a subtle gradient border === */
.lb-auth[data-variant="bold"] .lb-auth__card,
.lb-auth[data-variant="mesh"] .lb-auth__card {
  box-shadow:
    0 20px 48px rgba(15,23,42,0.10),
    0 4px 12px rgba(15,23,42,0.06),
    0 0 0 1px rgba(255,255,255,0.6) inset;
}
.lb-auth[data-variant="bold"] .lb-auth__card {
  backdrop-filter: blur(18px);
  background: rgba(255,255,255,0.94);
}
.lb-auth[data-variant="mesh"] .lb-auth__card {
  backdrop-filter: blur(20px);
  background: rgba(255,255,255,0.92);
}

/* === Trust strip below card === */
.lb-auth__trust {
  margin-top: 16px;
  display: flex; justify-content: center; gap: 18px;
  flex-wrap: wrap;
  font-size: 11.5px; color: var(--lb-text-muted);
}
.lb-auth__trust-item {
  display: inline-flex; align-items: center; gap: 5px;
}
.lb-auth__trust-item i { width: 12px; height: 12px; color: var(--lb-success); }

/* === Responsive === */
@media (max-width: 520px) {
  .lb-auth__card { padding: 24px 20px 22px; }
  .lb-auth__title { font-size: 19px; }
  .lb-auth__row { grid-template-columns: 1fr; }
  .lb-auth__corner { top: 16px; left: 16px; }
}

/* ============================================================
   Sidebar — vertical left nav (înlocuiește lb-topbar)
   Lățime fixă 240px desktop; drawer slide-in pe ≤1024px.
   Body primește padding-left: 240px când sidebar e mount-at
   prin atributul data-has-sidebar="true" (set de LBNav.render).
============================================================ */

body[data-has-sidebar="true"] {
  padding-left: 240px;
}

.lb-sidebar {
  position: fixed;
  top: 0; left: 0; bottom: 0;
  width: 240px;
  background: var(--lb-surface);
  border-right: 1px solid var(--lb-border);
  display: flex;
  flex-direction: column;
  z-index: 50;
}

.lb-sidebar__head {
  height: 64px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  border-bottom: 1px solid var(--lb-divider);
  flex-shrink: 0;
}

.lb-sidebar__head .lb-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 15px;
  color: var(--lb-text);
  text-decoration: none;
  letter-spacing: -0.01em;
}

.lb-sidebar__head .lb-brand-mark {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--lb-accent) 0%, var(--lb-info) 100%);
  color: #fff;
  display: grid; place-items: center;
  font-weight: 700; font-size: 13px;
  letter-spacing: -0.01em;
}

.lb-sidebar__body {
  flex: 1;
  min-height: 0; /* OBLIGATORIU: fără el flex-item-ul nu scade sub conținut → overflow-y nu
                    pornește, iar meniul lung împinge .lb-sidebar__foot (cont/admin) sub ecran. */
  overflow-y: auto;
  padding: 16px 12px;
  /* IRIS: ascunde scrollbar-ul vizibil, păstrând funcția de scroll cu mouse-wheel /
     gesture. Conform designului IRIS care n-are bară vizuală pe sidebar. */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.lb-sidebar__body::-webkit-scrollbar { display: none; width: 0; height: 0; }
.lb-sidebar { scrollbar-width: none; -ms-overflow-style: none; }
.lb-sidebar::-webkit-scrollbar { display: none; width: 0; height: 0; }

.lb-sidebar__group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.lb-sidebar__group + .lb-sidebar__group {
  margin-top: 20px;
}

.lb-sidebar__group-label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lb-text-muted);
  padding: 6px 12px 8px;
}

.lb-sidebar__group-label .lb-dot {
  width: 6px; height: 6px; border-radius: 50%;
  display: inline-block;
}

.lb-sidebar__group--fin .lb-dot { background: var(--lb-accent); }
.lb-sidebar__group--imp .lb-dot { background: var(--lb-info); }
.lb-sidebar__group--pret .lb-dot { background: var(--lb-success); }
.lb-sidebar__group--dec .lb-dot { background: var(--lb-warn); }
.lb-sidebar__group--emag .lb-dot { background: #0b5cb5; } /* albastru eMAG */

.lb-sidebar__link {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 12px;
  border-radius: var(--lb-radius-md);
  font-size: 14px;
  font-weight: 500;
  color: var(--lb-text-2);
  text-decoration: none;
  position: relative;
  transition: background 0.15s, color 0.15s;
}

.lb-sidebar__link i {
  width: 18px; height: 18px;
  flex-shrink: 0;
  color: var(--lb-text-faint);
  transition: color 0.15s;
}

.lb-sidebar__link:hover {
  background: var(--lb-bg);
  color: var(--lb-text);
}

.lb-sidebar__link:hover i { color: var(--lb-text-2); }

.lb-sidebar__link.is-active { font-weight: 600; }

.lb-sidebar__link.is-active::before {
  content: '';
  position: absolute;
  left: -12px;
  top: 8px; bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
}

.lb-sidebar__link.is-active--fin {
  background: var(--lb-accent-50);
  color: var(--lb-accent);
}
.lb-sidebar__link.is-active--fin::before { background: var(--lb-accent); }
.lb-sidebar__link.is-active--fin i { color: var(--lb-accent); }

.lb-sidebar__link.is-active--imp {
  background: var(--lb-info-50);
  color: var(--lb-info);
}
.lb-sidebar__link.is-active--imp::before { background: var(--lb-info); }
.lb-sidebar__link.is-active--imp i { color: var(--lb-info); }

.lb-sidebar__link.is-active--pret {
  background: var(--lb-success-50);
  color: var(--lb-success);
}
.lb-sidebar__link.is-active--pret::before { background: var(--lb-success); }
.lb-sidebar__link.is-active--pret i { color: var(--lb-success); }

.lb-sidebar__link.is-active--dec {
  background: var(--lb-warn-50);
  color: var(--lb-warn);
}
.lb-sidebar__link.is-active--dec::before { background: var(--lb-warn); }
.lb-sidebar__link.is-active--dec i { color: var(--lb-warn); }

/* eMAG — albastru de brand (#0b5cb5) pe link activ. */
.lb-sidebar__link.is-active--emag {
  background: #e8f1fc;
  color: #0b5cb5;
}
.lb-sidebar__link.is-active--emag::before { background: #0b5cb5; }
.lb-sidebar__link.is-active--emag i { color: #0b5cb5; }

.lb-sidebar__foot {
  border-top: 1px solid var(--lb-divider);
  padding: 12px;
  position: relative;
  flex-shrink: 0;
}

.lb-sidebar__account {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--lb-radius-md);
  cursor: pointer;
  background: transparent;
  border: 0;
  width: 100%;
  text-align: left;
  font-family: inherit;
  transition: background 0.15s;
}

.lb-sidebar__account:hover { background: var(--lb-bg); }

.lb-sidebar__account__avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--lb-accent-50);
  color: var(--lb-accent);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}

.lb-sidebar__account__info { min-width: 0; flex: 1; }

.lb-sidebar__account__name {
  font-size: 13px;
  font-weight: 600;
  color: var(--lb-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lb-sidebar__account__email {
  font-size: 11px;
  color: var(--lb-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lb-sidebar__account__chev {
  width: 14px; height: 14px;
  color: var(--lb-text-faint);
  flex-shrink: 0;
}

.lb-sidebar__pop {
  position: absolute;
  bottom: calc(100% - 4px);
  left: 12px;
  right: 12px;
  background: var(--lb-surface);
  border: 1px solid var(--lb-border);
  border-radius: var(--lb-radius-md);
  box-shadow: 0 12px 32px -8px rgba(15, 23, 42, 0.18);
  padding: 8px;
  display: none;
  z-index: 60;
}

.lb-sidebar__pop.is-open { display: block; }

.lb-sidebar__pop__head {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 6px 8px 12px;
  border-bottom: 1px solid var(--lb-divider);
  margin-bottom: 6px;
}

.lb-sidebar__pop__title {
  font-size: 13px;
  font-weight: 600;
  color: var(--lb-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lb-sidebar__pop__sub {
  font-size: 11px;
  color: var(--lb-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lb-sidebar__pop a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 13px;
  color: var(--lb-text-2);
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.lb-sidebar__pop a:hover {
  background: var(--lb-bg);
  color: var(--lb-text);
}

.lb-sidebar__pop a i {
  width: 14px; height: 14px;
  color: var(--lb-text-faint);
  flex-shrink: 0;
}

.lb-sidebar__pop hr {
  border: 0;
  border-top: 1px solid var(--lb-divider);
  margin: 6px 0;
}

.lb-sidebar-topbar {
  display: none;
  position: sticky;
  top: 0;
  z-index: 51;
  background: var(--lb-surface);
  border-bottom: 1px solid var(--lb-border);
  height: 56px;
  padding: 0 16px;
  align-items: center;
  gap: 12px;
}

.lb-sidebar-topbar .lb-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 14px;
  color: var(--lb-text);
  text-decoration: none;
}

.lb-sidebar-topbar .lb-brand-mark {
  width: 28px; height: 28px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--lb-accent) 0%, var(--lb-info) 100%);
  color: #fff;
  display: grid; place-items: center;
  font-weight: 700; font-size: 12px;
}

.lb-sidebar__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.4);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  z-index: 49;
}

.lb-sidebar__backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 1024px) {
  body[data-has-sidebar="true"] {
    padding-left: 0;
  }

  .lb-sidebar {
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    box-shadow: 0 12px 40px -8px rgba(15, 23, 42, 0.35);
  }

  .lb-sidebar.is-open {
    transform: translateX(0);
  }

  .lb-sidebar-topbar {
    display: flex;
  }
}

/* ════════════════════════════════════════════════════════════════════
   IRIS — adaos 2026-05-18
   Primitive noi pentru dashboard (bento, module cards, page header
   IRIS, breadcrumbs, period pill, status pills, notif bell, health
   rail, chart wrap, donut wrap, stage badge). Plus refinări pe sidebar
   pentru group strips colorate per modul (Fin/Imp/Pret/Dec).
════════════════════════════════════════════════════════════════════ */

/* ── Sidebar refinări IRIS — group cu strip masthead colorat ── */
.lb-sidebar__group {
  border-radius: 12px;
  border: 1px solid var(--lb-border);
  overflow: hidden;
  background: var(--lb-surface);
  transition: box-shadow 0.18s ease;
}
.lb-sidebar__group:hover { box-shadow: var(--lb-shadow-1); }
.lb-sidebar__group + .lb-sidebar__group { margin-top: 10px; }

.lb-sidebar__group-label {
  padding: 9px 12px 8px;
  border-bottom: 1px solid var(--lb-divider);
  gap: 9px;
  font-size: 11.5px;
  letter-spacing: 0.01em;
  color: var(--lb-t1);
  font-weight: 700;
  text-transform: none;
  user-select: none;
}
/* Module group strip (per data-mod) — fundal gradient subtil cu culoarea modulului. */
.lb-sidebar__group--fin .lb-sidebar__group-label {
  background: linear-gradient(90deg, rgba(124,58,237,0.07) 0%, rgba(124,58,237,0.02) 100%);
  border-bottom-color: rgba(124,58,237,0.10);
}
.lb-sidebar__group--imp .lb-sidebar__group-label {
  background: linear-gradient(90deg, rgba(8,145,178,0.07) 0%, rgba(8,145,178,0.02) 100%);
  border-bottom-color: rgba(8,145,178,0.10);
}
.lb-sidebar__group--pret .lb-sidebar__group-label {
  background: linear-gradient(90deg, rgba(180,83,9,0.07) 0%, rgba(180,83,9,0.02) 100%);
  border-bottom-color: rgba(180,83,9,0.10);
}
.lb-sidebar__group--dec .lb-sidebar__group-label {
  background: linear-gradient(90deg, rgba(4,120,87,0.07) 0%, rgba(4,120,87,0.02) 100%);
  border-bottom-color: rgba(4,120,87,0.10);
}
.lb-sidebar__group--emag .lb-sidebar__group-label {
  background: linear-gradient(90deg, rgba(11,92,181,0.07) 0%, rgba(11,92,181,0.02) 100%);
  border-bottom-color: rgba(11,92,181,0.10);
}

/* Iconiță modul (placeholder înainte de lb-dot — se păstrează compat dot ca fallback). */
.lb-sidebar__group-icon {
  width: 26px; height: 26px;
  border-radius: 7px;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.lb-sidebar__group-icon i { width: 14px; height: 14px; }
.lb-sidebar__group--fin  .lb-sidebar__group-icon { background: var(--lb-violet-pale); color: var(--lb-violet-m); }
.lb-sidebar__group--imp  .lb-sidebar__group-icon { background: var(--lb-cyan-pale);   color: var(--lb-cyan-m); }
.lb-sidebar__group--pret .lb-sidebar__group-icon { background: var(--lb-amber-pale);  color: var(--lb-amber-m); }
.lb-sidebar__group--dec  .lb-sidebar__group-icon { background: var(--lb-green-pale);  color: var(--lb-green-m); }
.lb-sidebar__group--emag .lb-sidebar__group-icon { background: #e8f1fc;               color: #0b5cb5; } /* albastru eMAG */

.lb-sidebar__group-count {
  margin-left: auto;
  font-size: 10px; font-weight: 700;
  padding: 2px 7px; border-radius: 20px;
  color: var(--lb-t3);
  background: rgba(0,0,0,0.04);
  border: 1px solid var(--lb-divider);
}

/* Reposiționare linkuri în interiorul group card (padding intern, fără bara verticală). */
.lb-sidebar__group .lb-sidebar__link {
  margin: 1px 6px;
  padding: 7px 10px;
}
.lb-sidebar__group .lb-sidebar__link:first-of-type { margin-top: 5px; }
.lb-sidebar__group .lb-sidebar__link:last-of-type  { margin-bottom: 6px; }
.lb-sidebar__group .lb-sidebar__link.is-active::before { display: none; }

/* ── Brand mark IRIS (logo violet gradient cu literă) ── */
.lb-sidebar__head .lb-brand-mark,
.lb-sidebar-topbar .lb-brand-mark {
  background: linear-gradient(135deg, var(--lb-violet-m) 0%, var(--lb-violet-l) 100%);
  box-shadow: 0 4px 12px var(--lb-accent-glow);
  width: 36px; height: 36px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 800;
}

/* ── Page header IRIS (breadcrumbs + period pill + actions) ── */
.lb-page-header {
  border-bottom: 1px solid var(--lb-border);
  padding-bottom: 18px;
  margin-bottom: 22px;
}
.lb-crumbs {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 8px;
  font-size: 11px;
}
.lb-crumbs .lb-crumb-root {
  color: var(--lb-t3);
  font-weight: 600;
  letter-spacing: 0.04em;
}
.lb-crumbs .lb-crumb-sep {
  width: 12px; height: 12px;
  opacity: 0.35;
  color: var(--lb-t3);
  display: inline-flex; align-items: center; justify-content: center;
}
.lb-crumbs .lb-crumb-current {
  color: var(--lb-t1);
  font-weight: 700;
  letter-spacing: 0.01em;
}

.lb-period-pill {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 22px; font-weight: 800;
  color: var(--lb-t1);
  line-height: 1;
}
.lb-period-pill i { color: var(--lb-violet-m); width: 14px; height: 14px; }
.lb-period-pill .lb-period-sep { color: var(--lb-t4); font-weight: 400; font-size: 18px; }
.lb-period-pill .lb-period-days { font-size: 13px; font-weight: 500; color: var(--lb-t3); }

.lb-status-pills {
  display: flex; align-items: center; gap: 7px;
  flex-wrap: wrap;
}
.lb-status-pill-mini {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 600;
  padding: 4px 10px; border-radius: 20px;
  border: 1px solid transparent;
}
.lb-status-pill-mini.is-ok    { background: var(--lb-green-bg); border-color: rgba(4,120,87,0.15);  color: var(--lb-green-m); }
.lb-status-pill-mini.is-warn  { background: var(--lb-amber-bg); border-color: rgba(146,64,14,0.15); color: var(--lb-amber-m); }
.lb-status-pill-mini.is-danger{ background: var(--lb-red-bg);   border-color: rgba(190,18,60,0.15); color: var(--lb-red); }
.lb-status-pill-mini .lb-dot { width: 5px; height: 5px; border-radius: 50%; }
.lb-status-pill-mini.is-ok    .lb-dot { background: var(--lb-green); }
.lb-status-pill-mini.is-warn  .lb-dot { background: var(--lb-amber-m); animation: lb-blink-slow 2.5s ease-in-out infinite; }
.lb-status-pill-mini.is-danger .lb-dot{ background: var(--lb-red); }
@keyframes lb-blink-slow { 0%,100%{opacity:1} 50%{opacity:0.4} }

/* ── Notification bell ── */
.lb-notif-wrap { position: relative; display: inline-block; }
.lb-notif-bell {
  width: 38px; height: 38px;
  background: var(--lb-surface);
  border: 1px solid var(--lb-border);
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--lb-t2);
  cursor: pointer;
  position: relative;
  transition: all 0.17s;
  box-shadow: var(--lb-shadow-1);
}
.lb-notif-bell:hover { color: var(--lb-t1); border-color: var(--lb-border-strong); box-shadow: var(--lb-shadow-2); }
.lb-notif-bell i { width: 17px; height: 17px; }
.lb-notif-bell .lb-notif-badge {
  position: absolute; top: -4px; right: -4px;
  min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px;
  background: var(--lb-red);
  color: #fff;
  font-size: 10px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid var(--lb-surface);
}
.lb-notif-bell .lb-notif-badge.is-hidden { display: none; }

.lb-notif-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 380px;
  max-width: calc(100vw - 32px);
  background: var(--lb-surface);
  border: 1px solid var(--lb-border);
  border-radius: 14px;
  box-shadow: var(--lb-shadow-3);
  z-index: 200;
  overflow: hidden;
  display: none;
}
.lb-notif-dropdown.is-open { display: block; }
.lb-notif-dropdown__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--lb-divider);
}
.lb-notif-dropdown__title { font-size: 13px; font-weight: 700; color: var(--lb-t1); }
.lb-notif-dropdown__count { font-size: 11px; color: var(--lb-t3); }
.lb-notif-dropdown__list {
  max-height: 420px; overflow-y: auto;
  padding: 6px;
}
.lb-notif-item {
  display: flex; gap: 11px;
  padding: 11px 12px;
  border-radius: 10px;
  align-items: flex-start;
  cursor: default;
  transition: background 0.14s;
  position: relative;
}
.lb-notif-item:hover { background: var(--lb-bg-inner); }
.lb-notif-item__icon {
  width: 30px; height: 30px;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.lb-notif-item__icon i { width: 14px; height: 14px; }
.lb-notif-item.is-danger .lb-notif-item__icon { background: var(--lb-red-bg);   color: var(--lb-red); }
.lb-notif-item.is-warn   .lb-notif-item__icon { background: var(--lb-amber-bg); color: var(--lb-amber-m); }
.lb-notif-item.is-info   .lb-notif-item__icon { background: var(--lb-cyan-bg);  color: var(--lb-cyan-m); }
.lb-notif-item.is-success .lb-notif-item__icon { background: var(--lb-green-bg); color: var(--lb-green-m); }
.lb-notif-item__body { flex: 1; min-width: 0; }
.lb-notif-item__title { font-size: 12.5px; font-weight: 600; color: var(--lb-t1); margin-bottom: 2px; }
.lb-notif-item__msg   { font-size: 11px; color: var(--lb-t2); line-height: 1.4; }
.lb-notif-item__foot  { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; }
.lb-notif-item__time  { font-size: 10.5px; color: var(--lb-t3); }
.lb-notif-item__cta   { font-size: 11px; font-weight: 700; color: var(--lb-accent); text-decoration: none; }
.lb-notif-item__cta:hover { color: var(--lb-accent-600); }
.lb-notif-item__dot {
  position: absolute; top: 14px; right: 12px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--lb-accent);
}
.lb-notif-dropdown__foot {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid var(--lb-divider);
  background: var(--lb-bg-inner);
}
.lb-notif-dropdown__foot a {
  font-size: 11.5px; font-weight: 600; color: var(--lb-accent);
  text-decoration: none;
}
.lb-notif-dropdown__foot button {
  font-size: 11px; color: var(--lb-t2);
  background: transparent; border: 0; cursor: pointer;
}
.lb-notif-dropdown__foot button:hover { color: var(--lb-t1); }
.lb-notif-dropdown__empty {
  text-align: center;
  padding: 28px 16px;
  color: var(--lb-t3);
  font-size: 12px;
}

/* ── Bento layout (12-col, gap from density) ── */
.lb-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--lb-bento-gap, 16px);
}

/* ── Module card cu masthead colorat (Fin/Imp) ── */
.lb-mod-card {
  overflow: hidden;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}
.lb-mod-card__banner {
  padding: 16px 22px 18px;
  position: relative;
  overflow: hidden;
  color: rgba(255,255,255,0.92);
  /* Default = violet IRIS — folosit când cardul nu are modifier --fin/--imp/--pret/--dec
     (ex: lb-mod-card singular pe pagini ca cheltuieli/venituri hero cards). Modifierii
     suprascriu gradient-ul prin specificitate egală + order CSS. */
  background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 55%, #a78bfa 100%);
}
.lb-mod-card--fin .lb-mod-card__banner {
  background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 55%, #a78bfa 100%);
}
.lb-mod-card--imp .lb-mod-card__banner {
  background: linear-gradient(135deg, #164e63 0%, #0891b2 55%, #22d3ee 100%);
}
.lb-mod-card--pret .lb-mod-card__banner {
  background: linear-gradient(135deg, #78350f 0%, #b45309 55%, #f59e0b 100%);
}
.lb-mod-card--dec .lb-mod-card__banner {
  background: linear-gradient(135deg, #064e3b 0%, #047857 55%, #34d399 100%);
}
.lb-mod-card__banner::after {
  content: '';
  position: absolute; inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    -55deg,
    transparent 0px, transparent 16px,
    rgba(255,255,255,0.04) 16px, rgba(255,255,255,0.04) 17px
  );
}
.lb-mod-card__banner-inner {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: space-between;
}
.lb-mod-card__badge {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 10px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.78);
}
.lb-mod-card__badge .lb-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255,255,255,0.92);
}
.lb-mod-card__expand {
  width: 26px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 7px;
  background: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.78);
  border: 0; cursor: pointer;
  transition: all 0.17s;
}
.lb-mod-card__expand:hover { background: rgba(255,255,255,0.22); color: #fff; }
.lb-mod-card__expand i { width: 11px; height: 11px; }

.lb-mod-card__body { padding: 20px 22px 18px; }
.lb-mod-card__label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--lb-t3);
  margin-bottom: 4px;
}
.lb-mod-card__value {
  font-size: 40px; font-weight: 800;
  line-height: 1.05; letter-spacing: -0.02em;
  margin-bottom: 2px;
}
.lb-mod-card--fin  .lb-mod-card__value { color: var(--lb-green); }
.lb-mod-card--imp  .lb-mod-card__value { color: var(--lb-cyan); display: flex; align-items: center; gap: 12px; }
.lb-mod-card--pret .lb-mod-card__value { color: var(--lb-amber-m); }
.lb-mod-card--dec  .lb-mod-card__value { color: var(--lb-green); }

.lb-mod-card__stats {
  display: flex; flex-wrap: wrap; gap: 4px 14px;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px solid var(--lb-divider);
  font-size: 12px;
}
.lb-mod-card__stats span { color: var(--lb-t2); white-space: nowrap; }
.lb-mod-card__stats strong { font-weight: 700; color: var(--lb-t1); }

/* ── Health rail (Sănătate business — 4 sections side-by-side) ── */
.lb-health-rail {
  grid-column: span 12;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 0;
  overflow: hidden;
}
.lb-health-rail__section {
  padding: 18px 22px;
  border-right: 1px solid var(--lb-divider);
  transition: background 0.17s;
}
.lb-health-rail__section:last-child { border-right: 0; }
.lb-health-rail__section:hover { background: var(--lb-violet-bg); }
.lb-health-rail__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.lb-health-rail__icon {
  width: 28px; height: 28px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.lb-health-rail__icon i { width: 13px; height: 13px; }
.lb-health-rail__icon.is-cash  { background: var(--lb-green-pale);  color: var(--lb-green); }
.lb-health-rail__icon.is-tva   { background: var(--lb-amber-pale);  color: var(--lb-amber-m); }
.lb-health-rail__icon.is-clean { background: var(--lb-cyan-pale);   color: var(--lb-cyan-m); }
.lb-health-rail__icon.is-eff   { background: var(--lb-violet-pale); color: var(--lb-violet-m); }
.lb-health-rail__label {
  font-size: 10.5px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--lb-t3);
}
.lb-health-rail__value { font-size: 20px; font-weight: 800; color: var(--lb-t1); margin-bottom: 3px; }
.lb-health-rail__value.is-ok  { color: var(--lb-cyan-m); }
.lb-health-rail__value.is-neg { color: var(--lb-amber-m); }
.lb-health-rail__sub { font-size: 11px; color: var(--lb-t3); line-height: 1.4; }

/* ── Chart wrap + legend ── */
.lb-chart-wrap {
  padding: 0 22px;
  height: 230px;
  position: relative;
}
.lb-chart-legend {
  display: flex; flex-wrap: wrap; gap: 6px 18px;
  padding: 14px 22px 18px;
  border-top: 1px solid var(--lb-divider);
}
.lb-chart-legend .lb-legend-item {
  display: flex; align-items: center; gap: 6px;
  font-size: 11.5px; color: var(--lb-t2);
}
.lb-chart-legend .lb-legend-dot {
  width: 8px; height: 8px; border-radius: 50%;
  flex-shrink: 0;
}

/* ── Donut wrap + legend ── */
.lb-donut-wrap {
  padding: 0 22px 20px;
  display: flex;
  gap: 14px;
  align-items: center;
}
.lb-donut-canvas {
  position: relative;
  flex-shrink: 0;
  width: 140px; height: 140px;
}
.lb-donut-canvas canvas {
  width: 140px !important;
  height: 140px !important;
}
.lb-donut-legend {
  flex: 1;
  display: flex; flex-direction: column;
  gap: 5px;
}
.lb-donut-legend__item {
  display: flex; align-items: center; gap: 7px;
  font-size: 11px; color: var(--lb-t2);
}
.lb-donut-legend__swatch {
  width: 8px; height: 8px;
  border-radius: 3px;
  flex-shrink: 0;
}

/* ── Stage badge for tables ── */
.lb-stage-badge {
  display: inline-block;
  font-size: 11px; font-weight: 600;
  padding: 3px 10px; border-radius: 20px;
  border: 1px solid transparent;
}
.lb-stage-badge.is-paid     { background: var(--lb-green-pale);  color: var(--lb-green);   border-color: rgba(4,120,87,0.2); }
.lb-stage-badge.is-active   { background: var(--lb-cyan-pale);   color: var(--lb-cyan-m);  border-color: rgba(8,145,178,0.2); }
.lb-stage-badge.is-draft    { background: var(--lb-amber-pale);  color: var(--lb-amber-m); border-color: rgba(180,83,9,0.2); }
.lb-stage-badge.is-rejected { background: var(--lb-red-pale);    color: var(--lb-red);     border-color: rgba(190,18,60,0.2); }

/* ── Card head IRIS layout (mai aproape de design v3) ── */
.lb-card__head .lb-card-action {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600;
  color: var(--lb-accent);
  padding: 5px 12px; border-radius: 8px;
  background: var(--lb-violet-pale);
  border: 1px solid var(--lb-border);
  text-decoration: none;
  transition: all 0.15s;
}
.lb-card__head .lb-card-action:hover {
  background: var(--lb-violet-bg);
  border-color: var(--lb-border-strong);
}

/* ── „In lucru" pill cu puls (folosit pe mod-card--imp pentru importuri active) ── */
.lb-in-lucru {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700;
  padding: 3px 10px; border-radius: 20px;
  background: var(--lb-cyan-pale);
  border: 1px solid rgba(14,116,144,0.25);
  color: var(--lb-cyan-m);
}
.lb-in-lucru::before {
  content: '';
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--lb-cyan-m);
  animation: lb-blink-pulse 2s ease-in-out infinite;
}
@keyframes lb-blink-pulse { 0%,100%{opacity:1} 50%{opacity:0.3} }

/* ── Date table refined (folosit în „Importuri în lucru") ── */
.lb-data-table {
  width: 100%;
  border-collapse: collapse;
}
.lb-data-table thead tr { border-bottom: 1px solid var(--lb-divider); }
.lb-data-table th {
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lb-t3);
  padding: 0 8px 10px;
  text-align: left;
}
.lb-data-table td {
  padding: 13px 8px;
  font-size: 13px; color: var(--lb-t1);
  border-bottom: 1px solid var(--lb-divider);
}
.lb-data-table tbody tr { transition: background 0.14s; }
.lb-data-table tbody tr:hover { background: var(--lb-violet-bg); }
.lb-data-table tbody tr:last-child td { border-bottom: 0; }
.lb-data-table .lb-supplier { font-weight: 600; }

/* ── Responsive bento ── */
@media (max-width: 1024px) {
  .lb-bento { grid-template-columns: repeat(6, 1fr); }
  .lb-health-rail { grid-template-columns: repeat(2, 1fr); }
  .lb-health-rail__section:nth-child(2) { border-right: 0; }
  .lb-health-rail__section:nth-child(-n+2) { border-bottom: 1px solid var(--lb-divider); }
}
@media (max-width: 700px) {
  .lb-bento { grid-template-columns: 1fr; }
  .lb-health-rail { grid-template-columns: 1fr; }
  .lb-health-rail__section { border-right: 0; border-bottom: 1px solid var(--lb-divider); }
  .lb-health-rail__section:last-child { border-bottom: 0; }
  .lb-notif-dropdown { width: 320px; }
}


/* ────────────────────────────────────────────────────────────────────
 * Trial banner sticky în top — Plan C 2026-05-19
 * Apare doar când user.trial_state ≠ 'paid' (warn în Z5-Z7, danger în readonly).
 * Mount via js/lb-nav.js → checkTrialStateAndRenderBanner().
 * ──────────────────────────────────────────────────────────────────── */
.lb-trial-banner {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 10px 24px;
  font-size: 0.875rem;
  font-weight: 500;
  border-bottom: 1px solid transparent;
  animation: lb-trial-banner-slide-in 0.3s ease-out;
}

@keyframes lb-trial-banner-slide-in {
  from { transform: translateY(-100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.lb-trial-banner[data-severity="warn"] {
  background: linear-gradient(90deg, var(--lb-accent-50), var(--lb-accent-100));
  color: var(--lb-accent-700);
  border-bottom-color: var(--lb-accent-light);
}

.lb-trial-banner[data-severity="danger"] {
  background: linear-gradient(90deg, var(--lb-danger-50), var(--lb-danger-100));
  color: var(--lb-danger);
  border-bottom-color: var(--lb-danger);
}

.lb-trial-banner-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.lb-trial-banner-text {
  flex: 1;
  max-width: 600px;
  text-align: center;
}

.lb-trial-banner-text strong {
  font-weight: 700;
}

.lb-trial-banner-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 0.825rem;
  font-weight: 600;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: opacity 0.15s, transform 0.15s;
  white-space: nowrap;
}

.lb-trial-banner[data-severity="warn"] .lb-trial-banner-btn {
  background: var(--lb-accent);
  color: #fff;
}

.lb-trial-banner[data-severity="danger"] .lb-trial-banner-btn {
  background: var(--lb-danger);
  color: #fff;
}

.lb-trial-banner-btn:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

.lb-trial-banner-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

/* Banner-ul e sticky → împinge conținutul natural; nu mai e nevoie de body padding.
 * Class hook pentru cazurile când vrem să ajustăm alte componente. */
body.lb-has-trial-banner { padding-top: 0; }

/* Responsive — pe mobile, text mai scurt + buton sub */
@media (max-width: 640px) {
  .lb-trial-banner {
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px;
    text-align: center;
  }
  .lb-trial-banner-text { font-size: 0.825rem; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .lb-trial-banner { animation: none; }
}


/* ============================================================
 * Banner primitive (R0 Foundation, 2026-05-21)
 * Generic page-level banner for status/announcement/warning.
 * Distinct from .lb-banner-diff which is transport-formula specific.
 *
 * Variants:
 *   .lb-banner.lb-banner--info     — cyan, neutral information
 *   .lb-banner.lb-banner--warn     — amber, attention needed
 *   .lb-banner.lb-banner--danger   — red, critical
 *
 * Structure:
 *   <div class="lb-banner lb-banner--warn">
 *     <i data-lucide="alert-triangle" class="lb-banner__icon"></i>
 *     <div class="lb-banner__body">
 *       <strong class="lb-banner__title">Title</strong>
 *       <span class="lb-banner__msg">Message</span>
 *     </div>
 *     <button class="lb-banner__close" aria-label="Închide">×</button>
 *   </div>
 * ============================================================ */
.lb-banner {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 8px;
  border-left: 3px solid;
  font-size: 13px;
  line-height: 1.4;
}
.lb-banner__icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  margin-top: 1px;
}
.lb-banner__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lb-banner__title {
  font-weight: 600;
}
.lb-banner__msg {
  color: var(--lb-text-muted);
}
.lb-banner__close {
  flex: 0 0 auto;
  background: transparent;
  border: 0;
  color: var(--lb-text-muted);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}
.lb-banner__close:hover { color: var(--lb-text); }

.lb-banner--info {
  background: var(--lb-cyan-bg);
  border-color: var(--lb-cyan-m);
  /* cyan-700 (#0e7490) — overrides --lb-cyan-m (cyan-600) on cyan-bg for
   * WCAG AA. cyan-600/cyan-50 = 3.54:1 (fail); cyan-700/cyan-50 = 5.2:1 (pass). */
  color: #0e7490;
}
.lb-banner--info .lb-banner__msg { color: #0e7490; opacity: 0.9; }

.lb-banner--warn {
  background: #fffbeb;
  border-color: var(--lb-amber-m);
  color: #854d0e;
}
.lb-banner--warn .lb-banner__msg { color: #854d0e; opacity: 0.85; }

.lb-banner--danger {
  background: #fef2f2;
  border-color: var(--lb-danger);
  color: var(--lb-danger);
}
.lb-banner--danger .lb-banner__msg { color: var(--lb-danger); opacity: 0.85; }

/* ==========================================================================
   Health Score chip (Decizii V2 — Phase 4A Task 4.1)
   Color-coded badge per health tier (healthy/caution/fragile) shown next to
   each decizie in the list. Score is 0..100; tier is derived in
   decisionHealthScorer.js. Neutral fallback for missing/null score.
   ========================================================================== */
.lb-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: #eef0f5;
  color: var(--lb-text-2);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.lb-chip[data-health-tier="healthy"]  { background: #dcfce7; color: #15803d; }
/* WCAG AA fix (2026-05-24): amber-700 #92400e on #fef3c7 = ≈5.5:1 (pass).
 * Previous #a16207 = 4.3:1 (fail AA 4.5:1 threshold). */
.lb-chip[data-health-tier="caution"]  { background: #fef3c7; color: #92400e; }
.lb-chip[data-health-tier="fragile"]  { background: #fee2e2; color: #b91c1c; }

/* ==========================================================================
   Health gauge — large display in wizard step 3 + decision detail
   ========================================================================== */
.lb-health-gauge {
  display: flex; flex-direction: column; align-items: center;
  gap: 6px; padding: 12px;
  border: 1px solid var(--lb-divider);
  border-radius: var(--lb-radius-md);
  background: var(--lb-surface);
  min-width: 180px;
}
.lb-health-gauge__score {
  font-size: 32px; font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.lb-health-gauge__score[data-tier="healthy"] { color: #15803d; }
/* WCAG AA fix (2026-05-24): amber-700 #92400e — see .lb-chip[data-health-tier="caution"]. */
.lb-health-gauge__score[data-tier="caution"] { color: #92400e; }
.lb-health-gauge__score[data-tier="fragile"] { color: #b91c1c; }
.lb-health-gauge__breakdown {
  font-size: 11px; color: var(--lb-text-muted);
  display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;
}

/* ==========================================================================
   Tornado bar — sensitivity preview (wizard step 3)
   ========================================================================== */
.lb-tornado {
  display: grid;
  grid-template-columns: 140px 1fr 1fr;
  gap: 4px 8px;
  align-items: center;
  font-size: 12px;
}
.lb-tornado__label { color: var(--lb-text-2); }
.lb-tornado__bar {
  height: 8px;
  border-radius: 4px;
  background: #eef0f5;
  position: relative;
}
.lb-tornado__bar-fill {
  position: absolute; top: 0; height: 100%;
  border-radius: 4px;
}
.lb-tornado__bar--down .lb-tornado__bar-fill { background: var(--lb-danger); right: 0; }
.lb-tornado__bar--up   .lb-tornado__bar-fill { background: var(--lb-success); left: 0; }

/* ==========================================================================
   Wizard stepper (Decizii V2)
   ========================================================================== */
.lb-stepper {
  display: flex; gap: 8px; align-items: center;
  margin-bottom: 14px; flex-wrap: wrap;
}
.lb-stepper__step {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eef0f5;
  color: var(--lb-text-2);
  font-size: 12px;
  font-weight: 600;
}
.lb-stepper__step.is-active {
  background: var(--lb-accent-50);
  color: var(--lb-accent);
}
.lb-stepper__step.is-done {
  background: #dcfce7;
  color: #15803d;
}
.lb-stepper__num {
  width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  background: currentColor; color: #fff;
  border-radius: 50%; font-size: 11px;
}
.lb-stepper__step.is-active .lb-stepper__num,
.lb-stepper__step.is-done .lb-stepper__num {
  background: currentColor; color: #fff;
}
/* Inner text on the num circle: white on filled background */
.lb-stepper__num { color: #fff !important; }

/* ==========================================================================
   Template card grid (Decizii V2 — Task 4.3)
   ========================================================================== */
.lb-tplcard {
  border: 1px solid var(--lb-divider);
  border-radius: var(--lb-radius-md);
  padding: 14px;
  background: var(--lb-surface);
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
  display: flex; flex-direction: column;
  gap: 8px;
}
.lb-tplcard:hover {
  border-color: var(--lb-accent);
  box-shadow: var(--lb-shadow-2);
  transform: translateY(-2px);
}
.lb-tplcard__title { font-weight: 600; color: var(--lb-text); font-size: 13px; }
.lb-tplcard__desc  { font-size: 12px; color: var(--lb-text-muted); }
.lb-tplcard__usecase { font-size: 11px; color: var(--lb-text-faint); font-style: italic; }
.lb-tplcard__tip {
  display: inline-flex; align-self: flex-start;
  padding: 1px 7px; border-radius: 999px;
  background: var(--lb-accent-50); color: var(--lb-accent);
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
}

/* ==========================================================================
   Sub-decision card (campanie builder — Task 4.5)
   ========================================================================== */
.lb-subcard {
  border: 1px solid var(--lb-divider);
  border-radius: var(--lb-radius-md);
  padding: 10px 12px;
  margin-bottom: 8px;
  background: var(--lb-surface);
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
}
.lb-subcard__order {
  font-weight: 700;
  color: var(--lb-text-muted);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  min-width: 20px;
}
.lb-subcard__main { font-size: 13px; color: var(--lb-text); }
.lb-subcard__actions { display: flex; gap: 4px; }

/* ==========================================================================
   Collapsible (Decizii V2 — Phase 4 a11y fix 2026-05-24, FIX A4)
   Native <details>/<summary> wrapper. Used in wizard Step 3 + impact detail
   pentru a evita height overflow pe ecrane <900px.
   ========================================================================== */
.lb-collapsible {
  border: 1px solid var(--lb-divider);
  border-radius: var(--lb-radius-md);
  background: var(--lb-surface);
  margin-bottom: 10px;
}
.lb-collapsible > summary {
  list-style: none;
  cursor: pointer;
  padding: 10px 14px;
  font-weight: 600;
  font-size: 13px;
  color: var(--lb-text);
  display: flex;
  align-items: center;
  gap: 8px;
  user-select: none;
}
.lb-collapsible > summary::-webkit-details-marker { display: none; }
.lb-collapsible > summary::before {
  content: '▸';
  display: inline-block;
  font-size: 11px;
  color: var(--lb-text-muted);
  transition: transform 0.15s;
}
.lb-collapsible[open] > summary::before {
  transform: rotate(90deg);
}
.lb-collapsible > summary:focus-visible {
  outline: 2px solid var(--lb-accent);
  outline-offset: -2px;
}
.lb-collapsible__body {
  padding: 0 14px 14px;
}

/* ==========================================================================
   Impact tab two-column responsive (Decizii V2 — FIX A5, 2026-05-24)
   Pe <=768px: layout-ul flex stacks (lista deciziilor → strip orizontal scroll
   peste detaliu). Vezi structura `decizii-impact.html` tab Impact.
   ========================================================================== */
@media (max-width: 768px) {
  .di-impact-row { flex-direction: column !important; }
  .di-impact-row > .lb-card:first-child {
    flex: 0 0 auto !important;
    max-height: 220px !important;
    width: 100% !important;
  }
  .di-impact-row > .lb-card:last-child {
    width: 100% !important;
  }
}

/* ==========================================================================
   Touch-friendly iconbtn (Decizii V2 — FIX A13, 2026-05-24)
   WCAG 2.5.5 best practice: ≥44×44 px touch target pe touch devices.
   Desktop păstrează dimensiunea compactă (30px); doar pe pointer:coarse upgrade.
   ========================================================================== */
@media (hover: none) and (pointer: coarse) {
  .lb-iconbtn {
    min-width: 44px;
    min-height: 44px;
    padding: 10px;
  }
}

/* ==========================================================================
   Scenario card visual accent (Decizii V2 — FIX A21, 2026-05-24)
   Left border colored per scenario type pentru identitate vizuală quick-scan.
   ========================================================================== */
.di-scn-card { border-left: 3px solid transparent; }
.di-scn-card[data-scn="status_quo"] { border-left-color: #94a3b8; }
.di-scn-card[data-scn="realist"]    { border-left-color: #2563eb; }
.di-scn-card[data-scn="pesimist"]   { border-left-color: #dc2626; }
.di-scn-card[data-scn="optimist"]   { border-left-color: #16a34a; }

/* ==========================================================================
   Mid-flight visual separator (Decizii V2 — FIX A17, 2026-05-24)
   Wrap mid-flight section în card cu border-top vizibil ca să spargă
   continuitatea cu scenario bar de deasupra.
   ========================================================================== */
.imp-midflight {
  border-top: 1px solid var(--lb-divider);
  padding: 14px 16px;
  margin-top: 14px;
  background: var(--lb-bg);
  border-radius: 8px;
}

/* ==========================================================================
   Templates modal empty state (Decizii V2 — FIX A19, 2026-05-24)
   Asigură că modalul nu colapsează vizual când 0 templates.
   ========================================================================== */
#tpl-modal .lb-modal__body { min-height: 160px; }
#tpl-modal .lb-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex-direction: column;
  gap: 12px;
}

/* ==========================================================================
   Required field abbr (Decizii V2 — FIX A1, 2026-05-24)
   Asterisk de „obligatoriu" trebuie să nu aibă underline default + cursor help.
   Asocierea text alternativă vine din <abbr title> + aria-label.
   ========================================================================== */
abbr.lb-required {
  text-decoration: none;
  color: var(--lb-danger);
  cursor: help;
  margin-left: 2px;
  font-weight: 700;
}

/* ==========================================================================
   Reduced motion — global a11y safety net (FIX A22, 2026-05-24)
   Browser-ul cu prefers-reduced-motion respect-uiește user preference; toate
   tranzițiile cad la 1ms. Existing rule for .lb-trial-banner remains, this is
   the global blanket.
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Mono text helper — documented in design-system-quickref §"Helpers tipografie"
   (was missing from CSS; added 2026-05-30 to fix drift + align decizii-impact). */
.lb-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }

/* ── Copilot pe date — widget chat flotant (Faza 4, 2026-06-08) ──────────────
   Buton rotund dreapta-jos + panel pop-up. Apare pe toate paginile cu shell (lb-nav). */
.lb-copilot-fab {
  position: fixed; right: 22px; bottom: 22px; z-index: 1200;
  width: 54px; height: 54px; border-radius: 50%;
  background: var(--lb-accent, #6d5efc); color: #fff; border: none; cursor: pointer;
  box-shadow: 0 8px 24px rgba(40, 30, 120, 0.28);
  display: flex; align-items: center; justify-content: center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.lb-copilot-fab:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 12px 30px rgba(40, 30, 120, 0.34); }
.lb-copilot-fab:focus-visible { outline: 3px solid var(--lb-accent-200, #c5bdfd); outline-offset: 2px; }
.lb-copilot-fab.is-open { transform: scale(0.94); }
.lb-copilot-fab i { width: 24px; height: 24px; }

.lb-copilot-panel {
  position: fixed; right: 22px; bottom: 88px; z-index: 1200;
  width: 380px; max-width: calc(100vw - 32px); height: 560px; max-height: calc(100vh - 130px);
  background: var(--lb-surface, #fff); border: 1px solid var(--lb-border, #e6e6ef); border-radius: 16px;
  box-shadow: 0 16px 48px rgba(30, 20, 90, 0.22);
  display: flex; flex-direction: column; overflow: hidden;
  animation: lbCopilotIn .18s ease;
}
@keyframes lbCopilotIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.lb-copilot-panel[hidden] { display: none; }
.lb-copilot-panel__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; border-bottom: 1px solid var(--lb-border, #e6e6ef);
  background: linear-gradient(180deg, var(--lb-accent-50, #f3f1ff), var(--lb-surface, #fff));
}
.lb-copilot-panel__title { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; color: var(--lb-accent-700, #4a3fc0); }
.lb-copilot-panel__close { background: none; border: none; font-size: 22px; line-height: 1; cursor: pointer; color: var(--lb-text-muted, #888); padding: 0 4px; }
.lb-copilot-panel__close:hover { color: var(--lb-text, #222); }

.lb-copilot-thread { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.lb-copilot-hint { font-size: 12px; color: var(--lb-text-muted, #888); line-height: 1.5; background: var(--lb-surface-2, #f7f7fb); border-radius: 10px; padding: 10px 12px; }
.lb-copilot-msg { font-size: 13px; line-height: 1.5; padding: 9px 12px; border-radius: 12px; max-width: 88%; white-space: pre-wrap; word-break: break-word; }
.lb-copilot-msg--user { align-self: flex-end; background: var(--lb-accent, #6d5efc); color: #fff; border-bottom-right-radius: 4px; }
.lb-copilot-msg--ai { align-self: flex-start; background: var(--lb-surface-2, #f3f3f8); color: var(--lb-text, #222); border-bottom-left-radius: 4px; }

.lb-copilot-card { align-self: flex-start; width: 100%; border: 1px solid var(--lb-border, #e6e6ef); border-radius: 10px; overflow: hidden; }
.lb-copilot-card__head { padding: 6px 10px; background: var(--lb-surface-2, #f7f7fb); font-size: 11px; font-weight: 600; color: var(--lb-text-muted, #777); }
.lb-copilot-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.lb-copilot-table th { text-align: left; padding: 4px 10px; border-bottom: 1px solid var(--lb-border, #eee); font-size: 10px; color: var(--lb-text-muted, #999); font-weight: 600; }
.lb-copilot-table td { padding: 4px 10px; border-bottom: 1px solid var(--lb-border, #f0f0f5); }
.lb-copilot-kv { padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.lb-copilot-kv__row { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; }
.lb-copilot-kv__row span { color: var(--lb-text-muted, #888); text-transform: capitalize; }
.lb-copilot-chart { width: 100%; margin-top: 4px; }
.lb-copilot-gate { align-self: flex-start; font-size: 13px; background: var(--lb-warn-50, #fff7e6); border: 1px solid var(--lb-warn-200, #ffe0a3); border-radius: 10px; padding: 10px 12px; color: var(--lb-text, #333); }

.lb-copilot-form { display: flex; gap: 8px; align-items: flex-end; padding: 10px; border-top: 1px solid var(--lb-border, #e6e6ef); }
.lb-copilot-form textarea {
  flex: 1; resize: none; max-height: 90px; border: 1px solid var(--lb-border, #ddd); border-radius: 10px;
  padding: 8px 10px; font: inherit; font-size: 13px; line-height: 1.4; outline: none;
}
.lb-copilot-form textarea:focus { border-color: var(--lb-accent, #6d5efc); }
.lb-copilot-send {
  flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px; border: none; cursor: pointer;
  background: var(--lb-accent, #6d5efc); color: #fff; display: flex; align-items: center; justify-content: center;
}
.lb-copilot-send:hover { filter: brightness(1.06); }
.lb-copilot-send:disabled { opacity: .55; cursor: default; }

@media (max-width: 640px) {
  .lb-copilot-panel { right: 8px; left: 8px; width: auto; bottom: 80px; height: calc(100vh - 100px); }
  .lb-copilot-fab { right: 16px; bottom: 16px; }
}

/* ── Feedback widget (2026-06-12) ───────────────────────────── */
.lb-feedback-fab{position:fixed;left:20px;bottom:20px;z-index:1400;width:52px;height:52px;border-radius:50%;border:none;cursor:pointer;background:var(--lb-accent-600,#7c3aed);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.18);transition:transform .15s ease,box-shadow .15s ease}
.lb-feedback-fab:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.22)}
.lb-feedback-fab i{width:22px;height:22px}
.lb-feedback-panel{position:fixed;left:20px;bottom:84px;z-index:1400;width:340px;max-width:calc(100vw - 40px);background:#fff;border:1px solid var(--lb-surface-2,#e5e7eb);border-radius:14px;box-shadow:0 16px 40px rgba(0,0,0,.18);padding:14px;display:flex;flex-direction:column;gap:10px}
.lb-feedback-panel__head{display:flex;align-items:center;justify-content:space-between}
.lb-feedback-panel__title{font-weight:600;font-size:15px}
.lb-feedback-panel__close{border:none;background:transparent;font-size:22px;line-height:1;cursor:pointer;color:var(--lb-text-muted,#6b7280)}
.lb-feedback-hint{font-size:12px;color:var(--lb-text-muted,#6b7280)}
.lb-feedback-panel textarea{width:100%;resize:vertical;min-height:84px;border:1px solid var(--lb-surface-2,#e5e7eb);border-radius:8px;padding:8px;font:inherit}
.lb-feedback-thumbs{display:flex;flex-wrap:wrap;gap:8px}
.lb-feedback-thumb{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;border:1px solid var(--lb-surface-2,#e5e7eb)}
.lb-feedback-thumb img{width:100%;height:100%;object-fit:cover}
.lb-feedback-thumb__rm{position:absolute;top:2px;right:2px;width:18px;height:18px;border:none;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:12px;line-height:1;cursor:pointer}
.lb-feedback-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.lb-feedback-attach{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--lb-surface-2,#e5e7eb);background:#fff;color:var(--lb-text,#0f172a);border-radius:8px;padding:8px 12px;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.lb-feedback-attach:hover{background:var(--lb-accent-50,#f5f3ff);border-color:var(--lb-accent-600,#7c3aed);color:var(--lb-accent-700,#6d28d9)}
.lb-feedback-attach i{width:16px;height:16px}
.lb-feedback-send{border:none;border-radius:8px;padding:8px 16px;background:var(--lb-accent-600,#7c3aed);color:#fff;font-weight:600;cursor:pointer}
.lb-feedback-send:disabled{opacity:.6;cursor:default}
@media (max-width:480px){.lb-feedback-panel{left:10px;right:10px;width:auto}}