/* Iframe Components */
.component-iframe {
  border: 1px solid var(--border-color);
  border-radius: 0;
  display: block;
  margin: var(--margin-large) 0;
  background: var(--bg-color);
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: min(400px, 60vh);
  height: auto;
  overflow: hidden;
  transition: border-color var(--transition-duration-slow) ease;
}

.component-iframe[data-loaded="true"] {
  background: var(--bg-color);
}

.iframe-placeholder-description {
  font-family: 'Crimson Text', Georgia, serif;
  font-size: 0.95rem;
  color: var(--text-color-low-emphasis);
  margin-top: calc(-1 * var(--margin-small));
  margin-bottom: var(--margin-medium);
  font-style: italic;
  line-height: 1.5;
}

/* Specific iframe types with better sizing */
.component-iframe-table,
.component-iframe-stacked-bar,
.component-iframe-quadrant,
.component-iframe-summary-table {
  aspect-ratio: auto;
  height: clamp(300px, 50vh, 600px);
  min-height: 300px;
}

article .table-wrapper {
  overflow-x: auto;
  margin: var(--margin-large) 0;
  border: 1px solid var(--border-color);
  border-radius: 0;
}

article .table-wrapper .component-iframe-table {
  border: none;
  margin: 0;
  border-radius: 0;
  min-height: 300px;
  height: clamp(300px, 50vh, 600px);
}

/* Mobile optimizations for iframes */
@media (max-width: 768px) {
  .component-iframe {
    min-height: 300px;
    border-radius: 0;
    aspect-ratio: 4 / 3;
  }

  .iframe-placeholder-description {
    font-size: 0.85rem;
    line-height: 1.4;
  }

  .component-iframe-table,
  .component-iframe-stacked-bar,
  .component-iframe-quadrant,
  .component-iframe-summary-table {
    height: clamp(250px, 40vh, 500px);
  }
}

/* Iframe theme sync helper (to be used by JS) */
.component-iframe.light-theme {
  /* Marker class for JS to detect theme */
}

ia-grid {
  margin-top: 1rem;
  padding: 2rem;
  display: block;
}

/* Temporarily disable all interactive iframes */
.component-iframe,
.iframe-placeholder-description,
article .table-wrapper,
.collapsible-iframe-wrapper {
  display: none !important;
}