/**
 * CNJ Processo Tracker — Calendário v1.0
 */

/* ── Wrapper ─────────────────────────────────────────────────────── */
.cal-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 360px;
    background: #0d1520;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    font-size: .82rem;
    color: #cbd5e1;
}
.cal-loading, .cal-erro, .cal-vazio {
    padding: 30px;
    text-align: center;
    color: #64748b;
    font-size: .82rem;
}
.cal-erro { color: #f87171; }

/* ── Toolbar ─────────────────────────────────────────────────────── */
.cal-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: #111d2e;
    border-bottom: 1px solid #1e2d40;
    flex-shrink: 0;
    gap: 8px;
    flex-wrap: wrap;
}
.cal-toolbar-esq { display: flex; gap: 6px; align-items: center; }

.cal-btn {
    padding: 5px 12px;
    border-radius: 6px;
    border: 1px solid #334155;
    background: #1e293b;
    color: #94a3b8;
    font-size: .75rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
}
.cal-btn:hover { background: #334155; color: #e2e8f0; }
.cal-btn:disabled { opacity: .4; cursor: default; pointer-events: none; }

.cal-btn-extrair { color: #C9A84C; border-color: #C9A84C44; }
.cal-btn-extrair:hover { background: #1a2338; border-color: #C9A84C; }
.cal-btn-novo   { color: #4ade80; border-color: #4ade8044; }
.cal-btn-novo:hover { background: #052e16; border-color: #4ade80; }
.cal-btn-salvar { color: #4ade80; border-color: #4ade8044; }
.cal-btn-salvar:hover { background: #052e16; border-color: #4ade80; }
.cal-btn-cancelar { color: #94a3b8; }

/* ── Toggle de vista ─────────────────────────────────────────────── */
.cal-view-toggle { display: flex; gap: 4px; }
.cal-view-btn {
    padding: 4px 10px;
    border-radius: 5px;
    border: 1px solid #334155;
    background: transparent;
    color: #64748b;
    font-size: .72rem;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.cal-view-btn.ativo { background: #1e3a5f; color: #93c5fd; border-color: #3b82f6; }
.cal-view-btn:not(.ativo):hover { background: #1a2638; color: #94a3b8; }

/* ── Legenda ─────────────────────────────────────────────────────── */
.cal-legenda {
    display: flex;
    gap: 14px;
    padding: 5px 12px;
    background: #0a111c;
    border-bottom: 1px solid #1e2d40;
    flex-shrink: 0;
    flex-wrap: wrap;
}
.cal-leg-item {
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .02em;
}
.cal-leg-item.vencido  { color: #f87171; }
.cal-leg-item.critico  { color: #fb923c; }
.cal-leg-item.urgente  { color: #fbbf24; }
.cal-leg-item.normal   { color: #4ade80; }

/* ── Conteúdo scrollável ─────────────────────────────────────────── */
#cnj-cal-conteudo {
    flex: 1;
    overflow-y: auto;
    padding: 10px 12px;
}
#cnj-cal-conteudo::-webkit-scrollbar { width: 5px; }
#cnj-cal-conteudo::-webkit-scrollbar-track { background: transparent; }
#cnj-cal-conteudo::-webkit-scrollbar-thumb { background: #1e2d40; border-radius: 3px; }

/* ── Grupos da lista ─────────────────────────────────────────────── */
.cal-grupo { margin-bottom: 18px; }
.cal-grupo-titulo {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #475569;
    padding: 4px 0 8px;
    border-bottom: 1px solid #1e2d40;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.cal-grupo-qtd { color: #334155; font-weight: 400; }

/* ── Item de evento ──────────────────────────────────────────────── */
.cal-item {
    display: flex;
    align-items: stretch;
    background: #111d2e;
    border: 1px solid #1e2d40;
    border-radius: 7px;
    margin-bottom: 6px;
    overflow: hidden;
    transition: border-color .15s, background .15s;
    position: relative;
}
.cal-item:hover { background: #1a2638; border-color: #334155; }
.cal-item.cal-concluido { opacity: .5; }

/* Barra lateral colorida por tipo */
.cal-item-barra {
    width: 4px;
    flex-shrink: 0;
    border-radius: 7px 0 0 7px;
}

.cal-item-corpo {
    flex: 1;
    padding: 8px 10px;
    min-width: 0;
}
.cal-item-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    flex-wrap: wrap;
}
.cal-item-icone { font-size: .9rem; flex-shrink: 0; }
.cal-item-titulo {
    font-weight: 600;
    color: #e2e8f0;
    font-size: .8rem;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cal-item-origem {
    font-size: .65rem;
    padding: 1px 6px;
    border-radius: 10px;
    font-weight: 600;
    flex-shrink: 0;
}
.cal-item-origem.auto   { background: #1e3a5f; color: #93c5fd; }
.cal-item-origem.ia     { background: #2d1b69; color: #a78bfa; }
.cal-item-origem.manual { background: #1a2638; color: #64748b; }

.cal-item-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .72rem;
}
.cal-item-data { color: #64748b; }
.cal-item-dias {
    font-weight: 700;
    font-size: .7rem;
    padding: 1px 7px;
    border-radius: 10px;
}
.cal-item-dias.cal-urgencia-vencido { background: #450a0a; color: #f87171; }
.cal-item-dias.cal-urgencia-critico { background: #431407; color: #fb923c; }
.cal-item-dias.cal-urgencia-urgente { background: #422006; color: #fbbf24; }
.cal-item-dias.cal-urgencia-normal  { background: #052e16; color: #4ade80; }

.cal-item-desc {
    margin-top: 4px;
    font-size: .72rem;
    color: #64748b;
    line-height: 1.4;
}
.cal-item-mov {
    margin-top: 3px;
    font-size: .68rem;
    color: #334155;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Botões de ação do item */
.cal-item-acoes {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 6px 8px;
    flex-shrink: 0;
}
.cal-item-acao {
    width: 24px;
    height: 24px;
    border-radius: 5px;
    border: 1px solid transparent;
    background: transparent;
    color: #475569;
    font-size: .75rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .1s, color .1s;
    line-height: 1;
}
.cal-concluir:hover { background: #052e16; color: #4ade80; border-color: #4ade8044; }
.cal-reabrir:hover  { background: #1e3a5f; color: #93c5fd; border-color: #3b82f644; }
.cal-excluir:hover  { background: #450a0a; color: #f87171; border-color: #f8717144; }

/* ── Grade mensal ────────────────────────────────────────────────── */
.cal-grade-wrapper { padding-bottom: 8px; }

.cal-grade-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 8px 0 10px;
}
.cal-nav-btn {
    width: 28px; height: 28px;
    border-radius: 6px;
    border: 1px solid #334155;
    background: #1e293b;
    color: #94a3b8;
    font-size: 1rem;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .15s;
}
.cal-nav-btn:hover { background: #334155; color: #e2e8f0; }
.cal-mes-titulo { font-size: .9rem; font-weight: 700; color: #e2e8f0; min-width: 150px; text-align: center; }

.cal-grade-head {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    margin-bottom: 4px;
}
.cal-cel-head {
    text-align: center;
    font-size: .65rem;
    font-weight: 700;
    color: #475569;
    text-transform: uppercase;
    padding: 3px 0;
}

.cal-grade-body {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px;
}
.cal-cel {
    min-height: 68px;
    background: #111d2e;
    border: 1px solid #1e2d40;
    border-radius: 5px;
    padding: 4px;
    overflow: hidden;
    transition: background .1s;
    cursor: default;
}
.cal-cel:hover { background: #1a2638; }
.cal-cel-vazia { background: transparent; border-color: transparent; cursor: default; }
.cal-cel.cal-hoje { border-color: #3b82f6; background: #0f1f3d; }
.cal-cel.cal-passado { opacity: .5; }

.cal-cel-num {
    font-size: .7rem;
    font-weight: 700;
    color: #475569;
    margin-bottom: 3px;
    line-height: 1;
}
.cal-cel.cal-hoje .cal-cel-num { color: #93c5fd; }

.cal-cel-evento {
    font-size: .6rem;
    color: #fff;
    border-radius: 3px;
    padding: 1px 4px;
    margin-bottom: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: .9;
}
.cal-cel-mais {
    font-size: .6rem;
    color: #64748b;
    text-align: right;
    margin-top: 1px;
}

.cal-grade-lista { margin-top: 14px; }

/* ── Modal de novo evento ────────────────────────────────────────── */
.cal-modal-novo {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30;
    padding: 16px;
}
.cal-modal-inner {
    background: #111d2e;
    border: 1px solid #334155;
    border-radius: 10px;
    padding: 20px;
    width: 100%;
    max-width: 380px;
}
.cal-modal-inner h4 {
    margin: 0 0 14px;
    font-size: .9rem;
    color: #e2e8f0;
    font-weight: 700;
}
.cal-form-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 10px;
}
.cal-form-row label {
    font-size: .7rem;
    color: #64748b;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.cal-input {
    background: #0d1520;
    border: 1px solid #334155;
    border-radius: 5px;
    padding: 6px 10px;
    color: #e2e8f0;
    font-size: .8rem;
    width: 100%;
    box-sizing: border-box;
    transition: border-color .15s;
}
.cal-input:focus { outline: none; border-color: #3b82f6; }
.cal-form-acoes {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 14px;
}

/* ── Fundo branco dentro de modal/ficha ─────────────────────── */
.cnj-modal-pane .cal-wrapper,
#cnj-pane-calendario .cal-wrapper {
  background:#fff; color:#1e293b;
}
.cnj-modal-pane .cal-toolbar,
#cnj-pane-calendario .cal-toolbar {
  background:#f1f5f9; border-bottom:1px solid #e2e8f0;
}
.cnj-modal-pane .cal-toolbar .cal-btn,
#cnj-pane-calendario .cal-toolbar .cal-btn {
  background:#fff; color:#334155; border-color:#cbd5e1;
}
.cnj-modal-pane .cal-dia,
#cnj-pane-calendario .cal-dia {
  background:#f8fafc; border-color:#e2e8f0; color:#334155;
}
.cnj-modal-pane .cal-dia:hover,
#cnj-pane-calendario .cal-dia:hover { background:#e8f0fe; }
.cnj-modal-pane .cal-lista-container,
#cnj-pane-calendario .cal-lista-container { background:#fff; color:#1e293b; }
.cnj-modal-pane .cal-lista-item,
#cnj-pane-calendario .cal-lista-item {
  background:#f8fafc; border-color:#e2e8f0; color:#334155;
}