/**
 * Cloud Caravel Quote Form — baseline styles.
 *
 * Everything is scoped to .ccqf-default-form so it only affects forms
 * rendered by the [ccqf_form] shortcode or ccqf_render_form() helper.
 * Custom forms using just .ccqf-form (for the JS wiring) are untouched.
 *
 * Colors and fonts inherit from the site via CSS custom properties with
 * conservative fallbacks, so the form looks decent even on bare themes
 * and can be themed by redefining the variables below at a higher scope.
 */

.ccqf-default-form {
    --_ccqf-accent: var(--ccqf-accent, var(--blue-500, #7BA5BD));
    --_ccqf-accent-soft: var(--ccqf-accent-soft, var(--blue-100, #EEF4F8));
    --_ccqf-ink: var(--ccqf-ink, var(--ink-900, #14181E));
    --_ccqf-muted: var(--ccqf-muted, #6B7684);
    --_ccqf-border: var(--ccqf-border, #E7ECF0);
    --_ccqf-bg: var(--ccqf-bg, #ffffff);
    --_ccqf-radius: var(--ccqf-radius, 10px);
    --_ccqf-font: var(--ccqf-font, inherit);

    font-family: var(--_ccqf-font);
    color: var(--_ccqf-ink);
    background: var(--_ccqf-bg);
    padding: 28px;
    border-radius: calc(var(--_ccqf-radius) + 4px);
    border: 1px solid var(--_ccqf-border);
    display: block;
    box-sizing: border-box;
}

.ccqf-default-form *,
.ccqf-default-form *::before,
.ccqf-default-form *::after {
    box-sizing: border-box;
}

.ccqf-default-form .ccqf-form-heading {
    margin: 0 0 6px;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
}

.ccqf-default-form .ccqf-form-subhead {
    margin: 0 0 20px;
    color: var(--_ccqf-muted);
    font-size: 0.95rem;
    line-height: 1.5;
}

.ccqf-default-form .ccqf-form-group {
    margin-bottom: 16px;
    flex: 1 1 0;
    min-width: 0;
}

.ccqf-default-form .ccqf-form-row {
    display: flex;
    gap: 14px;
    margin-bottom: 0;
}

@media (max-width: 560px) {
    .ccqf-default-form .ccqf-form-row {
        flex-direction: column;
        gap: 0;
    }
}

.ccqf-default-form .ccqf-form-label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--_ccqf-ink);
}

.ccqf-default-form .ccqf-required-mark {
    color: var(--_ccqf-accent);
    margin-left: 2px;
}

.ccqf-default-form input[type="text"],
.ccqf-default-form input[type="email"],
.ccqf-default-form input[type="tel"],
.ccqf-default-form input[type="number"],
.ccqf-default-form select,
.ccqf-default-form textarea {
    width: 100%;
    padding: 11px 14px;
    font-family: inherit;
    font-size: 0.975rem;
    color: var(--_ccqf-ink);
    background: #fff;
    border: 1px solid var(--_ccqf-border);
    border-radius: var(--_ccqf-radius);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ccqf-default-form textarea {
    resize: vertical;
    min-height: 90px;
    line-height: 1.5;
}

.ccqf-default-form input:focus,
.ccqf-default-form select:focus,
.ccqf-default-form textarea:focus {
    border-color: var(--_ccqf-accent);
    box-shadow: 0 0 0 3px var(--_ccqf-accent-soft);
}

.ccqf-default-form input[aria-invalid="true"],
.ccqf-default-form select[aria-invalid="true"],
.ccqf-default-form textarea[aria-invalid="true"] {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

/* Radio group — pill-style selectable chips */
.ccqf-default-form .ccqf-radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ccqf-default-form .ccqf-radio-group input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ccqf-default-form .ccqf-radio-group label {
    display: inline-block;
    padding: 9px 16px;
    border: 1px solid var(--_ccqf-border);
    border-radius: 999px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.15s ease;
    background: #fff;
    user-select: none;
}

.ccqf-default-form .ccqf-radio-group label:hover {
    border-color: var(--_ccqf-accent);
}

.ccqf-default-form .ccqf-radio-group input[type="radio"]:checked + label {
    background: var(--_ccqf-accent);
    border-color: var(--_ccqf-accent);
    color: #fff;
}

.ccqf-default-form .ccqf-radio-group input[type="radio"]:focus-visible + label {
    box-shadow: 0 0 0 3px var(--_ccqf-accent-soft);
}

/* Turnstile spacing */
.ccqf-default-form .ccqf-turnstile {
    margin: 18px 0 4px;
}

/* Submit button */
.ccqf-default-form .ccqf-btn {
    display: inline-block;
    padding: 13px 28px;
    background: var(--_ccqf-ink);
    color: #fff;
    border: none;
    border-radius: var(--_ccqf-radius);
    font-family: inherit;
    font-size: 0.975rem;
    font-weight: 600;
    cursor: pointer;
    margin-top: 18px;
    transition: background 0.15s ease, transform 0.08s ease;
}

.ccqf-default-form .ccqf-btn:hover {
    background: var(--_ccqf-accent);
}

.ccqf-default-form .ccqf-btn:active {
    transform: translateY(1px);
}

.ccqf-default-form .ccqf-btn:disabled {
    opacity: 0.6;
    cursor: wait;
}