/* ═══════════════════════════════════════════════════
   REUNIÕES
   ═══════════════════════════════════════════════════ */
#reunioesSection { display: none; }

.reunioes-wrap { padding: 20px 28px 28px; max-width: 1860px; margin: 0 auto; }

.reunioes-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.reunioes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 18px;
  align-items: start;
}

.reuniao-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  border-top: 3px solid var(--reuniao);
  overflow: hidden;
  transition: all var(--transition);
}

.reuniao-card:hover { box-shadow: var(--shadow); }
.reuniao-card.is-cancelada  { border-top-color: var(--error); opacity: 0.75; }
.reuniao-card.is-adiada     { border-top-color: var(--warning); }
.reuniao-card.is-finalizada { border-top-color: var(--success); }

.reuniao-card-head { padding: 16px 18px 12px; }

.reuniao-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.reuniao-card-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.35;
}

.reuniao-card.is-cancelada .reuniao-card-title { text-decoration: line-through; }

.reuniao-status-badge {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}

.rsb-agendada   { background: var(--reuniao-bg); color: var(--reuniao); }
.rsb-adiada     { background: var(--warning-bg); color: var(--warning); }
.rsb-finalizada { background: var(--success-bg); color: var(--success); }
.rsb-cancelada  { background: var(--error-bg);   color: var(--error); }

.reuniao-card-meta {
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.7;
}

.reuniao-card-meta .rm-line { display: flex; align-items: center; gap: 6px; }
.reuniao-card-meta .rm-ico { opacity: 0.6; flex-shrink: 0; }

.reuniao-card-notes {
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.6;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
  white-space: pre-wrap;
}

/* checklist blocks */
.checklist-block {
  padding: 14px 18px;
  border-top: 1px solid var(--border);
  background: var(--bg);
}

.checklist-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.checklist-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.checklist-progress {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  margin-left: 12px;
}

.checklist-track {
  flex: 1;
  height: 4px;
  background: var(--border);
  border-radius: 2px;
  overflow: hidden;
}

.checklist-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.4s ease;
}
.cl-pre  .checklist-fill { background: linear-gradient(90deg, var(--reuniao), var(--feed)); }
.cl-pos  .checklist-fill { background: var(--grad-brand); }

.checklist-pct { font-size: 11px; color: var(--text-muted); white-space: nowrap; min-width: 30px; text-align: right; }

.checklist-items { display: flex; flex-direction: column; gap: 4px; }

.check-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 5px 6px;
  border-radius: var(--radius-sm);
  transition: background var(--transition);
}

.check-row:hover { background: var(--surface); }

.check-box {
  width: 16px;
  height: 16px;
  border: 1.5px solid var(--border-strong);
  border-radius: 4px;
  flex-shrink: 0;
  margin-top: 1px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: #fff;
  transition: all var(--transition);
  background: var(--surface);
}

.check-row.done .check-box { background: var(--success); border-color: var(--success); }
.check-row.done .check-text { text-decoration: line-through; color: var(--text-muted); }

.check-body { flex: 1; min-width: 0; }

.check-text { font-size: 12px; color: var(--text-primary); line-height: 1.45; word-break: break-word; }

.check-sub {
  font-size: 10px;
  color: var(--text-muted);
  margin-top: 2px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.check-sub .cs-prazo { color: var(--brand); }

.check-del {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  padding: 0 2px;
  opacity: 0;
  transition: all var(--transition);
  flex-shrink: 0;
}
.check-row:hover .check-del { opacity: 1; }
.check-del:hover { color: var(--error); }

/* Pós-reunião: grupos por responsável (cliente / agência) */
.pos-group + .pos-group {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--border-strong);
}
.pos-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.pos-group-name {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--text-secondary);
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.pos-group-name::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text-muted);
}
.pos-cliente .pos-group-name::before { background: var(--brand); }
.pos-agencia .pos-group-name::before { background: var(--reuniao); }

.check-move {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  padding: 0 2px;
  opacity: 0.45;
  transition: all var(--transition);
  flex-shrink: 0;
}
.check-row:hover .check-move { opacity: 1; }
.check-move:hover { color: var(--reuniao); }

.check-add {
  display: flex;
  gap: 6px;
  margin-top: 8px;
}

.check-add input, .check-add-sub input {
  flex: 1;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-family: var(--fonte);
  font-size: 12px;
  color: var(--text-primary);
  background: var(--surface);
  outline: none;
  transition: border-color var(--transition);
  min-width: 0;
}
.check-add input:focus, .check-add-sub input:focus { border-color: var(--reuniao); }

.check-add-sub { display: flex; gap: 6px; margin-top: 6px; }

.check-add-btn {
  padding: 6px 12px;
  background: var(--reuniao);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--transition);
  font-family: var(--fonte);
  white-space: nowrap;
  flex-shrink: 0;
}
.check-add-btn:hover { filter: brightness(1.08); }

.reuniao-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 12px 18px;
  border-top: 1px solid var(--border);
}

.reuniao-act-btn {
  flex: 1 1 72px;
  padding: 7px;
  background: none;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-family: var(--fonte);
  font-size: 11px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all var(--transition);
}
.reuniao-act-btn:hover { border-color: var(--border-strong); color: var(--text-primary); }
.reuniao-act-btn.act-on-agendada   { background: var(--reuniao); color: #fff; border-color: var(--reuniao); }
.reuniao-act-btn.act-on-adiada     { background: var(--warning); color: #fff; border-color: var(--warning); }
.reuniao-act-btn.act-on-finalizada { background: var(--success); color: #fff; border-color: var(--success); }
.reuniao-act-btn.act-on-cancelada  { background: var(--error);   color: #fff; border-color: var(--error); }
.reuniao-act-btn.act-edit { flex: 0 0 38px; }
.reuniao-act-btn.act-edit:hover { border-color: var(--brand-light); color: var(--brand); }

.mode-client .check-add,
.mode-client .check-add-sub,
.mode-client .check-del,
.mode-client .reuniao-card-actions { display: none; }

/* ═══════════════════════════════════════════════════
   ENTRY / IDENTIDADE
   ═══════════════════════════════════════════════════ */
.entry-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: var(--grad-brand);
  animation: fadeIn 0.25s ease;
}

.entry-overlay.open { display: flex; }

.entry-box {
  background: var(--surface);
  border-radius: var(--radius-xl);
  padding: 40px 38px 34px;
  width: 100%;
  max-width: 460px;
  box-shadow: var(--shadow-xl);
  text-align: center;
  animation: slideUp 0.3s ease;
}

.entry-brand {
  font-family: var(--fonte);
  font-size: 18px;
  letter-spacing: 0.1em;
  color: var(--brand);
  margin-bottom: 22px;
}

/* logo da Órbitta na tela de login. O PNG tem fundo branco (sem
   transparência); o multiply "apaga" o branco sobre o cartão branco. */
.entry-logo {
  display: block;
  height: 46px;
  margin: 0 auto 20px;
  mix-blend-mode: multiply;
}

.entry-title {
  font-family: var(--fonte);
  font-size: 28px;
  font-weight: 400;
  color: var(--text-primary);
  margin-bottom: 6px;
}

.entry-sub {
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 28px;
}

/* Entrada pelo DOMÍNIO PRÓPRIO da agência (white label, sem link):
   a caixa veste a marca dela — logo (ou inicial), cor e, se o plano
   mostrar, o selo. --portal-cor chega pelo JS (showPortalDominio). */
.portal-logo { mix-blend-mode: normal; max-width: 180px; height: auto; max-height: 64px; object-fit: contain; }
.portal-inicial {
  width: 56px; height: 56px; border-radius: 16px; margin: 0 auto 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px; font-weight: 700; color: #fff;
  background: var(--portal-cor, var(--primary));
}
.portal-selo { margin-top: 26px; font-size: 11.5px; color: var(--text-muted); }
.portal-selo b { color: var(--text-secondary); }

/* Link discreto no rodapé da caixa de entrada ("Esqueci minha senha",
   "Voltar para a entrada"). É <button> e não <a> porque não navega para
   lugar nenhum — troca a caixa que está à mostra. */
.entry-link {
  display: block;
  width: 100%;
  margin-top: 12px;
  background: none;
  border: 0;
  padding: 4px;
  font: inherit;
  font-size: 12.5px;
  color: var(--text-muted);
  text-align: center;
  cursor: pointer;
}
.entry-link:hover { color: var(--brand); text-decoration: underline; }

.entry-legal-links {
  margin-top: 18px;
  text-align: center;
  font-size: 11.5px;
}
.entry-legal-links a { color: var(--text-muted); text-decoration: none; }
.entry-legal-links a:hover { color: var(--brand); text-decoration: underline; }
.entry-legal-links span { color: var(--border-strong); margin: 0 5px; }

.entry-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.entry-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 24px 16px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--bg);
  cursor: pointer;
  transition: all var(--transition);
  font-family: var(--fonte);
}

.entry-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }



.entry-card-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fonte);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: #fff;
  margin-bottom: 8px;
}




.entry-card-avatar img,
.identity-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  object-position: center 25%;
}

.entry-card-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
}

.entry-card-role {
  font-size: 11px;
  color: var(--text-muted);
  line-height: 1.4;
}

/* identity row in sidebar */
.identity-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 8px;
  margin-bottom: 10px;
  background: var(--sidebar-hover);
  border: 1px solid var(--sidebar-line);
  border-radius: var(--radius);
}

.identity-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fonte);
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--brand), var(--brand-dark));
  /* virou <button> (antes era <div>) pra dar pra clicar e trocar a foto */
  border: none; padding: 0; cursor: pointer; overflow: hidden;
}

.identity-avatar.is-client { background: linear-gradient(135deg, var(--reuniao), #134b70); cursor: default; }

.identity-avatar.is-busy { pointer-events: none; opacity: 0.6; }

.identity-info { flex: 1; min-width: 0; }

.identity-name {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  line-height: 1.2;
}

.identity-role {
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sidebar-muted);
}

.identity-switch {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  background: none;
  border: 1px solid var(--sidebar-line);
  border-radius: var(--radius-sm);
  color: var(--sidebar-muted);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition);
}

.identity-switch:hover { border-color: var(--brand-light); color: #fff; }

















.pwd-error {
  font-size: 12px;
  color: var(--error);
  min-height: 18px;
  margin-top: 8px;
}






/* ── login (e-mail + senha) ── */
.login-box { max-width: 400px; }

.login-input {
  width: 100%;
  padding: 12px 14px;
  margin-top: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: var(--fonte);
  font-size: 15px;
  color: var(--text-primary);
  background: var(--bg);
  outline: none;
  transition: all var(--transition);
}

.login-input:first-of-type { margin-top: 0; }
.login-input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-ring); background: var(--surface); }

.login-error { text-align: center; margin-top: 10px; }

.login-submit {
  width: 100%;
  flex: none;
  padding: 12px 20px;
  margin-top: 6px;
  font-size: 14px;
}
.login-submit:disabled { opacity: 0.6; cursor: default; }

/* Cliente não vê o botão de entrar no modo de edição,
   nem o de mexer no próprio cadastro — isso é coisa da agência */
.role-client .mode-group { display: none; }
.role-client .cw-edit-btn { display: none !important; }

/* ═══════════════════════════════════════════════════
   PRINT
   ═══════════════════════════════════════════════════ */
@media print {
  .sidebar, .filter-menu, .active-filter-bar, .cw-link-btn,
  .add-item-btn, .confirm-btn, .list-confirm-btn, .request-btn, .list-request-btn,
  .view-toggle, .month-nav-btn, .modal-overlay,
  .sidebar-toggle, .sidebar-overlay, .entry-overlay{ display: none !important; }

  body { background: white; display: block; }
  .main { margin-left: 0; }
  .top-bar { position: static; box-shadow: none; border-bottom: 2px solid var(--brand); }

  .list-wrap { display: block !important; max-width: 100%; }
  #calendarView { display: none !important; }

  .list-item { break-inside: avoid; box-shadow: none; margin-bottom: 6px; }
  .list-item-right { display: flex !important; }
  .list-item-script { display: block; }

  .content-area { padding: 0; }
  .agency-view, .cw-tabs, .cw-crumb, .cw-actions { display: none !important; }

  /* aba Marca impressa = o dossiê pra mandar a um freelancer: sai só o
     conteúdo, sem nada clicável, e nenhum card partido no meio */
  #marcaToolbar, .marca-edit-btn, .marca-copy, .marca-empty-btn,
  .marca-file-add, .marca-file-del, .marca-fundo-btn, .marca-link-go { display: none !important; }
  .marca-card { break-inside: avoid; box-shadow: none; }
  .marca-field.is-empty { display: none; }
  .marca-files { background: none !important; }
}