/* =====================================================
   APOIO A EVENTOS
   Componentes do módulo de gestão do fluxo de apoio.
===================================================== */


/* ==========
   INDICADORES
========== */

.ev-kpi{

    border-radius:16px;

    border:1px solid var(--bs-border-color);

    transition:all .25s ease;

    height:100%;

}

.ev-kpi:hover{

    transform:translateY(-4px);

    box-shadow:0 14px 28px rgba(0,0,0,.07);

}

.ev-kpi-icone{

    width:50px;

    height:50px;

    border-radius:14px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    font-size:19px;

}

.ev-kpi-valor{

    font-size:26px;

    font-weight:800;

    line-height:1.1;

}


/* ==========
   STEPPER DO PROCESSO
========== */

.ev-stepper{

    display:flex;

    align-items:flex-start;

    width:100%;

    overflow-x:auto;

    padding-bottom:4px;

}

.ev-stepper-etapa{

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    flex:1;

    min-width:120px;

    position:relative;

}

/* barra de ligação entre as etapas */
.ev-stepper-etapa::before,
.ev-stepper-etapa::after{

    content:"";

    position:absolute;

    top:21px;

    height:3px;

    background:var(--bs-border-color);

    width:50%;

    z-index:0;

}

.ev-stepper-etapa::before{ left:0; }
.ev-stepper-etapa::after{ right:0; }

.ev-stepper-etapa:first-child::before{ display:none; }
.ev-stepper-etapa:last-child::after{ display:none; }

.ev-stepper-etapa.concluida::before,
.ev-stepper-etapa.concluida::after,
.ev-stepper-etapa.ativa::before{

    background:var(--bs-primary);

}

.ev-stepper-bolinha{

    width:44px;

    height:44px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:16px;

    background:var(--bs-body-bg);

    border:3px solid var(--bs-border-color);

    color:var(--bs-secondary-color);

    position:relative;

    z-index:1;

    transition:.25s;

}

.ev-stepper-etapa.concluida .ev-stepper-bolinha{

    background:var(--bs-success);

    border-color:var(--bs-success);

    color:#fff;

}

.ev-stepper-etapa.ativa .ev-stepper-bolinha{

    background:var(--bs-primary);

    border-color:var(--bs-primary);

    color:#fff;

    box-shadow:0 0 0 5px var(--bs-primary-bg-subtle);

}

.ev-stepper-titulo{

    font-size:12px;

    font-weight:700;

    margin-top:10px;

    color:var(--bs-secondary-color);

    line-height:1.25;

}

.ev-stepper-etapa.ativa .ev-stepper-titulo,
.ev-stepper-etapa.concluida .ev-stepper-titulo{

    color:var(--bs-emphasis-color);

}

.ev-stepper-info{

    font-size:10px;

    color:var(--bs-tertiary-color);

    margin-top:3px;

    line-height:1.3;

}


/* ==========
   QUADRO POR ETAPA ( painel )
========== */

.ev-etapa-quadro{

    border:1px solid var(--bs-border-color);

    border-radius:14px;

    padding:14px;

    height:100%;

    cursor:pointer;

    background:var(--bs-body-bg);

    transition:all .2s ease;

}

.ev-etapa-quadro:hover{

    transform:translateY(-3px);

    border-color:var(--bs-primary);

}

.ev-etapa-quadro.ativo{

    border-color:var(--bs-primary);

    background:var(--bs-primary-bg-subtle);

}

.ev-etapa-quadro-icone{

    width:38px;

    height:38px;

    border-radius:11px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:15px;

    flex-shrink:0;

}

.ev-etapa-quadro-total{

    font-size:22px;

    font-weight:800;

    line-height:1;

}


/* ==========
   CARTÃO DE SOLICITAÇÃO
========== */

.ev-card{

    border:1px solid var(--bs-border-color);

    border-radius:16px;

    transition:all .25s ease;

    height:100%;

    overflow:hidden;

    position:relative;

}

.ev-card:hover{

    transform:translateY(-5px);

    box-shadow:0 16px 30px rgba(0,0,0,.08);

}

.ev-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    bottom:0;

    width:4px;

    background:var(--bs-secondary);

}

.ev-card.borda-info::before{ background:var(--bs-info); }
.ev-card.borda-warning::before{ background:var(--bs-warning); }
.ev-card.borda-primary::before{ background:var(--bs-primary); }
.ev-card.borda-success::before{ background:var(--bs-success); }
.ev-card.borda-danger::before{ background:var(--bs-danger); }
.ev-card.borda-secondary::before{ background:var(--bs-secondary); }

.ev-card-data{

    width:56px;

    height:56px;

    border-radius:14px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    background:var(--bs-secondary-bg);

    line-height:1;

}

.ev-card-data .dia{

    font-size:19px;

    font-weight:800;

}

.ev-card-data .mes{

    font-size:10px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.5px;

    margin-top:3px;

    color:var(--bs-secondary-color);

}

/* mini barra de progresso das 5 etapas dentro do cartão */
.ev-progresso{

    display:flex;

    gap:4px;

    margin-top:2px;

}

.ev-progresso span{

    flex:1;

    height:4px;

    border-radius:3px;

    background:var(--bs-border-color);

}

.ev-progresso span.feita{ background:var(--bs-success); }
.ev-progresso span.atual{ background:var(--bs-primary); }


/* ==========
   FILTROS RÁPIDOS
========== */

.ev-filtro{

    border:1px solid var(--bs-border-color);

    background:var(--bs-body-bg);

    border-radius:999px;

    padding:6px 16px;

    font-size:13px;

    font-weight:600;

    color:var(--bs-secondary-color);

    transition:.2s;

}

.ev-filtro:hover{

    border-color:var(--bs-primary);

    color:var(--bs-primary);

}

.ev-filtro.ativo{

    background:var(--bs-primary);

    border-color:var(--bs-primary);

    color:#fff;

}


/* ==========
   CATÁLOGO DE NECESSIDADES ( nova solicitação )
========== */

.ev-catalogo{

    border:1px solid var(--bs-border-color);

    border-radius:12px;

    padding:12px;

    cursor:pointer;

    height:100%;

    background:var(--bs-body-bg);

    transition:all .18s ease;

    display:flex;

    align-items:center;

    gap:12px;

}

.ev-catalogo:hover{

    border-color:var(--bs-primary);

    transform:translateY(-2px);

}

.ev-catalogo-icone{

    width:38px;

    height:38px;

    border-radius:11px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    font-size:15px;

    background:var(--bs-secondary-bg);

    color:var(--bs-secondary-color);

    transition:.18s;

}

.ev-catalogo:hover .ev-catalogo-icone{

    background:var(--bs-primary);

    color:#fff;

}


/* ==========
   NECESSIDADE ( linha do carrinho )
========== */

.ev-necessidade{

    border:1px solid var(--bs-border-color);

    border-radius:14px;

    padding:16px;

    background:var(--bs-body-bg);

    transition:.2s;

}

.ev-necessidade:hover{

    border-color:var(--bs-primary);

}

.ev-necessidade-icone{

    width:42px;

    height:42px;

    border-radius:12px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    font-size:16px;

    background:var(--bs-primary-bg-subtle);

    color:var(--bs-primary);

}

.ev-necessidade.coffee .ev-necessidade-icone{

    background:var(--bs-warning-bg-subtle);

    color:var(--bs-warning);

}


/* ==========
   COTAÇÕES
========== */

.ev-cotacao{

    border:1px solid var(--bs-border-color);

    border-radius:12px;

    padding:12px 14px;

    background:var(--bs-body-bg);

    transition:.2s;

}

.ev-cotacao.selecionada{

    border-color:var(--bs-success);

    background:var(--bs-success-bg-subtle);

    box-shadow:0 0 0 1px var(--bs-success) inset;

}

.ev-cotacao-valor{

    font-size:17px;

    font-weight:800;

    line-height:1;

}


/* ==========
   LINHA DO TEMPO
========== */

.ev-timeline{

    position:relative;

    padding-left:36px;

    margin:0;

    list-style:none;

}

.ev-timeline::before{

    content:"";

    position:absolute;

    left:17px;

    top:8px;

    bottom:8px;

    width:2px;

    background:var(--bs-border-color);

}

.ev-timeline-item{

    position:relative;

    padding-bottom:22px;

}

.ev-timeline-item:last-child{

    padding-bottom:0;

}

.ev-timeline-ponto{

    position:absolute;

    left:-36px;

    top:0;

    width:36px;

    height:36px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:13px;

    background:var(--bs-body-bg);

    border:2px solid var(--bs-border-color);

}


/* ==========
   ANEXOS
========== */

.ev-anexo{

    border:1px solid var(--bs-border-color);

    border-radius:12px;

    padding:12px;

    display:flex;

    align-items:center;

    gap:12px;

    background:var(--bs-body-bg);

    transition:.2s;

}

.ev-anexo:hover{

    border-color:var(--bs-primary);

}

.ev-anexo-icone{

    width:38px;

    height:38px;

    border-radius:11px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    font-size:15px;

    background:var(--bs-secondary-bg);

    color:var(--bs-secondary-color);

}

.ev-dropzone{

    border:2px dashed var(--bs-border-color);

    border-radius:14px;

    padding:26px;

    text-align:center;

    cursor:pointer;

    transition:.2s;

    background:var(--bs-body-bg);

}

.ev-dropzone:hover{

    border-color:var(--bs-primary);

    background:var(--bs-primary-bg-subtle);

}


/* ==========
   PAINEL DE ETAPA ( processo )
========== */

.ev-acao-etapa{

    border:1px solid var(--bs-border-color);

    border-left:4px solid var(--bs-primary);

    border-radius:12px;

    padding:16px 18px;

    background:var(--bs-primary-bg-subtle);

}


/* ==========
   ESTADO VAZIO
========== */

.ev-vazio{

    padding:52px 24px;

    text-align:center;

}

.ev-vazio-icone{

    width:84px;

    height:84px;

    border-radius:26px;

    margin:0 auto 18px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:32px;

    background:var(--bs-secondary-bg);

    color:var(--bs-secondary-color);

}


/* ==========
   CALENDÁRIO

   Temiza o FullCalendar 6 com as variáveis do Phoenix, para o componente
   herdar borda, fundo e modo escuro do resto da plataforma. Só aparência:
   nenhuma regra aqui depende de dado do evento — a cor de cada evento vem
   das classes bg-* da situação cadastrada no banco.
========== */

/* ---- barra de controle ---- */

.ev-cal-titulo{

    text-transform:capitalize;

    min-width:11rem;

}

.ev-cal-salto{

    width:9.5rem;

}

.ev-cal-busca-icone{

    position:absolute;

    left:.85rem;

    top:50%;

    transform:translateY(-50%);

    font-size:.75rem;

    color:var(--bs-tertiary-color);

    pointer-events:none;

}

.ev-kpi-clicavel{

    cursor:pointer;

}

.ev-cal-carregando{

    position:absolute;

    top:1rem;

    right:1.25rem;

    z-index:5;

}


/* ---- legenda ---- */

.ev-cal-legenda{

    display:inline-flex;

    align-items:center;

    gap:.4rem;

    border:1px solid var(--bs-border-color);

    background:var(--bs-body-bg);

    border-radius:999px;

    padding:.2rem .6rem;

    font-size:.75rem;

    color:var(--bs-body-color);

    cursor:pointer;

    transition:all .18s ease;

}

.ev-cal-legenda:hover{

    border-color:var(--bs-primary);

    transform:translateY(-1px);

}

.ev-cal-legenda.ativa{

    border-color:var(--bs-primary);

    box-shadow:0 0 0 2px rgba(var(--bs-primary-rgb),.18);

    font-weight:600;

}

/* status sem nenhum evento na janela continua visível, mas discreto:
   a legenda é o catálogo completo, não só o que apareceu */
.ev-cal-legenda.zerada{

    opacity:.45;

}

.ev-cal-legenda-total{

    font-variant-numeric:tabular-nums;

    font-weight:600;

    background:var(--bs-secondary-bg);

    border-radius:999px;

    padding:0 .4rem;

    min-width:1.4rem;

    text-align:center;

}

.ev-cal-ponto{

    width:.5rem;

    height:.5rem;

    border-radius:50%;

    display:inline-block;

    flex-shrink:0;

}


/* ---- grade do FullCalendar ---- */

#calendario{

    --fc-border-color:var(--bs-border-color);

    --fc-page-bg-color:transparent;

    --fc-neutral-bg-color:var(--bs-secondary-bg);

    --fc-today-bg-color:rgba(var(--bs-primary-rgb),.07);

    --fc-now-indicator-color:var(--bs-danger);

    --fc-list-event-hover-bg-color:var(--bs-body-highlight-bg,var(--bs-secondary-bg));

}

#calendario .fc{

    font-size:.85rem;

}

#calendario .fc .fc-col-header-cell{

    background:var(--bs-secondary-bg);

    padding:.5rem 0;

}

#calendario .fc .fc-col-header-cell-cushion{

    font-size:.7rem;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.03em;

    color:var(--bs-secondary-color);

    text-decoration:none;

}

#calendario .fc .fc-daygrid-day-number{

    font-size:.78rem;

    font-weight:600;

    color:var(--bs-body-color);

    text-decoration:none;

    padding:.35rem .45rem;

}

#calendario .fc .fc-day-today .fc-daygrid-day-number{

    background:var(--bs-primary);

    color:#fff;

    border-radius:999px;

    min-width:1.6rem;

    text-align:center;

}

#calendario .fc .fc-day-other .fc-daygrid-day-number{

    opacity:.4;

}

#calendario .fc .fc-daygrid-day-frame{

    min-height:6.5rem;

}

#calendario .fc .fc-scrollgrid{

    border-radius:10px;

    overflow:hidden;

}

#calendario .fc .fc-timegrid-slot-label-cushion{

    font-size:.72rem;

    color:var(--bs-tertiary-color);

}

#calendario .fc .fc-daygrid-more-link{

    font-size:.7rem;

    font-weight:600;

    color:var(--bs-primary);

}


/* ---- evento (chip) ---- */

#calendario .fc .ev-cal-evento{

    border:none;

    background:transparent;

    box-shadow:none;

    padding:0;

    margin:1px 2px;

    cursor:pointer;

}

.ev-cal-chip{

    display:flex;

    align-items:center;

    gap:.3rem;

    padding:.18rem .4rem;

    border-radius:6px;

    background:var(--bs-secondary-bg);

    border-left:3px solid var(--bs-secondary);

    overflow:hidden;

    transition:transform .14s ease, box-shadow .14s ease, background .14s ease;

}

.ev-cal-evento:hover .ev-cal-chip{

    transform:translateX(2px);

    box-shadow:0 3px 8px rgba(0,0,0,.14);

}

.ev-cal-chip-hora{

    font-variant-numeric:tabular-nums;

    font-weight:700;

    font-size:.7rem;

    color:var(--bs-secondary-color);

    flex-shrink:0;

}

.ev-cal-chip-titulo{

    font-weight:600;

    font-size:.75rem;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

}

.ev-cal-chip-sigla{

    margin-left:auto;

    font-size:.62rem;

    font-weight:700;

    text-transform:uppercase;

    color:var(--bs-tertiary-color);

    flex-shrink:0;

}

.ev-cal-chip-detalhe{

    font-size:.68rem;

    color:var(--bs-secondary-color);

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

}

/* a borda do chip acompanha a cor da situação (vinda do banco) */
.ev-cal-info      .ev-cal-chip{ border-left-color:var(--bs-info);      background:rgba(var(--bs-info-rgb),.10); }
.ev-cal-primary   .ev-cal-chip{ border-left-color:var(--bs-primary);   background:rgba(var(--bs-primary-rgb),.10); }
.ev-cal-success   .ev-cal-chip{ border-left-color:var(--bs-success);   background:rgba(var(--bs-success-rgb),.10); }
.ev-cal-warning   .ev-cal-chip{ border-left-color:var(--bs-warning);   background:rgba(var(--bs-warning-rgb),.12); }
.ev-cal-danger    .ev-cal-chip{ border-left-color:var(--bs-danger);    background:rgba(var(--bs-danger-rgb),.10); }
.ev-cal-secondary .ev-cal-chip{ border-left-color:var(--bs-secondary); background:var(--bs-secondary-bg); }

/* processo encerrado fica sóbrio, para não competir com o que está ativo */
.ev-cal-encerrado .ev-cal-chip-titulo{

    text-decoration:line-through;

    opacity:.75;

}


/* ---- visão de agenda (lista) ---- */

#calendario .fc .fc-list{

    border-radius:10px;

    overflow:hidden;

}

#calendario .fc .fc-list-day-cushion{

    background:var(--bs-secondary-bg);

    text-transform:capitalize;

    font-size:.78rem;

    font-weight:700;

}

#calendario .fc .fc-list-event td{

    padding:.6rem .75rem;

}

#calendario .fc .fc-list-event-time{

    font-variant-numeric:tabular-nums;

    font-size:.75rem;

    color:var(--bs-secondary-color);

    white-space:nowrap;

}

#calendario .fc .fc-list-empty{

    background:transparent;

    color:var(--bs-tertiary-color);

    font-size:.85rem;

}

.ev-cal-lista-item{

    line-height:1.35;

}


/* ---- tooltip ---- */

.ev-cal-tooltip .tooltip-inner{

    max-width:19rem;

    text-align:left;

    padding:.6rem .7rem;

    font-size:.75rem;

    background:var(--bs-emphasis-color);

    color:var(--bs-body-bg);

}

.ev-cal-tooltip .tooltip-arrow::before{

    border-top-color:var(--bs-emphasis-color);

}

.ev-cal-tip-linha{

    display:flex;

    align-items:baseline;

    gap:.4rem;

    opacity:.9;

}

.ev-cal-tip-linha i{

    width:.85rem;

    text-align:center;

    flex-shrink:0;

    opacity:.7;

}

.ev-cal-tip-rodape{

    margin-top:.4rem;

    padding-top:.3rem;

    border-top:1px solid rgba(255,255,255,.2);

    font-size:.68rem;

    opacity:.7;

    font-style:italic;

}


/* ---- modal da ficha ---- */

.ev-cal-modal{

    overflow:hidden;

}

.ev-cal-modal-faixa{

    height:4px;

    width:100%;

    flex-shrink:0;

}

.ev-cal-bloco{

    border:1px solid var(--bs-border-color);

    border-radius:10px;

    padding:.7rem .85rem;

    height:100%;

    background:var(--bs-body-bg);

}

.ev-cal-bloco-rotulo{

    font-size:.65rem;

    text-transform:uppercase;

    letter-spacing:.04em;

    font-weight:700;

    color:var(--bs-tertiary-color);

    margin-bottom:.2rem;

}

.ev-cal-pessoa{

    display:flex;

    align-items:center;

    gap:.6rem;

    border:1px solid var(--bs-border-color);

    border-radius:10px;

    padding:.55rem .7rem;

    height:100%;

}

.ev-cal-pessoa-icone{

    width:2.1rem;

    height:2.1rem;

    border-radius:8px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:.85rem;

    flex-shrink:0;

}

.ev-cal-recurso{

    display:flex;

    align-items:flex-start;

    gap:.6rem;

    padding:.5rem .25rem;

    border-top:1px solid var(--bs-border-color-translucent);

    font-size:.82rem;

}

.ev-cal-recurso:first-child{

    border-top:none;

}

.ev-cal-recurso-icone{

    width:1.1rem;

    text-align:center;

    color:var(--bs-tertiary-color);

    margin-top:.15rem;

    flex-shrink:0;

}


/* ---- responsividade ---- */

@media (max-width:991.98px){

    .ev-cal-titulo{ min-width:100%; order:10; font-size:1.05rem; }

    .ev-cal-salto{ display:none; }

    #calendario .fc .fc-daygrid-day-frame{ min-height:5rem; }

}

@media (max-width:767.98px){

    /* no estreito os botões de visão viram só ícone */
    .ev-cal-visoes .ev-cal-rotulo{ display:none; }

    .ev-cal-chip-detalhe,
    .ev-cal-chip-sigla{ display:none; }

    #calendario .fc{ font-size:.8rem; }

}
