/**
 * CRM modal validation — red outline + glow (Add Patient parity).
 * Loaded globally from header_v3.php after page extra_css.
 * Validation feedback is outline-only: no toasts, tooltips, or native browser bubbles.
 */

:root {
    --crm-invalid-border-dark: #f5576c;
    --crm-invalid-glow-dark: 0 0 0 0.2rem rgba(245, 87, 108, 0.28);
    --crm-invalid-border-light: #dc3545;
    --crm-invalid-glow-light: 0 0 0 0.2rem rgba(220, 53, 69, 0.22);
}

[data-bs-theme="dark"] .modal :is(
    .form-control.is-invalid,
    .form-select.is-invalid,
    textarea.form-control.is-invalid,
    .flatpickr-wrapper input.form-control.is-invalid,
    .flatpickr-wrapper.is-invalid input.form-control,
    .flatpickr-wrapper.is-invalid input.form-control:focus,
    .flatpickr-wrapper.is-invalid input.form-control:focus-visible,
    .select2-container.is-invalid .select2-selection,
    .select2-selection.is-invalid,
    .form-control.is-invalid:focus,
    .form-control.is-invalid:focus-visible,
    .form-select.is-invalid:focus,
    .form-select.is-invalid:focus-visible,
    .flatpickr-wrapper input.form-control.is-invalid:focus,
    .flatpickr-wrapper.is-invalid input.form-control:focus,
    .select2-container.is-invalid.select2-container--focus .select2-selection
) {
    border-color: var(--crm-invalid-border-dark) !important;
    box-shadow: var(--crm-invalid-glow-dark) !important;
}

[data-bs-theme="light"] .modal :is(
    .form-control.is-invalid,
    .form-select.is-invalid,
    textarea.form-control.is-invalid,
    .flatpickr-wrapper input.form-control.is-invalid,
    .flatpickr-wrapper.is-invalid input.form-control,
    .flatpickr-wrapper.is-invalid input.form-control:focus,
    .flatpickr-wrapper.is-invalid input.form-control:focus-visible,
    .select2-container.is-invalid .select2-selection,
    .select2-selection.is-invalid,
    .form-control.is-invalid:focus,
    .form-control.is-invalid:focus-visible,
    .form-select.is-invalid:focus,
    .form-select.is-invalid:focus-visible,
    .flatpickr-wrapper input.form-control.is-invalid:focus,
    .flatpickr-wrapper.is-invalid input.form-control:focus,
    .select2-container.is-invalid.select2-container--focus .select2-selection
) {
    border-color: var(--crm-invalid-border-light) !important;
    box-shadow: var(--crm-invalid-glow-light) !important;
}

[data-bs-theme="dark"] .modal [data-entity-upload-card]:has(.entity-file-input.is-invalid) .crm-treatment-doc-card {
    border-color: var(--crm-invalid-border-dark) !important;
    box-shadow: var(--crm-invalid-glow-dark) !important;
}

[data-bs-theme="light"] .modal [data-entity-upload-card]:has(.entity-file-input.is-invalid) .crm-treatment-doc-card {
    border-color: var(--crm-invalid-border-light) !important;
    box-shadow: var(--crm-invalid-glow-light) !important;
}

[data-bs-theme="dark"] .modal .invalid-feedback,
[data-bs-theme="dark"] .modal .invalid-feedback[data-patient-id-docs-error],
[data-bs-theme="dark"] .modal .invalid-feedback[data-companion-contact-error],
[data-bs-theme="dark"] .modal .text-danger,
[data-bs-theme="dark"] .modal [data-patient-id-docs-error],
[data-bs-theme="dark"] .modal [data-companion-contact-error] {
    color: #f87171 !important;
}

[data-bs-theme="light"] .modal .invalid-feedback,
[data-bs-theme="light"] .modal .invalid-feedback[data-patient-id-docs-error],
[data-bs-theme="light"] .modal .invalid-feedback[data-companion-contact-error] {
    display: block;
    color: #dc3545 !important;
}

[data-bs-theme="dark"] .modal .invalid-feedback[data-companion-phone-error],
[data-bs-theme="light"] .modal .invalid-feedback[data-companion-phone-error] {
    display: none !important;
}

[data-bs-theme="dark"] .modal .btn.is-invalid,
[data-bs-theme="light"] .modal .btn.is-invalid,
[data-bs-theme="dark"] .modal .crm-conv-next-action-pill.is-invalid,
[data-bs-theme="light"] .modal .crm-conv-next-action-pill.is-invalid {
    border-color: var(--crm-invalid-border-dark) !important;
    box-shadow: var(--crm-invalid-glow-dark) !important;
}

[data-bs-theme="light"] .modal .btn.is-invalid,
[data-bs-theme="light"] .modal .crm-conv-next-action-pill.is-invalid {
    border-color: var(--crm-invalid-border-light) !important;
    box-shadow: var(--crm-invalid-glow-light) !important;
}

/* Invalid ring belongs on the field, never the accordion container. */
.modal .collapsible-section,
.modal .accordion-item,
.modal .section-header,
.modal .accordion-button {
    outline: none !important;
}

.modal .collapsible-section:focus,
.modal .collapsible-section:focus-within,
.modal .accordion-item:focus,
.modal .accordion-item:focus-within,
.modal .section-header:focus,
.modal .section-header:focus-visible,
.modal .accordion-button:focus,
.modal .accordion-button:focus-visible {
    outline: none !important;
}

.modal .section-header.hr-acc-invalid-btn,
.modal .accordion-button.hr-acc-invalid-btn,
.modal .collapsible-section.hr-acc-invalid-btn,
.modal .accordion-item.hr-acc-invalid-btn {
    border-color: inherit !important;
    box-shadow: none !important;
    outline: none !important;
}

.modal .collapsible-section.active > .section-header.hr-acc-invalid-btn,
.modal .collapsible-section.active > button.section-header.hr-acc-invalid-btn {
    border: none !important;
    box-shadow: none !important;
}

.modal :is(input, select, textarea, .form-control, .form-select):invalid,
.modal :is(input, select, textarea, .form-control, .form-select):user-invalid {
    outline: none;
}

.tooltip.patient-required-tooltip,
.tooltip.crm-field-required-tooltip {
    z-index: 20050 !important;
}

.tooltip.patient-required-tooltip .tooltip-inner,
.tooltip.crm-field-required-tooltip .tooltip-inner {
    background: #dc3545 !important;
    color: #ffffff !important;
    font-size: 0.8rem;
    font-weight: 600;
}

.tooltip.patient-required-tooltip.bs-tooltip-top .tooltip-arrow::before,
.tooltip.patient-required-tooltip .tooltip-arrow::before,
.tooltip.crm-field-required-tooltip.bs-tooltip-top .tooltip-arrow::before,
.tooltip.crm-field-required-tooltip .tooltip-arrow::before {
    border-top-color: #dc3545 !important;
}

[data-bs-theme="dark"] .modal .tooltip.patient-required-tooltip .tooltip-inner,
[data-bs-theme="dark"] .modal .tooltip.patient-required-tooltip div,
[data-bs-theme="dark"] .modal .tooltip.crm-field-required-tooltip .tooltip-inner,
[data-bs-theme="dark"] .modal .tooltip.crm-field-required-tooltip div {
    color: #ffffff !important;
}