/* ==========================================================================
   Nelson's Car Hire — Global base layer
   Low-risk, additive defaults applied site-wide. Loaded AFTER tokens.css and
   BEFORE each page's stylesheet, so page CSS keeps the final say on layout.
   Scope: typography smoothing, links, focus-visible, form-input baseline.
   ========================================================================== */

/* --- Rendering ---------------------------------------------------------- */
html {
    -webkit-text-size-adjust: 100%;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* --- Accessible focus --------------------------------------------------- */
/* Restore a visible, on-brand focus ring for keyboard users everywhere.
   Mouse users are unaffected (:focus-visible only). */
*:focus-visible,
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: var(--focus-outline);
    outline-offset: 2px;
    border-radius: var(--r-xs);
}

/* Don't show the ring for pointer interactions that some browsers still
   report as :focus on buttons. */
:focus:not(:focus-visible) {
    outline: none;
}

/* --- Links -------------------------------------------------------------- */
a {
    transition: color var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

/* --- Tap targets -------------------------------------------------------- */
/* Ensure interactive controls meet the 44px guideline on touch without
   forcing a fixed height (min only, so existing layouts can grow). */
button,
[type="button"],
[type="submit"],
a[role="button"] {
    min-height: 44px;
    cursor: pointer;
}

/* --- Form-control baseline --------------------------------------------- */
/* Native inputs/selects/textareas currently fall back to browser defaults.
   Give them one consistent, modern resting + focus + validation state.
   Component CSS can still override per-page. */
input:not([type="radio"]):not([type="checkbox"]):not([type="file"]),
select,
textarea {
    font-family: var(--font-body);
    font-size: var(--fs-base);
    color: var(--ink);
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    padding: 10px var(--s-3);
    min-height: 44px;
    transition: border-color var(--dur) var(--ease),
        box-shadow var(--dur) var(--ease);
    -webkit-appearance: none;
    appearance: none;
}

textarea {
    min-height: 96px;
    line-height: var(--lh-normal);
    resize: vertical;
}

/* Restore a dropdown affordance for selects (we removed the native one with
   appearance:none so the control matches text inputs). */
select {
    padding-right: var(--s-7);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235b5b5b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--s-3) center;
    cursor: pointer;
}

input::placeholder,
textarea::placeholder {
    color: var(--muted);
    opacity: 1;
}

input:not([type="radio"]):not([type="checkbox"]):not([type="file"]):focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: none;
    border-color: var(--brand-cyan);
    box-shadow: var(--focus-ring);
}

/* Validation states — shown only after the user has interacted, so pristine
   forms aren't painted red on load. */
input:not(:placeholder-shown):invalid,
textarea:not(:placeholder-shown):invalid {
    border-color: var(--danger);
}

input:not(:placeholder-shown):invalid:focus-visible,
textarea:not(:placeholder-shown):invalid:focus-visible {
    box-shadow: 0 0 0 3px rgba(215, 39, 46, 0.35);
}

/* --- Reduced motion ----------------------------------------------------- */
@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;
    }
}
