/* Calendario Comercial */
.cc-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 14px;
}

.cc-toolbar-field {
  display: grid;
  gap: 6px;
  font-size: 0.92rem;
  min-width: 170px;
}

.cc-toolbar-field-year {
  min-width: 100px;
  max-width: 130px;
}

.cc-toolbar-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-left: auto;
}

.cc-subtitle {
  margin: 12px 0 2px;
  font-size: 13px;
  color: var(--color-muted);
  line-height: 1.5;
}

.cc-subtitle strong {
  color: var(--color-text);
  font-size: 14px;
}

.cc-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.cc-metric {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 10px;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  min-height: 56px;
}

.cc-metric span {
  font-size: 11px;
  color: var(--color-muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.cc-metric strong {
  font-size: 20px;
  font-weight: 800;
  line-height: 1.15;
}

.cc-metric-next {
  grid-column: span 2;
}

.cc-metric-next .cc-next-name {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cc-metric-next small {
  color: var(--color-muted);
  font-size: 11px;
}

.cc-next-empty {
  font-size: 13px;
  color: var(--color-muted);
  font-weight: 600;
}

.cc-stage-alert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 10px 0;
  padding: 10px 14px;
  border-radius: 10px;
  background: #FDF3DF;
  border: 1px solid #FDE68A;
  color: var(--color-warning, #92400E);
  font-size: 13px;
}

.cc-stage-alert a {
  font-weight: 700;
  color: inherit;
  text-decoration: underline;
}

.cc-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 12px 0;
  font-size: 12px;
  color: var(--color-muted);
}

.cc-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.cc-legend-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--cc-color, #6B7280);
  display: inline-block;
}

.cc-grid-head {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  margin-top: 8px;
}

.cc-grid-head-cell {
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--color-muted);
  padding: 4px 0;
}

.cc-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  margin-top: 4px;
}

.cc-day {
  min-height: 96px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-surface);
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.cc-day.is-outside {
  background: var(--color-surface-muted);
  opacity: 0.55;
}

.cc-day.is-today {
  border-color: var(--color-accent, #0e7c86);
  box-shadow: 0 0 0 1px var(--color-accent, #0e7c86);
}

.cc-day.has-events {
  cursor: pointer;
}

.cc-day.has-events:hover {
  background: var(--color-surface-soft);
}

.cc-day-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cc-day-number {
  font-weight: 700;
  font-size: 13px;
}

.cc-stage-badge {
  font-size: 10px;
  font-weight: 700;
  color: var(--color-text-soft);
  background: #E0F2FE;
  border: 1px solid #BAE6FD;
  border-radius: 999px;
  padding: 1px 7px;
}

/* Etapa com evento cadastrado no dia: azul discreto (padrao acima) ja cobre;
   evento de alto impacto no dia: reforca com laranja/vermelho suave, sem
   ficar agressivo. */
.cc-stage-badge--has-event {
  background: #E0F2FE;
  border-color: #7DD3FC;
  color: #0369A1;
}

.cc-stage-badge--alert {
  background: #FDF3DF;
  border-color: #FDE68A;
  color: #92400E;
}

.cc-day-events {
  display: flex;
  flex-direction: column;
  gap: 3px;
  overflow: hidden;
}

.cc-event-chip {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: color-mix(in srgb, var(--cc-color, #6B7280) 16%, white);
  color: color-mix(in srgb, var(--cc-color, #6B7280) 75%, black);
  border-left: 3px solid var(--cc-color, #6B7280);
}

.cc-day-more {
  font-size: 10px;
  color: var(--color-muted);
  font-weight: 700;
}

.cc-day-modal-card { width: min(560px, 100%); }

.cc-day-event-card {
  border: 1px solid var(--color-border);
  border-radius: 10px;
  padding: 10px 12px;
  margin-bottom: 10px;
}

.cc-day-event-card header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.cc-day-event-card p {
  margin: 4px 0;
  font-size: 13px;
  color: var(--color-text-soft);
}

/* Cores por tipo de evento */
.cc-type-rodeio { --cc-color: #F59E0B; }
.cc-type-prova_laco { --cc-color: #D97706; }
.cc-type-festa_peao { --cc-color: #EA580C; }
.cc-type-evento_cidade { --cc-color: #2563EB; }
.cc-type-escolha_rainha { --cc-color: #DB2777; }
.cc-type-evento_particular { --cc-color: #6366F1; }
.cc-type-feira_agropecuaria { --cc-color: #16A34A; }
.cc-type-exposicao { --cc-color: #0891B2; }
.cc-type-cavalgada { --cc-color: #92400E; }
.cc-type-leilao { --cc-color: #7C3AED; }
.cc-type-show { --cc-color: #DC2626; }
.cc-type-data_comemorativa { --cc-color: #0D9488; }
.cc-type-campanha_comercial { --cc-color: #9333EA; }
.cc-type-promocao_interna { --cc-color: #4F46E5; }
.cc-type-outro { --cc-color: #6B7280; }

@media (max-width: 900px) {
  .cc-grid, .cc-grid-head { grid-template-columns: repeat(7, minmax(60px, 1fr)); }
  .cc-day { min-height: 76px; padding: 4px 5px; }
  .cc-summary { grid-template-columns: repeat(3, 1fr); }
  .cc-metric-next { grid-column: span 3; }
}

@media (max-width: 640px) {
  .cc-toolbar { flex-direction: column; align-items: stretch; }
  .cc-toolbar-field, .cc-toolbar-field-year { min-width: 0; max-width: none; width: 100%; }
  .cc-toolbar-actions { margin-left: 0; width: 100%; }
  .cc-toolbar-actions button { flex: 1; }
  .cc-summary { grid-template-columns: 1fr; }
  .cc-metric-next { grid-column: span 1; }
}