// Superhero 4.1.3
// Bootswatch


// Variables ===================================================================

//$web-font-path: "https://fonts.googleapis.com/css?family=Lato:300,400,700" !default;
//@import url($web-font-path);

@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 300;
    src: unquote("url('[[font:theme|Lato-Light.ttf]]') format('truetype')");
}

@font-face {
    font-family: 'Lato';
    font-style: italic;
    font-weight: 300;
    src: unquote("url('[[font:theme|Lato-LightItalic.ttf]]') format('truetype')");
}

@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: unquote("url('[[font:theme|Lato-Regular.ttf]]') format('truetype')");
}

@font-face {
    font-family: 'Lato';
    font-weight: 400;
    font-style: italic;
    font-stretch: normal;
    src: unquote("url('[[font:theme|Lato-Italic.ttf]]') format('truetype')");
}

@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 700;
    src: unquote("url('[[font:theme|Lato-Bold.ttf]]') format('truetype')");
}

@font-face {
    font-family: 'Lato';
    font-style: italic;
    font-weight: 700;
    src: unquote("url('[[font:theme|Lato-BoldItalic.ttf]]') format('truetype')");
}

// Navbar ======================================================================

.navbar {
    font-size: $font-size-sm;
}

// Buttons =====================================================================

.btn {
    @each $color, $value in $theme-colors {
        &-#{$color} {
            @if $enable-gradients {
                background: $value linear-gradient(180deg, mix($white, $value, 15%), $value) repeat-x;
            } @else { // stylelint-disable-line block-closing-brace-newline-after
                background-color: $value;
            }
        }
    }
}

// Typography ==================================================================

.dropdown-menu {

    font-size: $font-size-sm;
}

.dropdown-header {
    font-size: $font-size-sm;
}

.blockquote-footer {
    color: $body-color;
}

// Tables ======================================================================

.table {
    font-size: $font-size-sm;

    .thead-dark th {
        color: $white;
    }

    a:not(.btn) {
        color: #fff;
        text-decoration: underline;
    }

    .dropdown-menu a {
        text-decoration: none;
    }

    .text-muted {
        color: $text-muted;
    }

    &-dark {
        color: #fff;
    }

    &-primary {
        &,
        > th,
        > td {
            background-color: $primary;
        }
    }

    &-secondary {
        &,
        > th,
        > td {
            background-color: $secondary;
        }
    }

    &-light {
        &,
        > th,
        > td {
            background-color: $light;
        }
    }

    &-dark {
        &,
        > th,
        > td {
            background-color: $dark;
        }
    }

    &-success {
        &,
        > th,
        > td {
            background-color: $success;
        }
    }

    &-info {
        &,
        > th,
        > td {
            background-color: $info;
        }
    }

    &-danger {
        &,
        > th,
        > td {
            background-color: $danger;
        }
    }

    &-warning {
        &,
        > th,
        > td {
            background-color: $warning;
        }
    }

    &-active {
        &,
        > th,
        > td {
            background-color: $table-active-bg;
        }
    }

    &-hover {

        .table-primary:hover {
            &,
            > th,
            > td {
                background-color: darken($primary, 5%);
            }
        }

        .table-secondary:hover {
            &,
            > th,
            > td {
                background-color: darken($secondary, 5%);
            }
        }

        .table-light:hover {
            &,
            > th,
            > td {
                background-color: darken($light, 5%);
            }
        }

        .table-dark:hover {
            &,
            > th,
            > td {
                background-color: darken($dark, 5%);
            }
        }

        .table-success:hover {
            &,
            > th,
            > td {
                background-color: darken($success, 5%);
            }
        }

        .table-info:hover {
            &,
            > th,
            > td {
                background-color: darken($info, 5%);
            }
        }

        .table-danger:hover {
            &,
            > th,
            > td {
                background-color: darken($danger, 5%);
            }
        }

        .table-warning:hover {
            &,
            > th,
            > td {
                background-color: darken($warning, 5%);
            }
        }

        .table-active:hover {
            &,
            > th,
            > td {
                background-color: $table-active-bg;
            }
        }

    }
}

// Forms =======================================================================

label,
.radio label,
.checkbox label,
.help-block {
    font-size: $font-size-sm;
}

// Navs ========================================================================

.nav-tabs,
.nav-pills {
    .nav-link,
    .nav-link:hover {
        color: $body-color;
    }

    .nav-link.disabled {
        color: $nav-link-disabled-color;
    }
}

.page-link:hover,
.page-link:focus {
    color: #fff;
    text-decoration: none;
}

// Indicators ==================================================================

.alert {
    border: none;
    color: $white;

    a,
    .alert-link {
        color: #fff;
        text-decoration: underline;
    }

    @each $color, $value in $theme-colors {
        &-#{$color} {
            @if $enable-gradients {
                background: $value linear-gradient(180deg, mix($white, $value, 15%), $value) repeat-x;
            } @else { // stylelint-disable-line block-closing-brace-newline-after
                background-color: $value;
            }
        }
    }
}

.badge {
    &-warning,
    &-info {
        color: $white;
    }
}

.close {
    opacity: 0.5;

    &:hover,
    &:focus {
        opacity: 1;
    }
}

// Progress bars ===============================================================

// Containers ==================================================================

.modal {
    &-header,
    &-footer {
        background-color: $table-hover-bg;

        .close {
            color: #fff;
            text-shadow: none;
            opacity: 0.5;

            &:hover,
            &:focus {
                opacity: 1;
            }
        }
    }
}

// Fixes =======================================================================

.bg-white {
    background-color: $card-bg !important;
}

.bg-dark {
    &.text-light {
        color: #fff !important;
    }
}

.block-cards .btn-outline-secondary {
    @include button-outline-variant($gray-600);
    border-color: $border-color;
}

.navbar-plugin-output {
    margin-top: 2px;
}