/**
 * CarTeam Parts Request - Frontend Stylesheet
 * Fully Dynamic Multi-Color Customizable Theme System
 * High-Specificity Isolation against Theme and Builder resets.
 */

.ctpr-parts-request,
.ctpr-client-container,
.ctpr-track-container,
.ctpr-button-wrapper,
div.ctpr-parts-request,
div.ctpr-client-container,
div.ctpr-track-container {
    /* 1. Base Canonical 8 Colors (Single Source of Truth) */
    --ctpr-primary: #064F87;
    --ctpr-button-primary: #2563EB;
    --ctpr-accent: #F59E0B;
    --ctpr-form-bg: #FFFFFF;
    --ctpr-card-bg: #F3F6FA;
    --ctpr-text: #263445;
    --ctpr-text-muted: #64748B;
    --ctpr-border: #D9E2EC;

    /* 2. Form Container */
    --ctpr-form-text: var(--ctpr-text);
    --ctpr-form-text-muted: var(--ctpr-text-muted);
    --ctpr-form-border: var(--ctpr-border);
    --ctpr-form-border-width: 1px;
    --ctpr-form-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    --ctpr-form-radius: 14px;
    --ctpr-spacing-unit: 16px;
    --ctpr-icon-color: var(--ctpr-primary);
    --ctpr-link-color: var(--ctpr-button-primary);

    /* 3. Header */
    --ctpr-header-bg-start: var(--ctpr-primary);
    --ctpr-header-bg-end: var(--ctpr-primary);
    --ctpr-header-text: #FFFFFF;
    --ctpr-header-title: #FFFFFF;
    --ctpr-header-desc: #F3F6FA;
    --ctpr-header-accent: var(--ctpr-accent);
    --ctpr-header-border: var(--ctpr-accent);

    /* 4. Cards & Sections */
    --ctpr-card-border: var(--ctpr-border);
    --ctpr-card-title: var(--ctpr-text);
    --ctpr-card-text: var(--ctpr-text);

    /* 5. Inputs */
    --ctpr-input-bg: var(--ctpr-form-bg);
    --ctpr-input-text: var(--ctpr-text);
    --ctpr-input-placeholder: var(--ctpr-text-muted);
    --ctpr-input-border: var(--ctpr-border);
    --ctpr-input-focus-border: var(--ctpr-button-primary);
    --ctpr-input-focus-ring: rgba(37, 99, 235, 0.2);
    --ctpr-input-invalid-border: #ef4444;
    --ctpr-input-invalid-text: #dc2626;

    /* 6. Selects */
    --ctpr-select-bg: var(--ctpr-form-bg);
    --ctpr-select-text: var(--ctpr-text);
    --ctpr-select-border: var(--ctpr-border);
    --ctpr-select-option-bg: var(--ctpr-form-bg);
    --ctpr-select-option-text: var(--ctpr-text);
    --ctpr-select-option-selected-bg: var(--ctpr-card-bg);

    /* 7. Buttons */
    --ctpr-btn-submit-bg: var(--ctpr-button-primary);
    --ctpr-btn-submit-text: #FFFFFF;
    --ctpr-btn-submit-border: var(--ctpr-button-primary);
    --ctpr-btn-submit-hover-bg: #1D4ED8;
    --ctpr-btn-submit-hover-text: #FFFFFF;
    --ctpr-btn-submit-active-bg: #1E40AF;
    --ctpr-btn-submit-disabled-bg: #94A3B8;
    --ctpr-btn-submit-disabled-text: #FFFFFF;

    --ctpr-btn-next-bg: var(--ctpr-button-primary);
    --ctpr-btn-next-text: #FFFFFF;
    --ctpr-btn-next-hover-bg: #1D4ED8;

    --ctpr-btn-prev-bg: var(--ctpr-card-bg);
    --ctpr-btn-prev-text: var(--ctpr-text);
    --ctpr-btn-prev-border: var(--ctpr-border);
    --ctpr-btn-prev-hover-bg: #E2E8F0;

    --ctpr-btn-cancel-bg: transparent;
    --ctpr-btn-cancel-text: var(--ctpr-text-muted);
    --ctpr-btn-cancel-border: var(--ctpr-border);

    --ctpr-btn-upload-bg: var(--ctpr-card-bg);
    --ctpr-btn-upload-text: var(--ctpr-text);
    --ctpr-btn-upload-hover-bg: #E2E8F0;

    --ctpr-btn-add-vehicle-bg: var(--ctpr-card-bg);
    --ctpr-btn-add-vehicle-text: var(--ctpr-text);
    --ctpr-btn-add-vehicle-hover-bg: #E2E8F0;

    --ctpr-btn-qty-bg: var(--ctpr-card-bg);
    --ctpr-btn-qty-text: var(--ctpr-text);
    --ctpr-btn-qty-border: var(--ctpr-border);
    --ctpr-btn-qty-hover-bg: #E2E8F0;

    --ctpr-btn-condition-bg: var(--ctpr-form-bg);
    --ctpr-btn-condition-text: var(--ctpr-text);
    --ctpr-btn-condition-border: var(--ctpr-border);
    --ctpr-btn-condition-active-bg: var(--ctpr-button-primary);
    --ctpr-btn-condition-active-text: #FFFFFF;

    /* 8. Checkboxes & Radios */
    --ctpr-checkbox-color: var(--ctpr-button-primary);
    --ctpr-checkbox-bg: var(--ctpr-form-bg);
    --ctpr-checkbox-border: var(--ctpr-border);
    --ctpr-checkbox-checked-bg: var(--ctpr-button-primary);
    --ctpr-checkbox-checked-border: var(--ctpr-button-primary);

    /* 9. Stepper */
    --ctpr-step-active-bg: var(--ctpr-button-primary);
    --ctpr-step-active-text: #FFFFFF;
    --ctpr-step-completed-bg: #10B981;
    --ctpr-step-completed-text: #FFFFFF;
    --ctpr-step-pending-bg: var(--ctpr-card-bg);
    --ctpr-step-pending-text: var(--ctpr-text-muted);
    --ctpr-step-line-color: var(--ctpr-border);

    /* 10. Alerts */
    --ctpr-alert-success-bg: #F0FDF4;
    --ctpr-alert-success-text: #166534;
    --ctpr-alert-success-border: #BBF7D0;
    --ctpr-alert-error-bg: #FEF2F2;
    --ctpr-alert-error-text: #991B1B;
    --ctpr-alert-error-border: #FECACA;
    --ctpr-alert-warning-bg: #FFFBEB;
    --ctpr-alert-warning-text: #92400E;
    --ctpr-alert-warning-border: #FDE68A;
    --ctpr-alert-info-bg: #EFF6FF;
    --ctpr-alert-info-text: #1E40AF;
    --ctpr-alert-info-border: #BFDBFE;

    /* 11. Dropzone */
    --ctpr-dropzone-bg: var(--ctpr-card-bg);
    --ctpr-dropzone-border: var(--ctpr-border);
    --ctpr-dropzone-text: var(--ctpr-text);
    --ctpr-dropzone-desc: var(--ctpr-text-muted);
    --ctpr-dropzone-icon: var(--ctpr-primary);
    --ctpr-dropzone-drag-bg: rgba(37, 99, 235, 0.08);
    --ctpr-dropzone-drag-border: var(--ctpr-button-primary);

    /* 12. Summary */
    --ctpr-summary-bg: var(--ctpr-card-bg);
    --ctpr-summary-border: var(--ctpr-border);
    --ctpr-summary-title: var(--ctpr-primary);
    --ctpr-summary-label: var(--ctpr-text-muted);
    --ctpr-summary-value: var(--ctpr-text);

    /* 13. Focus, Radius & Aliases */
    --ctpr-focus-ring-color: rgba(37, 99, 235, 0.25);
    --ctpr-focus-ring-width: 3px;
    --ctpr-btn: var(--ctpr-button-primary);
    --ctpr-btn-color: var(--ctpr-button-primary);
    --ctpr-bg: var(--ctpr-form-bg);
    --ctpr-radius: 14px;
    --ctpr-muted: var(--ctpr-text-muted);
}

/* ==========================================================================
   Base Scoped Containers (.ctpr-parts-request, .ctpr-client-container, .ctpr-track-container)
   Guaranteed High-Specificity Isolation against Global Theme & Page Builder Resets
   ========================================================================== */
.ctpr-parts-request,
.ctpr-parts-request.ctpr-client-container,
.ctpr-parts-request.ctpr-track-container,
.ctpr-client-container,
.ctpr-track-container,
.ctpr-button-wrapper,
div.ctpr-parts-request,
div.ctpr-client-container,
div.ctpr-track-container {
    box-sizing: border-box !important;
    font-family: inherit;
    direction: rtl !important;
    text-align: right !important;
    width: 100% !important;
    color: var(--ctpr-form-text, #263445) !important;
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    background: var(--ctpr-form-bg, #FFFFFF) !important;
    border-color: var(--ctpr-form-border, #D9E2EC) !important;
    border-width: var(--ctpr-form-border-width, 1px) !important;
    border-style: solid !important;
    border-radius: var(--ctpr-form-radius, 14px) !important;
    overflow: hidden !important;
    box-shadow: var(--ctpr-form-shadow, 0 4px 6px -1px rgba(0, 0, 0, 0.05)) !important;
    line-height: 1.5 !important;
}

/* ==========================================================================
   Header Banner & Title
   ========================================================================== */
.ctpr-parts-request .ctpr-client-header,
.ctpr-client-container .ctpr-client-header,
div.ctpr-parts-request .ctpr-client-header {
    background: var(--ctpr-header-bg-start, #064F87) !important;
    background-color: var(--ctpr-header-bg-start, #064F87) !important;
    border-bottom: 3px solid var(--ctpr-header-border, #F59E0B) !important;
    color: var(--ctpr-header-text, #ffffff) !important;
    padding: 24px 28px !important;
    position: relative !important;
}

.ctpr-parts-request .ctpr-client-header h2,
.ctpr-parts-request .ctpr-header-title,
.ctpr-client-container .ctpr-client-header h2,
div.ctpr-parts-request .ctpr-client-header h2 {
    font-size: 22px !important;
    font-weight: 800 !important;
    color: var(--ctpr-header-title, #ffffff) !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.3 !important;
}

.ctpr-parts-request .ctpr-client-header p,
.ctpr-parts-request .ctpr-header-desc,
.ctpr-client-container .ctpr-client-header p,
div.ctpr-parts-request .ctpr-client-header p {
    margin: 0 !important;
    color: var(--ctpr-header-desc, #F3F6FA) !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.ctpr-parts-request .ctpr-badge-accent,
.ctpr-client-container .ctpr-badge-accent,
.ctpr-track-container .ctpr-badge-accent {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background-color: var(--ctpr-header-accent, #F59E0B) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    margin-bottom: 8px !important;
    letter-spacing: 0.5px !important;
}

/* ==========================================================================
   4-Step Progress Indicator
   ========================================================================== */
.ctpr-parts-request .ctpr-steps-nav,
.ctpr-client-container .ctpr-steps-nav {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    padding: 16px 20px !important;
    border-bottom: 1px solid var(--ctpr-step-line-color, #D9E2EC) !important;
    position: relative !important;
}

.ctpr-parts-request .ctpr-step-item,
.ctpr-client-container .ctpr-step-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    position: relative !important;
    user-select: none !important;
    transition: all 0.2s ease !important;
    cursor: default !important;
}

.ctpr-parts-request .ctpr-step-item.completed,
.ctpr-client-container .ctpr-step-item.completed {
    cursor: pointer !important;
}

.ctpr-parts-request .ctpr-step-bubble,
.ctpr-client-container .ctpr-step-bubble {
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    background-color: var(--ctpr-step-pending-bg, #F3F6FA) !important;
    color: var(--ctpr-step-pending-text, #64748B) !important;
    border: 1px solid var(--ctpr-step-line-color, #D9E2EC) !important;
    transition: all 0.25s ease !important;
    margin-bottom: 6px !important;
}

.ctpr-parts-request .ctpr-step-item.active .ctpr-step-bubble,
.ctpr-client-container .ctpr-step-item.active .ctpr-step-bubble {
    background-color: var(--ctpr-step-active-bg, #2563EB) !important;
    color: var(--ctpr-step-active-text, #ffffff) !important;
    border-color: var(--ctpr-step-active-bg, #2563EB) !important;
    box-shadow: 0 0 15px rgba(37, 99, 235, 0.35) !important;
    transform: scale(1.05) !important;
}

.ctpr-parts-request .ctpr-step-item.completed .ctpr-step-bubble,
.ctpr-client-container .ctpr-step-item.completed .ctpr-step-bubble {
    background-color: var(--ctpr-step-completed-bg, #10b981) !important;
    color: var(--ctpr-step-completed-text, #ffffff) !important;
    border-color: var(--ctpr-step-completed-bg, #10b981) !important;
}

.ctpr-parts-request .ctpr-step-title,
.ctpr-client-container .ctpr-step-title {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--ctpr-step-pending-text, #64748B) !important;
    transition: color 0.2s !important;
}

.ctpr-parts-request .ctpr-step-item.active .ctpr-step-title,
.ctpr-client-container .ctpr-step-item.active .ctpr-step-title {
    color: var(--ctpr-step-active-bg, #2563EB) !important;
    font-weight: 800 !important;
}

.ctpr-parts-request .ctpr-step-item.completed .ctpr-step-title,
.ctpr-client-container .ctpr-step-item.completed .ctpr-step-title {
    color: var(--ctpr-step-completed-bg, #10b981) !important;
}

/* ==========================================================================
   Inner Cards & Section Framing
   ========================================================================== */
.ctpr-parts-request .ctpr-form-section,
.ctpr-client-container .ctpr-form-section {
    background-color: var(--ctpr-card-bg, #F3F6FA) !important;
    border: 1px solid var(--ctpr-card-border, #D9E2EC) !important;
    border-radius: var(--ctpr-form-radius, 12px) !important;
    padding: 22px !important;
    margin-bottom: 20px !important;
}

.ctpr-section-header,
.ctpr-parts-request .ctpr-section-header,
.ctpr-client-container .ctpr-section-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-bottom: 12px !important;
    margin-bottom: 16px !important;
    border-bottom: 1px solid var(--ctpr-card-border, #D9E2EC) !important;
}

.ctpr-parts-request .ctpr-section-title,
.ctpr-client-container .ctpr-section-title {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--ctpr-card-title, #263445) !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
}

/* ==========================================================================
   Form Labels & Input Fields
   ========================================================================== */
.ctpr-parts-request .ctpr-input-label,
.ctpr-client-container .ctpr-input-label,
.ctpr-track-container .ctpr-input-label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: var(--ctpr-text, #263445) !important;
    margin-bottom: 6px !important;
    text-align: right !important;
}

.ctpr-parts-request .ctpr-input-label .required,
.ctpr-client-container .ctpr-input-label .required,
.ctpr-track-container .ctpr-input-label .required {
    color: var(--ctpr-input-invalid-border, #ef4444) !important;
    margin-right: 2px !important;
}

/* Inputs, Selects, and Textareas */
.ctpr-parts-request input[type="text"],
.ctpr-parts-request input[type="tel"],
.ctpr-parts-request input[type="number"],
.ctpr-parts-request input[type="email"],
.ctpr-parts-request select,
.ctpr-parts-request textarea,
.ctpr-parts-request .ctpr-input-styled,
.ctpr-client-container input[type="text"],
.ctpr-client-container input[type="tel"],
.ctpr-client-container input[type="number"],
.ctpr-client-container input[type="email"],
.ctpr-client-container select,
.ctpr-client-container textarea,
.ctpr-client-container .ctpr-input-styled,
.ctpr-track-container input[type="text"],
.ctpr-track-container input[type="tel"],
.ctpr-track-container .ctpr-input-styled,
div.ctpr-parts-request input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]):not([type="hidden"]),
div.ctpr-parts-request select,
div.ctpr-parts-request textarea {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    background: var(--ctpr-form-bg, #FFFFFF) !important;
    background-image: none !important;
    border: 1px solid var(--ctpr-border, #D9E2EC) !important;
    border-radius: 8px !important;
    color: var(--ctpr-text, #263445) !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    box-sizing: border-box !important;
    text-align: right !important;
    -webkit-appearance: none !important;
}

/* Explicitly hide file inputs */
.ctpr-parts-request input[type="file"],
.ctpr-parts-request input.ctpr-hidden-file-input,
.ctpr-client-container input[type="file"],
.ctpr-client-container input.ctpr-hidden-file-input {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* LTR Inputs (Phone, VIN, Email, Reference) */
.ctpr-parts-request .ctpr-input-ltr,
.ctpr-client-container .ctpr-input-ltr,
.ctpr-track-container .ctpr-input-ltr {
    direction: ltr !important;
    text-align: right !important;
}

/* Specific Select Styling with Sleek Embedded SVG Arrow */
.ctpr-parts-request select,
.ctpr-client-container select,
div.ctpr-parts-request select {
    color: var(--ctpr-text, #263445) !important;
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    background: var(--ctpr-form-bg, #FFFFFF) !important;
    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='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: left 14px center !important;
    background-size: 14px 14px !important;
    padding-left: 38px !important;
    border-color: var(--ctpr-border, #D9E2EC) !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

.ctpr-parts-request select option,
.ctpr-client-container select option,
div.ctpr-parts-request select option {
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    background: var(--ctpr-form-bg, #FFFFFF) !important;
    color: var(--ctpr-text, #263445) !important;
    padding: 8px !important;
}

/* Placeholder Styling */
.ctpr-parts-request input::placeholder,
.ctpr-parts-request textarea::placeholder,
.ctpr-client-container input::placeholder,
.ctpr-client-container textarea::placeholder,
.ctpr-track-container input::placeholder {
    color: var(--ctpr-text-muted, #64748B) !important;
    opacity: 1 !important;
}

/* Input Focus States */
.ctpr-parts-request input:focus,
.ctpr-parts-request select:focus,
.ctpr-parts-request textarea:focus,
.ctpr-client-container input:focus,
.ctpr-client-container select:focus,
.ctpr-client-container textarea:focus,
.ctpr-track-container input:focus {
    border-color: var(--ctpr-button-primary, #2563EB) !important;
    box-shadow: 0 0 0 var(--ctpr-focus-ring-width, 3px) rgba(37, 99, 235, 0.15) !important;
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    color: var(--ctpr-text, #263445) !important;
    outline: none !important;
}

/* Invalid / Error Input State */
.ctpr-parts-request input.ctpr-input-error,
.ctpr-client-container input.ctpr-input-error {
    border-color: var(--ctpr-input-invalid-border, #ef4444) !important;
}
.ctpr-field-error-msg {
    color: var(--ctpr-input-invalid-text, #ef4444) !important;
    font-size: 11px !important;
    margin-top: 4px !important;
}

/* Checkbox & Radio Controls */
.ctpr-parts-request input[type="checkbox"],
.ctpr-parts-request input[type="radio"],
.ctpr-client-container input[type="checkbox"],
.ctpr-client-container input[type="radio"] {
    accent-color: var(--ctpr-button-primary, #2563EB) !important;
}

/* ==========================================================================
   File Dropzone
   ========================================================================== */
.ctpr-parts-request .ctpr-dropzone,
.ctpr-client-container .ctpr-dropzone {
    border: 2px dashed var(--ctpr-border, #D9E2EC) !important;
    background-color: var(--ctpr-card-bg, #F3F6FA) !important;
    border-radius: 12px !important;
    padding: 22px !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: block !important;
}

.ctpr-parts-request .ctpr-dropzone:hover,
.ctpr-parts-request .ctpr-dropzone.ctpr-dragover,
.ctpr-client-container .ctpr-dropzone:hover,
.ctpr-client-container .ctpr-dropzone.ctpr-dragover {
    border-color: var(--ctpr-button-primary, #2563EB) !important;
    background-color: rgba(37, 99, 235, 0.05) !important;
}

.ctpr-dropzone-icon, .ctpr-dropzone svg {
    color: var(--ctpr-accent, #F59E0B) !important;
    stroke: var(--ctpr-accent, #F59E0B) !important;
}

.ctpr-dropzone-text {
    color: var(--ctpr-text, #263445) !important;
}

.ctpr-dropzone-desc {
    color: var(--ctpr-text-muted, #64748B) !important;
}

/* ==========================================================================
   Action Buttons (Submit, Next, Prev, Qty, Conditions)
   ========================================================================== */
.ctpr-parts-request .ctpr-btn-primary,
.ctpr-parts-request .ctpr-submit-accent,
.ctpr-parts-request #ctpr-submit-btn,
.ctpr-parts-request button[type="submit"],
.ctpr-client-container .ctpr-btn-primary,
.ctpr-client-container .ctpr-submit-accent,
.ctpr-client-container #ctpr-submit-btn,
.ctpr-client-container button[type="submit"],
.ctpr-track-container #ctpr-track-btn,
.ctpr-track-container .ctpr-btn-primary,
div.ctpr-parts-request button.ctpr-btn-primary,
div.ctpr-parts-request button#ctpr-submit-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 26px !important;
    background-color: var(--ctpr-button-primary, #2563EB) !important;
    background: var(--ctpr-button-primary, #2563EB) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    border: 1px solid var(--ctpr-button-primary, #2563EB) !important;
    border-radius: var(--ctpr-form-radius, 10px) !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

.ctpr-parts-request .ctpr-btn-primary:hover,
.ctpr-parts-request .ctpr-submit-accent:hover,
.ctpr-parts-request #ctpr-submit-btn:hover,
.ctpr-parts-request button[type="submit"]:hover,
.ctpr-client-container .ctpr-btn-primary:hover,
.ctpr-client-container .ctpr-submit-accent:hover,
.ctpr-client-container #ctpr-submit-btn:hover,
.ctpr-client-container button[type="submit"]:hover,
.ctpr-track-container #ctpr-track-btn:hover,
.ctpr-track-container .ctpr-btn-primary:hover,
div.ctpr-parts-request button.ctpr-btn-primary:hover,
div.ctpr-parts-request button#ctpr-submit-btn:hover {
    background-color: #1D4ED8 !important;
    background: #1D4ED8 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.35) !important;
}

.ctpr-parts-request .ctpr-btn-primary:active,
.ctpr-parts-request #ctpr-submit-btn:active {
    background-color: #1E40AF !important;
}

.ctpr-parts-request .ctpr-btn-primary:disabled,
.ctpr-parts-request #ctpr-submit-btn:disabled {
    background-color: var(--ctpr-border, #CBD5E1) !important;
    color: var(--ctpr-text-muted, #64748B) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Stepper Next button */
.ctpr-parts-request .ctpr-btn-next,
.ctpr-client-container .ctpr-btn-next {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 24px !important;
    /* هذه المتغيرات تأتي مباشرة من إعدادات المظهر على حاوية النموذج. */
    background-color: var(--ctpr-btn-next-bg, var(--ctpr-button-primary, #2563EB)) !important;
    background: var(--ctpr-btn-next-bg, var(--ctpr-button-primary, #2563EB)) !important;
    color: var(--ctpr-btn-next-text, #FFFFFF) !important;
    border-radius: var(--ctpr-form-radius, 10px) !important;
    border: 1px solid var(--ctpr-btn-next-bg, var(--ctpr-button-primary, #2563EB)) !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}
.ctpr-parts-request .ctpr-btn-next:hover,
.ctpr-client-container .ctpr-btn-next:hover {
    background-color: var(--ctpr-btn-next-hover-bg, var(--ctpr-btn-next-bg, #1D4ED8)) !important;
    background: var(--ctpr-btn-next-hover-bg, var(--ctpr-btn-next-bg, #1D4ED8)) !important;
    border-color: var(--ctpr-btn-next-hover-bg, var(--ctpr-btn-next-bg, #1D4ED8)) !important;
    color: var(--ctpr-btn-next-text, #FFFFFF) !important;
}

/* Stepper Prev button */
.ctpr-parts-request .ctpr-btn-prev,
.ctpr-parts-request .ctpr-btn-secondary,
.ctpr-client-container .ctpr-btn-prev,
.ctpr-client-container .ctpr-btn-secondary {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 12px 20px !important;
    background-color: var(--ctpr-card-bg, #F3F6FA) !important;
    color: var(--ctpr-text, #263445) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    border: 1px solid var(--ctpr-border, #D9E2EC) !important;
    border-radius: var(--ctpr-form-radius, 10px) !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

.ctpr-parts-request .ctpr-btn-prev:hover,
.ctpr-parts-request .ctpr-btn-secondary:hover,
.ctpr-client-container .ctpr-btn-prev:hover,
.ctpr-client-container .ctpr-btn-secondary:hover {
    background-color: #E2E8F0 !important;
    color: var(--ctpr-text, #263445) !important;
}

/* Quantity Buttons */
.ctpr-parts-request .ctpr-qty-minus,
.ctpr-parts-request .ctpr-qty-plus,
.ctpr-client-container .ctpr-qty-minus,
.ctpr-client-container .ctpr-qty-plus {
    background-color: var(--ctpr-card-bg, #F3F6FA) !important;
    color: var(--ctpr-text, #263445) !important;
    border: 1px solid var(--ctpr-border, #D9E2EC) !important;
}
.ctpr-parts-request .ctpr-qty-minus:hover,
.ctpr-parts-request .ctpr-qty-plus:hover {
    background-color: #E2E8F0 !important;
}

/* Condition Selector Buttons */
.ctpr-parts-request .ctpr-condition-grid,
.ctpr-client-container .ctpr-condition-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)) !important;
    gap: 8px !important;
}

.ctpr-parts-request .ctpr-condition-btn,
.ctpr-client-container .ctpr-condition-btn {
    padding: 10px 8px !important;
    background-color: var(--ctpr-form-bg, #FFFFFF) !important;
    border: 1px solid var(--ctpr-border, #D9E2EC) !important;
    border-radius: 8px !important;
    color: var(--ctpr-text, #263445) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    text-align: center !important;
    transition: all 0.2s ease !important;
}

.ctpr-parts-request .ctpr-condition-btn.selected,
.ctpr-parts-request .ctpr-condition-btn:hover,
.ctpr-client-container .ctpr-condition-btn.selected,
.ctpr-client-container .ctpr-condition-btn:hover {
    background-color: var(--ctpr-button-primary, #2563EB) !important;
    border-color: var(--ctpr-button-primary, #2563EB) !important;
    color: #FFFFFF !important;
}

/* ==========================================================================
   Order Summary & Review Card
   ========================================================================== */
.ctpr-parts-request .ctpr-summary-card,
.ctpr-client-container .ctpr-summary-card {
    background-color: var(--ctpr-card-bg, #F3F6FA) !important;
    border: 1px solid var(--ctpr-border, #D9E2EC) !important;
    border-radius: 8px !important;
    padding: 12px !important;
}

.ctpr-parts-request .ctpr-summary-title,
.ctpr-client-container .ctpr-summary-title {
    color: var(--ctpr-primary, #064F87) !important;
}

.ctpr-parts-request .ctpr-summary-label,
.ctpr-client-container .ctpr-summary-label {
    color: var(--ctpr-text-muted, #64748B) !important;
}

.ctpr-parts-request .ctpr-summary-val,
.ctpr-client-container .ctpr-summary-val {
    color: var(--ctpr-text, #263445) !important;
}

.ctpr-parts-request .ctpr-guarantee-box,
.ctpr-client-container .ctpr-guarantee-box {
    background-color: rgba(37, 99, 235, 0.08) !important;
    border: 1px solid rgba(37, 99, 235, 0.2) !important;
    color: var(--ctpr-primary, #064F87) !important;
}

/* ==========================================================================
   Alert & Message Boxes
   ========================================================================== */
.ctpr-alert {
    padding: 14px 18px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
}

.ctpr-alert-success {
    background-color: var(--ctpr-alert-success-bg, rgba(16, 185, 129, 0.12)) !important;
    color: var(--ctpr-alert-success-text, #34d399) !important;
    border: 1px solid var(--ctpr-alert-success-border, rgba(16, 185, 129, 0.3)) !important;
}

.ctpr-alert-error {
    background-color: var(--ctpr-alert-error-bg, rgba(239, 68, 68, 0.12)) !important;
    color: var(--ctpr-alert-error-text, #f87171) !important;
    border: 1px solid var(--ctpr-alert-error-border, rgba(239, 68, 68, 0.3)) !important;
}

.ctpr-alert-warning {
    background-color: var(--ctpr-alert-warning-bg, rgba(245, 158, 11, 0.12)) !important;
    color: var(--ctpr-alert-warning-text, #fbbf24) !important;
    border: 1px solid var(--ctpr-alert-warning-border, rgba(245, 158, 11, 0.3)) !important;
}

.ctpr-alert-info {
    background-color: var(--ctpr-alert-info-bg, rgba(59, 130, 246, 0.12)) !important;
    color: var(--ctpr-alert-info-text, #60a5fa) !important;
    border: 1px solid var(--ctpr-alert-info-border, rgba(59, 130, 246, 0.3)) !important;
}

/* ==========================================================================
   Status Badges (Tracking System)
   ========================================================================== */
.ctpr-parts-request .ctpr-status-badge,
.ctpr-track-container .ctpr-status-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 12px !important;
    border-radius: 9999px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.ctpr-status-new {
    background-color: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
    border: 1px solid rgba(59, 130, 246, 0.3) !important;
}

.ctpr-status-processing {
    background-color: rgba(245, 158, 11, 0.15) !important;
    color: #fbbf24 !important;
    border: 1px solid rgba(245, 158, 11, 0.3) !important;
}

.ctpr-status-available {
    background-color: rgba(16, 185, 129, 0.15) !important;
    color: #34d399 !important;
    border: 1px solid rgba(16, 185, 129, 0.3) !important;
}

.ctpr-status-unavailable {
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #f87171 !important;
    border: 1px solid rgba(239, 68, 68, 0.3) !important;
}

.ctpr-status-completed {
    background-color: rgba(20, 184, 166, 0.15) !important;
    color: #2dd4bf !important;
    border: 1px solid rgba(20, 184, 166, 0.3) !important;
}

.ctpr-status-cancelled {
    background-color: rgba(100, 116, 139, 0.15) !important;
    color: #94a3b8 !important;
    border: 1px solid rgba(100, 116, 139, 0.3) !important;
}

/* ==========================================================================
   Form Body, Grids & Responsive Component Layouts
   ========================================================================== */
.ctpr-parts-request .ctpr-form-body,
.ctpr-client-container .ctpr-form-body {
    padding: 24px 28px !important;
}

.ctpr-parts-request .ctpr-grid-row,
.ctpr-client-container .ctpr-grid-row {
    display: grid !important;
    gap: 14px !important;
    margin-bottom: 14px !important;
    direction: rtl !important;
}

.ctpr-parts-request .ctpr-grid-3cols,
.ctpr-client-container .ctpr-grid-3cols {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    direction: rtl !important;
}

.ctpr-parts-request .ctpr-grid-2cols,
.ctpr-client-container .ctpr-grid-2cols {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    direction: rtl !important;
}

.ctpr-parts-request .ctpr-grid-qty-notes,
.ctpr-client-container .ctpr-grid-qty-notes {
    display: grid !important;
    grid-template-columns: 140px 1fr !important;
    gap: 14px !important;
    margin-bottom: 14px !important;
}

.ctpr-parts-request .ctpr-form-group,
.ctpr-client-container .ctpr-form-group,
.ctpr-track-container .ctpr-form-group {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 0 !important;
}

.ctpr-parts-request .ctpr-optional-badge,
.ctpr-client-container .ctpr-optional-badge,
.ctpr-track-container .ctpr-optional-badge {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: var(--ctpr-text-muted, #64748B) !important;
    margin-right: 4px !important;
}

.ctpr-parts-request .ctpr-section-icon,
.ctpr-client-container .ctpr-section-icon {
    color: var(--ctpr-accent, #F59E0B) !important;
    margin-left: 4px !important;
}

.ctpr-parts-request .ctpr-step-counter,
.ctpr-client-container .ctpr-step-counter {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--ctpr-accent, #F59E0B) !important;
}

.ctpr-parts-request .ctpr-qty-picker,
.ctpr-client-container .ctpr-qty-picker {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.ctpr-parts-request .ctpr-qty-input,
.ctpr-client-container .ctpr-qty-input {
    text-align: center !important;
    max-width: 65px !important;
    padding: 10px 4px !important;
}

.ctpr-parts-request .ctpr-step-actions,
.ctpr-client-container .ctpr-step-actions {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-top: 20px !important;
    box-sizing: border-box !important;
}

.ctpr-parts-request .ctpr-actions-end,
.ctpr-client-container .ctpr-actions-end {
    justify-content: flex-end !important;
}

.ctpr-parts-request .ctpr-actions-between,
.ctpr-client-container .ctpr-actions-between {
    justify-content: space-between !important;
}

.ctpr-parts-request .ctpr-summary-grid,
.ctpr-client-container .ctpr-summary-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-bottom: 16px !important;
}

.ctpr-parts-request .ctpr-summary-sub,
.ctpr-client-container .ctpr-summary-sub {
    font-size: 11.5px !important;
    color: var(--ctpr-text-muted, #64748B) !important;
    margin-top: 4px !important;
    display: block !important;
}

.ctpr-parts-request .ctpr-file-feedback,
.ctpr-client-container .ctpr-file-feedback {
    font-size: 12px !important;
    color: #10b981 !important;
    margin-top: 6px !important;
    font-weight: 600 !important;
}

.ctpr-track-container {
    max-width: 580px !important;
    margin: 0 auto !important;
    padding: 28px !important;
}

.ctpr-track-container .ctpr-track-header {
    text-align: center !important;
    margin-bottom: 20px !important;
}

.ctpr-track-container .ctpr-track-form {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

.ctpr-track-container .ctpr-btn-full {
    width: 100% !important;
    justify-content: center !important;
}

/* ==========================================================================
   Mobile & Tablet Responsiveness (768px, 640px, 480px)
   ========================================================================== */
@media (max-width: 768px) {
    .ctpr-parts-request .ctpr-grid-3cols,
    .ctpr-client-container .ctpr-grid-3cols {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    .ctpr-parts-request,
    .ctpr-client-container,
    .ctpr-track-container {
        border-radius: 10px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .ctpr-parts-request .ctpr-client-header,
    .ctpr-client-container .ctpr-client-header {
        padding: 18px 16px !important;
    }

    .ctpr-parts-request .ctpr-header-title,
    .ctpr-client-container .ctpr-header-title {
        font-size: 18px !important;
    }

    .ctpr-parts-request .ctpr-steps-nav,
    .ctpr-client-container .ctpr-steps-nav {
        padding: 12px 6px !important;
        gap: 4px !important;
    }

    .ctpr-parts-request .ctpr-step-bubble,
    .ctpr-client-container .ctpr-step-bubble {
        width: 34px !important;
        height: 34px !important;
        font-size: 12px !important;
        border-radius: 9px !important;
        margin-bottom: 4px !important;
    }

    .ctpr-parts-request .ctpr-step-title,
    .ctpr-client-container .ctpr-step-title {
        font-size: 11px !important;
        font-weight: 700 !important;
    }

    .ctpr-parts-request .ctpr-form-body,
    .ctpr-client-container .ctpr-form-body {
        padding: 16px 14px !important;
    }

    .ctpr-parts-request .ctpr-form-section,
    .ctpr-client-container .ctpr-form-section {
        padding: 14px 12px !important;
        margin-bottom: 16px !important;
        border-radius: 10px !important;
    }

    .ctpr-parts-request .ctpr-grid-3cols,
    .ctpr-client-container .ctpr-grid-3cols,
    .ctpr-parts-request .ctpr-grid-2cols,
    .ctpr-client-container .ctpr-grid-2cols,
    .ctpr-parts-request .ctpr-grid-qty-notes,
    .ctpr-client-container .ctpr-grid-qty-notes,
    .ctpr-parts-request .ctpr-summary-grid,
    .ctpr-client-container .ctpr-summary-grid {
        grid-template-columns: 1fr !important;
    }

    .ctpr-parts-request .ctpr-condition-grid,
    .ctpr-client-container .ctpr-condition-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .ctpr-track-container {
        padding: 20px 14px !important;
    }
}

@media (max-width: 480px) {
    .ctpr-parts-request .ctpr-step-bubble,
    .ctpr-client-container .ctpr-step-bubble {
        width: 30px !important;
        height: 30px !important;
        font-size: 11px !important;
        border-radius: 8px !important;
    }

    .ctpr-parts-request .ctpr-step-title,
    .ctpr-client-container .ctpr-step-title {
        font-size: 10.5px !important;
    }

    .ctpr-parts-request .ctpr-step-actions,
    .ctpr-client-container .ctpr-step-actions {
        flex-direction: column-reverse !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .ctpr-parts-request .ctpr-btn-primary,
    .ctpr-parts-request .ctpr-btn-secondary,
    .ctpr-parts-request .ctpr-btn-next,
    .ctpr-parts-request .ctpr-btn-prev,
    .ctpr-parts-request #ctpr-submit-btn,
    .ctpr-client-container .ctpr-btn-primary,
    .ctpr-client-container .ctpr-btn-secondary,
    .ctpr-client-container .ctpr-btn-next,
    .ctpr-client-container .ctpr-btn-prev,
    .ctpr-client-container #ctpr-submit-btn {
        width: 100% !important;
        justify-content: center !important;
        padding: 12px 16px !important;
        font-size: 13.5px !important;
    }
}

/* ==========================================================================
   Phase 2: Unlisted Vehicle (Custom Car) Mode Styles
   ========================================================================== */
.ctpr-parts-request .ctpr-vehicle-mode-toggle-bar,
.ctpr-client-container .ctpr-vehicle-mode-toggle-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin-bottom: 16px !important;
    gap: 10px !important;
}

.ctpr-parts-request .ctpr-btn-vehicle-mode,
.ctpr-client-container .ctpr-btn-vehicle-mode {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    border-radius: 9999px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    min-height: 40px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

.ctpr-parts-request .ctpr-btn-mode-custom,
.ctpr-client-container .ctpr-btn-mode-custom {
    color: var(--ctpr-button-primary, #2563EB) !important;
    background-color: rgba(37, 99, 235, 0.08) !important;
    border: 1.5px dashed var(--ctpr-button-primary, #2563EB) !important;
}

.ctpr-parts-request .ctpr-btn-mode-custom:hover,
.ctpr-client-container .ctpr-btn-mode-custom:hover {
    background-color: rgba(37, 99, 235, 0.16) !important;
    border-style: solid !important;
    transform: translateY(-1px) !important;
}

.ctpr-parts-request .ctpr-btn-mode-return,
.ctpr-client-container .ctpr-btn-mode-return {
    color: var(--ctpr-text, #263445) !important;
    background-color: var(--ctpr-card-bg, #F3F6FA) !important;
    border: 1.5px solid var(--ctpr-border, #D9E2EC) !important;
}

.ctpr-parts-request .ctpr-btn-mode-return:hover,
.ctpr-client-container .ctpr-btn-mode-return:hover {
    background-color: #E2E8F0 !important;
    border-color: #94A3B8 !important;
    transform: translateY(-1px) !important;
}

.ctpr-parts-request .ctpr-manual-vehicle-alert,
.ctpr-client-container .ctpr-manual-vehicle-alert {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 14px !important;
    background-color: rgba(37, 99, 235, 0.08) !important;
    border: 1px solid rgba(37, 99, 235, 0.25) !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    color: var(--ctpr-button-primary, #2563EB) !important;
    font-weight: 600 !important;
    margin-bottom: 16px !important;
    line-height: 1.5 !important;
}

.ctpr-parts-request .ctpr-mode-icon,
.ctpr-client-container .ctpr-mode-icon {
    font-size: 14px !important;
}

@media (max-width: 480px) {
    .ctpr-parts-request .ctpr-vehicle-mode-toggle-bar,
    .ctpr-client-container .ctpr-vehicle-mode-toggle-bar {
        width: 100% !important;
    }
    .ctpr-parts-request .ctpr-btn-vehicle-mode,
    .ctpr-client-container .ctpr-btn-vehicle-mode {
        width: 100% !important;
        justify-content: center !important;
        min-height: 44px !important;
        font-size: 13.5px !important;
    }
}


/* ======================================================================
   CarTeam Responsive Layout Patch (Desktop / Tablet / Mobile)
   Scoped to the plugin so it does not alter the active WordPress theme.
   ====================================================================== */
.ctpr-parts-request,
.ctpr-parts-request *,
.ctpr-client-container,
.ctpr-client-container * {
    box-sizing: border-box !important;
}

.ctpr-parts-request,
.ctpr-client-container {
    width: min(100%, 1120px) !important;
    max-width: 1120px !important;
    margin-inline: auto !important;
}

.ctpr-parts-request #ctpr-customer-form-root,
.ctpr-client-container #ctpr-customer-form-root,
.ctpr-parts-request .ctpr-form-body,
.ctpr-client-container .ctpr-form-body,
.ctpr-parts-request .ctpr-form-section,
.ctpr-client-container .ctpr-form-section {
    min-width: 0 !important;
    max-width: 100% !important;
}

.ctpr-parts-request .ctpr-grid-row,
.ctpr-client-container .ctpr-grid-row {
    grid-template-columns: minmax(0, 1fr) !important;
}

.ctpr-parts-request .ctpr-grid-3cols,
.ctpr-client-container .ctpr-grid-3cols {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.ctpr-parts-request input,
.ctpr-parts-request select,
.ctpr-parts-request textarea,
.ctpr-client-container input,
.ctpr-client-container select,
.ctpr-client-container textarea {
    min-width: 0 !important;
    max-width: 100% !important;
}

.ctpr-parts-request .ctpr-client-header,
.ctpr-client-container .ctpr-client-header {
    padding: clamp(16px, 3vw, 30px) !important;
}

.ctpr-parts-request .ctpr-form-body,
.ctpr-client-container .ctpr-form-body {
    padding: clamp(12px, 3vw, 28px) !important;
}

.ctpr-parts-request .ctpr-form-section,
.ctpr-client-container .ctpr-form-section {
    padding: clamp(12px, 2.5vw, 22px) !important;
}

.ctpr-parts-request .ctpr-steps-nav,
.ctpr-client-container .ctpr-steps-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 12px clamp(8px, 2vw, 20px) !important;
}

.ctpr-parts-request .ctpr-step-item,
.ctpr-client-container .ctpr-step-item {
    min-width: 0 !important;
}

.ctpr-parts-request .ctpr-section-header,
.ctpr-client-container .ctpr-section-header {
    flex-wrap: wrap !important;
    gap: 8px 12px !important;
}

.ctpr-parts-request .ctpr-dropzone,
.ctpr-client-container .ctpr-dropzone {
    overflow-wrap: anywhere !important;
}

@media (max-width: 900px) {
    .ctpr-parts-request,
    .ctpr-client-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    .ctpr-parts-request .ctpr-grid-3cols,
    .ctpr-client-container .ctpr-grid-3cols {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 600px) {
    .ctpr-parts-request,
    .ctpr-client-container {
        border-radius: 10px !important;
        margin: 0 auto !important;
        overflow: hidden !important;
    }

    .ctpr-parts-request .ctpr-client-header,
    .ctpr-client-container .ctpr-client-header {
        padding: 16px 14px !important;
    }

    .ctpr-parts-request .ctpr-client-header h2,
    .ctpr-parts-request .ctpr-header-title,
    .ctpr-client-container .ctpr-client-header h2 {
        font-size: 19px !important;
        line-height: 1.4 !important;
        overflow-wrap: anywhere !important;
    }

    .ctpr-parts-request .ctpr-client-header p,
    .ctpr-parts-request .ctpr-header-desc,
    .ctpr-client-container .ctpr-header-desc {
        font-size: 12.5px !important;
    }

    .ctpr-parts-request .ctpr-form-body,
    .ctpr-client-container .ctpr-form-body {
        padding: 10px !important;
    }

    .ctpr-parts-request .ctpr-form-section,
    .ctpr-client-container .ctpr-form-section {
        padding: 12px !important;
        margin-bottom: 12px !important;
        border-radius: 10px !important;
    }

    .ctpr-parts-request .ctpr-grid-3cols,
    .ctpr-parts-request .ctpr-grid-2cols,
    .ctpr-parts-request .ctpr-grid-qty-notes,
    .ctpr-parts-request .ctpr-summary-grid,
    .ctpr-client-container .ctpr-grid-3cols,
    .ctpr-client-container .ctpr-grid-2cols,
    .ctpr-client-container .ctpr-grid-qty-notes,
    .ctpr-client-container .ctpr-summary-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
    }

    .ctpr-parts-request .ctpr-grid-row,
    .ctpr-client-container .ctpr-grid-row {
        gap: 12px !important;
        margin-bottom: 12px !important;
    }

    .ctpr-parts-request .ctpr-vehicle-mode-toggle-bar,
    .ctpr-client-container .ctpr-vehicle-mode-toggle-bar {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    .ctpr-parts-request .ctpr-btn-vehicle-mode,
    .ctpr-client-container .ctpr-btn-vehicle-mode {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        justify-content: center !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.45 !important;
        padding: 10px 12px !important;
    }

    .ctpr-parts-request .ctpr-steps-nav,
    .ctpr-client-container .ctpr-steps-nav {
        padding: 10px 6px !important;
        gap: 3px !important;
    }

    .ctpr-parts-request .ctpr-step-bubble,
    .ctpr-client-container .ctpr-step-bubble {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        font-size: 12px !important;
    }

    .ctpr-parts-request .ctpr-step-title,
    .ctpr-client-container .ctpr-step-title {
        font-size: 10px !important;
        line-height: 1.3 !important;
        overflow-wrap: anywhere !important;
    }

    .ctpr-parts-request .ctpr-section-title,
    .ctpr-client-container .ctpr-section-title {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    .ctpr-parts-request .ctpr-step-actions,
    .ctpr-client-container .ctpr-step-actions {
        display: flex !important;
        flex-direction: column-reverse !important;
        align-items: stretch !important;
        width: 100% !important;
        gap: 8px !important;
    }

    .ctpr-parts-request .ctpr-step-actions button,
    .ctpr-parts-request .ctpr-step-actions .ctpr-btn-primary,
    .ctpr-parts-request .ctpr-step-actions .ctpr-btn-secondary,
    .ctpr-parts-request .ctpr-step-actions .ctpr-btn-next,
    .ctpr-parts-request .ctpr-step-actions .ctpr-btn-prev,
    .ctpr-parts-request #ctpr-submit-btn,
    .ctpr-client-container .ctpr-step-actions button,
    .ctpr-client-container .ctpr-step-actions .ctpr-btn-primary,
    .ctpr-client-container .ctpr-step-actions .ctpr-btn-secondary,
    .ctpr-client-container .ctpr-step-actions .ctpr-btn-next,
    .ctpr-client-container .ctpr-step-actions .ctpr-btn-prev,
    .ctpr-client-container #ctpr-submit-btn {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 44px !important;
        justify-content: center !important;
        white-space: normal !important;
    }

    .ctpr-parts-request .ctpr-dropzone,
    .ctpr-client-container .ctpr-dropzone {
        padding: 18px 10px !important;
        font-size: 13px !important;
    }
}

@media (max-width: 360px) {
    .ctpr-parts-request .ctpr-client-header h2,
    .ctpr-parts-request .ctpr-header-title,
    .ctpr-client-container .ctpr-client-header h2 {
        font-size: 17px !important;
    }

    .ctpr-parts-request .ctpr-badge-accent,
    .ctpr-client-container .ctpr-badge-accent {
        font-size: 9px !important;
        letter-spacing: 0 !important;
    }

    .ctpr-parts-request .ctpr-step-title,
    .ctpr-client-container .ctpr-step-title {
        font-size: 9px !important;
    }
}


/* Multi-part request cards */
.ctpr-parts-list{display:flex;flex-direction:column;gap:16px;margin:12px 0 16px}
.ctpr-part-item{border:1px solid var(--ctpr-border,#d6e1ef);border-radius:12px;background:var(--ctpr-card-bg,#fff);padding:18px;min-width:0}
.ctpr-part-item-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;color:var(--ctpr-form-text,#163b60)}
.ctpr-part-remove-placeholder{font-size:12px;color:#64748b}
.ctpr-remove-part{border:1px solid #fecaca;background:#fff7f7;color:#b91c1c;border-radius:8px;padding:7px 11px;cursor:pointer}
.ctpr-add-part{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:0 0 10px;font-weight:700;min-height:44px}
.ctpr-part-item .ctpr-condition-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ctpr-part-item .ctpr-condition-btn{font:inherit;cursor:pointer;min-width:0;white-space:normal}
.ctpr-part-item .ctpr-grid-qty-notes{display:grid;grid-template-columns:minmax(130px,.7fr) minmax(0,2fr);gap:14px}
@media(max-width:640px){
 .ctpr-part-item{padding:12px}
 .ctpr-part-item .ctpr-condition-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ctpr-part-item .ctpr-grid-qty-notes{grid-template-columns:minmax(0,1fr)}
 .ctpr-part-item-heading{align-items:flex-start}
 .ctpr-add-part{width:100%}
}