/* Label and control text size overrides */

/* Base styles for smaller screens (mobile) */
label,
.form-label,
.form-control,
input,
select,
textarea,
button,
.btn,
table,
th,
td {
    font-size: 0.875rem !important; /* 14px */
}

/* Medium screens and above (tablets, desktops) */
@media (min-width: 768px) {
    label,
    .form-label,
    .form-control,
    input,
    select,
    textarea,
    button,
    .btn,
    table,
    th,
    td {
        font-size: 1rem !important; /* Bootstrap fs-6 size */
    }
}

/* Table text color overrides */
table,
table th,
table td,
.table,
.table th,
.table td {
    color: #00273a !important;
}

/* Bootstrap secondary color overrides */
:root {
    --bs-secondary: #00273a !important;
    --bs-secondary-rgb: 0, 39, 58 !important;
}

.bg-secondary {
    background-color: #00273a !important;
}

.text-secondary {
    color: #00273a !important;
}

.btn-secondary {
    background-color: #00273a !important;
    border-color: #00273a !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: #001d2a !important;
    border-color: #001d2a !important;
}

.btn-secondary:active,
.btn-secondary.active {
    background-color: #001420 !important;
    border-color: #001420 !important;
}

.btn-outline-secondary {
    color: #00273a !important;
    border-color: #00273a !important;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    background-color: #00273a !important;
    border-color: #00273a !important;
}

.border-secondary {
    border-color: #00273a !important;
}

.alert-secondary {
    background-color: #00273a !important;
    border-color: #00273a !important;
    color: #ffffff !important;
}

.badge-secondary,
.badge.bg-secondary {
    background-color: #00273a !important;
}

.list-group-item-secondary {
    background-color: #00273a !important;
    color: #ffffff !important;
}

.table-secondary {
    background-color: #00273a !important;
    color: #ffffff !important;
}

.text-bg-secondary {
    background-color: #00273a !important;
    color: #ffffff !important;
}

/* form-select: underline-only, no rounding, fa-list icon */
.form-select {
    border: none !important;
    border-bottom: 1px solid #00273a !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    background-color: white !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Crect fill='%2300273a' x='0' y='96' width='512' height='32'/%3E%3Crect fill='%2300273a' x='0' y='240' width='512' height='32'/%3E%3Crect fill='%2300273a' x='0' y='384' width='512' height='32'/%3E%3C/svg%3E") !important;
    background-position: right .75rem center !important;
    background-size: 16px 12px !important;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem !important;
    color: var(--bs-secondary) !important;
}

.form-select:focus {
    border-bottom-color: var(--bs-success) !important;
    box-shadow: none !important;
    outline: none !important;
}

.form-select.is-valid,
.was-validated .form-select:valid {
    border-bottom-color: var(--bs-success) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Crect fill='%2300273a' x='0' y='96' width='512' height='32'/%3E%3Crect fill='%2300273a' x='0' y='240' width='512' height='32'/%3E%3Crect fill='%2300273a' x='0' y='384' width='512' height='32'/%3E%3C/svg%3E") !important;
}

.form-select.is-invalid,
.was-validated .form-select:invalid {
    border-bottom-color: var(--bs-danger) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Crect fill='%2300273a' x='0' y='96' width='512' height='32'/%3E%3Crect fill='%2300273a' x='0' y='240' width='512' height='32'/%3E%3Crect fill='%2300273a' x='0' y='384' width='512' height='32'/%3E%3C/svg%3E") !important;
}

/* No borders for form controls inside tables */
table .form-select,
td .form-select,
table .form-control,
td .form-control {
    border-bottom: none !important;
}

/* form-control: underline-only, no rounding */
.form-control {
    border: none !important;
    border-bottom: 1px solid #00273a !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.form-control:read-only,
.form-control[readonly] {
    background-color: white !important;
}

.form-control:focus {
    border-bottom-color: var(--bs-success) !important;
    box-shadow: none !important;
    outline: none !important;
}

.form-control.is-valid,
.was-validated .form-control:valid {
    border-bottom-color: var(--bs-success) !important;
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
    border-bottom-color: var(--bs-danger) !important;
}
