/* ============================================================
   FloreData — dev requirements baseline
   Enforces the targets from FloreData-DEV_TECH_REQUIREMENTS-v3
   that aren't automatic in WP / GeneratePress:

   - touch targets ≥ 48×48
   - responsive tables (post content + block tables)
   - no horizontal page scroll
   - mobile body ≥ 16px (avoids iOS form-field auto-zoom)
   - lazy-image background reservation (CLS belt-and-braces)
   - accessible focus rings
   ============================================================ */

/* Guard the page against any rogue child element causing horizontal scroll. */
html,
body {
    overflow-x: clip;
    max-width: 100%;
}

/* --------- Touch targets (WCAG 2.5.5 + dev-req 48×48) --------- */
.fd-tap,
.wp-block-button .wp-block-button__link,
.wp-block-navigation a,
.wp-block-search__button,
button:not(.fd-no-min),
input[type="button"],
input[type="submit"],
input[type="reset"] {
    min-height: 48px;
    min-width: 48px;
}

/* --------- Responsive tables --------- */
/* Wrapper added by the `the_content` filter for post-content tables. */
.fd-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 1.25rem 0;
}
.fd-table-scroll table {
    min-width: 100%;
}

/* Block-level <figure class="wp-block-table"> equivalent. */
figure.wp-block-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* --------- Mobile typography minimum (≥ 16px body) --------- */
@media (max-width: 768px) {
    body,
    p,
    li,
    .wp-block-post-content {
        font-size: max(16px, 1rem);
    }
    table {
        font-size: 14px;
    }
    th,
    td {
        padding: 8px;
    }
}

/* --------- Lazy-image space reservation (CLS) ---------
   Layout shift is prevented by each image's width/height attributes +
   aspect-ratio, so NO visible placeholder colour is needed. The previous
   cream (#E7E3DA) plate made still-loading or transparent images (logo on the
   dark footer, icon PNGs) read as broken "cream boxes" — especially in
   screenshots / on slow connections. Keep the reservation transparent. */
img[loading="lazy"] {
    background-color: transparent;
}

/* --------- Accessible focus ring everywhere --------- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--wp--preset--color--accent, #0F7A57);
    outline-offset: 2px;
    border-radius: 4px;
}

/* --------- Reduced motion respect --------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}