/* ==========================================================================
   EMPREGA EXTREMA • SETEMBRO AMARELO 2026
   CAMADA GLOBAL V2

   IMPORTANTE:
   - A sidebar/drawer do Rodeio NÃO é tematizada por este arquivo.
   - A tela candidato/rodeio_extrema.php NÃO carrega este arquivo.
   - Toda a customização abaixo fica limitada à área de conteúdo marcada
     dinamicamente com .sa-page-surface.
   ========================================================================== */

body.setembro-amarelo-system{
    --sa-yellow:#FFD51F;
    --sa-yellow-2:#FFE765;
    --sa-yellow-3:#FFF3A9;
    --sa-soft:#FFFBE4;
    --sa-soft-2:#FFFDF5;
    --sa-amber:#D59A00;
    --sa-amber-dark:#9B6D00;
    --sa-navy:#082B50;
    --sa-navy-2:#0D4F85;
    --sa-text:#14273A;
    --sa-muted:#687888;
    --sa-line:rgba(210,157,0,.22);

    background:
        radial-gradient(circle at 84% 4%,rgba(255,213,31,.15),transparent 28rem),
        linear-gradient(180deg,#fffefa,#fffdf5 55%,#f6faff 100%);
}

/* ==========================================================================
   GARANTIA: SIDEBARS DO RODEIO FICAM FORA DO TEMA
   Não aplicamos cores nem filtros nesses elementos.
   ========================================================================== */
body.setembro-amarelo-system :is(
    .sidebar,
    .candidate-mobile-sidebar,
    .mobile-sidebar,
    .empresa-sidebar,
    .admin-sidebar,
    .side-menu,
    aside[class*="sidebar"],
    nav[class*="sidebar"]
){
    /* propositalmente sem propriedades visuais */
}

/* ==========================================================================
   ÁREA DE CONTEÚDO
   ========================================================================== */
body.setembro-amarelo-system .sa-page-surface{
    position:relative;
    /* Não criar stacking context aqui: o backdrop do Bootstrap fica no body. */
}

body.setembro-amarelo-system .sa-page-surface::after{
    content:"";
    position:absolute;
    z-index:-1;
    pointer-events:none;
    width:290px;
    height:290px;
    right:-100px;
    top:40px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,213,31,.15),rgba(255,213,31,0) 69%);
}

/* ==========================================================================
   BANNER GLOBAL
   ========================================================================== */
.sa-global-banner{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:15px;
    width:100%;
    margin:0 0 20px;
    padding:15px 17px;
    border:1px solid rgba(205,151,0,.26);
    border-radius:21px;
    background:
        radial-gradient(circle at 91% 15%,rgba(255,255,255,.72),transparent 14rem),
        linear-gradient(118deg,#FFD51F 0%,#FFE875 53%,#FFF7C2 100%);
    box-shadow:
        0 18px 42px rgba(122,91,0,.11),
        inset 0 1px rgba(255,255,255,.55);
    color:var(--sa-navy);
}

.sa-global-banner::before{
    content:"";
    position:absolute;
    right:-54px;
    top:-65px;
    width:180px;
    height:180px;
    border:24px solid rgba(255,255,255,.20);
    border-radius:50%;
    pointer-events:none;
}

.sa-global-ribbon{
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border-radius:16px;
    background:linear-gradient(145deg,var(--sa-navy),var(--sa-navy-2));
    color:#fff;
    font-size:1.55rem;
    box-shadow:0 11px 24px rgba(8,43,80,.17);
}

.sa-global-copy{
    min-width:0;
}

.sa-global-kicker{
    display:block;
    margin-bottom:3px;
    color:#795600;
    font-size:.65rem;
    line-height:1.25;
    letter-spacing:.12em;
    text-transform:uppercase;
    font-weight:1000;
}

.sa-global-copy strong{
    display:block;
    color:#102B45;
    font-size:.98rem;
    line-height:1.3;
    font-weight:1000;
}

.sa-global-copy small{
    display:block;
    margin-top:3px;
    color:#536473;
    font-size:.74rem;
    line-height:1.45;
    font-weight:650;
}

.sa-global-action{
    min-height:41px;
    padding:0 13px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:13px;
    background:linear-gradient(135deg,var(--sa-navy),#0B477C);
    color:#fff !important;
    text-decoration:none !important;
    white-space:nowrap;
    font-size:.72rem;
    line-height:1;
    font-weight:950;
    box-shadow:0 9px 20px rgba(8,43,80,.15);
    transition:transform .16s ease, box-shadow .16s ease;
}

.sa-global-action:hover{
    color:#fff !important;
    transform:translateY(-1px);
    box-shadow:0 12px 24px rgba(8,43,80,.20);
}

/* ==========================================================================
   TOPBARS DA ÁREA DE CONTEÚDO
   A drawer/sidebar continua Rodeio.
   ========================================================================== */
body.setembro-amarelo-system :is(
    .topbar,
    .mobile-app-topbar,
    .page-topbar,
    .admin-topbar,
    .empresa-topbar
){
    border-bottom-color:rgba(207,153,0,.22) !important;
    background:
        linear-gradient(110deg,rgba(255,253,238,.97),rgba(255,241,151,.94)) !important;
    color:var(--sa-navy) !important;
    box-shadow:0 9px 28px rgba(108,80,0,.07);
}

body.setembro-amarelo-system :is(
    .topbar,
    .mobile-app-topbar,
    .page-topbar,
    .admin-topbar,
    .empresa-topbar
) :is(h1,h2,h3,strong,small,span){
    color:inherit;
}

/* ==========================================================================
   HEROS / CABEÇALHOS
   Somente dentro da superfície da página.
   ========================================================================== */
body.setembro-amarelo-system .sa-page-surface :is(
    .hero,
    .page-hero,
    .dashboard-hero,
    .welcome-card,
    .welcome-panel,
    .summary-hero,
    .profile-hero,
    .head-card,
    .top-hero
){
    position:relative;
    overflow:hidden;
    color:var(--sa-navy) !important;
    border-color:rgba(203,150,0,.22) !important;
    background:
        radial-gradient(circle at 90% -10%,rgba(255,255,255,.75),transparent 18rem),
        linear-gradient(126deg,#FFD51F 0%,#FFE875 50%,#FFF8CB 100%) !important;
    box-shadow:0 22px 54px rgba(125,92,0,.12) !important;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .hero,
    .page-hero,
    .dashboard-hero,
    .welcome-card,
    .welcome-panel,
    .summary-hero,
    .profile-hero,
    .head-card,
    .top-hero
)::after{
    content:"🎗️";
    position:absolute;
    right:4%;
    bottom:-25px;
    opacity:.09;
    font-size:7rem;
    line-height:1;
    transform:rotate(-8deg);
    pointer-events:none;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .hero,
    .page-hero,
    .dashboard-hero,
    .welcome-card,
    .welcome-panel,
    .summary-hero,
    .profile-hero,
    .head-card,
    .top-hero
) :is(h1,h2,h3,h4,p,small,strong,span){
    color:var(--sa-navy) !important;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .hero-badge,
    .eyebrow,
    .badge-company,
    .hero-chip,
    .pill-highlight
){
    border-color:rgba(8,43,80,.10) !important;
    background:linear-gradient(135deg,var(--sa-navy),var(--sa-navy-2)) !important;
    color:#fff !important;
}

/* Empresa específica possui imagem própria no hero.
   Não substituímos o banner/foto da empresa; apenas colocamos um contorno
   amarelo e detalhes de campanha. */
body.setembro-amarelo-system .sa-page-surface .company-hero{
    border:2px solid rgba(229,174,0,.42) !important;
    box-shadow:0 24px 60px rgba(116,86,0,.14) !important;
}

body.setembro-amarelo-system .sa-page-surface .company-hero::after{
    content:"SETEMBRO AMARELO";
    position:absolute;
    z-index:3;
    top:18px;
    right:18px;
    padding:7px 11px;
    border-radius:999px;
    background:#FFD51F;
    color:#102B45;
    font-size:.63rem;
    font-weight:1000;
    letter-spacing:.06em;
    box-shadow:0 8px 18px rgba(0,0,0,.15);
}

/* ==========================================================================
   CARDS E PAINÉIS
   ========================================================================== */
body.setembro-amarelo-system .sa-page-surface :is(
    .card,
    .kpi,
    .stat-card,
    .metric-card,
    .vaga,
    .vaga-card,
    .company-card,
    .calc-card,
    .radar-shell,
    .side-panel,
    .quiz-panel,
    .notif,
    .notification-card,
    .summary-card,
    .completion-card,
    .wizard-shell,
    .wizard-card,
    .filter-card,
    .filtro,
    .notice-top,
    .info-card,
    .access-card,
    .panel,
    .box,
    .process-card,
    .talent-card,
    .interview-card,
    .privacy-card,
    .lgpd-card
){
    border-color:rgba(212,160,0,.19) !important;
    box-shadow:0 14px 38px rgba(74,58,0,.065) !important;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .kpi,
    .stat-card,
    .metric-card,
    .calc-card,
    .summary-card
){
    position:relative;
    overflow:hidden;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .kpi,
    .stat-card,
    .metric-card,
    .calc-card,
    .summary-card
)::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:3px;
    background:linear-gradient(90deg,#FFD51F,#E4A800);
}

body.setembro-amarelo-system .sa-page-surface :is(
    .kpi-icon,
    .stat-icon,
    .metric-icon,
    .calc-icon,
    .step-heading-icon,
    .section-icon,
    .icon-box
){
    border-color:rgba(205,152,0,.15) !important;
    background:linear-gradient(135deg,#FFD51F,#FFF0A0) !important;
    color:var(--sa-navy) !important;
}

/* ==========================================================================
   BOTÕES / FILTROS / CHIPS
   Mantemos azul institucional nos CTAs principais, com amarelo como campanha.
   ========================================================================== */
body.setembro-amarelo-system .sa-page-surface :is(
    .btn-filter,
    .btn-calc,
    .btn-next,
    .btn-next-step,
    .btn-save,
    .btn-warning-theme,
    .chip.active,
    .filter-chip.active,
    .tab.active
){
    border-color:transparent !important;
    background:linear-gradient(135deg,#FFD51F,#E8AC00) !important;
    color:#0B2A48 !important;
    box-shadow:0 9px 20px rgba(194,143,0,.17);
}

body.setembro-amarelo-system .sa-page-surface :is(
    .btn-primary,
    .btn-main,
    .btn-details,
    .btn-apply
){
    border-color:var(--sa-navy) !important;
    background:linear-gradient(135deg,var(--sa-navy),var(--sa-navy-2)) !important;
    color:#fff !important;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .result-count,
    .badge-vaga,
    .tag,
    .status-badge.warning,
    .highlight-tag
){
    border-color:rgba(213,160,0,.18) !important;
    background:#FFF3A7 !important;
    color:#745400 !important;
}

/* ==========================================================================
   FORMULÁRIOS
   ========================================================================== */
body.setembro-amarelo-system .sa-page-surface :is(
    .form-control,
    .form-select,
    input,
    select,
    textarea
):focus{
    border-color:#DDA800 !important;
    box-shadow:0 0 0 4px rgba(255,213,31,.17) !important;
}

body.setembro-amarelo-system .sa-page-surface :is(
    .progress-bar,
    .completion-track > span,
    .progress-fill
){
    background:linear-gradient(90deg,#FFD51F,#E0A400) !important;
}

/* ==========================================================================
   NOTIFICAÇÕES
   ========================================================================== */
body.setembro-amarelo-system .sa-page-surface :is(
    .notif.unread,
    .notification-card.unread
){
    border-left-color:#DDA800 !important;
    background:linear-gradient(90deg,#FFF8C8 0%,#fff 34%) !important;
}

/* ==========================================================================
   ADMIN / EMPRESA
   ========================================================================== */
body.setembro-amarelo-system[data-sa-context="empresa"] .sa-global-banner,
body.setembro-amarelo-system[data-sa-context="admin"] .sa-global-banner{
    background:
        radial-gradient(circle at 91% 15%,rgba(255,255,255,.72),transparent 14rem),
        linear-gradient(118deg,#FFDC35 0%,#FFEB84 53%,#FFF9D0 100%);
}

body.setembro-amarelo-system[data-sa-context="admin"] .sa-page-surface :is(
    table thead th,
    .table thead th
){
    border-color:rgba(207,155,0,.18) !important;
    background:#FFF9D8 !important;
    color:#19334A !important;
}

/* ==========================================================================
   RESPONSIVO
   ========================================================================== */
@media(max-width:991px){
    .sa-global-banner{
        margin-bottom:16px;
    }
}

@media(max-width:768px){
    .sa-global-banner{
        grid-template-columns:auto minmax(0,1fr);
        gap:11px;
        padding:13px;
        border-radius:17px;
    }

    .sa-global-ribbon{
        width:47px;
        height:47px;
        border-radius:14px;
        font-size:1.35rem;
    }

    .sa-global-copy strong{
        font-size:.86rem;
    }

    .sa-global-copy small{
        font-size:.67rem;
    }

    .sa-global-action{
        grid-column:1 / -1;
        width:100%;
        min-height:39px;
    }

    body.setembro-amarelo-system .sa-page-surface :is(
        .hero,
        .page-hero,
        .dashboard-hero,
        .welcome-card,
        .welcome-panel
    )::after{
        right:-8px;
        font-size:5rem;
    }
}

@media(max-width:420px){
    .sa-global-banner{
        padding:11px;
        margin-bottom:13px;
    }

    .sa-global-kicker{
        font-size:.56rem;
        letter-spacing:.08em;
    }

    .sa-global-copy strong{
        font-size:.80rem;
        line-height:1.27;
    }

    .sa-global-copy small{
        margin-top:2px;
        font-size:.63rem;
        line-height:1.34;
    }
}