/* Plan §11.7E — WCAG 2.1 AA accessibility primitives.
   Skip-link, focus-visible defaults, reduced-motion, print stylesheet,
   wizard-step + pill helpers used by the wizard markup. */

/* Skip-to-content link — visually hidden until keyboard focused. */
.cp-skip-link {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    background: var(--brand-accent, #0e2a4a);
    color: #fff;
    padding: .5rem 1rem;
    z-index: 9999;
    text-decoration: none;
}
.cp-skip-link:focus {
    left: .5rem;
    top: .5rem;
    width: auto;
    height: auto;
    border-radius: 6px;
}

/* Visible keyboard focus across all interactive elements. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[role="radio"]:focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 2px;
    box-shadow: 0 0 0 1px #0e2a4a;
}

/* Wizard chrome bits referenced by Repairs/New.cshtml. */
.cp-step {
    padding: .35rem .75rem;
    border-radius: 999px;
    background: var(--brand-subtle, #eef2f7);
    color: var(--brand-text-muted, #5a6a7a);
    font-size: .8rem;
    font-weight: 600;
    border: 1px solid transparent;
}
.cp-step.active {
    background: var(--brand-accent, #0e2a4a);
    color: #fff;
    border-color: var(--brand-accent, #0e2a4a);
}
.cp-pill {
    display: inline-block;
    padding: .15rem .5rem;
    background: var(--brand-subtle, #eef2f7);
    border-radius: 999px;
    font-size: .75rem;
    margin: 0 .15rem;
}

/* Form-control basics for the wizard (the existing site CSS only has card
   rules — wizard inputs need their own baseline). */
.cp-input {
    display: block;
    width: 100%;
    padding: .55rem .75rem;
    border: 1px solid var(--brand-border, #cfd6e0);
    border-radius: 6px;
    font: inherit;
    background: #fff;
    color: var(--brand-text, #222);
}
.cp-input:focus-visible {
    border-color: var(--brand-accent, #0e2a4a);
}
.cp-label {
    display: block;
    font-size: .85rem;
    font-weight: 600;
    margin: .25rem 0 .25rem 0;
    color: var(--brand-text, #222);
}
.cp-btn-block { width: 100%; }

/* Reduce motion when the user has asked the OS to. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
}

/* Print stylesheet — strip nav/header/footer so a tenant printing a rent
   statement or repair detail gets a clean page. */
@media print {
    .cp-header, .cp-nav, .cp-footer, .cp-skip-link, .cp-quick-actions { display: none !important; }
    .cp-main { padding: 0 !important; }
    a[href]::after { content: " (" attr(href) ")"; font-size: 0.85em; color: #555; }
    .cp-card { break-inside: avoid; box-shadow: none; border: 1px solid #ccc; }
}

/* High-contrast preference (Windows / browser high-contrast modes). */
@media (forced-colors: active) {
    .cp-card, .cp-btn, .cp-input { border: 1px solid CanvasText; }
}
