/* =========================================================================
   AFRIKAANS TINTING for the admin resort-edit page.

   Ported from docs/ui-redesign/admin/resort-edit.html so the live editor
   subtly tints cream/yellow when the user is editing Afrikaans content,
   matching the prototype's "you can see at a glance which language
   you're in" affordance.

   These rules live in a global stylesheet (not component-scoped) because
   `body[data-lang="af"]` references an ancestor that's outside the
   ResortEdit component's b-xxxx scope. The rules are scoped to the
   .re-page container so they only apply on the resort-edit screen and
   don't leak to other admin pages that may also set data-lang.

   The body[data-lang] attribute is toggled by ResortEdit's SetLang().
   ========================================================================= */

/* Overall body / page background. Cream tint when editing AF. */
body[data-lang="af"] .re-page { background: #fff7e0; }

/* Section / panel backgrounds inside the editor. */
body[data-lang="af"] .re-page .editor,
body[data-lang="af"] .re-page .rte,
body[data-lang="af"] .re-page .rte__body,
body[data-lang="af"] .re-page .highlight-row,
body[data-lang="af"] .re-page .gallery-card,
body[data-lang="af"] .re-page .crud-list,
body[data-lang="af"] .re-page .crud-row,
body[data-lang="af"] .re-page .pdf-slot,
body[data-lang="af"] .re-page .booking-link-grid,
body[data-lang="af"] .re-page .hex-trio__input-wrap {
    background: #fffdf2;
}

/* Form inputs inside the editor. Slightly warmer cream so they still
   look like editable fields against the pale-cream surface. */
body[data-lang="af"] .re-page .field-block input,
body[data-lang="af"] .re-page .field-block textarea,
body[data-lang="af"] .re-page .field-block select,
body[data-lang="af"] .re-page .form-grid input,
body[data-lang="af"] .re-page .form-grid textarea,
body[data-lang="af"] .re-page .form-grid select {
    background: #fffbe9;
}

/* Footer save-bar and image drop zones get a more saturated cream so
   the affordance is unmistakable when uploading or saving. (.footer-bar is
   the design-mock name; the live page's save bar is .re-save-bar.) */
body[data-lang="af"] .re-page .footer-bar,
body[data-lang="af"] .re-page .re-save-bar,
body[data-lang="af"] .re-page .image-drop {
    background: #fef3c7;
}

/* AF active tab in the EN/AF toggle: amber instead of blue so the
   active state matches the cream theme. */
body[data-lang="af"] .lang-toggle button.active.af,
body[data-lang="af"] .lang-toggle button[data-lang="af"].active {
    background: #b45309;
    color: #fff;
}