/* Defines the main display font */
@font-face {
    font-family: 'Concourse';
    src: url('/fonts/concourse_t3_regular.woff') format('woff');
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Concourse';
    src: url('/fonts/concourse_t3_italic.woff') format('woff');
    font-weight: 300;
    font-stretch: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Concourse';
    src: url('/fonts/concourse_t4_regular.woff') format('woff');
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Concourse';
    src: url('/fonts/concourse_t4_italic.woff') format('woff');
    font-weight: 400;
    font-stretch: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Concourse';
    src: url('/fonts/concourse_t4_bold.woff') format('woff');
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Concourse';
    src: url('/fonts/concourse_t4_bold_italic.woff') format('woff');
    font-weight: 500;
    font-stretch: normal;
    font-style: italic;
}

/* CSS Variables (not supported in IE11) */
* {
    font-family: 'Concourse';
    font-weight: 300;
    font-style: normal;
    --tame-red: #A22135;
    --tame-blue: #073086;
}

/* Navigation and Layout */
nav.bg-dark {
    background-color: #073086 !important; /*var(--tame-blue)*/
}

body {
    padding-top: 90px; /* Updated from 50px for fixed navbar */
    padding-bottom: 20px;
}

.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Navbar Product Logo */
#NavbarProductLogo {
    background-image: url("/images/tame-demos-cream.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

#NavbarProductLogo:hover {
    background-image: url("/images/tame-demos-white.svg");
}

/* Typography */
h1 {
    margin-bottom: 20px;
}

.footer {
    font-size: small;
}

div.subtitle {
    font-size: 20px;
}

div.result {
    line-height: 1.5;
    font-size: 20px;
}

.result-value {
    font-weight: 700;
}

/* Forms and Inputs */
.form-group {
    margin-bottom: 8px;
}

.dl-horizontal dt {
    white-space: normal;
}

/* Input Validation Styles */
.error-block {
    min-height: 24px;
    padding-left: 11px;
    text-align: left;
}

.invalid-feedback {
    min-height: 20px;
    padding-left: 11px;
    text-align: left;
    display: block;
}

.validation-summary-errors ul {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 0;
}

input.input-validation-error, input.input-validation-error:focus {
    background-color: yellow;
    border: 3px solid red;
}

input.valid {
    border: 2px solid green;
}

/* Required Field Styling */
input[required] {
    background: url('/images/RequiredFieldMarker.png') no-repeat;
    background-position: right top;
}

/* Number Input Styling */
input[type=number] {
    padding-right: 16px;
    -moz-appearance: textfield;
}

/* Remove spinners from number inputs */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Custom Checkbox Styling */
input[type=checkbox] + label {
    padding-left: 32px;
}

.custom-control-label {
    line-height: 2.6;
    margin-left: 5px;
    padding-left: 35px;
}

.custom-control-label::after,
.custom-control-label::before {
    height: 30px;
    width: 30px;
}

.custom-control-label::before {
    background-color: #fff;
    border: 1px solid #ced4da;
    margin-left: 20px;
}

.custom-control-input:checked ~ .custom-control-label::before {
    background-color: white !important;
    background-image: url(/Images/DialogHelpers/check-3x.png);
    background-repeat: no-repeat;
    background-position: center;
}

.custom-control-input:not(:checked) ~ .custom-control-label::before {
    background-image: none;
    background-color: white !important;
}

.custom-control-input.is-valid ~ .custom-control-label, 
.was-validated .custom-control-input:valid ~ .custom-control-label {
    color: black;
}

/* Buttons */
.btn-primary {
    background-color: #073086;
    border-color: #073086;
}

/* Definition Lists */
dd {
    margin-left: 3em;
}

/* Close Button */
.close a:hover {
    text-decoration: none;
}

/* Responsive Design */
@media only screen and (max-height: 500px) {
    .hide-tiny {
        display: none;
    }
}

.invalid-feedback {
    position: absolute;
    width: 100%;
    margin-top: 2px;
}

.row.mb-3 {
    margin-bottom: 2rem !important; /* Increased from Bootstrap's default */
}

/* Container for the input and feedback */
.col-6 {
    position: relative;
}