/**
 * Form validation — error text matches required-field asterisk (var(--danger)).
 * Bootstrap hardcodes #ea5455 on .invalid-feedback; theme danger may differ (e.g. Limen #8B4444).
 */
:root {
    --wms-form-invalid-color: var(--danger);
    --wms-form-invalid-border: color-mix(in srgb, var(--danger) 45%, var(--bs-border-color, #d8d6de));
    --wms-form-invalid-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--danger) 14%, transparent);
    --bs-form-invalid-color: var(--danger);
    --bs-form-invalid-border-color: var(--wms-form-invalid-border);
}

.invalid-feedback,
.invalid-tooltip {
    color: var(--wms-form-invalid-color) !important;
}

form .error:not(input),
form span.error {
    color: var(--wms-form-invalid-color) !important;
}

.form-control.is-invalid,
.was-validated .form-control:invalid,
.form-select.is-invalid,
.was-validated .form-select:invalid,
.form-check-input.is-invalid,
.was-validated .form-check-input:invalid,
textarea.form-control.is-invalid,
.was-validated textarea.form-control:invalid {
    border-color: var(--wms-form-invalid-border) !important;
}

.form-control.is-invalid:focus,
.was-validated .form-control:invalid:focus,
.form-select.is-invalid:focus,
.was-validated .form-select:invalid:focus,
.form-check-input.is-invalid:focus,
.was-validated .form-check-input:invalid:focus {
    border-color: var(--wms-form-invalid-border) !important;
    box-shadow: var(--wms-form-invalid-shadow) !important;
}

.form-check-input.is-invalid ~ .form-check-label,
.was-validated .form-check-input:invalid ~ .form-check-label {
    color: inherit;
}

.input-group.is-invalid .input-group-text,
.input-group:not(.bootstrap-touchspin):focus-within .form-control.is-invalid,
.input-group:not(.bootstrap-touchspin):focus-within .input-group-text.is-invalid {
    border-color: var(--wms-form-invalid-border) !important;
}

.select2-container--default .select2-selection.is-invalid,
.select2-container--classic .select2-selection.is-invalid {
    border-color: var(--wms-form-invalid-border) !important;
}

/* Row-action kebab menus must not be clipped inside responsive tables */
.table-responsive:has(.datatable-row-actions) {
    overflow: visible;
}

.card-body:has(.table-responsive .datatable-row-actions) {
    overflow: visible;
}

.merchant-detail-inner-content > .tab-pane {
    overflow: visible;
}

.dropdown-menu .dt-action-form {
    margin: 0;
}

.dropdown-menu .dt-action-form .dropdown-item {
    width: 100%;
    text-align: inherit;
}