/* ===========================================================
   New Mind — Calendário de Jobs (Redes Sociais / Operand)
   Tokens de cor/tipografia herdados de nm-ci (LP Comunicação
   Interna). Linguagem de card/pill/topbar+sidebar herdada do
   Portal Culco (print de referência).
   =========================================================== */

/* Fallback web font — mesmo esquema da LP nm-ci: remova este @import
   se "Poppins-Bold" e "Poppins Regular" já estiverem registradas como
   font-face customizadas neste ambiente. */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,700&display=swap');

.nmc {
  /* ---- Tokens — mesmos valores da LP nm-ci ---- */
  --nm-ink:         #16130E;
  --nm-charcoal:    #262119;
  --nm-paper:       #FFFFFF;
  --nm-yellow:      #FFCD00;
  --nm-yellow-deep: #C79A00;
  --nm-stone:       #857D6D;
  --nm-line:        rgba(22, 19, 14, 0.14);
  --nm-line-on-ink: rgba(255, 249, 238, 0.16);

  /* Verde/vermelho já usados na própria LP (seção de comparação) —
     reaproveitados aqui para "Concluído" e "Atrasado" em vez de inventar
     cores novas fora da paleta que você já usa. */
  --nm-good: #1E9E5A;
  --nm-bad:  #D63B32;

  --nm-font-head: "Poppins-Bold", "Poppins", Arial, sans-serif;
  --nm-font-body: "Poppins Regular", "Poppins", Arial, sans-serif;

  /* ---- Tokens específicos deste painel (não existem na LP) ---- */
  --nmc-bg:          #F4F3EE;   /* fundo da área de conteúdo, atrás dos cards brancos */
  --nmc-radius-card: 14px;
  --nmc-radius-pill: 100px;
  --nmc-shadow-card: 0 1px 2px rgba(22,19,14,.04), 0 8px 24px -12px rgba(22,19,14,.12);
  --nmc-ease: cubic-bezier(.22,.68,0,1);

  margin: 0;
  color: var(--nm-ink);
  font-family: var(--nm-font-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

.nmc *, .nmc *::before, .nmc *::after { box-sizing: border-box; }
.nmc h1, .nmc h2, .nmc h3 { margin: 0; font-family: var(--nm-font-head); font-weight: 700; }
.nmc ul { list-style: none; margin: 0; padding: 0; }
.nmc button { font: inherit; cursor: pointer; }
.nmc a { color: inherit; text-decoration: none; }

/* ===================== SHELL ===================== */
.nmc-shell { display: flex; flex-direction: column; min-height: 100vh; }

/* ---- Topbar (preta, igual ao Portal Culco) ---- */
.nmc-topbar {
  height: 64px;
  flex-shrink: 0;
  background: var(--nm-ink);
  color: var(--nm-paper);
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 0 28px;
  border-bottom: 1px solid var(--nm-line-on-ink);
}
.nmc-topbar__brand { display: flex; align-items: center; gap: 8px; }
.nmc-topbar__mark { width: 26px; height: 26px; color: var(--nm-yellow); }
.nmc-topbar__wordmark {
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 19px;
  letter-spacing: -.01em;
}
.nmc-topbar__title {
  font-size: 14px;
  color: rgba(255,249,238,.6);
  padding-left: 20px;
  border-left: 1px solid var(--nm-line-on-ink);
}

/* ---- Corpo: sidebar + conteúdo + painel ---- */
.nmc-body { display: flex; flex: 1; min-height: 0; }

/* ---- Sidebar (preta, ícone + label, igual ao Portal Culco) ---- */
.nmc-sidebar {
  width: 240px;
  flex-shrink: 0;
  background: var(--nm-ink);
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.nmc-nav { display: flex; flex-direction: column; gap: 4px; }
.nmc-nav__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border-radius: 8px;
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 14.5px;
  color: rgba(255,249,238,.62);
  transition: background .2s, color .2s;
}
.nmc-nav__item:hover { color: var(--nm-paper); background: rgba(255,249,238,.06); }
.nmc-nav__item.is-active { color: var(--nm-ink); background: var(--nm-yellow); }
.nmc-nav__icon { width: 19px; height: 19px; flex-shrink: 0; }

.nmc-sidebar__footer {
  font-size: 12px;
  color: rgba(255,249,238,.5);
  padding: 12px;
  border-top: 1px solid var(--nm-line-on-ink);
}
.nmc-sidebar__footer span { display: block; text-transform: uppercase; letter-spacing: .06em; font-size: 10.5px; }
.nmc-sidebar__footer strong { display: block; margin-top: 4px; color: var(--nm-paper); font-family: var(--nm-font-head); font-size: 13px; }

/* ---- Conteúdo (fundo claro, cards brancos) ---- */
.nmc-content {
  flex: 1;
  min-width: 0;
  background: var(--nmc-bg);
  padding: 32px 36px;
  overflow-y: auto;
}
.nmc-content__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 22px;
}
.nmc-content__head h1 { font-size: 24px; letter-spacing: -.01em; }

.nmc-legend { display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; color: var(--nm-charcoal); opacity: .78; }
.nmc-legend li { display: flex; align-items: center; gap: 6px; }
.nmc-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.nmc-dot.status-aguardando { background: var(--nm-yellow); }
.nmc-dot.status-execucao { background: var(--nm-ink); }
.nmc-dot.status-planejamento { background: var(--nm-paper); border: 1.5px solid var(--nm-stone); }
.nmc-dot.status-concluido { background: var(--nm-good); }
.nmc-dot.status-atrasado { background: var(--nm-bad); }

/* ---- Card genérico (mesma linguagem dos cards do Mural: branco,
   cantos bem arredondados, sombra suave em vez de borda dura) ---- */
.nmc-card {
  background: var(--nm-paper);
  border-radius: var(--nmc-radius-card);
  box-shadow: var(--nmc-shadow-card);
  padding: 24px;
}

/* ===================== FULLCALENDAR — overrides ===================== */
.nmc .fc { font-family: var(--nm-font-body); }

.nmc .fc .fc-toolbar-title {
  font-family: var(--nm-font-head);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.005em;
}

/* Botões prev/next/hoje no estilo do toggle "Grid | Lista" do print:
   pílula clara, segmento ativo com fundo branco + sombra leve. */
.nmc .fc-header-toolbar { margin-bottom: 18px !important; }

.nmc .fc .fc-button-group {
  background: var(--nmc-bg);
  border: 1px solid var(--nm-line);
  border-radius: var(--nmc-radius-pill);
  padding: 3px;
  gap: 2px;
}
.nmc .fc .fc-button {
  background: transparent;
  border: none;
  color: var(--nm-charcoal);
  border-radius: var(--nmc-radius-pill);
  box-shadow: none;
  text-transform: none;
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 13px;
  padding: 6px 16px;
  transition: background .2s, color .2s;
}
.nmc .fc .fc-button:hover { background: rgba(22,19,14,.06); }
.nmc .fc .fc-button:focus { box-shadow: none; }
.nmc .fc .fc-today-button {
  background: var(--nm-paper);
  border-radius: var(--nmc-radius-pill);
  box-shadow: var(--nmc-shadow-card);
  color: var(--nm-ink);
  margin-left: 8px;
}
.nmc .fc .fc-button-primary:not(:disabled).fc-button-active {
  background: var(--nm-yellow);
  color: var(--nm-ink);
}

.nmc .fc-theme-standard td, .nmc .fc-theme-standard th { border-color: var(--nm-line); }
.nmc .fc .fc-col-header-cell {
  background: transparent;
  border-color: var(--nm-line);
}
.nmc .fc .fc-col-header-cell-cushion {
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--nm-stone);
  padding: 10px 4px;
}
.nmc .fc .fc-daygrid-day-number {
  font-family: var(--nm-font-head);
  font-weight: 600;
  font-size: 13px;
  color: var(--nm-charcoal);
  padding: 8px;
}
.nmc .fc .fc-daygrid-day.fc-day-today {
  background: rgba(255,205,0,.10);
}
.nmc .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
  color: var(--nm-ink);
}

/* Eventos como pílulas — mesma linguagem das tags amarelas do Mural,
   com cor variando por status. */
.nmc .fc-event.job-chip {
  border: none;
  border-radius: var(--nmc-radius-pill);
  padding: 3px 10px;
  margin-bottom: 3px;
  font-family: var(--nm-font-head);
  font-weight: 600;
  font-size: 11.5px;
  cursor: pointer;
  background: var(--nmc-bg);
  color: var(--nm-charcoal);
  border: 1px solid var(--nm-line);
}
.nmc .fc-event.job-chip.status-aguardando { background: var(--nm-yellow); color: var(--nm-ink); border-color: transparent; }
.nmc .fc-event.job-chip.status-execucao { background: var(--nm-ink); color: var(--nm-paper); border-color: transparent; }
.nmc .fc-event.job-chip.status-concluido { background: rgba(30,158,90,.14); color: var(--nm-good); border-color: transparent; }
.nmc .fc-event.job-chip.status-atrasado { background: rgba(214,59,50,.12); color: var(--nm-bad); border-color: transparent; }

/* ---- Painel lateral de detalhe ---- */
.nmc-panel {
  position: fixed;
  top: 0;
  right: -380px;
  width: 360px;
  height: 100%;
  background: var(--nm-paper);
  border-left: 1px solid var(--nm-line);
  padding: 32px 24px;
  transition: right .25s var(--nmc-ease);
  box-shadow: -8px 0 32px -16px rgba(22,19,14,.25);
  overflow-y: auto;
  z-index: 20;
}
.nmc-panel.aberto { right: 0; }

.nmc-panel__close {
  position: absolute;
  top: 18px;
  right: 18px;
  border: none;
  background: none;
  font-size: 22px;
  line-height: 1;
  color: var(--nm-charcoal);
}

/* Pílula de status — mesma peça visual das tags amarelas do Mural de
   Reconhecimentos ("Encante o outro lado", "Supere no próximo"...). */
.nmc-tag {
  display: inline-block;
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 12px;
  padding: 6px 14px;
  border-radius: var(--nmc-radius-pill);
  margin-bottom: 16px;
  background: var(--nmc-bg);
  color: var(--nm-charcoal);
}
.nmc-tag.status-aguardando { background: var(--nm-yellow); color: var(--nm-ink); }
.nmc-tag.status-execucao { background: var(--nm-ink); color: var(--nm-paper); }
.nmc-tag.status-concluido { background: rgba(30,158,90,.14); color: var(--nm-good); }
.nmc-tag.status-atrasado { background: rgba(214,59,50,.12); color: var(--nm-bad); }

#painel-conteudo h2 { font-size: 19px; letter-spacing: -.005em; margin-bottom: 18px; }
#painel-conteudo dl { margin: 0 0 26px; }
#painel-conteudo dt {
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--nm-stone);
  margin-top: 14px;
}
#painel-conteudo dd { margin: 3px 0 0; font-size: 14.5px; color: var(--nm-ink); }

.nmc-botao {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--nm-yellow);
  color: var(--nm-ink);
  font-family: var(--nm-font-head);
  font-weight: 700;
  font-size: 13.5px;
  padding: 12px 20px;
  border-radius: var(--nmc-radius-pill);
  transition: background .2s, transform .2s var(--nmc-ease);
}
.nmc-botao:hover { background: var(--nm-yellow-deep); transform: translateY(-1px); }

/* ===================== RESPONSIVO ===================== */
@media (max-width: 900px) {
  .nmc-body { flex-direction: column; }
  .nmc-sidebar {
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
  }
  .nmc-nav { flex-direction: row; }
  .nmc-sidebar__footer { display: none; }
  .nmc-content { padding: 20px; }
  .nmc-topbar__title { display: none; }
  .nmc-panel { width: 100%; right: -100%; }
}