/* ==========================================================================
   v3 → v4 compatibility layer.
   v3 "Stamped Ledger" classes (l-*) still present in markup render with the
   v4 "Clarté" look: drenched bands become light, display type shrinks,
   decorative motifs (grid, stamps, dots) disappear. New markup must use the
   ui-* primitives from core.css instead of these classes.
   ========================================================================== */
:root {
  --l-ink: var(--ui-text);
  --l-ink-2: var(--ui-text-2);
  --l-ink-3: var(--ui-text-3);
  --l-paper: #fff;
  --l-paper-2: var(--ui-bg-soft);
  --l-paper-3: var(--ui-n-100);
  --l-rule: var(--ui-border);
  --l-rule-strong: var(--ui-border-strong);
  --l-violet: var(--ui-primary);
  --l-violet-hi: var(--ui-primary);
  --l-indigo: var(--ui-primary-hover);
  --l-blue: var(--ui-blue);
  --l-on-violet: #fff;
  --l-on-violet-2: rgba(255, 255, 255, .86);
  --l-shadow-sheet: var(--ui-shadow-sm);
  --l-ease: var(--ui-ease);
  --l-radius: var(--ui-r-md);
}

/* Former drenched sections: light surface, dark text */
.l-violet, .l-blue, .l-ink {
  position: relative; isolation: isolate; background: var(--ui-bg-soft) !important; color: var(--ui-text-2);
  --l-on-violet: var(--ui-text); --l-on-violet-2: var(--ui-text-2);
}
.l-violet :is(h1, h2, h3, h4, .l-display, .l-h2, .l-h3), .l-blue :is(h1, h2, h3, h4), .l-ink :is(h1, h2, h3, h4) { color: var(--ui-text) !important; }
.l-violet :is(p, .l-lead), .l-blue :is(p, .l-lead), .l-ink :is(p, .l-lead) { color: var(--ui-text-2); }
.l-grid-bg, .l-grid-bg--ink, .l-stamp, .lh-dot { display: none !important; }

/* Type */
.l-display { font-size: var(--ui-fs-4xl) !important; font-weight: 600; line-height: 1.18; letter-spacing: -.02em; font-variation-settings: normal; }
.l-h2 { font-size: var(--ui-fs-3xl); font-weight: 600; line-height: 1.2; letter-spacing: -.02em; font-variation-settings: normal; text-wrap: balance; }
.l-h3 { font-size: var(--ui-fs-xl); font-weight: 600; line-height: 1.35; letter-spacing: -.01em; font-variation-settings: normal; }
.l-thin { font-weight: inherit; letter-spacing: inherit; }
.l-label { font-size: var(--ui-fs-xs); font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ui-text-3); font-variation-settings: normal; }
.l-num { font-variant-numeric: tabular-nums; font-variation-settings: normal; }
.l-lead { font-size: var(--ui-fs-lg); line-height: 1.65; color: var(--ui-text-2); max-width: 62ch; }

/* Buttons */
.l-btn {
  --_bg: var(--ui-primary); --_fg: #fff; --_bd: var(--ui-primary);
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 20px; border-radius: var(--ui-r-md) !important;
  background: var(--_bg) !important; color: var(--_fg) !important; border: 1px solid var(--_bd) !important;
  font-family: var(--ui-font); font-weight: 600; font-size: 15px; line-height: 1.1; white-space: nowrap; text-decoration: none; cursor: pointer;
  transition: background-color var(--ui-dur-2) var(--ui-ease), border-color var(--ui-dur-2) var(--ui-ease), color var(--ui-dur-2) var(--ui-ease);
}
.l-btn > i { font-size: 1.1em; }
.l-btn--violet, .l-btn--ink { --_bg: var(--ui-primary); --_bd: var(--ui-primary); --_fg: #fff; }
.l-btn--violet:hover, .l-btn--ink:hover, .l-btn:not([class*="l-btn--"]):hover { --_bg: var(--ui-primary-hover); --_bd: var(--ui-primary-hover); }
.l-btn--outline, .l-btn--paper, .l-btn--outline-paper { --_bg: #fff; --_fg: var(--ui-text); --_bd: var(--ui-border-strong); }
.l-btn--outline:hover, .l-btn--paper:hover, .l-btn--outline-paper:hover { --_bd: var(--ui-primary); --_fg: var(--ui-primary); --_bg: var(--ui-primary-50); }
.l-btn--lg { min-height: 54px; padding: 0 26px; font-size: 16px; }
html[dir="rtl"] .l-btn > i.ph-arrow-right { transform: scaleX(-1); }

/* Motifs → plain cards / lists */
.l-sheet, .l-receipt { position: relative; background: #fff !important; background-image: none !important; color: var(--ui-text-2); border: 1px solid var(--ui-border); border-radius: var(--ui-r-lg); box-shadow: var(--ui-shadow-xs); -webkit-mask: none !important; mask: none !important; filter: none !important; transform: none !important; }
.l-receipt { padding: 24px; }
.l-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--ui-border); background: transparent; }
.l-sheet__body { padding: 16px 20px 20px; }
.l-sheet__row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 8px 0; font-size: 14px; border-bottom: 1px solid var(--ui-border-soft); }
.l-sheet__row:last-child { border-bottom: 0; }
.l-sheet__row b { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--ui-text); }
.l-index { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ui-border); }
.l-index__row { border-bottom: 1px solid var(--ui-border); }
.l-index__link { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 40px; align-items: center; gap: 20px; padding: 20px 8px; color: var(--ui-text) !important; text-decoration: none; border-radius: var(--ui-r-sm); transition: background-color var(--ui-dur-2) var(--ui-ease); }
.l-index__link:hover { background: var(--ui-primary-50); }
.l-index__num { display: none; }
.l-index__title { font-size: var(--ui-fs-xl); font-weight: 600; }
.l-index__text { font-size: 15px; color: var(--ui-text-2); }
.l-index__go { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--ui-primary-soft); color: var(--ui-primary); }
ol[class*="l-"] > li::before, ol[class*="lh-"] > li::before { content: none !important; display: none !important; }
@media (max-width: 767.98px) {
  .l-index__link { grid-template-columns: minmax(0, 1fr) 40px; }
  .l-index__text { display: none; }
}
