/*
 * Compatibility layer for Bootstrap-era admin markup. Components consume
 * semantic tokens; tenant custom-css remains the final, intentional cascade.
 */
/*
 * Single-select geometry shared by portal, quiz and public/account layouts.
 * Only indicator properties are important: legacy page styles use background
 * and padding shorthands (including on focus). Leave dimensions, fonts, surface,
 * borders and native popup/keyboard behavior with their existing owners.
 * A size greater than one is a listbox, not a collapsed dropdown.
 */
select:not([multiple]):is(:not([size]), [size="0"], [size="1"]) {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: var(--hm-select-indicator) !important;
    background-repeat: no-repeat !important;
    background-position: right var(--hm-select-arrow-inset) center !important;
    background-size: var(--hm-select-arrow-size) var(--hm-select-arrow-size) !important;
    padding-right: var(--hm-select-text-clearance) !important;
}

/* Select2's existing clear affordance floats inside the rendered text box.
 * Reserve the arrow gutter outside that box so clear and long labels still fit.
 * Use the same image rather than depending on the legacy icon font loading.
 */
.select2-container .select2-selection--single .select2-selection__rendered {
    padding-right: var(--hm-select-text-clearance) !important;
}
.select2-container .select2-selection--single .select2-selection__arrow::after {
    content: "" !important;
    position: absolute;
    top: 50%;
    right: var(--hm-select-arrow-inset);
    width: var(--hm-select-arrow-size);
    height: var(--hm-select-arrow-size);
    margin-top: -6px;
    background: var(--hm-select-indicator) center / contain no-repeat;
    pointer-events: none;
}
.select2-container--open .select2-selection--single .select2-selection__arrow::after {
    transform: rotate(180deg);
}

@media (forced-colors: active) {
    select:not([multiple]):is(:not([size]), [size="0"], [size="1"]) {
        -webkit-appearance: auto !important;
        -moz-appearance: auto !important;
        appearance: auto !important;
        background-image: none !important;
    }
    /* Images may be suppressed in High Contrast. CSS borders use system ink. */
    .select2-container .select2-selection--single .select2-selection__arrow::after {
        width: 8px;
        height: 8px;
        margin-top: -6px;
        background: none;
        border: solid ButtonText;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
    }
    .select2-container--open .select2-selection--single .select2-selection__arrow::after {
        margin-top: -2px;
        transform: rotate(225deg);
    }
}

.portal-shell .panel,
.portal-shell .well,
.portal-shell .thumbnail,
.portal-shell .dropdown-menu,
.portal-shell .modal-content,
.portal-shell .popover {
    color: var(--hm-ink);
    background-color: var(--hm-surface);
    border-color: var(--hm-border);
    box-shadow: var(--hm-shadow-sm);
}

.portal-shell .panel-heading,
.portal-shell .modal-header,
.portal-shell .modal-footer {
    background-color: var(--hm-surface-soft);
    border-color: var(--hm-border);
}

/* Keep the Bootstrap-era shared heading surfaces on one semantic spacing
   contract; component-specific layout remains owned by its component CSS. */
.portal-shell .panel > .panel-heading,
.portal-shell .panel-flat > .panel-heading,
.portal-shell .modal-header {
    padding: var(--hm-header-inset-y) var(--hm-header-inset-x);
}

.portal-shell .table > thead > tr > th,
.portal-shell .table > tbody > tr > td {
    border-color: var(--hm-border);
}

.portal-shell .table-striped > tbody > tr:nth-of-type(odd),
.portal-shell .table-hover > tbody > tr:hover {
    background-color: var(--hm-surface-soft);
}

.portal-shell .table > tbody > tr:hover,
.portal-shell .dropdown-menu > li > a:hover,
.portal-shell .dropdown-menu > li > a:focus {
    color: var(--hm-ink);
    background-color: var(--hm-surface-hover);
}

.portal-shell .form-control,
.portal-shell .select2-container--default .select2-selection--single,
.portal-shell .dataTables_length select {
    color: var(--hm-ink);
    background-color: var(--hm-surface);
    border-color: var(--hm-border-strong);
}

.portal-shell .form-control::placeholder {
    color: var(--hm-muted);
}

.portal-shell .help-block,
.portal-shell .text-muted {
    color: var(--hm-muted);
}

.portal-shell .has-error .form-control {
    border-color: var(--hm-danger);
}

.portal-shell .has-error .help-block,
.portal-shell .has-error .control-label,
.portal-shell .text-danger {
    color: var(--hm-danger);
}

.portal-shell .btn-primary,
.portal-shell .label-primary,
.portal-shell .badge-primary {
    color: #fff;
    background-color: var(--hm-brand-blue);
    border-color: var(--hm-brand-blue-dark);
}

.portal-shell .btn-primary:hover,
.portal-shell .btn-primary:focus,
.portal-shell .btn-primary:active {
    background-color: var(--hm-brand-blue-dark);
    border-color: var(--hm-brand-navy-deep);
}

/* Small informational text needs AA contrast; keep action colors independent.
 * Use existing shield tokens, including their dark-theme contrast pairing. */
.portal-shell .label-primary,
.portal-shell .badge-primary {
    color: var(--hm-brand-blue-contrast);
    background-color: var(--hm-brand-blue-dark);
}

.portal-shell .btn-default {
    color: var(--hm-ink);
    background-color: var(--hm-surface);
    border-color: var(--hm-border-strong);
}

.portal-shell .btn-default:hover,
.portal-shell .btn-default:focus,
.portal-shell .btn-default:active {
    color: var(--hm-ink);
    background-color: var(--hm-surface-hover);
    border-color: var(--hm-brand-blue);
}

/*
 * HIPAAmart does not use green as a product status or action color.
 * Map Bootstrap's historical success/green vocabulary to the shield blue
 * palette everywhere, including legacy views outside the portal shell.
 */
.btn-success,
.label-success,
.badge-success,
.bg-success,
.bg-success-300,
.bg-success-400,
.bg-success-600,
.bg-success-700,
.bg-success-800,
.bg-green,
.bg-green-300,
.bg-green-400,
.bg-green-600,
.bg-green-700,
.bg-green-800,
.progress-bar-success {
    border-color: var(--hm-brand-blue-dark) !important;
    background-color: var(--hm-brand-blue) !important;
    color: var(--hm-brand-blue-contrast) !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
    border-color: var(--hm-brand-navy-deep) !important;
    background-color: var(--hm-brand-blue-dark) !important;
    color: var(--hm-brand-blue-contrast) !important;
}

.label-success,
.badge-success {
    background-color: var(--hm-brand-blue-dark) !important;
    color: var(--hm-brand-blue-contrast) !important;
}

.text-success,
.text-success-300,
.text-success-400,
.text-success-600,
.text-success-700,
.text-success-800,
.text-green,
.text-green-300,
.text-green-400,
.text-green-600,
.text-green-700,
.text-green-800 {
    color: var(--hm-brand-blue-dark) !important;
}

.border-success,
.border-success-300,
.border-success-400,
.border-success-600,
.border-success-700,
.border-success-800,
.border-green,
.border-green-300,
.border-green-400,
.border-green-600,
.border-green-700,
.border-green-800,
.panel-success {
    border-color: var(--hm-brand-blue) !important;
}

.alert-success,
.list-group-item-success,
.panel-success > .panel-heading {
    border-color: var(--hm-brand-blue) !important;
    background-color: var(--hm-success-soft) !important;
    color: var(--hm-info-ink) !important;
}

.alert-success a,
.list-group-item-success a,
.panel-success > .panel-heading a {
    color: inherit !important;
}

.portal-shell .alert-info,
.portal-shell .label-info,
.portal-shell .badge-info {
    color: var(--hm-info-ink);
    background-color: var(--hm-info-soft);
    border-color: var(--hm-info);
}

.portal-shell .alert-warning,
.portal-shell .label-warning,
.portal-shell .badge-warning {
    color: var(--hm-warning);
    background-color: var(--hm-warning-soft);
    border-color: var(--hm-warning);
}

.portal-shell .alert-danger,
.portal-shell .label-danger,
.portal-shell .badge-danger {
    color: var(--hm-danger);
    background-color: var(--hm-danger-soft);
    border-color: var(--hm-danger);
}

.portal-shell .alert a {
    color: inherit;
    text-decoration: underline;
}

.portal-shell .iti--allow-dropdown {
    width: 100%;
}