/* ============================================================================
   Informational pages — حول, المصادر والحقوق, طلب الإزالة, الخصوصية
   plus the site-wide footer that links them.

   These are long-form prose, so the measure is narrower than the app pages
   and the line-height is the Arabic reading value rather than the UI value.
   ============================================================================ */

.static-page {
    max-width: 760px;
    margin: 0 auto;
    padding: 32px 20px 72px;
}

.static-page__body {
    color: var(--color-text-primary);
    line-height: var(--line-height-arabic);
    font-size: var(--font-size-md);
}

.static-page__body h1 {
    color: var(--color-primary);
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-tight);
    margin: 0 0 24px;
}

.static-page__body h2 {
    color: var(--color-primary-light);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-tight);
    margin: 36px 0 12px;
}

.static-page__body p {
    margin: 0 0 18px;
}

.static-page__body a {
    color: var(--color-text-link);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.static-page__body a:hover {
    color: var(--color-text-link-hover);
    border-bottom-color: currentColor;
}

.static-page__body strong {
    color: var(--color-text-primary);
    font-weight: 600;
}

/* ---- lists ---- */

.static-page__list {
    margin: 0 0 18px;
    padding-inline-start: 24px;
}

.static-page__list li {
    margin-bottom: 10px;
}

/* ---- sources table ---- */

.static-page__table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 20px;
    font-size: var(--font-size-base);
}

.static-page__table th,
.static-page__table td {
    padding: 10px 12px;
    text-align: start;
    border-bottom: 1px solid var(--color-border-subtle);
}

.static-page__table th {
    color: var(--color-text-secondary);
    font-weight: 600;
    font-size: var(--font-size-sm);
    border-bottom-color: var(--color-border-primary);
}

.static-page__table tbody tr:last-child td {
    border-bottom: none;
}

/* Latin transliteration sits under the Arabic name, quieter than it. */
.static-page__translit {
    display: block;
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
    line-height: 1.4;
    margin-top: 2px;
}

/* ---- callout: the epistemic caution and the takedown pledge ---- */

.static-page__callout {
    margin: 24px 0;
    padding: 16px 18px;
    background: var(--color-surface-elevated);
    border-inline-start: 3px solid var(--color-primary);
    border-radius: var(--radius-md);
}

.static-page__callout p:last-child {
    margin-bottom: 0;
}

.static-page__contact {
    font-size: var(--font-size-lg);
}

/* ---- the English half ---- */

.static-page__rule {
    margin: 48px 0 36px;
    border: none;
    border-top: 1px solid var(--color-border-subtle);
}

.static-page__en-heading {
    /* dir="ltr" on the element handles direction; this just restores the
       left alignment that the RTL page context would otherwise impose. */
    text-align: left;
}

.static-page__en {
    text-align: left;
    line-height: var(--line-height-relaxed);
    color: var(--color-text-secondary);
    font-size: var(--font-size-base);
}

.static-page__en strong {
    color: var(--color-text-primary);
}

/* ============================================================================
   «عن الموقع» dropdown in the header

   Replaces the site-wide footer bar that used to carry these links. Same
   reachability from every route, none of the permanent vertical space.
   ============================================================================ */

.nav-info-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.nav-info-trigger {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.nav-info-caret {
    font-size: 0.7em;
    line-height: 1;
    transition: transform 0.15s ease;
}

.nav-info-trigger.open .nav-info-caret {
    transform: rotate(180deg);
}

/* Transparent full-screen catcher: one click anywhere dismisses the menu.
   Sits below the dropdown but above everything else, so the first click
   outside closes rather than activating whatever is underneath. */
.nav-info-backdrop {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-nav) + 1);
    background: transparent;
}

.nav-info-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    /* Anchored to the menu's start edge, which flips correctly under RTL. */
    inset-inline-start: 0;
    min-width: 190px;
    z-index: calc(var(--z-nav) + 2);
    padding: 6px;
    background: var(--color-surface-elevated);
    border: 1px solid var(--color-border-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.35));
}

.nav-info-item {
    display: block;
    padding: 9px 12px;
    border-radius: var(--radius-md);
    color: var(--color-text-primary);
    font-size: var(--font-size-sm);
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.12s ease, color 0.12s ease;
}

.nav-info-item:hover,
.nav-info-item:focus-visible {
    background: var(--color-surface-secondary);
    color: var(--color-text-link-hover);
    outline: none;
}