/* Ponte SAG → Web Awesome: brand identity + variantes semânticas */

:root,
.wa-light {
  --wa-color-brand: var(--brand-primary);
  --wa-color-brand-on: var(--brand-primary-contrast);
  --wa-color-brand-fill-loud: var(--brand-primary);
  --wa-color-brand-on-loud: var(--brand-primary-contrast);
  --wa-color-brand-border-loud: var(--brand-primary);
  --wa-color-brand-fill-normal: var(--brand-primary);
  --wa-color-brand-on-normal: var(--brand-primary-contrast);
  --wa-color-brand-border-normal: var(--brand-primary);
  --wa-color-focus: var(--brand-primary);
  --wa-color-text-link: var(--brand-primary);

  /* Alinha suavidade ao tema Awesome (scale 1.5): painéis ~18px */
  --wa-border-radius-scale: 1.5;
  --sag-radius-panel: var(--wa-panel-border-radius, var(--wa-border-radius-l));
  --sag-radius-control: var(--wa-form-control-border-radius, var(--wa-border-radius-m));
  --sag-border-soft: rgba(148, 163, 184, 0.2);
}

.sag-accent {
  color: var(--brand-secondary);
}

.sag-accent-fill {
  background: var(--brand-secondary);
  color: var(--brand-secondary-contrast);
}

.choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--wa-space-l, 1.5rem);
}

.sag-choice-card {
  cursor: pointer;
  height: 100%;
}

.sag-choice-card::part(body) {
  text-align: center;
}

.sag-choice-card h2 {
  margin: 0 0 0.75rem;
  font-size: 1.35rem;
  color: var(--brand-primary);
}

.sag-choice-card p {
  margin: 0;
  color: var(--wa-color-text-quiet, var(--text-muted));
  line-height: 1.5;
}

.sag-choice-card__icon {
  font-size: 1.75rem;
  color: var(--brand-primary);
  margin-bottom: 0.5rem;
}

.page-title {
  color: var(--brand-primary);
  margin: 0 0 0.75rem;
}

/* Callouts de feedback */
.sag-callout {
  margin-top: var(--wa-space-m, 1rem);
}

.sag-callout[hidden] {
  display: none !important;
}

/* Ações em tabelas e toolbars */
.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wa-space-s, 0.5rem);
  align-items: center;
}

.table-actions wa-button {
  flex: 0 1 auto;
}

.operations-toolbar,
.teacher-session-header,
.modal-actions,
.attrib-proto-actions,
.booking-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wa-space-s, 0.5rem);
  align-items: center;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wa-space-s, 0.5rem);
}

.appointment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wa-space-m, 1rem);
}

.appointment-details {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-2xs, 0.25rem);
}

.appointment-delete-button {
  flex-shrink: 0;
}