/* =============================================================================
   LI-NK — chrome public: bara de sus, meniurile (desktop + mobil) și subsolul.
   Încărcat de functions.php (SHEETS) după tokens/base/components. Marcaj: partials/main_menu.php și partials/footer.php.
   Doar tokeni `--ln-*` (excepție: #fff pe nodul comutatorului, ca în machetă). Clase `ln-*` — nu există în style.css, deci fără conflict.
   ATENȚIE la cascadă: CSS-ul nostru e nestratificat și BATE utilitarele Tailwind (@layer). `.hidden` (comutat de app.js pe #mobile-nav,
   panourile mobile, panoul contului) nu trebuie contrazis: pe elementele comutate cu `.hidden` NU setăm `display` în regula de bază.
   Breakpoint: 1024px (sub el = bara mobilă cu meniul din #mobile-nav).
   ============================================================================= */

/* Comutatorul de schemă: ascuns când schema e fixată din admin (<html data-theme-scheme> ≠ default); app.js nu comută atunci */
html:not([data-theme-scheme="default"]) [data-ln-scheme-only] { display: none !important; }

/* ---------- bara de sus ---------- */
.ln-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--ln-header-bg);
  border-bottom: 1px solid var(--ln-border);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  font-family: var(--ln-font); color: var(--ln-text);
}
.ln-header *, .ln-header *::before, .ln-header *::after,
.ln-footer *, .ln-footer *::before, .ln-footer *::after { box-sizing: border-box; }
.ln-header a, .ln-footer a { text-decoration: none; }
.ln-header__bar {
  max-width: var(--ln-content); margin: 0 auto; padding: 0 16px; min-height: 64px;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.ln-header__bar--full { max-width: none; }
.ln-logo { display: flex; align-items: center; flex: none; color: inherit; }
.ln-logo__img { height: 30px; width: auto; display: block; }
.ln-logo__img--svg { height: 22px; }
.ln-logo--on-dark { display: none; }
.ln-logo--filter { filter: var(--ln-logo-filter); }
html.dark .ln-logo--on-light { display: none; }
html.dark .ln-logo--on-dark { display: block; }
/* logo subsol: aceeași comutare, cu specificitate peste `.ln-footer__logo { display: block }` */
.ln-footer__logo.ln-logo--on-dark { display: none; }
html.dark .ln-footer__logo.ln-logo--on-light { display: none; }
html.dark .ln-footer__logo.ln-logo--on-dark { display: block; }

.ln-svg, .ln-chev { flex: none; display: block; }
.ln-chev { rotate: 0deg; transition: rotate .2s ease; }
.ln-dd.is-open > button .ln-chev,
[aria-expanded="true"] > .ln-chev,
[aria-expanded="true"] > [data-mobile-products-chevron] .ln-chev,
[aria-expanded="true"] > [data-mobile-resources-chevron] .ln-chev { rotate: 180deg; }

/* focus vizibil, peste tot în chrome */
.ln-header :is(a, button, input):focus-visible,
.ln-footer :is(a, button):focus-visible { outline: 2px solid var(--ln-primary-ring); outline-offset: 2px; }
.ln-header input:focus-visible { outline: none; }

/* navigația principală (desktop) */
.ln-nav { display: none; align-items: center; gap: 4px; position: relative; }
.ln-navlink {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
  border: 0; border-radius: var(--ln-r-pill); background: transparent; cursor: pointer;
  font: 500 14px/20px var(--ln-font); color: var(--ln-text-2); white-space: nowrap;
  transition: background-color .15s, color .15s;
}
.ln-navlink:hover, .ln-dd.is-open > .ln-navlink { background: var(--ln-primary-soft); color: var(--ln-primary-alt); }
.ln-navlink--strong { font-weight: 600; padding: 0 16px; color: var(--ln-text); }

/* dropdown-uri (desktop + selectoare de limbă) */
.ln-dd { position: relative; }
.ln-dd--static { position: static; }
.ln-dd__panel {
  position: absolute; top: 100%; z-index: 60; padding-top: 16px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(6px);
  transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
}
.ln-dd.is-open > .ln-dd__panel { opacity: 1; visibility: visible; pointer-events: auto; transform: none; transition-delay: 0s; }
.ln-dd__panel--platform { left: 50%; margin-left: -340px; width: 680px; }
.ln-dd__panel--resources { left: 50%; margin-left: -160px; width: 320px; }
.ln-dd__panel--lang { right: 0; min-width: 200px; }
.ln-dd--up > .ln-dd__panel { top: auto; bottom: 100%; padding: 0 0 12px; transform: translateY(-6px); }
.ln-dd--up.is-open > .ln-dd__panel { transform: none; }
.ln-dd__card {
  background: var(--ln-card); border: 1px solid var(--ln-border); border-radius: var(--ln-r-xl);
  box-shadow: var(--ln-shadow-3); padding: 10px;
}
.ln-dd__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.ln-dd__panel--resources .ln-dd__card { border-radius: 20px; padding: 8px; }
.ln-dd__card--list { border-radius: var(--ln-r-lg); padding: 6px; max-height: 288px; overflow-y: auto; }

.ln-item {
  display: flex; gap: 14px; align-items: flex-start; padding: 14px; border-radius: var(--ln-r-lg);
  color: inherit; transition: background-color .15s;
}
.ln-item:hover, .ln-item:focus-visible { background: var(--ln-primary-soft); color: inherit; }
.ln-item__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ln-item__title { font: 600 14px/20px var(--ln-font); color: var(--ln-heading); }
.ln-item__desc { font: 400 13px/18px var(--ln-font); color: var(--ln-text-2); }
.ln-item--row { align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; border-radius: 10px; min-height: 40px; }
.ln-item--row .ln-item__title { font-weight: 500; color: var(--ln-text); }
.ln-item--row.is-current { background: var(--ln-primary-soft); }
.ln-item--row.is-current .ln-item__title { font-weight: 600; color: var(--ln-heading); }
.ln-item__code { display: inline-flex; align-items: center; gap: 8px; font: 600 11px/16px var(--ln-font); letter-spacing: .06em; color: var(--ln-text-3); }
.ln-item__code .ln-svg { color: var(--ln-primary-alt); }

/* iconițe de produs */
.ln-ico {
  display: flex; flex: none; width: 40px; height: 40px; border-radius: var(--ln-r-md);
  align-items: center; justify-content: center;
}
.ln-ico--sm { width: 28px; height: 28px; border-radius: var(--ln-r-sm); }
.ln-ico--link, .ln-ico--code { background: var(--ln-primary-soft); color: var(--ln-primary); }
.ln-ico--bio { background: var(--ln-accent-soft); color: var(--ln-accent); }
.ln-ico--qr { background: var(--ln-warning-soft); color: var(--ln-warning); }
.ln-ico--ai { background: var(--ln-success-soft); color: var(--ln-success); }
.ln-ico--neutral { background: var(--ln-bg-2); color: var(--ln-primary-alt); border: 1px solid var(--ln-border); }

/* acțiuni din dreapta */
.ln-actions { display: flex; align-items: center; gap: 4px; }
.ln-iconbtn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 12px;
  border: 0; border-radius: var(--ln-r-pill); background: transparent; cursor: pointer;
  font: 600 13px/18px var(--ln-font); color: var(--ln-text-2);
  transition: background-color .15s, color .15s;
}
.ln-iconbtn:hover, .ln-dd.is-open > .ln-iconbtn { background: var(--ln-primary-soft); color: var(--ln-primary-alt); }
.ln-iconbtn--round { width: 44px; height: 44px; padding: 0; }
.ln-burger { color: var(--ln-text); }
.ln-theme-btn [data-icon-light], .ln-theme-btn [data-icon-dark] { display: inline-flex; }
html.dark .ln-theme-btn [data-icon-light], html:not(.dark) .ln-theme-btn [data-icon-dark] { display: none; }
.ln-burger [data-icon-open], .ln-burger [data-icon-close] { display: inline-flex; }
.ln-burger .hidden { display: none; }

.ln-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 22px;
  border-radius: var(--ln-r-pill); border: 2px solid transparent; cursor: pointer; white-space: nowrap;
  font: 600 14px/20px var(--ln-font); transition: background-color .15s, color .15s, filter .15s, border-color .15s;
}
.ln-btn--primary { background: var(--ln-primary); color: var(--ln-primary-fg); box-shadow: var(--ln-shadow-1); }
.ln-btn--primary:hover { filter: brightness(.93); color: var(--ln-primary-fg); }
.ln-btn--outline { border-color: var(--ln-primary); color: var(--ln-primary-alt); background: transparent; min-height: 40px; padding: 0 18px; }
.ln-btn--outline:hover { background: var(--ln-primary-soft); }
.ln-btn--neutral { border-color: var(--ln-border-strong); color: var(--ln-text); background: transparent; }
.ln-btn--neutral:hover { background: var(--ln-bg-2); }
.ln-btn--block { width: 100%; min-height: 52px; font-size: 16px; }
.ln-btn--cta { min-height: 40px; padding: 0 16px; font-size: 13px; }

/* meniul contului (logat) */
.ln-acc { position: relative; }
.ln-acc__trigger {
  display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; overflow: hidden;
  border: 2px solid var(--ln-border-strong); border-radius: var(--ln-r-pill); background: var(--ln-bg-2); cursor: pointer;
  transition: border-color .15s;
}
.ln-acc__trigger:hover, .ln-acc__trigger[aria-expanded="true"] { border-color: var(--ln-primary); }
.ln-acc__trigger img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.ln-acc__panel {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; width: 288px; max-width: calc(100vw - 32px);
  background: var(--ln-card); border: 1px solid var(--ln-border); border-radius: var(--ln-r-lg);
  box-shadow: var(--ln-shadow-3); padding: 6px;
}
.ln-acc__item {
  display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 12px; border-radius: 10px;
  font: 500 14px/20px var(--ln-font); color: var(--ln-text); cursor: pointer;
}
.ln-acc__item:hover, .ln-acc__item:focus-visible { background: var(--ln-primary-soft); color: var(--ln-text); }
.ln-acc__item .ln-svg { opacity: .65; }
.ln-acc__item--switch { justify-content: space-between; }
.ln-acc__label { display: flex; align-items: center; gap: 10px; }
.ln-acc__item--danger, .ln-acc__item--danger:hover { color: var(--ln-danger); }
.ln-acc__sep { height: 1px; background: var(--ln-border); margin: 4px 6px; }

/* comutator (44×26) */
.ln-switch { position: relative; display: inline-flex; flex: none; width: 44px; height: 26px; }
.ln-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; z-index: 1; }
.ln-switch__track {
  position: absolute; inset: 0; border-radius: var(--ln-r-pill); background: var(--ln-border-strong); transition: background-color .2s;
}
.ln-switch__track::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: var(--ln-r-pill);
  background: #fff; /* nodul comutatorului: alb în ambele scheme (machetă) */ box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .2s;
}
html.dark .ln-switch__track, .ln-switch input:checked + .ln-switch__track { background: var(--ln-primary); }
html.dark .ln-switch__track::after, .ln-switch input:checked + .ln-switch__track::after { transform: translateX(18px); }
.ln-switch input:focus-visible + .ln-switch__track { outline: 2px solid var(--ln-primary-ring); outline-offset: 2px; }

/* ---------- meniul mobil ---------- */
/* #mobile-nav e comutat cu `.hidden` de app.js: nu setăm `display` aici (doar sub 1024px, vezi mai jos) */
.ln-mobile {
  position: absolute; left: 0; right: 0; top: 100%; height: calc(100vh - 65px); height: calc(100dvh - 65px);
  overflow-y: auto; background: var(--ln-bg); border-top: 1px solid var(--ln-border);
}
.ln-mobile__inner { padding: 12px 12px 32px; display: flex; flex-direction: column; gap: 2px; }
.ln-mrow {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; padding: 0 12px;
  border: 0; border-radius: var(--ln-r-md); background: transparent; cursor: pointer; text-align: left;
  font: 600 16px/24px var(--ln-font); color: var(--ln-heading); transition: background-color .15s;
}
a.ln-mrow:hover, button.ln-mrow:hover { background: var(--ln-primary-soft); color: var(--ln-heading); }
.ln-mrow--static { cursor: default; font-size: 15px; font-weight: 400; color: var(--ln-text-2); }
.ln-mrow--switch { cursor: pointer; }
.ln-mobile__inner > a.ln-mrow:not(.ln-mrow--group) { margin-top: 0; }
.ln-msub { padding-bottom: 4px; }
.ln-msub__link {
  display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px 0 24px; border-radius: var(--ln-r-md);
  font: 400 15px/22px var(--ln-font); color: var(--ln-text-2); transition: background-color .15s;
}
.ln-msub__link:hover { background: var(--ln-primary-soft); color: var(--ln-primary-alt); }
.ln-mobile__sep { height: 1px; background: var(--ln-border); margin: 12px; }
.ln-segment { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 3px; background: var(--ln-bg-2); border: 1px solid var(--ln-border); border-radius: var(--ln-r-pill); }
.ln-segment__opt { padding: 4px 12px; border-radius: var(--ln-r-pill); font: 500 13px/18px var(--ln-font); color: var(--ln-text-3); }
.ln-segment__opt.is-current { background: var(--ln-card); box-shadow: var(--ln-shadow-1); font-weight: 600; color: var(--ln-heading); }
.ln-mobile__cta { display: flex; flex-direction: column; gap: 10px; padding: 16px 12px 0; }

/* ---------- desktop (≥1024px) ---------- */
@media (min-width: 1024px) {
  .ln-header__bar { padding: 0 32px; min-height: 80px; gap: 24px; }
  .ln-logo__img { height: 36px; }
  .ln-logo__img--svg { height: 26px; }
  .ln-nav { display: flex; }
  .ln-actions { gap: 8px; }
  .ln-iconbtn--round { width: 40px; height: 40px; }
  .ln-burger { display: none; }
  .ln-btn--cta { min-height: 44px; padding: 0 22px; font-size: 14px; }
  .ln-mobile { display: none !important; }
}
/* ---------- sub 1024px ---------- */
@media (max-width: 1023.98px) {
  .ln-only-desktop { display: none !important; }
  /* cât timp meniul mobil e deschis: doar logo + închidere (ca în machetă) */
  .ln-header:has(#menu-toggle[aria-expanded="true"]) .ln-actions > :not(.ln-burger) { display: none; }
  html:has(#menu-toggle[aria-expanded="true"]) { overflow: hidden; }
  .ln-mobile:not(.hidden) { display: block; }
}
@media (max-width: 359.98px) {
  .ln-header__bar { padding: 0 12px; gap: 4px; }
  .ln-logo__img--svg { height: 20px; }
  .ln-iconbtn--round { width: 40px; height: 40px; }
  .ln-btn--cta { padding: 0 12px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .ln-dd__panel, .ln-chev, .ln-switch__track, .ln-switch__track::after { transition: none; }
}

/* ---------- subsol ---------- */
.ln-footer { border-top: 1px solid var(--ln-border); background: var(--ln-bg); font-family: var(--ln-font); color: var(--ln-text-2); }
.ln-footer__inner { max-width: var(--ln-content); margin: 0 auto; padding: 0 20px; }
.ln-footer__grid { padding-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
.ln-footer__brand { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.ln-footer__logolink { display: inline-flex; color: inherit; }
.ln-footer__logo { height: 30px; width: auto; display: block; }
.ln-footer__logo--svg { height: 52px; }
.ln-footer__tagline { display: none; margin: 0; max-width: 300px; font: 400 14px/21px var(--ln-font); color: var(--ln-text-3); }
.ln-footer__product { display: none; align-items: center; gap: 8px; font: 400 13px/18px var(--ln-font); color: var(--ln-text-3); transition: color .15s; }
.ln-footer__product:hover { color: var(--ln-text); }
.ln-footer__product img { height: 22px; width: auto; display: block; }
.ln-footer__social { display: flex; align-items: center; gap: 16px; color: var(--ln-text-3); }
.ln-footer__social a { display: inline-flex; color: inherit; transition: color .15s; }
.ln-footer__social a:hover { color: var(--ln-primary-alt); }
.ln-footer__col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ln-footer__title { margin: 0; font: 600 12px/16px var(--ln-font); letter-spacing: .1em; text-transform: uppercase; color: var(--ln-text-3); }
.ln-footer__col ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.ln-footer__col a { display: block; font: 400 14px/20px var(--ln-font); color: var(--ln-text-2); transition: color .15s; overflow-wrap: anywhere; }
.ln-footer__col a:hover { color: var(--ln-primary-alt); }
.ln-footer__bottom {
  margin: 28px 0 0; padding: 20px 0 28px; border-top: 1px solid var(--ln-border);
  display: flex; flex-direction: column-reverse; gap: 12px; font: 400 12px/18px var(--ln-font); color: var(--ln-text-3);
}
.ln-footer__copy { margin: 0; }
.ln-footer__copy a { color: var(--ln-text-3); text-decoration: underline; }
.ln-footer__tools { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-direction: row-reverse; }
.ln-footer__cookie { font: 400 13px/18px var(--ln-font); color: var(--ln-text-3); transition: color .15s; }
.ln-footer__cookie:hover { color: var(--ln-text); }
.ln-langpill {
  display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px; cursor: pointer;
  border: 1px solid var(--ln-border); border-radius: var(--ln-r-pill); background: transparent;
  font: 600 13px/18px var(--ln-font); color: var(--ln-text-2); transition: background-color .15s, color .15s;
}
.ln-langpill:hover, .ln-dd.is-open > .ln-langpill { background: var(--ln-primary-soft); color: var(--ln-primary-alt); }
@media (max-width: 639.98px) { .ln-langpill .ln-svg { display: none; } }
.ln-footer .ln-dd--right > .ln-dd__panel { right: 0; left: auto; margin-left: 0; }
.ln-footer .ln-dd__panel--lang { min-width: 200px; }

@media (min-width: 640px) {
  .ln-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
  .ln-footer__tagline { display: block; }
  .ln-footer__product { display: flex; }
}
@media (min-width: 1024px) {
  .ln-footer__inner { padding: 0 32px; }
  .ln-footer__grid { padding-top: 56px; grid-template-columns: 1.6fr repeat(4, minmax(0, 1fr)); gap: 40px; }
  .ln-footer__brand { grid-column: auto; }
  .ln-footer__logo { height: 32px; }
  .ln-footer__logo--svg { height: 64px; }
  .ln-footer__col { gap: 14px; }
  .ln-footer__bottom {
    margin: 48px -32px 0; padding: 32px; flex-direction: row; align-items: center; justify-content: space-between; font-size: 13px; line-height: 18px;
  }
  .ln-footer__tools { flex-direction: row; justify-content: flex-end; }
}
