/* erisilebilirlik.css (H479/H480): keyboard focus and AA contrast fixes for the new page families
   (araclar ToolsMore, rehber, sozluk, karsilastirma, kimler-icin, ozellikler, sehir, tam-eslesme).
   Loaded AFTER icerik-sayfa.css; only flag-gated views link it, so no live page changes without a flag.
   Brand colours (turquoise button / CTA gradient) are NOT touched here: decision CS-51. */

/* Focus ring: brand primary #064A97 = 8.6:1 on white, 8.2:1 on #f5f9ff (the old accent #1bb5cc ring was 2.5:1, below 3:1). */
.pcrm-page a:focus-visible,
.pcrm-page button:focus-visible,
.pcrm-page summary:focus-visible,
.pcrm-page [tabindex]:focus-visible {
    outline: 3px solid var(--pcrm-primary);
    outline-offset: 3px;
}
.pcrm-page .pcrm-copy-btn:focus-visible { outline: 3px solid var(--pcrm-primary); outline-offset: 2px; }
.pcrm-page .pcrm-field input:focus-visible,
.pcrm-page .pcrm-field select:focus-visible { outline: 3px solid var(--pcrm-primary); outline-offset: 1px; border-color: var(--pcrm-primary); }
.pcrm-page .pcrm-card-link:focus-visible { outline: 3px solid var(--pcrm-primary); outline-offset: 3px; }

/* Accordion buttons sit inside an overflow:hidden card: an outside ring would be clipped, so the ring is drawn inside. */
.pcrm-page .pcrm-faq-q:focus-visible { outline: 3px solid var(--pcrm-primary); outline-offset: -3px; border-radius: 12px; }

/* Dark surfaces (hero, quote, CTA gradient): white ring with a dark inner ring so it reads on every point of the gradient. */
.pcrm-page .pcrm-hero a:focus-visible,
.pcrm-page .pcrm-hero button:focus-visible,
.pcrm-page .pcrm-quote-section a:focus-visible,
.pcrm-page .pcrm-cta a:focus-visible,
.pcrm-page .pcrm-cta button:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
    box-shadow: 0 0 0 3px var(--pcrm-dark);
}
.pcrm-page .pcrm-video-btn:focus-visible { outline: 3px solid #fff; outline-offset: -6px; box-shadow: inset 0 0 0 3px var(--pcrm-dark); }

/* A focused control must not hide under the fixed site header (WCAG 2.4.11). */
.pcrm-page a, .pcrm-page button, .pcrm-page input, .pcrm-page select { scroll-margin-top: 120px; }

/* Collapsed answers must not be reachable by Tab or read by screen readers (ozellik-alt.css does this for the feature pages only). */
.pcrm-page .pcrm-faq-item:not(.open) .pcrm-faq-a { visibility: hidden; }

/* Link hover: accent #1bb5cc on white is 2.5:1; the darker brand navy keeps the hover cue at 17:1. */
.pcrm-prose a:hover,
.pcrm-press-links a:hover { color: var(--pcrm-dark); }

/* Form field boundary: #cfdcec on white is 1.4:1; #6b7f99 is 4.1:1 (WCAG 1.4.11 asks 3:1). */
.pcrm-page .pcrm-field input[type=text],
.pcrm-page .pcrm-field select { border-color: #6b7f99; }

@media (forced-colors: active) {
    .pcrm-page a:focus-visible, .pcrm-page button:focus-visible { outline-color: Highlight; }
}

/* H511 (from H478 mobile scan): body/label/input text >= 16px and touch targets >= 44px on phones and small tablets.
   Scoped to .pcrm-page and kept in this flag-gated file, so the unflagged H123 tools (icerik-sayfa.css only) do not change.
   16px on inputs also stops the iOS Safari focus zoom. Shared header/footer/cookie/contact icons are NOT touched here. */
@media (max-width: 768px) {
    /* Tool pages: form */
    .pcrm-page .pcrm-field label { display: flex; align-items: center; min-height: 44px; font-size: 16px; margin-bottom: 0; }
    .pcrm-page .pcrm-field input[type=text],
    .pcrm-page .pcrm-field select { min-height: 44px; font-size: 16px; }
    .pcrm-page .pcrm-field small { font-size: 16px; }
    .pcrm-page .pcrm-intro-lead { font-size: 16px; }
    .pcrm-page .pcrm-calc-warn { font-size: 16px; }
    .pcrm-page .pcrm-calc-note { font-size: 16px; }
    .pcrm-page .pcrm-result-main span { font-size: 16px; }
    .pcrm-page .pcrm-result-list li { font-size: 16px; }
    .pcrm-page .pcrm-copy-btn { min-height: 44px; min-width: 44px; font-size: 16px; }
    .pcrm-page .pcrm-copy-status { font-size: 16px; }

    /* Text tables (comparison, profile and feature lists) */
    .pcrm-page .pcrm-table--text th,
    .pcrm-page .pcrm-table--text td,
    .pcrm-page .pcrm-table--text td:first-child { font-size: 16px; }
    .pcrm-page .pcrm-table--text td:not(:first-child)::before { font-size: 16px; }
    .pcrm-page .kar-table caption,
    .pcrm-page .kar-table th[scope="row"] { font-size: 16px; }
    .pcrm-page .kar-pair-table td .kar-src,
    .pcrm-page .kar-note { font-size: 16px; }
    .pcrm-page .pcrm-table--text td a { overflow-wrap: anywhere; }
}

/* Scrollable table wrappers are focusable (tabindex=0, role=region, aria-label in the views): the ring is drawn inside so the overflow clip does not hide it. */
.pcrm-page .pcrm-table-wrap[tabindex]:focus-visible { outline: 3px solid var(--pcrm-primary); outline-offset: -3px; }