﻿/*!
 * Havan Styles v1.0.0
 * Copyright 2021 Havan S/A.
 */

.hvn-body {
    background-color: #f2f2f2
}

.hvn-logo {
    background-color: #002a5d
}

.hvn-nav {
    background-color: #fff;
    color: #002a5d;
    box-shadow: -1px 1px 6px rgba(0,0,0,.15)
}

    .hvn-nav svg {
        fill: #002a5d
    }

.hvn-footer, .hvn-user-info {
    background-color: #e6e6e6
}

    .hvn-user-info .bg-avatar {
        background-color: #fff;
        border: .2px solid;
        box-shadow: -1px 1px 6px rgba(0,0,0,.15)
    }

.hvn-arrow::before {
    content: "";
    border-color: #e6e6e6 transparent;
    border-style: solid;
    border-width: 0 12px 12px 12px;
    bottom: 20px;
    bottom: 100%;
    position: absolute;
    left: 77%;
    transform: translateX(-50%)
}

.hvn-menu, .hvn-user-links {
    background-color: #5f6a7d
}

    .hvn-menu, .hvn-menu a, .hvn-user-links, .hvn-user-links a, .hvn-user-links button {
        color: #fff
    }

        .hvn-menu a:hover {
            background-color: #556072
        }

        .hvn-menu svg, .hvn-user-links svg {
            fill: #fff
        }

.hvn-sub-menu {
    background-color: #556072
}

    .hvn-sub-menu a:hover, .hvn-user-links a:hover, .hvn-user-links button:hover {
        color: #dddedf
    }

.hvn-view-title {
    color: #2b2b2b
}

.hvn-content {
    background-color: #fff;
    color: #363636
}

.hvn-footer-bar {
    background-color: #fff;
    color: #002a5d
}

.hvn-footer {
    color: #002a5d
}

.hvn-labs-icon {
    display: inline-block;
    width: 14.3px;
    height: 16px;
    background: url(https://cdn.havan.com.br/assets/images/hlabs-icon-b.svg) no-repeat;
    background-size: 100%
}

.hvn-ellipse {
    display: inline-block;
    width: 29px;
    height: 14px;
    background: url(https://cdn.havan.com.br/assets/images/elipse-havan-b.svg) no-repeat;
    background-size: 100%
}

@media screen and (min-width:750px) {
    .hvn-arrow::before {
        left: 74%
    }

    .hvn-logout {
        background-color: #e6e6e6
    }
}

.dark.hvn-body {
    background-color: #282a36
}

.dark .hvn-logo {
    background-color: #23496e
}

.dark .hvn-nav {
    background-color: #3d3f48;
    color: #f7f7f7
}

    .dark .hvn-nav svg {
        fill: #f7f7f7
    }

.dark .hvn-user-info {
    background-color: #23496e
}

    .dark .hvn-user-info .bg-avatar {
        background-color: #f7f7f7;
        color: #23496e
    }

        .dark .hvn-user-info .bg-avatar svg {
            fill: #23496e
        }

.dark .hvn-arrow::before {
    border-color: #23496e transparent
}

.dark .hvn-menu, .dark .hvn-user-links {
    background-color: #253955
}

    .dark .hvn-menu, .dark .hvn-menu a, .dark .hvn-user-links, .dark .hvn-user-links a, .dark .hvn-user-links button {
        color: #f7f7f7
    }

        .dark .hvn-menu a:hover {
            background-color: #2b4160
        }

        .dark .hvn-menu svg, .dark .hvn-user-links svg {
            fill: #f7f7f7
        }

.dark .hvn-sub-menu {
    background-color: #2b4160
}

    .dark .hvn-sub-menu a:hover, .dark .hvn-user-links a:hover, .dark .hvn-user-links button:hover {
        color: #d1d5d8
    }

.dark .hvn-view-title {
    color: #f7f7f7
}

.dark .hvn-content {
    background-color: #3d3f48;
    color: #f7f7f7
}

.dark .hvn-footer-bar {
    background-color: #3d3f48;
    color: #f7f7f7
}

.dark .hvn-footer {
    background-color: #282a36;
    color: #f7f7f7
}

.dark .hvn-labs-icon {
    background-image: url(https://cdn.havan.com.br/assets/images/hlabs-icon-w.svg)
}

.dark .hvn-ellipse {
    background-image: url(https://cdn.havan.com.br/assets/images/elipse-havan-w.svg)
}

@media screen and (min-width:750px) {
    .dark .hvn-logout {
        background-color: #21222c
    }
}

.hvn-ideology {
    float: left;
    width: 100%;
    position: relative;
    padding: 20px;
    background-image: repeating-linear-gradient(200deg,#00458b,#003981 25%,#00458b 30%)
}

    .hvn-ideology .gptw {
        position: absolute;
        right: 20px;
        top: 0;
        width: 100px;
        filter: drop-shadow(2px 2px 5px rgba(0, 0, 0, .45))
    }

    .hvn-ideology .logo-hvn {
        position: absolute;
        right: 20px;
        bottom: 20px;
        width: 100px;
        filter: drop-shadow(2px 2px 5px rgba(0, 0, 0, .45));
        color: #fff;
        font-weight: 600;
        font-size: 1.1rem;
        font-family: Arial,Helvetica,sans-serif
    }

    .hvn-ideology div {
        display: flex;
        align-items: center;
        height: 100px;
        margin: 10px 0;
        padding-right: 100px
    }

    .hvn-ideology h3 {
        flex: 0 0 200px;
        margin: 5px 20px 0;
        padding: 4px 0;
        color: #036;
        background-color: #10e6ff;
        box-shadow: -6px 6px 2px rgba(0,0,0,.25);
        text-align: center;
        text-transform: uppercase;
        font-weight: 800
    }

    .hvn-ideology p {
        margin: 0;
        font-size: 1.75rem;
        line-height: 1;
        font-weight: 600;
        color: #fff
    }

@media (max-width:768px) {
    .hvn-ideology .logo-hvn {
        position: static;
        float: right
    }

    .hvn-ideology .gptw {
        display: none
    }

    .hvn-ideology div {
        display: block;
        float: left;
        width: 100%;
        height: auto;
        margin: 25px 0;
        padding: 0
    }

    .hvn-ideology h3 {
        float: left;
        width: 200px;
        margin: 0
    }

    .hvn-ideology p {
        float: left;
        width: 100%;
        margin-top: 10px
    }
}

.hvn-not-found {
    width: 600px;
    min-height: calc(100vh - 230px);
    margin: 0 auto;
    padding: 20px 0;
    align-items: center;
    align-content: center
}

    .hvn-not-found img {
        display: inline-block;
        height: 360px
    }

@media (max-width:768px) {
    .hvn-not-found {
        text-align: center;
        width: 100%
    }

        .hvn-not-found div {
            text-align: center;
            flex: 1 1 100%
        }

        .hvn-not-found img {
            height: 300px;
            margin-bottom: 25px
        }
}

.alert, .badge, .card {
    border-radius: .5rem
}

.accordion-item:first-of-type {
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem
}

.form-label {
    margin-left: 2px;
    margin-bottom: .25rem;
    font-size: .938rem;
    color: #565656;
    line-height: normal
}

.form-control, .form-select {
    border-color: #b0b6be;
    border-radius: .5rem
}

    .form-control:focus, .form-select:focus {
        border-color: #0d9dfd;
        box-shadow: 0 0 8px rgba(0,0,0,.25)
    }

    .form-control.is-invalid:focus, .was-validated .form-control:invalid:focus {
        box-shadow: 0 0 8px rgba(220,53,69,.25)
    }

    .form-select.is-invalid:focus, .was-validated .form-select:invalid:focus {
        box-shadow: 0 0 8px rgba(220,53,69,.25)
    }

.form-check-input.is-invalid:focus, .was-validated .form-check-input:invalid:focus {
    box-shadow: 0 0 8px rgba(220,53,69,.25)
}

.form-floating > .form-control, .form-floating > .form-select {
    height: calc(2.25rem + 2px)
}

.form-floating > label {
    padding: .35rem .75rem;
    color: #747476
}

.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {
    padding-top: .625rem
}

.form-floating > .form-control:-webkit-autofill {
    padding-top: .625rem
}

.form-floating > .form-select {
    padding-top: .35rem
}

.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {
    opacity: 1;
    height: auto;
    transform: scale(1) translateY(-1.45rem) translateX(.4rem);
    padding: 0;
    font-size: .938rem
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: 1;
    height: auto;
    transform: scale(1) translateY(-1.45rem) translateX(.4rem);
    padding: 0;
    font-size: .938rem
}

.form-floating > .form-control:-webkit-autofill ~ label {
    opacity: 1;
    height: auto;
    transform: scale(1) translateY(-1.45rem) translateX(.4rem);
    padding: 0;
    font-size: .938rem
}

.btn {
    border-radius: .5rem
}

.btn-primary {
    background-color: #215696;
    border-color: #215696
}

    .btn-primary:hover {
        background-color: #174a88;
        border-color: #174a88
    }

    .btn-check:focus + .btn-primary, .btn-primary:focus {
        background-color: #174a88;
        border-color: #174a88;
        box-shadow: 0 0 0 .25rem rgba(23,74,136,.25)
    }

.btn-outline-primary {
    color: #215696;
    border-color: #215696
}

    .btn-outline-primary:hover {
        color: #fff;
        background-color: #215696;
        border-color: #215696
    }

.btn.btn-fl {
    padding: .625rem .75rem
}

.input-group-text {
    border-color: #b0b6be;
    border-radius: .5rem
}

.modal-content {
    border-radius: .5rem
}

.modal-header {
    padding: .5rem 1rem;
    border-bottom: 1px solid #5f6a7d;
    border-radius: .4rem .4rem 0 0;
    background-color: #5f6a7d;
    color: #fff
}

    .modal-header .btn-close {
        background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat
    }

.modal-footer {
    padding: .5rem .75rem;
    border-bottom-right-radius: calc(.5rem - 1px);
    border-bottom-left-radius: calc(.5rem - 1px)
}
