/* Muscles Dashboard */
.muscles-grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns-desktop), 1fr);
  gap: var(--spacing-lg);
}

/* Spike Chart Card */
.spike-chart-card {
  grid-column: 1 / span 1;
  height: var(--card-height-muscle-spike);
}

.spike-chart-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

#muscle-spike-chart {
  height: var(--chart-height-large);
  min-height: var(--chart-height-large);
}

/* Weekly Sets Container */
.weekly-sets-container {
  grid-column: 2 / span 5;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: var(--spacing-lg);
  height: var(--card-height-muscle-spike);
}

.weekly-sets-card {
  position: relative;
  transition: all var(--transition-medium) var(--transition-easing);
}

.target-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0;
}

.target-header h6 {
  margin: var(--spacing-md) 0 var(--spacing-md) 0;
  padding: 0;
}

.sets-with-target {
  margin-bottom: var(--spacing-sm);
}

.sets-with-target h3 {
  margin: 0 0 var(--spacing-xs) 0 ;
  padding: 0;
}

.target-range {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  margin: 0;
}

/* Intensity Chart Card */
.intensity-chart-card {
  grid-column: 5 / span 2;
  grid-row: 3;
  height: var(--card-height-muscle-intensity);
}

.intensity-chart-container {
  align-items: center;
  justify-content: center;
}

#muscle-intensity-chart {
    height: var(--chart-height-intensity);
    width: 100%;
}

/* Timeseries Chart Cards */
.timeseries-chart-card {
  overflow: hidden;
  max-height: var(--card-height-muscle-intensity);
}

.muscle-sets-chart {
    grid-row: 2;
    grid-column: 1 / span 3;
}

.muscle-pr-chart {
  grid-row: 2;
  grid-column: 4 / span 3;
}

.volume-intensity-scatter {
    grid-row: 3;
    grid-column: 1 / span 4;
}

#volume-intensity-scatter,
#muscle-sets-chart,
#muscle-prs-chart {
    height: var(--chart-height-medium);
    min-height: var(--chart-height-medium);
}

/* Responsive Tablet Adjustments */
@media (max-width: 1740px) {
  .muscles-grid {
    grid-template-columns: repeat(var(--grid-columns-tablet), 1fr);
  }

  .spike-chart-card {
    grid-column: span 2 !important;
  }

  .weekly-sets-container,
  .intensity-chart-card,
  .timeseries-chart-card {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  .weekly-sets-container {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(var(--grid-columns-tablet), 1fr);
    grid-template-rows: repeat(3, auto);
    height: auto;
  }

  .intensity-chart-card {
    grid-column: 1 / -1 !important;
  }

  .muscle-sets-chart,
  .muscle-pr-chart,
  .volume-intensity-scatter {
    grid-column: 1 / -1 !important;
  }
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
  .muscles-grid {
    grid-template-columns: var(--grid-columns-mobile);
  }

  .spike-chart-card,
  .weekly-sets-card,
  .intensity-chart-card,
  .timeseries-chart-card {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }

  .weekly-sets-container {
    grid-template-columns: var(--grid-columns-mobile);
    grid-template-rows: repeat(6, min-content);
    height: min-content;
    position: static;
    display: grid;
  }

  .muscle-sets-chart,
  .muscle-pr-chart,
  .volume-intensity-scatter {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }

  #muscle-intensity-chart {
    width: 100%;
    height: var(--chart-height-mobile);
  }
}