/*
 * The admin base stylesheet (milestones B1 and B4).
 *
 * BootstrapBlazor's stylesheet (bootstrapblazor.min.css 20.1.3) did not only style its own
 * components: it also restyled plain elements and Bootstrap/Theme.Base classes on every admin
 * page - check boxes, links, disabled controls, tables, list groups, pagination, popovers,
 * modals, toasts. FrameworkSiteInfo links this file in that sheet's place - before the theme's
 * sheet, exactly where BootstrapBlazor's was - on every document of the theme: the Vue admin
 * shell (milestone B1), the downstream Razor admin pages on _AdminLayout and every public page
 * (milestone B4; the Fluid theme's _Head partial links it the same way). No page links
 * BootstrapBlazor's sheet any more; the Tailwind theme links neither.
 *
 * What is here: the declarations of BootstrapBlazor's sheet whose selector needs no
 * BootstrapBlazor-only class and that were in effect on the admin - the ones Theme.Base's
 * compiled CSS and /api/themes/admin-variables.css did not override for the same element - under
 * Atheox variable names. Rules that only served BootstrapBlazor components, rules for markup no
 * admin page renders and declarations without a visible effect are not carried over.
 *
 * Cascade. The selectors are BootstrapBlazor's and the file sits where its sheet sat, so every
 * tie resolves as it did: the theme, linked after this file, wins wherever it states the same
 * property with equal or higher specificity (for example Bootstrap's `.row > *` gutter on a
 * `.col-* .form-check`), and these rules win where BootstrapBlazor's did.
 *
 * Colours. BootstrapBlazor's literal colours follow the theme instead (owner decision 2026-10-06):
 * the hover border is the accent tinted half towards white (Bootstrap's focus-border tint), the
 * check box focus border the tertiary text colour, the dark dropdown surface the neutral ramp's
 * 700 step. A named accent is written onto <body>, so the hover border is resolved there too.
 */

:root,
body {
    --a-base-control-height: 35px;
    --a-base-border-hover-color: color-mix(in srgb, var(--bs-primary), #fff 50%);
}

/* Links, labels and disabled controls */
a,
[for] {
    cursor: pointer;
}

a:focus {
    text-decoration: none;
}

[disabled],
:disabled,
.disabled,
.disabled > * {
    cursor: not-allowed !important;
}

:disabled {
    background-color: var(--bs-secondary-bg);
    opacity: 1;
}

:focus-visible,
:focus {
    outline: none;
}

/* Input groups and button groups */
.input-group > [data-bs-toggle] {
    flex: 1;
    text-overflow: ellipsis;
    overflow: hidden;
}

.input-group > [data-bs-toggle]:not(:last-child) > .form-control,
.btn-group > [data-bs-toggle]:not(:last-child) > .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group > [data-bs-toggle]:not(:first-child) > .form-control,
.btn-group > [data-bs-toggle]:not(:first-child) > .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group > .input-group-text:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group > .input-group-text:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group > :not(:first-child).dropdown > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group > :not(:last-child).dropdown > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group > .form-label {
    display: none;
}

.input-group > .form-check {
    --a-base-input-group-check-padding: 0.375rem 0.75rem;
    display: flex;
    align-items: center;
    padding: var(--a-base-input-group-check-padding);
}

.input-group > .form-range {
    --a-base-input-group-range-padding: 0.375rem 0.75rem;
    height: var(--a-base-control-height);
    padding: var(--a-base-input-group-range-padding);
}

.input-group > .form-check,
.input-group .form-range {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    flex-grow: 1;
    width: 1%;
    min-width: 0;
}

.input-group > .form-check:hover,
.input-group .form-range:hover {
    border: 1px solid var(--a-base-border-hover-color);
}

.row {
    --a-base-range-margin-top: 6px;
}

.row > div[class^=col-] > .form-range {
    margin-block-start: var(--a-base-range-margin-top);
}

.form-range:disabled {
    background-color: unset;
}

/* Form controls */
.form-control.is-valid[type=number],
.form-control.is-invalid[type=number] {
    padding-right: 0.75rem;
    background-image: none;
}

/* BootstrapBlazor also excluded two classes of its own components here; no admin markup carries
   them, so the rule is 0,6,0 instead of 0,8,0 - above every theme rule for this border. */
.form-control:not(.disabled):not(:disabled):not(.is-valid):not(.is-invalid):hover {
    border: var(--bs-border-width) solid var(--a-base-border-hover-color);
}

.form-select:not(:disabled):hover {
    border-color: var(--a-base-border-hover-color);
}

/* Check boxes and radios */
.form-check {
    --a-base-check-size: 1rem;
    --a-base-check-focus-border-color: var(--bs-tertiary-color);
    --a-base-check-disabled-opacity: 0.5;
    padding: 0;
    margin: 0;
}

.form-check .form-check-input {
    width: var(--a-base-check-size);
    height: var(--a-base-check-size);
    margin: 3px 0 1px 0;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-check .form-check-input + .form-check-label {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
    margin-inline-start: 0.5rem;
    flex: 1;
}

.form-check .form-check-input:active {
    filter: none;
}

.form-check .form-check-input:focus {
    border-color: var(--a-base-check-focus-border-color);
    box-shadow: none;
}

.form-check .form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.form-check .form-check-input:disabled {
    pointer-events: none;
    filter: none;
    opacity: var(--a-base-check-disabled-opacity);
}

.form-check .form-check-input[type=checkbox]:indeterminate {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.form-check .form-check-input:disabled ~ .form-check-label,
.form-check .form-check-input[disabled] ~ .form-check-label {
    opacity: var(--a-base-check-disabled-opacity);
}

@media (prefers-reduced-motion: reduce) {
    .form-check-input {
        transition: none;
    }
}

/* Buttons, badges, alerts, avatars, card headers */
.btn {
    --a-base-btn-label-gap: 4px;
}

.btn .badge,
.btn i + span,
.badge i + span {
    margin-inline-start: var(--a-base-btn-label-gap);
}

.alert {
    --a-base-alert-icon-gap: 0.5rem;
}

.alert .alert-icon {
    margin-inline-end: var(--a-base-alert-icon-gap);
}

.avatar img {
    width: 100%;
    object-fit: cover;
}

.avatar > i {
    font-size: var(--bs-avatar-icon-size);
}

.card-header .card-title {
    flex: 1;
}

/* Accordions */
.accordion {
    --bs-accordion-btn-focus-box-shadow: none;
}

.accordion .accordion-header {
    display: flex;
    align-items: center;
    width: 100%;
    overflow: hidden;
}

.accordion .accordion-header:not(.collapsed) {
    background-color: var(--bs-accordion-active-bg);
}

.accordion .accordion-header .accordion-button {
    --bs-accordion-inner-border-radius: 0;
    flex: 1 1 auto;
    width: 1%;
    cursor: pointer;
}

.accordion .accordion-item:first-of-type .accordion-header {
    border-top-left-radius: var(--bs-accordion-inner-border-radius);
    border-top-right-radius: var(--bs-accordion-inner-border-radius);
}

.accordion .accordion-item:last-of-type .accordion-header.collapsed {
    border-bottom-left-radius: var(--bs-accordion-inner-border-radius);
    border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
}

/* Headings, footer, list groups, timelines */
section > h2 {
    margin: 2rem 0 1rem 0;
}

.footer {
    display: flex;
}

.list-group {
    border: var(--bs-list-group-border-width) solid var(--bs-list-group-border-color);
    overflow: auto;
    height: 100%;
}

.timeline {
    margin: 0;
}

/* Dropdowns */
[data-bs-theme=dark] .dropdown-menu {
    --bs-dropdown-bg: var(--bs-gray-700);
}

.dropdown-item {
    cursor: pointer;
}

.dropdown-item > i + span {
    margin-inline-start: 0.25rem;
}

.show > .dropdown-menu {
    display: block;
}

/* Pagination */
.pagination {
    --a-base-page-link-padding: 0.25rem 0.35rem;
    flex: 1 1 auto;
    justify-content: flex-end;
}

@media (min-width: 375px) {
    .pagination {
        --a-base-page-link-padding: 0.25rem 0.5rem;
    }
}

@media (min-width: 456px) {
    .pagination {
        --a-base-page-link-padding: 0.25rem 0.75rem;
    }
}

.pagination .page-link {
    padding: var(--a-base-page-link-padding);
    cursor: pointer;
}

[data-bs-theme=dark] .pagination {
    --bs-pagination-active-border-color: var(--bs-border-color);
}

[dir=rtl] .pagination .page-item:first-child .page-link > i,
[dir=rtl] .pagination .page-item:last-child .page-link > i {
    transform: rotate(180deg);
}

/* Popovers */
.popover {
    --a-base-popover-min-width: 240px;
    min-width: var(--a-base-popover-min-width);
}

/* Modals */
.modal-backdrop.show + .modal-backdrop.show {
    display: none;
}

.modal-content {
    min-height: 160px;
    min-width: 210px;
}

.modal-footer button:not(:last-child) {
    margin-inline-end: 0.5rem;
}

/* Tables */
.table thead th {
    border-top: none;
    vertical-align: top;
    overflow: hidden;
}

.table tbody td {
    border-top: none;
}

.table td,
.table th {
    min-width: 0;
    text-overflow: ellipsis;
}

.table-bordered thead tr:last-child > th {
    border-bottom-width: 2px;
    border-bottom-color: rgba(var(--bs-body-color-rgb), 0.125);
}

/* Toasts */
.toast-container.top-0 {
    top: 1rem !important;
}

.toast-container.bottom-0 {
    bottom: 1rem !important;
}

.toast-container.start-0 {
    left: 1rem !important;
}

.toast-container.end-0 {
    right: 1rem !important;
}

.toast {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: background-color 0.3s ease-in-out, opacity 0.15s linear;
}

.toast .btn-close {
    height: 4px;
    width: 4px;
    margin: 0;
}
