@charset "UTF-8";

/* Faixa fixa indicando ambiente não-produtivo (DEV/QAS) — só aparece quando
   Environment:Label está configurado; ausente em produção/local. */
.tim-env-banner {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    background: #ff8c00;
    color: #fff;
    font: bold 12px/1.6 sans-serif;
    letter-spacing: 1px;
    padding: 2px 12px;
    border-bottom-right-radius: 6px;
    pointer-events: none;
}

:root {
    --font-tim-thin: 'timsans-thin', sans-serif;
    --font-tim-light: 'timsans-light', sans-serif;
    --font-tim-regular: 'timsans-regular', sans-serif;
    --font-tim-medium: 'timsans-medium', sans-serif;
    --font-tim-bold: 'timsans-bold', sans-serif;
    --font-source-regular: 'source-sans-pro', sans-serif;
}

@font-face {
    font-family: 'timsans-thin';
    src: url('../fonts/timsans-thin.woff') format('woff'), url('../fonts/timsans-thin.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'timsans-light';
    src: url('../fonts/timsans-light.woff') format('woff');
    font-style: normal;
    font-weight: 300;
}

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

@font-face {
    font-family: 'timsans-medium';
    src: url('../fonts/timsans-medium.woff') format('woff'), url('../fonts/timsans-medium.ttf') format('truetype');
    font-style: normal;
    font-weight: 500;
}

@font-face {
    font-family: 'timsans-bold';
    src: url('../fonts/timsans-bold-2.woff') format('woff'), url('../fonts/timsans-bold-2.ttf') format('truetype');
    font-style: normal;
    font-weight: 700;
}

html, body {
    height: 100%;
    margin: 0;
}

body {
    font-family: var(--font-tim-regular);
    background-color: #FFFFFF;
    overflow-x: hidden;
}

/* Banner de sucesso do "Reenviar convite" (produção fecha o modal e mostra isto no topo da
   página inteira, acima das duas colunas — não dentro do modal). */
.tim-top-banner {
    border-radius: 0;
    margin: 0;
    text-align: left;
}

/*
* Login
* -----
*/
.tim-main-login {
    min-height: 100vh;
}

.tim-main-login > .row {
    min-height: 100vh;
}

.tim-main-login .col-md-4 {
    padding: 0;
    background-color: #f2f2f2;
}

.tim-main-login .col-md-8 {
    padding: 0;
}

.tim-main-login #content {
    padding: 45px;
}

/* Páginas com formulário real (Login/Register/ResetPassword/ForgotPassword ao preencher e-mail):
   em produção o logo fica dentro do wrapper nativo `.page-content`/`#mainContent`
   (margin-top:20px), então o topo efetivo é 45+20=65px. Telas de confirmação/erro (sem
   formulário) prependam o logo direto em `#content`, fora desse wrapper — sem os 20px extras. */
.tim-form-page #content {
    padding-top: 65px;
}

.tim-logo-login {
    margin-bottom: 120px;
}

.tim-logo-login img {
    width: 120px;
}

.tim-main-login .login-heading-section,
.tim-main-login .forgot-password-heading {
    color: #212519;
    font-family: var(--font-tim-light);
    font-weight: 300;
    font-size: 24px;
    font-style: normal;
    line-height: 110%;
    letter-spacing: -0.48px;
    border: 0;
    margin: 0 0 37px 0;
    padding: 0;
    outline: none;
}

.forgot-password-heading small {
    display: inline-block;
    font-family: var(--font-tim-light);
    font-size: 14px;
    color: #212519;
    line-height: 110%;
    letter-spacing: -0.28px;
    margin-top: 30px;
}

.forgot-password-heading small b {
    font-family: var(--font-tim-bold);
    font-weight: 700;
    font-size: 14px;
    color: #0964AF;
    line-height: 110%;
    letter-spacing: -0.28px;
    display: block;
    margin-bottom: 7px;
}

.tim-msg-field {
    display: inline-block;
    font-family: var(--font-tim-regular);
    font-size: 12px;
    line-height: 110%;
    color: #555555;
    margin-top: 10px;
}

/* Modal - nativo (igual produção: header azul, cantos arredondados) — o modal de Reenviar
   Convite vive na tela de login, fora do tim-app.css, então precisa da mesma regra aqui. */
.modal-header {
    background-color: #0964AF;
    border-radius: 8px 8px 0 0;
}

.modal-header .modal-title {
    font-family: var(--font-tim-medium);
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    margin: 0;
    color: #FFFFFF;
}

.modal-content {
    border-radius: 10px;
}

.col-form-label {
    font-family: var(--font-tim-bold);
    font-size: 14px;
    line-height: 110%;
    color: #0964AF;
}

label.col-form-label.required:after {
    content: '* ';
    color: #a94442;
    white-space: nowrap;
}

/* Fields */
input.form-control {
    font-family: var(--font-source-regular);
    font-size: 14px;
    border: 1px solid #CED4DA;
    border-radius: 4px;
    padding: 8px 16px;
}

input.form-control[readonly] {
    background-color: #E9ECEF;
    color: #6C757D;
    cursor: not-allowed;
}

input::placeholder {
    color: #6C757D !important;
}

/* Captcha (tela de conclusão de cadastro) */
.tim-captcha-bloco {
    text-align: center;
}

.tim-captcha-imagem {
    display: inline-block;
    border: 1px solid #CED4DA;
    border-radius: 4px;
    overflow: hidden;
    line-height: 0;
}

.tim-captcha-imagem svg {
    display: block;
}

.tim-captcha-refresh {
    display: block;
    margin-top: 6px;
    font-family: var(--font-tim-regular);
    font-size: 12px;
    color: #0964AF !important;
    text-decoration: none;
    cursor: pointer;
}

.tim-captcha-refresh:hover {
    text-decoration: underline;
}

.tim-captcha-bloco .form-control {
    text-align: left;
}

.tim-captcha-dica {
    display: block;
    text-align: left;
    margin-top: 4px;
    font-family: var(--font-source-regular);
    font-size: 12px;
    color: #B26A00;
}

.col-form-label {
    font-family: var(--font-tim-bold);
    font-size: 14px;
    line-height: 110%;
    color: #0964AF;
    text-align: left;
}

/* Buttons / links */
.tim-btn-login {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
}

.tim-btn-login button, .tim-btn-login input, .tim-btn-login a.btn {
    font-family: var(--font-source-regular);
    font-size: 16px;
    font-weight: 400;
    width: 100%;
    padding: 8px;
    border-radius: 50px;
    background-color: #004691;
    border: 1px solid #004691;
    height: 46px;
    color: #FFFFFF !important;
}

.tim-btn-login button:hover, .tim-btn-login button:focus, .tim-btn-login a.btn:hover {
    background-color: #136FE0;
    border: 1px solid #136FE0;
    outline: none;
}

.tim-btn-login #submit-signin-local {
    margin-top: 45px;
}

.tim-btn-login a:not(.btn) {
    font-family: var(--font-tim-regular);
    font-weight: 400;
    font-size: 12px;
    border: 0;
    padding: 0;
    color: #0964AF !important;
    background: transparent !important;
    outline: none !important;
    text-decoration: none;
    cursor: pointer;
    margin-top: 8px;
}

.tim-btn-login a:not(.btn):hover {
    text-decoration: underline;
}

.tim-link-voltar {
    display: block;
    text-align: center;
    margin-top: 12px;
    font-family: var(--font-tim-regular);
    font-weight: 400;
    font-size: 12px;
    color: #0964AF !important;
    background: transparent !important;
    text-decoration: none;
    cursor: pointer;
}

.tim-link-voltar:hover {
    text-decoration: underline;
}

/* Right side banner */
.tim-bg-login {
    background-image: url(../img/img-bg-login.jpg);
    background-position: center center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 70px;
    min-height: 100vh;
}

.tim-bg-login .tim-row-login {
    display: flex;
    align-items: baseline !important;
    flex-wrap: wrap;
    align-content: center;
    column-gap: 20px;
    flex-direction: row;
}

.tim-bg-login .tim-info-login {
    display: none;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-left: 1rem;
    width: 100%;
}

.tim-bg-login .tim-info-login p {
    font-family: var(--font-tim-bold);
    text-align: left;
    font-size: 26px;
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 10px;
}

.tim-bg-login .tim-info-login > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tim-bg-login .tim-col-12 {
    width: 100%;
    padding: 0;
    margin: 0;
    margin-top: -21px;
}

.tim-bg-login .tim-col-12 hr {
    border: 1px solid #82b9e6;
    width: 100%;
    margin: 20px 0;
    opacity: 1;
}

@media (max-width: 767px) {
    .tim-bg-login .tim-info-login p {
        font-size: 18px;
    }

    .tim-bg-login {
        height: auto;
        padding: 25px;
        justify-content: center;
        margin-top: 50px;
        min-height: 0;
    }

    .tim-bg-login .tim-row-login {
        justify-content: center;
    }

    .tim-bg-login .tim-info-login > div {
        margin-top: 15px;
    }
}

/* Auth extras: errors, MFA, enrollment, dashboard */
.tim-form-error {
    font-family: var(--font-tim-regular);
    font-size: 13px;
    color: #a94442;
    background: #fdecea;
    border: 1px solid #f5c2c0;
    border-radius: 4px;
    padding: 8px 12px;
    margin-bottom: 20px;
}

.tim-mfa-icon {
    margin-bottom: 16px;
}

.tim-mfa-text {
    font-family: var(--font-source-regular);
    font-size: 14px;
    color: #555555;
    line-height: 140%;
    margin-bottom: 28px;
}

.tim-mfa-text strong {
    color: #212519;
}

.tim-otp-inputs {
    display: flex;
    gap: 10px;
    margin-bottom: 24px;
}

.tim-otp-box {
    width: 46px;
    height: 52px;
    padding: 0;
    text-align: center;
    font-size: 22px;
    font-family: var(--font-tim-medium);
}

.tim-otp-box:focus {
    border-color: #0964AF;
    outline: none;
    box-shadow: 0 0 0 3px rgba(9, 100, 175, 0.15);
}

.tim-enroll-qr {
    background: #FFFFFF;
    border: 1px solid #CED4DA;
    border-radius: 8px;
    padding: 16px;
    display: inline-block;
    margin-bottom: 20px;
}

.tim-enroll-qr img {
    width: 200px;
    height: 200px;
    display: block;
}

.tim-manual-key {
    font-family: 'Consolas', monospace;
    font-size: 14px;
    letter-spacing: 1px;
    background: #f2f2f2;
    border-radius: 4px;
    padding: 8px 12px;
    display: inline-block;
    margin-bottom: 24px;
    word-break: break-all;
}

.tim-dashboard {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f2f2f2;
}

.tim-dashboard-card {
    background: #FFFFFF;
    border-radius: 8px;
    box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.08);
    padding: 45px;
    text-align: center;
    max-width: 420px;
}

.tim-dashboard-card .tim-logo-login {
    margin-bottom: 30px;
}

.tim-dashboard-card .tim-logo-login img {
    width: 100px;
}