/* Global density polish: comfortable, readable data-entry fields. */
:root {
    --density-font-scale: 1;
    --control-min-height: 2.55rem;
    --control-min-height-sm: 2.15rem;
    --control-min-height-lg: 3.05rem;
    --control-x-padding: 0.82rem;
    --control-y-padding: 0.5rem;
}

html,
body {
    font-size: 16px;
}

body,
button,
input,
select,
textarea,
.table,
.btn,
.form-control,
.form-select,
.form-label,
.dropdown-menu,
.modal-content,
.card {
    font-size: 1rem;
}

h1,
.h1,
.display-1 {
    font-size: 2.5rem !important;
}

h2,
.h2,
.display-2 {
    font-size: 2rem !important;
}

h3,
.h3,
.display-3 {
    font-size: 1.75rem !important;
}

h4,
.h4,
.display-4,
.display-5,
.display-6 {
    font-size: 1.5rem !important;
}

h5,
.h5,
.fs-1,
.fs-2,
.fs-3 {
    font-size: 1.25rem !important;
}

h6,
.h6,
.fs-4,
.fs-5,
.fs-6 {
    font-size: 1rem !important;
}

small,
.small {
    font-size: 0.875rem !important;
}

.lead {
    font-size: 1.25rem !important;
}

.container,
.container-fluid {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
}

.mybody,
.page-container {
    padding: 0.25rem !important;
}

.glass-header,
.card-header,
.card-body,
.modal-header,
.modal-body,
.modal-footer,
.custom-modal-content {
    padding: 0.5rem !important;
}

.row {
    --bs-gutter-x: 0.5rem;
    --bs-gutter-y: 0.5rem;
}

.g-1,
.gx-1 {
    --bs-gutter-x: 0.125rem !important;
}

.g-1,
.gy-1 {
    --bs-gutter-y: 0.125rem !important;
}

.g-2,
.gx-2 {
    --bs-gutter-x: 0.25rem !important;
}

.g-2,
.gy-2 {
    --bs-gutter-y: 0.25rem !important;
}

.g-3,
.gx-3 {
    --bs-gutter-x: 0.5rem !important;
}

.g-3,
.gy-3 {
    --bs-gutter-y: 0.5rem !important;
}

.g-4,
.gx-4 {
    --bs-gutter-x: 0.75rem !important;
}

.g-4,
.gy-4 {
    --bs-gutter-y: 0.75rem !important;
}

.g-5,
.gx-5 {
    --bs-gutter-x: 1.5rem !important;
}

.g-5,
.gy-5 {
    --bs-gutter-y: 1.5rem !important;
}

.gap-1 {
    gap: 0.125rem !important;
}

.gap-2 {
    gap: 0.25rem !important;
}

.gap-3 {
    gap: 0.5rem !important;
}

.gap-4 {
    gap: 0.75rem !important;
}

.gap-5 {
    gap: 1.5rem !important;
}

.p-1,
.pt-1,
.py-1 {
    padding-top: 0.125rem !important;
}

.p-1,
.pb-1,
.py-1 {
    padding-bottom: 0.125rem !important;
}

.p-1,
.ps-1,
.px-1 {
    padding-left: 0.125rem !important;
}

.p-1,
.pe-1,
.px-1 {
    padding-right: 0.125rem !important;
}

.p-2,
.pt-2,
.py-2 {
    padding-top: 0.25rem !important;
}

.p-2,
.pb-2,
.py-2 {
    padding-bottom: 0.25rem !important;
}

.p-2,
.ps-2,
.px-2 {
    padding-left: 0.25rem !important;
}

.p-2,
.pe-2,
.px-2 {
    padding-right: 0.25rem !important;
}

.p-3,
.pt-3,
.py-3 {
    padding-top: 0.5rem !important;
}

.p-3,
.pb-3,
.py-3 {
    padding-bottom: 0.5rem !important;
}

.p-3,
.ps-3,
.px-3 {
    padding-left: 0.5rem !important;
}

.p-3,
.pe-3,
.px-3 {
    padding-right: 0.5rem !important;
}

.p-4,
.pt-4,
.py-4 {
    padding-top: 0.75rem !important;
}

.p-4,
.pb-4,
.py-4 {
    padding-bottom: 0.75rem !important;
}

.p-4,
.ps-4,
.px-4 {
    padding-left: 0.75rem !important;
}

.p-4,
.pe-4,
.px-4 {
    padding-right: 0.75rem !important;
}

.p-5,
.pt-5,
.py-5 {
    padding-top: 1.5rem !important;
}

.p-5,
.pb-5,
.py-5 {
    padding-bottom: 1.5rem !important;
}

.p-5,
.ps-5,
.px-5 {
    padding-left: 1.5rem !important;
}

.p-5,
.pe-5,
.px-5 {
    padding-right: 1.5rem !important;
}

.m-1,
.mt-1,
.my-1 {
    margin-top: 0.125rem !important;
}

.m-1,
.mb-1,
.my-1 {
    margin-bottom: 0.125rem !important;
}

.m-1,
.ms-1,
.mx-1 {
    margin-left: 0.125rem !important;
}

.m-1,
.me-1,
.mx-1 {
    margin-right: 0.125rem !important;
}

.m-2,
.mt-2,
.my-2 {
    margin-top: 0.25rem !important;
}

.m-2,
.mb-2,
.my-2 {
    margin-bottom: 0.25rem !important;
}

.m-2,
.ms-2,
.mx-2 {
    margin-left: 0.25rem !important;
}

.m-2,
.me-2,
.mx-2 {
    margin-right: 0.25rem !important;
}

.m-3,
.mt-3,
.my-3 {
    margin-top: 0.5rem !important;
}

.m-3,
.mb-3,
.my-3 {
    margin-bottom: 0.5rem !important;
}

.m-3,
.ms-3,
.mx-3 {
    margin-left: 0.5rem !important;
}

.m-3,
.me-3,
.mx-3 {
    margin-right: 0.5rem !important;
}

.m-4,
.mt-4,
.my-4 {
    margin-top: 0.75rem !important;
}

.m-4,
.mb-4,
.my-4 {
    margin-bottom: 0.75rem !important;
}

.m-4,
.ms-4,
.mx-4 {
    margin-left: 0.75rem !important;
}

.m-4,
.me-4,
.mx-4 {
    margin-right: 0.75rem !important;
}

.m-5,
.mt-5,
.my-5 {
    margin-top: 1.5rem !important;
}

.m-5,
.mb-5,
.my-5 {
    margin-bottom: 1.5rem !important;
}

.m-5,
.ms-5,
.mx-5 {
    margin-left: 1.5rem !important;
}

.m-5,
.me-5,
.mx-5 {
    margin-right: 1.5rem !important;
}

.btn {
    padding: 0.22rem 0.5rem !important;
    min-height: 1.7rem;
}

.btn-sm {
    padding: 0.12rem 0.35rem !important;
    min-height: 1.35rem;
}

.btn-lg {
    padding: 0.32rem 0.7rem !important;
    min-height: 2rem;
}

.form-control,
.form-select,
.glass-input,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,
textarea {
    width: 100%;
    min-height: var(--control-min-height);
    padding: var(--control-y-padding) var(--control-x-padding) !important;
    font-size: 0.98rem !important;
    font-weight: 400 !important;
    line-height: 1.35;
    letter-spacing: 0;
    border-radius: 0.85rem;
    text-overflow: ellipsis;
}

textarea,
.auto-size-textarea {
    min-height: 5.25rem;
    resize: vertical;
}

.form-select,
select {
    padding-right: 2.45rem !important;
    background-position: right 0.82rem center;
    white-space: nowrap;
}

.form-control-lg,
.form-select-lg {
    min-height: var(--control-min-height-lg);
    padding: 0.62rem 0.95rem !important;
    font-size: 1.04rem !important;
}

.form-control-sm,
.form-select-sm {
    min-height: var(--control-min-height-sm);
    padding: 0.35rem 0.62rem !important;
    font-size: 0.875rem !important;
}

input.fw-bold,
input.fw-semibold,
textarea.fw-bold,
textarea.fw-semibold,
select.fw-bold,
select.fw-semibold,
.form-control.fw-bold,
.form-control.fw-semibold,
.form-select.fw-bold,
.form-select.fw-semibold,
.glass-input.fw-bold,
.glass-input.fw-semibold {
    font-weight: 400 !important;
}

.table > :not(caption) > * > * {
    padding: 0.25rem 0.35rem !important;
}

.badge {
    padding: 0.22em 0.42em !important;
    font-size: 0.75rem !important;
}

label,
.form-label {
    margin-bottom: 0.32rem !important;
    margin-left: 0.15rem;
    color: #52677b;
    letter-spacing: 0;
}

.input-group > .form-control,
.input-group > .form-select,
.input-group > .glass-input {
    min-width: 0;
}

.input-group-text {
    min-height: var(--control-min-height);
    border-radius: 0.85rem;
    border-color: rgba(142, 174, 196, 0.34);
    background: rgba(255, 255, 255, 0.72);
}

.form-control:disabled,
.form-select:disabled,
.glass-input:disabled,
input:disabled,
select:disabled,
textarea:disabled {
    opacity: 0.72;
    cursor: not-allowed;
}

@media (min-width: 768px) {
    .row > .col-md-2:has(> .form-control),
    .row > .col-md-2:has(> .form-select),
    .row > .col-md-2:has(> .glass-input),
    .row > .col-md-2:has(> label + .form-control),
    .row > .col-md-2:has(> label + .form-select),
    .row > .col-md-2:has(> label + .glass-input),
    .row > .col-md-3:has(> .form-control),
    .row > .col-md-3:has(> .form-select),
    .row > .col-md-3:has(> .glass-input),
    .row > .col-md-3:has(> label + .form-control),
    .row > .col-md-3:has(> label + .form-select),
    .row > .col-md-3:has(> label + .glass-input) {
        flex: 1 1 clamp(12rem, 22%, 16rem);
        width: auto;
        min-width: min(100%, 12rem);
    }
}

@media (max-width: 575.98px) {
    .form-control,
    .form-select,
    .glass-input,
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea {
        min-height: 2.7rem;
        font-size: 1rem !important;
    }
}

input[type="checkbox"] {
    width: 14px;
    height: 14px;
    border-radius: 4px;
}

input[type="checkbox"]::after {
    width: 7px;
    height: 4px;
}
