@import url('../Content/fontawesome/css/all.min.css');
@import "variables.css";
html, body {
    color: var(--font-color-primary);
}
html, body, .btn, input {
    font-family: var(--font-headline-primary);
    font-weight: var(--font-weight-normal);
}
h1, h2, h3, h4, h5, h6 {
    font-weight: var(--font-weight-bold);
}
span {
    color: var(--font-color-secondary);
}
.font-color-link {
    color: var(--link-color-primary);
}
.font-color-primary {
    color: var(--color-primary);
}
.btn.btn-primary span {
    color: var(--btntext-color-primary);
}
.navbar-brand img {
    max-width: 195px;
}
.nav-link.small {
    padding-bottom: 0;
}
.btn-link {
    color: var(--link-color-primary);
}
.btn.btn-link {
    text-decoration: none;
    border-radius: 0;
}
.btn-link > i {
    margin-right: .3rem;
}
.badge.btn-link {
    text-decoration: none;
}
.btn-primary, input[id*='okButton'] {
    background-color: var(--color-primary);
    color: var(--btntext-color-primary);
    font-weight: var(--font-weight-bold);
}
.btn span {
    color: inherit;
}
.nav-item.active, .nav-item.active > a {
    font-weight: var(--font-weight-bold);
}
.dropdown-item.active, .dropdown-item:active {
    background-color: #4F9FA6;
}
.navbar-light .navbar-nav .nav-link {
    color: var(--font-color-primary);
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: var(--hover-color-primary);
}
.dropdown-item {
    color: var(--font-color-primary);
}
.dropdown-item:focus, .dropdown-item:hover {
    background-color: var(--bg-color-primary);
    color: var(--hover-color-primary);
}
.badge {
    color: var(--color-light);
    background-color: var(--color-primary);
}
.btn, .badge, .btn-lg, .btn-sm, input[id*='okButton'] {
    border-radius: 25px;
    font-weight: var(--font-weight-bold);
}
.btn-default {
    border: 1px solid var(--border-color-secondary);
    color: var(--font-color-primary);
}
.btn-primary, .btn-outline-primary {
    border-color: var(--border-color-secondary);
}
.btn-outline-primary {
    background-color: transparent;
    color: var(--font-color-primary);
}
input[id*='okButton'] {
    border-color: var(--color-light);
}
.btn-danger {
    background-color: transparent;
    color: var(--danger-color);
    font-weight: var(--font-weight-bold);
}
.btn-danger:not(.btn-danger-rounded) {
    border-radius: unset;
    border: 1px solid transparent;
    border-bottom: 1px solid var(--border-color-primary);
}
.btn-link-border {
    border-bottom: 1px solid var(--border-color-primary);
    color: var(--link-color-primary);
    font-weight: var(--font-weight-bold);
}
.btn-link-border.disabled, .btn-link-border:disabled {
    border-bottom-color: var(--border-color-primary);
}
.btn-link-border i {
    color: var(--link-color-primary);
}
.link-secondary {
    color: var(--link-color-secondary);
}
.link-primary, a.link-primary, .table td a.link-primary {
    color: var(--link-color-primary);
    text-decoration: none;
    font-weight: var(--font-weight-bold);
}
.border-bottom, .border, .border-top {
    border-color: var(--border-color-primary);
}
table a {
    text-decoration: none;
}
.table, .table th a, .table-striped > tbody > tr:nth-of-type(2n+1) > * {
    color: var(--color-primary);
}
.table-striped > tbody > tr:nth-of-type(2n+1) > * {
    background-color: var(--bg-color-primary);
}
.table td a {
    color: var(--font-color-primary);
}
.table td a:hover {
    color: var(--hover-color-primary);
}
.bg-primary {
    background-color: var(--bg-color-primary);
    color: var(--color-light);
}
.bg-secondary {
    background-color: var(--bg-color-primary) !important;
}
.bg-secondary-darker {
    background-color:  var(--bg-color-secondary-darker);
}
.border-primary {
    border-color: var(--color-primary) !important;
}
.position-top-left {
    left: 0px;
    top: 0px;
}
.fit-child-content * {
    width: fit-content;
}
.flex-gap-sm {
    gap: 8px;
}
.grey-card {
    background-color: var(--bg-color-primary);
    box-sizing: border-box;
    padding: 20px;
}
.text-primary {
    color: var(--font-color-primary) !important;
}
.btn-check:active + .btn-primary, .btn-check:checked + .btn-primary, .btn-primary.active, .btn-primary:active, .show > .btn-primary.dropdown-toggle, .btn-primary:hover, .btn-check:focus + .btn-primary, .btn-primary:focus, input[id*='okButton']:hover {
    background-color: var(--hover-color-primary);
    border-color: var(--hover-color-primary);
    box-shadow: none;
    color: var(--color-light);
}
.btn-link:hover {
    color: var(--hover-color-primary);
}
.btn-default:hover, .btn-check:active + .btn-outline-primary, .btn-check:checked + .btn-outline-primary, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show, .btn-outline-primary:active, .btn-outline-primary:hover {
    background-color: transparent;
    border-color: var(--hover-color-primary);
    color: var(--hover-color-primary);
}
.btn-outline-primary {
    background-color: var(--color-light);
}
.btn:focus, .btn-primary:active:focus, .btn-check:active + .btn-outline-primary:focus, .btn-check:checked + .btn-outline-primary:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus, .btn-outline-primary:active:focus, input[id*='okButton'] {
    box-shadow: none;
}
.btn-primary:active:focus, input[id*='okButton']:active:focus {
    background-color: #3D7D83;
}
.modal-header {
    border-bottom:none;
}
.modal-footer {
    border-top:none;
}
@media screen and (max-width: 1350px) {
    .responsive-text-size {
        font-size: 80%;
    }
}
/* FORMS */
.form-control {
    border-radius: var(--border-radius-primary);
    border-color: var(--border-color-primary);
    padding: .375rem 1.5rem;
    color: var(--font-color-primary);
}
.table .form-control:not(.form-select) {
    border: 1px solid var(--border-color-primary);
}
select.form-control, .grey-card .table .form-select {
    border-color: var(--border-color-primary);
    color: var(--font-color-primary);
}
label:not(.label-normal) {
    font-weight: bold;
    color: var(--font-color-primary);
}
.grey-card .form-control, .table .form-control {
    background-color: var(--color-light);
}
.form-select:focus, input.form-control:focus, textarea.form-control:focus {
    box-shadow: none;
    border-color: var(--hover-color-primary);
    color: var(--font-color-primary);
}
.form-select, select {
    background-position: right .5rem center;
    border-radius: var(--border-radius-primary);
    border-color: var(--border-color-primary);
    background-color: #fff;
    padding: .375rem 1.5rem;
}
.select-100 select {
    width: 100% !important;
    max-width: 100%;
}
input[type='checkbox'] {
    accent-color: var(--link-color-primary);
}

.fixed-button {
    position: sticky;
    bottom: 0;
    padding: 10px;
    background: var(--link-color-primary);
    background: linear-gradient(90deg, rgba(var(--color-gradient-first)) 0%, rgba(var(--color-gradient-second)) 100%);
    margin-left: -10px;
    margin-right: -10px;
}
/* END FORMS*/

/* ICONS */
.icon-img {
    width: 16px;
    height: auto;
}
/* END ICONS */


/* ALERTS */
.alert-success {
    background-color: var(--success-color);
    color: var(--font-color-primary);
}
.alert {
    border-radius: var(--border-radius-large);
    border-color: transparent;
}
.btn-close {
    color: var(--color-primary);
}

/* for ExportKML list items */
.manual-style-form table {
    width: 100%;
}
.manual-style-form input:not([type=button]) {
    float: left;
    margin-left: -1.5em;
    width: fit-content;
    margin-top: 4px;
}
.manual-style-form table tr td {
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5em;
    margin-bottom: .125rem;
}

.additional-content {
    display: none;
}

    .additional-content.show {
        display: table-row;
    }

.disable-mark-all-link {
    color: lightgrey;
    text-decoration: none;
    pointer-events: none;
    cursor: not-allowed;
}
