/* WP3.1: opt-in user shell. Admin and page-specific components retain their styles.
   Keep the marked critical block identical to the copy in templates/critical.css. */
/* WP3 SHELL CRITICAL START */
.ls-app {
    --ls-navy: #003366;
    --ls-action: #2563eb;
    --ls-action-hover: #1d4ed8;
    --ls-text: #0f172a;
    --ls-muted: #475569;
    --ls-border: #e2e8f0;
    --ls-surface: #ffffff;
    --ls-subtle: #f8fafc;
    --ls-space-1: 4px;
    --ls-space-2: 8px;
    --ls-space-3: 12px;
    --ls-space-4: 16px;
    --ls-space-6: 24px;
    --ls-space-8: 32px;
    --ls-space-12: 48px;
    --ls-space-16: 64px;
    --ls-radius-control: 8px;
    --ls-radius-surface: 12px;
    --ls-header-height: 72px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
}
html[dir="rtl"] .ls-app { font-family: "Noto Sans Arabic", "Segoe UI", Arial, sans-serif; }
.ls-app .ls-site-nav, .ls-app .ls-site-nav *, .ls-app .ls-site-footer, .ls-app .ls-site-footer * { box-sizing: border-box; }
.ls-app .ls-site-nav {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: block;
    min-height: var(--ls-header-height);
    padding: 0;
    background: var(--ls-surface);
    border-bottom: 1px solid var(--ls-border);
    box-shadow: none;
    backdrop-filter: none;
    color: var(--ls-text);
}
.ls-app .ls-nav-frame {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ls-space-6);
    max-width: 1440px;
    min-height: var(--ls-header-height);
    margin-inline: auto;
    padding: var(--ls-space-3) var(--ls-space-6);
    direction: ltr; /* Keep the existing logo on the left in both languages. */
}
.ls-app .ls-brand { display: flex; align-items: center; min-height: 44px; flex-shrink: 0; }
.ls-app .ls-brand img { display: block; width: 92px; height: 40px; object-fit: contain; }
.ls-app .ls-nav-menu { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: var(--ls-space-4); min-width: 0; }
.ls-app .ls-nav-primary, .ls-app .ls-nav-actions { display: flex; align-items: center; gap: var(--ls-space-1); margin: 0; padding: 0; list-style: none; }
.ls-app .ls-nav-actions { gap: var(--ls-space-2); }
.ls-app .ls-nav-link, .ls-app .ls-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ls-space-2);
    min-height: 44px;
    padding: var(--ls-space-2) var(--ls-space-3);
    border: 1px solid transparent;
    border-radius: var(--ls-radius-control);
    background: transparent;
    color: var(--ls-muted);
    font: inherit;
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.5;
    text-align: start;
    text-decoration: none;
    cursor: pointer;
}
.ls-app .ls-nav-link.active { background: #eff6ff; color: var(--ls-navy); border-color: #bfdbfe; }
.ls-app .ls-nav-link:hover, .ls-app .ls-button:hover { background: var(--ls-subtle); color: var(--ls-navy); }
.ls-app .ls-button-primary { background: var(--ls-action); color: white; border-color: var(--ls-action); }
.ls-app .ls-button-primary:hover { background: var(--ls-action-hover); color: white; border-color: var(--ls-action-hover); }
.ls-app .ls-button-outline { color: var(--ls-navy); border-color: #cbd5e1; background: var(--ls-surface); }
.ls-app .ls-button:disabled { opacity: .65; cursor: wait; }
.ls-app .ls-button .fas { width: 20px; flex-shrink: 0; text-align: center; }
.ls-app .ls-menu-toggle { display: none; margin-left: auto; width: 44px; padding: 0; border-color: #cbd5e1; }
.ls-app .ls-menu-toggle-icon { width: 20px; height: 16px; border-block: 2px solid currentColor; position: relative; }
.ls-app .ls-menu-toggle-icon::after { content: ""; position: absolute; top: 5px; inset-inline: 0; border-top: 2px solid currentColor; }
.ls-app .ls-mobile-account { display: none; }
.ls-app .ls-profile { position: relative; }
.ls-app .ls-profile-name { max-width: 128px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ls-app .ls-tier { color: var(--ls-navy); background: #eff6ff; border: 1px solid #bfdbfe; padding: 2px 8px; border-radius: 8px; font-size: .75rem; }
.ls-app .ls-profile .dropdown-menu { display: none; position: absolute; }
.ls-app .ls-profile .dropdown-menu.show { display: block; }
.ls-app .ls-profile .dropdown-toggle::after { content: ""; display: inline-block; margin: 0; border: 4px solid transparent; border-bottom: 0; border-top-color: currentColor; }
.ls-app .ls-skip-link { position: fixed; top: 8px; left: 16px; z-index: 1080; transform: translateY(-160%); background: var(--ls-navy); color: white; padding: 12px 16px; border-radius: 8px; }
.ls-app .ls-skip-link:focus { transform: none; }
.ls-app .ls-site-nav :focus-visible, .ls-app .ls-site-footer :focus-visible, .ls-app .ls-skip-link:focus-visible { outline: 3px solid var(--ls-action); outline-offset: 3px; }
.ls-app #main-content { scroll-margin-top: calc(var(--ls-header-height) + 16px); }
.ls-app #main-content > .sticky-top { top: var(--ls-header-height); }
@media (max-width: 1199.98px) {
    .ls-app .ls-nav-frame { gap: 0; padding-inline: var(--ls-space-4); }
    .ls-app .ls-menu-toggle { display: inline-flex; }
    .ls-app .ls-nav-menu { flex-basis: 100%; flex-direction: column; align-items: stretch; gap: var(--ls-space-4); padding-block: var(--ls-space-3); max-height: calc(100dvh - var(--ls-header-height)); overflow-y: auto; }
    .ls-app .ls-nav-menu.collapse:not(.show) { display: none; }
    .ls-app .ls-nav-menu.collapsing { display: block; }
    .ls-app .ls-nav-primary { flex-direction: column; align-items: stretch; gap: var(--ls-space-1); }
    .ls-app .ls-nav-primary .ls-nav-link { display: flex; justify-content: flex-start; width: 100%; }
    .ls-app .ls-nav-actions { flex-wrap: wrap; padding-top: var(--ls-space-4); border-top: 1px solid var(--ls-border); }
    .ls-app .ls-desktop-account { display: none; }
    .ls-app .ls-mobile-account { display: flex; flex-wrap: wrap; width: 100%; gap: var(--ls-space-2); }
}
@media (min-width: 1200px) { .ls-app .ls-nav-menu.collapse { display: flex; } }
/* WP3 SHELL CRITICAL END */

.ls-app .ls-profile .dropdown-menu { border: 1px solid var(--ls-border); border-radius: var(--ls-radius-surface); padding: 8px; min-width: 208px; box-shadow: 0 8px 24px #0f172a14; }
.ls-app .ls-profile .dropdown-item { display: flex; align-items: center; min-height: 44px; padding: 8px 12px; border-radius: 8px; font-size: .9375rem; color: var(--ls-text); text-align: start; }
.ls-app .ls-profile .dropdown-item:hover, .ls-app .ls-profile .dropdown-item:focus { background: #eff6ff; color: var(--ls-navy); }
.ls-app .ls-logout { color: #b91c1c; }
.ls-app .ls-profile .ls-logout { color: #b91c1c; }
.ls-app .ls-language { position: relative; }
.ls-app .ls-language-hint { position: absolute; inset-block-start: calc(100% + 12px); right: 0; width: min(248px, calc(100vw - 32px)); padding: 16px 56px 16px 16px; border: 1px solid var(--ls-border); border-radius: 12px; background: white; color: var(--ls-text); font-size: .875rem; line-height: 1.5; box-shadow: 0 8px 24px #0f172a14; }
.ls-app .ls-language-hint p { margin: 0; }
.ls-app .ls-language-hint button { position: absolute; top: 0; right: 0; width: 44px; height: 44px; font: inherit; background: none; border: 0; color: var(--ls-muted); cursor: pointer; }
.ls-app .ls-site-footer { margin-top: auto; padding: 48px 24px 24px; background: var(--ls-subtle); color: var(--ls-muted); border-top: 1px solid var(--ls-border); font-size: 1rem; }
.ls-app .ls-footer-grid { display: grid; grid-template-columns: 2fr 1fr 1.4fr 1fr; gap: 32px; max-width: 1200px; margin-inline: auto; }
.ls-app .ls-footer-summary { max-width: 34ch; margin: 0 0 16px; line-height: 1.75; }
.ls-app .ls-site-footer h2 { margin: 0 0 12px; color: var(--ls-navy); font-size: 1rem; font-weight: 700; line-height: 1.5; }
.ls-app .ls-site-footer ul { padding: 0; margin: 0; list-style: none; }
.ls-app .ls-site-footer a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 8px; color: var(--ls-muted); text-decoration: none; overflow-wrap: anywhere; }
.ls-app .ls-site-footer a:hover { color: var(--ls-navy); text-decoration: underline; text-underline-offset: 4px; }
.ls-app .ls-footer-bottom { max-width: 1200px; margin: 32px auto 0; padding-top: 24px; border-top: 1px solid var(--ls-border); font-size: .875rem; }
.ls-app .ls-footer-bottom p { margin: 0; }
@media (max-width: 991.98px) { .ls-app .ls-footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; } }
@media (max-width: 575.98px) {
    .ls-app .ls-site-footer { padding: 32px 16px 24px; }
    .ls-app .ls-footer-grid { grid-template-columns: 1fr; }
    .ls-app .ls-language-hint { position: relative; top: auto; right: auto; margin-top: 8px; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
    .ls-app .ls-site-nav *, .ls-app .ls-site-footer * { transition: none; animation: none; scroll-behavior: auto; }
}
