/* ============================================================
   PORTAL RH — Design System
   Paleta: Rocha Red #ED1639 · Superfície · Fundo neutro
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    /* Brand */
    --brand:       #ED1639;
    --brand-dark:  #b90220;
    --brand-light: #ffeef1;
    --brand-50:    rgba(225, 4, 41, 0.08);

    /* Neutrals */
    --bg:          #F1F5F9;
    --surface:     #FFFFFF;
    --surface-2:   #F8FAFC;
    --border:      #E2E8F0;
    --border-dark: #CBD5E1;

    /* Text */
    --text:        #0F172A;
    --text-2:      #475569;
    --text-3:      #94A3B8;

    /* Status */
    --blue:   #3B82F6;
    --violet: #7C3AED;
    --amber:  #D97706;
    --orange: #EA580C;
    --cyan:   #0891B2;
    --green:  #059669;
    --red:    #DC2626;

    /* Misc */
    --radius-sm: 6px;
    --radius:    10px;
    --radius-lg: 16px;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
    --shadow:    0 4px 12px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05);
    --shadow-lg: 0 10px 40px rgba(0,0,0,.12), 0 4px 16px rgba(0,0,0,.07);
    --transition: 0.18s ease;
}

*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    background: var(--bg);
    color: var(--text);
    font-size: 0.9rem;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/* ── Scrollbar ────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-dark); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-3); }

/* ── Navbar ───────────────────────────────────────────────── */
.rh-navbar {
    background: var(--brand);
    padding: 0 1.25rem;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 2px 8px rgba(225, 4, 41, .25);
    position: sticky;
    top: 0;
    z-index: 100;
}

.rh-navbar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: -.01em;
    text-decoration: none;
}

.rh-navbar-brand img {
    height: 30px;
    width: auto;
}

.rh-navbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.btn-nav {
    background: rgba(255,255,255,.15);
    color: #fff;
    border: 1px solid rgba(255,255,255,.25);
    padding: 5px 14px;
    border-radius: var(--radius-sm);
    font-size: .82rem;
    font-weight: 500;
    cursor: pointer;
    transition: background var(--transition);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

.btn-nav:hover {
    background: rgba(255,255,255,.28);
    color: #fff;
}

/* ── Logo (login / formulário público) ───────────────────── */
.login-logo, .app-logo {
    display: block;
    height: auto;
    margin: 0 auto;
}
.login-logo { max-width: 220px; margin-bottom: 1.75rem; }
.app-logo   { max-height: 48px; margin-bottom: 1.25rem; }
.brand-logo { height: 28px; width: auto; }

/* ── Formulário de login ──────────────────────────────────── */
body.login-page {
    background: linear-gradient(135deg, #ED1639 0%, #8b0119 100%) !important;
    min-height: 100vh;
}

.login-card {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    border: none;
    overflow: hidden;
}

.login-card .card-body {
    padding: 2.25rem 2rem;
}

.login-subtitle {
    color: var(--text-2);
    font-size: .875rem;
}

.btn-login {
    background: var(--brand) !important;
    border-color: var(--brand) !important;
    color: #fff !important;
    font-weight: 600;
    letter-spacing: .01em;
    padding: .6rem 1rem;
    border-radius: var(--radius-sm);
    transition: background var(--transition), box-shadow var(--transition);
}
.btn-login:hover, .btn-login:focus {
    background: var(--brand-dark) !important;
    border-color: var(--brand-dark) !important;
    box-shadow: 0 4px 12px rgba(225,4,41,.3);
}

/* ── Inputs ───────────────────────────────────────────────── */
.form-control, .form-select {
    border-radius: var(--radius-sm);
    border-color: var(--border);
    font-size: .875rem;
    transition: border-color var(--transition), box-shadow var(--transition);
    background: var(--surface);
    color: var(--text);
}
.form-control:focus, .form-select:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px rgba(225,4,41,.12);
}
.form-label {
    font-size: .82rem;
    font-weight: 500;
    color: var(--text-2);
    margin-bottom: .35rem;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn {
    border-radius: var(--radius-sm);
    font-weight: 500;
    font-size: .82rem;
    transition: all var(--transition);
}
.btn-primary   { background: var(--brand); border-color: var(--brand); }
.btn-primary:hover { background: var(--brand-dark); border-color: var(--brand-dark); box-shadow: 0 3px 8px rgba(225,4,41,.25); }
.btn-success   { background: var(--green); border-color: var(--green); }
.btn-success:hover { background: #047857; border-color: #047857; }
.btn-danger    { background: var(--red); border-color: var(--red); }
.btn-danger:hover { background: #b91c1c; border-color: #b91c1c; }
.btn-info      { background: var(--blue); border-color: var(--blue); color: #fff; }
.btn-info:hover { background: #2563eb; border-color: #2563eb; color: #fff; }
.btn-warning   { background: var(--amber); border-color: var(--amber); color: #fff; }
.btn-warning:hover { background: #b45309; border-color: #b45309; color: #fff; }
.btn-outline-secondary {
    border-color: var(--border-dark);
    color: var(--text-2);
}
.btn-outline-secondary:hover {
    background: var(--bg);
    border-color: var(--text-3);
    color: var(--text);
}

/* ── Cards ────────────────────────────────────────────────── */
.card {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
}

/* ── Portal Home — módulos ────────────────────────────────── */
.module-card {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition), transform var(--transition);
    overflow: hidden;
    position: relative;
}
.module-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: var(--brand);
    opacity: 0;
    transition: opacity var(--transition);
}
.module-card:hover {
    box-shadow: var(--shadow);
    transform: translateY(-2px);
}
.module-card:hover::before { opacity: 1; }
.module-icon {
    width: 44px; height: 44px;
    border-radius: var(--radius-sm);
    background: var(--brand-50);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: .85rem;
    font-size: 1.3rem;
}

/* ── Formulário público ───────────────────────────────────── */
body.form-public-page {
    background: var(--brand);
    background: linear-gradient(160deg, #ED1639 0%, #9b011e 100%);
    min-height: 100vh;
    padding: 2rem 0;
}
.form-public-card {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    border: none;
    overflow: hidden;
}
.form-public-header {
    background: var(--brand);
    padding: 2rem 2.25rem 1.75rem;
    color: #fff;
}
.form-public-header img { height: 44px; width: auto; display: block; margin-bottom: .9rem; }
.form-public-header h1 { font-size: 1.5rem; font-weight: 700; margin: 0 0 .25rem; }
.form-public-header p  { font-size: .875rem; opacity: .85; margin: 0; }
.form-public-body { padding: 2rem 2.25rem; }

.form-section-title {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--brand);
    border-bottom: 1px solid var(--border);
    padding-bottom: .5rem;
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}
.form-section-title:first-child { margin-top: 0; }

.form-public-body .form-label { color: var(--text-2); }
.form-public-body .form-control,
.form-public-body .form-select {
    background: var(--surface-2);
}

.exp-block {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1rem;
}

.lgpd-box {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: .875rem 1rem;
    font-size: .8rem;
    color: var(--text-2);
    line-height: 1.55;
}

/* ── Kanban ───────────────────────────────────────────────── */
.rh-page { padding: 1rem 1.25rem; }

.filter-bar {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: .75rem 1rem;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: .75rem;
    box-shadow: var(--shadow-sm);
}

.filter-bar .form-control,
.filter-bar .form-select {
    background: var(--bg);
    border-color: var(--border);
    font-size: .8rem;
    height: 34px;
    padding: 0 .65rem;
    min-width: 0;
}
.filter-bar .form-select { height: 34px; }
.filter-bar .btn { height: 34px; padding: 0 .85rem; font-size: .8rem; }

.btn-agenda-bar {
    width: 100%;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: .65rem 1rem;
    font-weight: 600;
    font-size: .875rem;
    color: var(--brand);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: all var(--transition);
    margin-bottom: .75rem;
    box-shadow: var(--shadow-sm);
}
.btn-agenda-bar:hover {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
    box-shadow: 0 3px 8px rgba(225,4,41,.2);
}

.kanban-board {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 8px;
    align-items: start;
    margin: 0 -0.75rem;
    width: calc(100% + 1.5rem);
}

.kanban-column {
    background: var(--surface);
    border-radius: var(--radius);
    border: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 188px);
    min-height: 280px;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

.kanban-column-header {
    font-weight: 600;
    font-size: .78rem;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: #fff;
    padding: 9px 12px;
    border-radius: var(--radius) var(--radius) 0 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.kanban-column-header::before {
    content: '';
    width: 7px; height: 7px;
    border-radius: 50%;
    background: rgba(255,255,255,.6);
    flex-shrink: 0;
}

.status-1 { background: var(--blue); }
.status-2 { background: var(--red); }
.status-3 { background: var(--amber); }
.status-4 { background: var(--orange); }
.status-5 { background: var(--cyan); }
.status-6 { background: var(--green); }
.status-7 { background: #6B7280; }

.kanban-column-body {
    flex: 1;
    min-height: 0;
    padding: 8px;
    overflow-y: auto;
    overflow-x: hidden;
}

.candidate-card {
    background: var(--surface);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    border-left: 3px solid transparent;
    margin-bottom: 7px;
    padding: 9px 10px;
    cursor: grab;
    transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
}

.candidate-card:hover {
    box-shadow: var(--shadow);
    transform: translateY(-1px);
    border-left-color: var(--brand);
}

.candidate-card:active { cursor: grabbing; }

.candidate-card h6 {
    margin: 0 0 4px;
    font-size: .88rem;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-card p {
    margin: 0;
    color: var(--text-2);
    font-size: .78rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-card .btn { font-size: .75rem; }

.dropzone.drag-over {
    background: var(--brand-50);
    border: 2px dashed var(--brand);
}

.card-inline-actions {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}

.kanban-info-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .5rem;
}

/* ── Modal ────────────────────────────────────────────────── */
.modal-content {
    border: none;
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
}
.modal-header {
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    padding: 1rem 1.25rem;
    border-radius: var(--radius) var(--radius) 0 0;
}
.modal-title {
    font-size: .95rem;
    font-weight: 600;
    color: var(--text);
}
.modal-footer {
    background: var(--surface-2);
    border-top: 1px solid var(--border);
    padding: .75rem 1.25rem;
}

/* ── Detalhes candidato ───────────────────────────────────── */
.candidate-detail-label {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--text-3);
    margin-bottom: 1px;
}
.candidate-detail-value {
    font-size: .875rem;
    color: var(--text);
}

/* ── Resumo / verificação IA ──────────────────────────────── */
.resumo-ia-detalhe,
.verificacao-ia-detalhe {
    margin-top: .5rem;
    padding: .75rem 1rem;
    border-radius: var(--radius-sm);
    border-left: 3px solid;
}
.resumo-ia-detalhe {
    background: #FFF8F0;
    border-color: #F59E0B;
}
.verificacao-ia-detalhe {
    background: #EFF6FF;
    border-color: var(--blue);
}

.resumo-ia-texto,
.historico-entrevista-texto,
.verificacao-ia-texto,
.verificacao-ia-sugestoes-detalhe {
    white-space: pre-wrap;
    line-height: 1.5;
    color: var(--text);
    font-size: .875rem;
    margin-top: .4rem;
}

.verificacao-ia-secao {
    color: var(--brand);
    font-weight: 700;
    font-size: .875rem;
}

.verificacao-ia-sugestoes {
    background: #EFF6FF;
    border-left: 3px solid var(--blue);
    padding: .75rem 1rem;
    border-radius: var(--radius-sm);
    font-size: .8rem;
    line-height: 1.55;
}

/* ── Toast ────────────────────────────────────────────────── */
.toast {
    border: none;
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    font-size: .875rem;
}
.toast-header {
    background: var(--text);
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.1);
    border-radius: var(--radius) var(--radius) 0 0;
    padding: .5rem .85rem;
    font-size: .8rem;
}
.toast-header .btn-close { filter: invert(1); opacity: .7; }
.toast-body { background: var(--surface); border-radius: 0 0 var(--radius) var(--radius); padding: .6rem .85rem; }
.toast.text-bg-success .toast-body,
.toast.text-bg-danger .toast-body,
.toast.text-bg-dark .toast-body {
    background: transparent;
    border-radius: var(--radius);
    color: inherit;
}

/* ── Entrevista sessão ────────────────────────────────────── */
body.entrevista-sessao-page {
    background: var(--bg) !important;
}
.entrevista-sessao-main { max-width: 920px; }

.entrevista-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    padding: 1.25rem;
}

.entrevista-transcricao,
.entrevista-resumo {
    font-size: .875rem;
    line-height: 1.55;
    background: var(--surface-2);
    border-color: var(--border);
    border-radius: var(--radius-sm);
    resize: vertical;
}
.entrevista-resumo { background: #FAFFFE; }

.entrevista-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: .3rem .7rem;
    border-radius: 20px;
    font-size: .78rem;
    font-weight: 500;
}
.entrevista-status-pill.idle    { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--border); }
.entrevista-status-pill.active  { background: #ECFDF5; color: #065F46; border: 1px solid #A7F3D0; }
.entrevista-status-pill.loading { background: #EFF6FF; color: #1E40AF; border: 1px solid #BFDBFE; }

.pulse-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: currentColor;
    animation: pulse 1.2s infinite;
}
@keyframes pulse {
    0%, 100% { opacity: 1; } 50% { opacity: .3; }
}

/* ── Impressão ────────────────────────────────────────────── */
.print-page {
    background: var(--brand);
    margin: 0;
    padding: 20px;
}
.resume-layout {
    max-width: 1000px;
    margin: 0 auto;
    background: #fff;
}
.resume-photo { width: 100%; max-width: 210px; height: 220px; object-fit: cover; border: 3px solid rgba(255,255,255,.25); display: block; margin: 0 auto 18px; }
.resume-photo.placeholder { display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.2); color: #f8f9fa; }
.resume-main { padding: 28px 28px 36px; }
.resume-main header { position: relative; min-height: 140px; padding-right: 170px; }
.resume-main h1 { margin: 0; font-size: 2.4rem; line-height: 1.1; color: #1e293b; }
.resume-photo-top-right { position: absolute; top: 0; right: 0; width: 140px; height: 140px; object-fit: cover; border: 2px solid var(--border); border-radius: var(--radius-sm); }
.resume-main .subtitle { margin: 6px 0 14px; font-size: 1.1rem; color: var(--text-2); }
.resume-main section { margin-top: 18px; }
.resume-main h2 { border-bottom: 1px solid var(--border-dark); text-transform: uppercase; font-size: 1.2rem; padding-bottom: 4px; margin-bottom: 8px; }
.resume-main p { margin: 6px 0; color: var(--text); white-space: pre-line; }
.print-actions { max-width: 1000px; margin: 14px auto 0; display: flex; gap: 10px; }
.print-actions button, .print-actions a { border: 0; background: var(--brand); color: #fff; text-decoration: none; padding: 10px 14px; border-radius: var(--radius-sm); }
.print-actions a { background: var(--text-2); }

.resume-page-2, .resume-page-3 { margin-top: 20px; }
.resumo-ia-print-section { margin-top: 1rem; }
.resumo-ia-data { color: var(--text-2); font-size: .9rem; }
.resumo-ia-print-texto, .verificacao-ia-print-texto, .verificacao-ia-print-sugestoes { white-space: pre-wrap; line-height: 1.55; color: var(--text); margin-top: .75rem; font-size: .875rem; }
.verificacao-ia-print-sugestoes { background: var(--surface-2); padding: .75rem 1rem; border-radius: var(--radius-sm); }

@media print {
    .no-print { display: none !important; }
    .print-page { background: #fff; padding: 0; }
    .resume-layout { max-width: 100%; box-shadow: none; }
    .resume-page-2, .resume-page-3 { page-break-before: always; break-before: page; margin-top: 0; }
}

/* ── Calendário de agenda ─────────────────────────────────── */
#entrevistasCalendar { min-height: 500px; }
.entrevista-lista-item { padding: .65rem .85rem; }
.entrevista-lista-abrir { cursor: pointer; }
.entrevista-lista-abrir:hover strong { text-decoration: underline; }
.entrevista-lista-item:hover { background: var(--brand-50); }

/* ── Utilitários ──────────────────────────────────────────── */
.text-brand { color: var(--brand); }
.badge-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 20px;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
}

/* ── Responsivo ───────────────────────────────────────────── */
@media (max-width: 768px) {
    .kanban-board { grid-template-columns: repeat(6, minmax(150px, 1fr)); }
    .filter-bar   { flex-direction: column; }
    .filter-bar > * { width: 100%; }
    .form-public-header { padding: 1.5rem 1.25rem; }
    .form-public-body   { padding: 1.25rem; }
    .rh-navbar { padding: 0 .75rem; }
}