.sintonia-no-ar,
.sintonia-grade {
  --sfm-core-border: rgba(10, 41, 71, 0.12);
  --sfm-core-soft: #f6f8fb;
  --sfm-core-accent: #0b4b78;
  --sfm-core-text: #15212f;
  color: var(--sfm-core-text);
}

.sintonia-no-ar {
  display: grid;
  grid-template-columns: minmax(110px, 160px) minmax(0, 1fr);
  gap: 1.25rem;
  align-items: center;
  padding: 1rem;
  border: 1px solid var(--sfm-core-border);
  border-radius: 18px;
  background: linear-gradient(135deg, #ffffff 0%, var(--sfm-core-soft) 100%);
}

.sintonia-no-ar__image img,
.sintonia-no-ar__placeholder {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 14px;
  background: #dfe7ee;
}

.sintonia-no-ar__placeholder {
  display: grid;
  place-items: center;
  font-size: 0.9rem;
}

.sintonia-no-ar__eyebrow,
.sintonia-no-ar__meta,
.sintonia-no-ar__next,
.sintonia-grade__time,
.sintonia-grade__host {
  margin: 0;
  color: #4d6175;
}

.sintonia-no-ar__title,
.sintonia-grade__title {
  margin: 0;
}

.sintonia-grade {
  display: grid;
  gap: 1rem;
}

.sintonia-grade__day {
  border: 1px solid var(--sfm-core-border);
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
}

.sintonia-grade__day-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: var(--sfm-core-soft);
}

.sintonia-grade__day-header h3 {
  margin: 0;
}

.sintonia-grade__day-nav {
  width: 2.5rem;
  height: 2.5rem;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: #ffffff;
  color: var(--sfm-core-accent);
  box-shadow: inset 0 0 0 1px var(--sfm-core-border);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.sintonia-grade__day-nav:hover,
.sintonia-grade__day-nav:focus-visible {
  background: var(--sfm-core-accent);
  color: #ffffff;
  transform: translateY(-1px);
}

.sintonia-grade__day-nav span {
  font-size: 1.5rem;
  line-height: 1;
}

.sintonia-grade__list {
  display: grid;
}

.sintonia-grade__item {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--sfm-core-border);
}

.sintonia-grade__time {
  white-space: nowrap;
}

.sintonia-grade__item:first-child {
  border-top: 0;
}

.sintonia-grade__item--current {
  background: rgba(11, 75, 120, 0.08);
}

.sintonia-grade__empty {
  margin: 0;
  padding: 1rem 1.25rem;
}

@media (max-width: 720px) {
  .sintonia-no-ar {
    grid-template-columns: 1fr;
  }

  .sintonia-grade__item {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }
}
