/* ==========================================================================
   REBRANDING DAS TELAS PESSOAIS — lote 3, 18/09/2026
   Perfil, preferências, emblemas, arquivos privados, calendário, mensagens e
   "esqueci a senha".

   Botões, avisos, tabelas e campos vêm do rebranding-miolo.css. Aqui fica o
   que é de cada tela. Cada seção diz de quem é:

   [SCSS]      regra de estilo, vai para o parcial da tela
   [RENDERER]  o CSS aqui só ESCONDE um erro de emissão; o conserto de verdade
               é o tema parar de emitir. Está marcado onde acontece.
   [CONFIG]    não é código: é capacidade ou setting, do Marcelo.

   ACHADOS QUE NÃO SÃO CSS (para o LEIA-ME):
   - /message/ emite o PAINEL INTEIRO (.don-dash: saudação + 5 cartões) acima
     da caixa de mensagens, porque a rota também é pagelayout-mydashboard.
   - O aluno vê "Novo evento" no calendário e "Redefinir a página para o
     padrão" no perfil. São capacidades do papel, não desenho.
   - O próprio perfil oferece o botão "Mensagem" — para si mesmo.
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. SUPERFÍCIE                                                        [SCSS]
   A base pinta #F5F7FB em incourse, report e standard. Perfil (mypublic),
   preferências (admin) e mensagens (mydashboard) ficaram de fora dela e
   seguiam em branco puro: o aluno saía de uma tela cinza-azulada e caía numa
   branca. Mesma superfície em todas.
   -------------------------------------------------------------------------- */
body:is(.pagelayout-mypublic, .pagelayout-admin).path-user,
body.path-message,
body:is(.pagelayout-mypublic, .pagelayout-admin).path-user #page,
body.path-message #page {
    background-color: #F5F7FB;
}
/* #topofscroll (.main-inner) vem BRANCO nestes layouts: com a superfície nova
   ele vira uma faixa branca de 900px atrás do herói e dos cartões. */
body:is(.pagelayout-mypublic, .pagelayout-admin).path-user #topofscroll,
body.path-message #topofscroll {
    background-color: transparent;
}


/* --------------------------------------------------------------------------
   2. FORA A FAIXA DE PERFIL ONDE A TELA NÃO É O PERFIL                 [SCSS]
   Mesma decisão de Notas (rebranding-notas.css, bloco A.2, 31/08): emblemas,
   arquivos privados e preferências reaproveitam o cabeçalho de PERFIL. O
   aluno clica em "Emblemas" e a tela responde com o nome dele em 34px, um
   avatar de 100px e um botão "Mensagem" — e o nome da tela vem embaixo, como
   um h2 qualquer. Sai a faixa; o h2 do core assume como título da tela.

   A faixa é o próprio header#page-header pintado pelo tema: esconder só o
   miolo deixaria o retângulo azul vazio (armadilha 1 do bloco A.2).
   -------------------------------------------------------------------------- */
body.path-badges #page-header,
#page-user-files #page-header,
#page-user-preferences #page-header {
    display: none !important;             /* .d-print-none/.d-flex são utilitários */
}

/* O título da tela: o mesmo desenho do .don-notas__titulo, para as telas de
   "minha conta" terem todas a mesma cabeça. */
body.path-badges #region-main h2:first-of-type,
#page-user-files #region-main h2:first-of-type,
#page-user-preferences #region-main h2:first-of-type,
body.path-calendar #region-main h2.current {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.15;
    color: #102770;
    margin: 1.5rem 0 1.5rem;
    text-align: left !important;          /* .text-center no calendário */
}


/* --------------------------------------------------------------------------
   3. PERFIL — a faixa fica, com o gradiente da casa                    [SCSS]
   Aqui a faixa de identidade está CERTA: a tela é o perfil. Só o azul é o do
   preset (linear 100deg #1e5aad → #0a2445); curso, painel e atividades já
   usam o radial da casa.
   -------------------------------------------------------------------------- */
body.don-perfil-view #page-header {
    background: radial-gradient(135% 120% at 25% 12%, #1B6BFF 0%, #0059FB 48%, #102770 118%);
    border-radius: 16px;
}
/* "Mensagem" e "Redefinir a página" dentro da faixa: o ciano chapado do
   .btn-secondary vira contorno claro, que não disputa com o nome. */
body.don-perfil-view #page-header .btn-secondary,
body.don-perfil-view #page-header .header-button-group .btn {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 10px;
    color: #FFFFFF;                       /* 4,57:1 no ponto mais claro do gradiente */
    font-weight: 600;
}
body.don-perfil-view #page-header .btn-secondary:hover,
body.don-perfil-view #page-header .header-button-group .btn:hover {
    background: rgba(255, 255, 255, .14);
    border-color: #FFFFFF;
}

/* Os títulos de cartão do perfil ("Detalhes do usuário") são h3 dentro de um
   cartão que já tem respiro: o título de SEÇÃO do miolo (2rem em cima) não
   serve aqui. */
body.don-perfil-view #region-main [role="main"] h3 {
    font-size: 1.0625rem;
    margin-top: 0;
}


/* --------------------------------------------------------------------------
   4. PREFERÊNCIAS — cartões da casa                                    [SCSS]
   O título de cada cartão saía em h3 de 28px cinza, maior que os links que
   ele rotula, e quebrava em duas linhas ("Conta de / usuário").
   -------------------------------------------------------------------------- */
#page-user-preferences #region-main .card {
    border: 1px solid #D5D8E2;
    border-radius: 16px;
    background: #FFFFFF;
}
#page-user-preferences #region-main .card-title {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #5A668C;                       /* 5,65:1 sobre branco */
    margin: 0 0 .875rem;
}
#page-user-preferences #region-main .card-text a {
    display: block;
    padding: .375rem 0;
    color: #102770;
    font-weight: 500;
    text-decoration: none;
}
#page-user-preferences #region-main .card-text a:hover {
    color: #0059FB;
}
/* três colunas de 224px deixavam um terço da linha vazio com dois cartões */
@media (min-width: 768px) {
    #page-user-preferences #region-main .row > .col-md-4 {
        flex: 1 1 0;
        max-width: none;
    }
}


/* --------------------------------------------------------------------------
   5. MENSAGENS                                                [RENDERER+SCSS]
   -------------------------------------------------------------------------- */
/* [RENDERER] O painel inteiro aparece acima das mensagens: 549px de saudação
   e cartões antes da caixa que o aluno veio abrir. A rota /message/ também é
   pagelayout-mydashboard e o tema emite o .don-dash por layout, não por
   página. O CERTO é o tema só emitir em page-my-index. Esta regra esconde o
   sintoma e pode ficar como cinto de segurança. */
body.path-message .don-dash {
    display: none;
}

/* [SCSS] #region-main vem branco do tema e a caixa, dentro dele, com borda:
   cartão dentro de cartão. Fica um só. */
body.path-message #region-main {
    background: transparent;
    box-shadow: none;
    border: 0;
}

/* [SCSS] A caixa: cartão da casa, no lugar do retângulo cinza com borda. */
body.path-message #region-main .message-app.main {
    border: 1px solid #D5D8E2 !important; /* .border é utilitário */
    border-radius: 16px;
    background-color: #FFFFFF !important; /* .bg-light, idem */
    overflow: hidden;                     /* a caixa não abre menu para fora */
    min-height: 560px;
}
body.path-message .message-app .bg-light {
    background-color: #FFFFFF !important;
}
body.path-message .message-app .form-control.bg-light {
    background-color: #F5F7FB !important;
}
body.path-message .message-app .list-group-item {
    border-color: #E9EBF1;
}
body.path-message .message-app [data-region="view-overview"] .btn-link,
body.path-message .message-app .view-overview-body .btn {
    color: #102770;
    font-weight: 600;
}


/* --------------------------------------------------------------------------
   6. ESQUECI A SENHA                                                   [SCSS]
   O login tem desenho; esta tela, um clique depois, tinha dois h3 pretos de
   28px maiores que qualquer coisa do login, e rótulo ao lado do campo numa
   coluna de 460px — "Identificação de / usuário" quebrava em duas linhas.
   Preso ao id da página: o login (também path-login) já está no ar e não
   pode herdar nada daqui.
   -------------------------------------------------------------------------- */
#page-login-forgot_password .login-container .generalbox {
    color: #3A4468;                       /* 9,5:1 sobre branco */
    font-size: .9375rem;
    line-height: 1.55;
}
#page-login-forgot_password .mform fieldset h3 {
    font-size: 1rem;
    font-weight: 700;
    color: #102770;
    margin-top: .5rem;
}
/* rótulo em cima do campo */
#page-login-forgot_password .mform .fitem.row > [class*="col-md-"] {
    flex: 0 0 100%;
    max-width: 100%;
}
#page-login-forgot_password .mform .col-form-label label {
    font-size: .875rem;
    font-weight: 600;
    color: #102770;
}
#page-login-forgot_password .mform .form-control {
    width: 100%;
    max-width: none;
    border: 1px solid #D5D8E2;
    border-radius: 10px;
    padding: .625rem .875rem;
    color: #102770;
}
#page-login-forgot_password .mform .form-control:focus {
    border-color: #0059FB;
    box-shadow: 0 0 0 3px rgba(0, 89, 251, .18);
}
#page-login-forgot_password .mform .btn-primary {
    width: 100%;
    background-color: #0059FB;
    border: 1px solid #0059FB;
    border-radius: 10px;
    padding: .625rem 1.125rem;
    font-weight: 600;
    color: #FFFFFF;                       /* 5,5:1 */
}
#page-login-forgot_password .mform .btn-primary:hover {
    background-color: #102770;
    border-color: #102770;
}


/* --------------------------------------------------------------------------
   7. CALENDÁRIO                                                        [SCSS]
   -------------------------------------------------------------------------- */
body.path-calendar #region-main .form-select,
body.path-calendar #region-main .header .btn-outline-secondary,
body.path-calendar #region-main .header .dropdown-toggle {
    border: 1px solid #D5D8E2;
    border-radius: 10px;
    background-color: #FFFFFF;
    color: #102770;
}
body.path-calendar #region-main .eventlist {
    color: #5A668C;
}