/* Form Validation Styles - Shared across all circuit management forms */
/* AGGRESSIVE removal of all green validation styling */

/* Required asterisk styling */
.required-asterisk {
    color: #dc3545;
    font-weight: bold;
    margin-left: 2px;
}

/* ============================================ */
/* REMOVE ALL GREEN VALIDATION STYLING */
/* ============================================ */

/* Remove green borders and checkmarks from ALL inputs */
/* Text inputs, textarea, file - remove green checkmark */
.was-validated .form-control:valid,
.was-validated textarea:valid,
.was-validated input:not([type="checkbox"]):not([type="radio"]):valid,
.was-validated input[type="text"]:valid,
.was-validated input[type="date"]:valid,
.was-validated input[type="file"]:valid,
.was-validated input[type="email"]:valid,
.was-validated input[type="number"]:valid,
.form-control.is-valid,
textarea.is-valid,
input:not([type="checkbox"]):not([type="radio"]).is-valid,
.form-control:valid,
textarea:valid,
input:not([type="checkbox"]):not([type="radio"]):valid {
    border-color: #ced4da !important;
    background-image: none !important;
    padding-right: 0.75rem !important;
    background-color: #fff !important;
}

/* Select dropdowns - remove green checkmark but KEEP Bootstrap's default dropdown arrow */
.was-validated .form-select:valid,
.was-validated select:valid,
.form-select.is-valid,
select.is-valid,
.form-select:valid,
select:valid {
    border-color: #ced4da !important;
    background-color: #fff !important;
    /* DO NOT set background-image: none - let Bootstrap's default arrow show */
}

/* Remove green focus styling */
.was-validated .form-control:valid:focus,
.was-validated .form-select:valid:focus,
.was-validated textarea:valid:focus,
.was-validated input:valid:focus,
.form-control.is-valid:focus,
.form-select.is-valid:focus,
textarea.is-valid:focus,
input.is-valid:focus {
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

/* Remove green from checkboxes and radio buttons (but NOT form-switch toggles) */
.was-validated .form-check-input:not([role="switch"]):valid,
.form-check-input:not([role="switch"]).is-valid,
.form-check-input:not([role="switch"]):valid,
.was-validated input[type="radio"]:valid,
.was-validated input[type="checkbox"]:not([role="switch"]):valid,
input[type="radio"].is-valid,
input[type="checkbox"]:not([role="switch"]).is-valid,
input[type="radio"]:valid,
input[type="checkbox"]:not([role="switch"]):valid {
    border-color: #6c757d !important;
    background-color: transparent !important;
    background-image: none !important;
}

.was-validated .form-check-input:not([role="switch"]):valid:checked,
.form-check-input:not([role="switch"]).is-valid:checked,
.was-validated input[type="radio"]:valid:checked,
.was-validated input[type="checkbox"]:not([role="switch"]):valid:checked,
input[type="radio"].is-valid:checked,
input[type="checkbox"]:not([role="switch"]).is-valid:checked,
input[type="radio"]:valid:checked,
input[type="checkbox"]:not([role="switch"]):valid:checked {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
}

/* Restore inner white dot for valid checked radio buttons */
.was-validated .form-check-input[type="radio"]:valid:checked,
input[type="radio"].is-valid:checked,
input[type="radio"]:valid:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e") !important;
}

/* Restore inner white checkmark for valid checked checkboxes */
.was-validated .form-check-input[type="checkbox"]:not([role="switch"]):valid:checked,
input[type="checkbox"]:not([role="switch"]).is-valid:checked,
input[type="checkbox"]:not([role="switch"]):valid:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") !important;
}

.was-validated .form-check-input:not([role="switch"]):valid:focus,
.form-check-input:not([role="switch"]).is-valid:focus,
.was-validated input[type="radio"]:valid:focus,
.was-validated input[type="checkbox"]:not([role="switch"]):valid:focus,
input[type="radio"].is-valid:focus,
input[type="checkbox"]:not([role="switch"]).is-valid:focus {
    border-color: #6c757d !important;
    box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.25) !important;
}

/* Prevent any green text */
.was-validated .form-check-label,
.was-validated .form-label,
.form-check-input:valid ~ .form-check-label,
.form-check-input.is-valid ~ .form-check-label,
.was-validated :valid:not(button):not(.btn),
.is-valid:not(button):not(.btn) {
    color: inherit !important;
}

/* ============================================ */
/* SMALLER RADIO BUTTONS - ALL FORMS */
/* ============================================ */
/* Apply to ALL radio buttons in new-request and care-issue forms */
.form-check-input[type="radio"] {
    width: 0.75em !important;
    height: 0.75em !important;
    margin-top: 0.25em;
}

.form-check-input[type="radio"]:checked {
    background-size: 0.5em !important;
}

/* Specific styling for radio buttons in radio-group-card */
.radio-group-card .form-check-input[type="radio"] {
    width: 0.75em !important;
    height: 0.75em !important;
    margin-top: 0.2em;
}

.radio-group-card .form-check-input[type="radio"]:checked {
    background-size: 0.5em !important;
}

.radio-group-card .form-check-label {
    font-size: 0.875em;
    padding-left: 0.2em;
}

.radio-group-card .form-check-inline {
    margin-right: 0.75rem;
}

/* COMPLETELY hide valid feedback */
.valid-feedback,
.was-validated .form-control:valid ~ .valid-feedback,
.was-validated .form-select:valid ~ .valid-feedback,
.was-validated textarea:valid ~ .valid-feedback,
.was-validated input:valid ~ .valid-feedback,
.form-control.is-valid ~ .valid-feedback,
.form-select.is-valid ~ .valid-feedback,
textarea.is-valid ~ .valid-feedback,
input.is-valid ~ .valid-feedback {
    display: none !important;
    visibility: hidden !important;
}

/* Remove any ::before and ::after pseudo elements that might show checkmarks */
.was-validated .form-control:valid::before,
.was-validated .form-control:valid::after,
.was-validated .form-select:valid::before,
.was-validated .form-select:valid::after,
.was-validated input:valid::before,
.was-validated input:valid::after,
.form-control.is-valid::before,
.form-control.is-valid::after,
.form-select.is-valid::before,
.form-select.is-valid::after,
input.is-valid::before,
input.is-valid::after {
    display: none !important;
    content: none !important;
}

/* ============================================ */
/* RED VALIDATION FOR INVALID FIELDS ONLY */
/* ============================================ */

/* Invalid field styling - red validation for required fields */
.was-validated .form-control:invalid,
.was-validated .form-select:invalid,
.was-validated textarea:invalid,
.was-validated input:not([type="checkbox"]):not([type="radio"]):invalid,
.form-control.is-invalid,
.form-select.is-invalid,
textarea.is-invalid,
input:not([type="checkbox"]):not([type="radio"]).is-invalid {
    border-color: #dc3545 !important;
    padding-right: calc(1.5em + 0.75rem) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right calc(0.375em + 0.1875rem) center !important;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}

/* Invalid field focus styling */
.was-validated .form-control:invalid:focus,
.was-validated .form-select:invalid:focus,
.was-validated textarea:invalid:focus,
.was-validated input:not([type="checkbox"]):not([type="radio"]):invalid:focus,
.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
textarea.is-invalid:focus,
input:not([type="checkbox"]):not([type="radio"]).is-invalid:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25) !important;
}

/* Invalid feedback message - "This field is required" */
.invalid-feedback {
    display: none;
    color: #dc3545 !important;
    font-size: 0.875em;
    margin-top: 0.25rem;
}

.was-validated .form-control:invalid ~ .invalid-feedback,
.was-validated .form-select:invalid ~ .invalid-feedback,
.was-validated textarea:invalid ~ .invalid-feedback,
.was-validated input:not([type="checkbox"]):not([type="radio"]):invalid ~ .invalid-feedback,
.form-control.is-invalid ~ .invalid-feedback,
.form-select.is-invalid ~ .invalid-feedback,
textarea.is-invalid ~ .invalid-feedback,
input:not([type="checkbox"]):not([type="radio"]).is-invalid ~ .invalid-feedback {
    display: block !important;
}
