/* Identidade das telas de acesso e das paginas publicas do 15Flow. */
:root {
    --flow-access-navy: #19384d;
    --flow-access-navy-deep: #102b3c;
    --flow-access-blue: #2d668f;
    --flow-access-cyan: #31a8bd;
    --flow-access-bg: #edf3f7;
    --flow-access-text: #213746;
    --flow-access-muted: #718493;
}

body.flow-access {
    min-height: 100vh;
    color: var(--flow-access-text);
    background:
        radial-gradient(circle at 82% 12%, rgba(49, 168, 189, .12), transparent 28%),
        linear-gradient(145deg, #e7eff4 0%, #f7f9fb 52%, #e8f0f4 100%);
}

.flow-access .flow-access-header {
    min-height: 72px;
    margin: 0 !important;
    padding: 0 34px;
    border: 0;
    border-radius: 0;
    background: linear-gradient(110deg, var(--flow-access-navy-deep), var(--flow-access-navy)) !important;
    box-shadow: 0 5px 18px rgba(16, 43, 60, .24);
    display: flex;
    align-items: center;
}

.flow-access .flow-access-brand-wrap {
    width: 100%;
}

.flow-access .flow-access-brand {
    min-height: 72px;
    padding: 0;
    color: #fff !important;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.flow-access .flow-access-brand strong {
    font-size: 23px;
    font-weight: 700;
    letter-spacing: -.4px;
}

.flow-access .flow-access-brand small {
    margin-left: 2px;
    padding-left: 15px;
    border-left: 1px solid rgba(255, 255, 255, .3);
    color: rgba(255, 255, 255, .7);
    font-size: 12px;
    font-weight: 500;
}

.flow-access .flow-access-mark {
    width: 32px;
    height: 28px;
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
}

.flow-access .flow-access-mark i {
    width: 5px;
    border-radius: 4px;
    background: var(--flow-access-cyan);
    display: block;
}

.flow-access .flow-access-mark i:nth-child(1) { height: 13px; opacity: .7; }
.flow-access .flow-access-mark i:nth-child(2) { height: 21px; opacity: .86; }
.flow-access .flow-access-mark i:nth-child(3) { height: 27px; }

.flow-access-login .flow-access-brand-wrap {
    display: flex;
    justify-content: center;
}

.flow-access-login .flow-access-content {
    width: 100%;
    max-width: 1120px;
    min-height: calc(100vh - 150px);
    margin: 0 auto;
    padding: 30px 22px 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.flow-access-login #adianti_div_content {
    width: 100%;
}

.flow-access-login #login-wrapper {
    max-width: 470px !important;
    margin: 0 auto !important;
}

.flow-access-login #login-wrapper .panel,
.flow-access-login #login-wrapper .card {
    overflow: hidden;
    border: 1px solid rgba(25, 56, 77, .09);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(25, 56, 77, .16);
}

.flow-access-login #login-wrapper .panel-heading,
.flow-access-login #login-wrapper .card-header,
.flow-access-login #login-wrapper .header {
    padding: 21px 25px;
    border-bottom: 1px solid #e5edf2;
    background: #f9fbfc;
    color: var(--flow-access-navy);
}

.flow-access-login #login-wrapper .panel-title,
.flow-access-login #login-wrapper h2 {
    color: var(--flow-access-navy);
    font-weight: 700;
    letter-spacing: .3px;
}

.flow-access-login #login-wrapper .panel-body,
.flow-access-login #login-wrapper .card-body,
.flow-access-login #login-wrapper .body {
    padding: 28px 30px;
}

.flow-access-login #login-wrapper .login-avatar {
    height: 35px;
    min-width: 42px;
    border-radius: 7px 0 0 7px;
    background: #e8f1f5;
    color: var(--flow-access-blue);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.flow-access-login #login-wrapper input,
.flow-access-login #login-wrapper select {
    border-color: #cddae2 !important;
    background: #fff !important;
    color: var(--flow-access-text) !important;
}

.flow-access-login #login-wrapper .btn-primary {
    border: 0;
    border-radius: 7px;
    background: linear-gradient(100deg, var(--flow-access-navy), var(--flow-access-blue)) !important;
    box-shadow: 0 7px 17px rgba(45, 102, 143, .24);
}

.flow-access-login #login-wrapper .btn-primary:hover,
.flow-access-login #login-wrapper .btn-primary:focus {
    background: var(--flow-access-navy-deep) !important;
}

.flow-access .flow-access-links {
    padding: 0 16px 20px;
    text-align: center;
}

.flow-access .flow-access-links a {
    color: var(--flow-access-blue);
    font-weight: 600;
}

.flow-access-public .flow-access-header {
    justify-content: space-between;
}

.flow-access-public .flow-access-header .navbar-collapse {
    margin-left: auto;
}

.flow-access-public .flow-access-header .navbar-nav > li > a,
.flow-access-public .flow-access-header .material-icons {
    color: rgba(255, 255, 255, .9) !important;
}

.flow-access-public section.content {
    padding-top: 28px;
    background: transparent;
}

@media (max-width: 767px) {
    .flow-access .flow-access-header {
        min-height: 62px;
        padding: 0 18px;
    }

    .flow-access .flow-access-brand { min-height: 62px; }
    .flow-access .flow-access-brand small { display: none; }
    .flow-access-login .flow-access-content { min-height: calc(100vh - 125px); padding: 20px 12px; }
    .flow-access-login #login-wrapper .panel-body,
    .flow-access-login #login-wrapper .card-body,
    .flow-access-login #login-wrapper .body { padding: 22px 18px; }
}