/* Drone License Curriculum — scoped under .dronelicense-root */

.dronelicense-root {
  --dronelicense-color-accent: #e60012;
  --dronelicense-color-text: #111111;
  --dronelicense-color-muted: #666666;
  --dronelicense-color-white: #ffffff;
  --dronelicense-color-border: #e8e8e8;
  --dronelicense-color-table-border: #e0e0e0;
  --dronelicense-color-banner-bg: #fff5f5;
  --dronelicense-color-summary-bg: #fff5f5;
  --dronelicense-font-family: "Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", -apple-system, BlinkMacSystemFont, sans-serif;

  --dronelicense-radius-card: 10px;
  --dronelicense-radius-sm: 6px;
  --dronelicense-max-width: 977px;
  --dronelicense-card-gap: 14px;
  --dronelicense-section-gap: 14px;

  --dronelicense-text-title: 1.15rem;
  --dronelicense-text-subtitle: 1rem;
  --dronelicense-text-body: 0.875rem;
  --dronelicense-text-tab: 0.95rem;

  --dronelicense-icon-circle: 36px;
  --dronelicense-icon-circle-inner: 20px;
  --dronelicense-icon-inline: 16px;
  --dronelicense-card-padding: 24px 20px 20px;

  font-family: var(--dronelicense-font-family);
  color: var(--dronelicense-color-text);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.dronelicense-root *,
.dronelicense-root *::before,
.dronelicense-root *::after {
  box-sizing: border-box;
}

.dronelicense-root h2,
.dronelicense-root h3,
.dronelicense-root p {
  margin: 0;
  padding: 0;
}

.dronelicense-root img {
  display: block;
  max-width: 100%;
  border: 0;
}

.dronelicense-root .dronelicense-icon-img {
  display: block;
  object-fit: contain;
  flex-shrink: 0;
}

.dronelicense-root .dronelicense-icon-img--accent {
  width: var(--dronelicense-icon-inline);
  height: var(--dronelicense-icon-inline);
  filter: brightness(0) saturate(100%) invert(12%) sepia(100%) saturate(7452%) hue-rotate(358deg) brightness(95%) contrast(115%);
}

.dronelicense-root .dronelicense-icon-img--white {
  width: var(--dronelicense-icon-circle-inner);
  height: var(--dronelicense-icon-circle-inner);
  filter: brightness(0) invert(1);
}

/* ── WordPress embed ── */
.dronelicense-root:not(.dronelicense-preview) {
  width: 100%;
  max-width: 100%;
  background: transparent;
}

/* ── Compare mode ── */
body.dronelicense-compare-mode {
  margin: 0;
  padding: 0;
  width: 984px;
  max-width: 984px;
  background: #ffffff;
  overflow: hidden;
}

body.dronelicense-compare-mode .dronelicense-root.dronelicense-preview {
  padding: 0;
  width: 100%;
  max-width: 984px;
}

body.dronelicense-compare-mode .dronelicense-inner {
  max-width: 984px;
  gap: 16px;
}

body.dronelicense-compare-mode .dronelicense-tabs {
  display: none !important;
}

body.dronelicense-compare-mode .dronelicense-panel {
  display: block !important;
}

body.dronelicense-compare-mode .dronelicense-panel:not(.is-active) {
  display: none !important;
}

body.dronelicense-compare-mode .dronelicense-card {
  box-shadow: none;
}

/* ── Preview wrapper ── */
.dronelicense-root.dronelicense-preview {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 16px;
  background: var(--dronelicense-color-white);
}

.dronelicense-root .dronelicense-inner {
  display: flex;
  flex-direction: column;
  gap: var(--dronelicense-section-gap);
  width: 100%;
  max-width: 100%;
}

.dronelicense-root.dronelicense-preview .dronelicense-inner {
  max-width: var(--dronelicense-max-width);
}

/* ── Tabs ── */
.dronelicense-root .dronelicense-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 4px;
}

.dronelicense-root .dronelicense-tab {
  flex: 1;
  padding: 12px 16px;
  border: 1px solid var(--dronelicense-color-border);
  border-radius: var(--dronelicense-radius-sm);
  background: var(--dronelicense-color-white);
  color: var(--dronelicense-color-text);
  font-family: inherit;
  font-size: var(--dronelicense-text-tab);
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.dronelicense-root .dronelicense-tab:hover {
  border-color: var(--dronelicense-color-accent);
}

.dronelicense-root .dronelicense-tab.is-active {
  background: var(--dronelicense-color-accent);
  border-color: var(--dronelicense-color-accent);
  color: var(--dronelicense-color-white);
}

.dronelicense-root .dronelicense-tab:focus-visible {
  outline: 2px solid var(--dronelicense-color-accent);
  outline-offset: 2px;
}

/* ── Panels ── */
.dronelicense-root .dronelicense-panel {
  display: none;
  flex-direction: column;
  gap: var(--dronelicense-card-gap);
}

.dronelicense-root .dronelicense-panel.is-active {
  display: flex;
}

/* ── Card ── */
.dronelicense-root .dronelicense-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: var(--dronelicense-card-padding);
  background: var(--dronelicense-color-white);
  border: 1px solid var(--dronelicense-color-border);
  border-radius: var(--dronelicense-radius-card);
}

.dronelicense-root .dronelicense-card__header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dronelicense-root .dronelicense-card__icon--circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--dronelicense-icon-circle);
  height: var(--dronelicense-icon-circle);
  border-radius: 50%;
  background: var(--dronelicense-color-accent);
  flex-shrink: 0;
}

.dronelicense-root .dronelicense-card__title {
  font-size: var(--dronelicense-text-title);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--dronelicense-color-text);
}

/* ── Summary bar ── */
.dronelicense-root .dronelicense-summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 14px;
  background: var(--dronelicense-color-summary-bg);
  border: 1px solid #f0dede;
  border-radius: var(--dronelicense-radius-sm);
}

.dronelicense-root .dronelicense-summary__text {
  font-size: var(--dronelicense-text-body);
  font-weight: 500;
  color: var(--dronelicense-color-text);
  text-align: center;
  line-height: 1.4;
}

/* ── Subsection ── */
.dronelicense-root .dronelicense-subsection {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dronelicense-root .dronelicense-subsection__title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--dronelicense-text-subtitle);
  font-weight: 700;
  color: var(--dronelicense-color-accent);
  line-height: 1.3;
}

/* ── Table ── */
.dronelicense-root .dronelicense-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--dronelicense-radius-sm);
}

.dronelicense-root .dronelicense-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: var(--dronelicense-text-body);
}

.dronelicense-root .dronelicense-table--theory {
  min-width: 640px;
}

.dronelicense-root .dronelicense-table thead th {
  padding: 7px 5px;
  background: var(--dronelicense-color-accent);
  color: var(--dronelicense-color-white);
  font-weight: 700;
  font-size: var(--dronelicense-text-body);
  text-align: center;
  border: 1px solid var(--dronelicense-color-accent);
  line-height: 1.3;
}

.dronelicense-root .dronelicense-table tbody td {
  padding: 6px 5px;
  text-align: center;
  vertical-align: middle;
  border: 1px solid var(--dronelicense-color-table-border);
  background: var(--dronelicense-color-white);
  color: var(--dronelicense-color-text);
  font-size: var(--dronelicense-text-body);
  line-height: 1.35;
  word-break: keep-all;
}

.dronelicense-root .dronelicense-table tbody tr.dronelicense-row--lunch td {
  background: #fafafa;
}

.dronelicense-root .dronelicense-table--theory tbody td:first-child,
.dronelicense-root .dronelicense-table--theory tbody td:nth-child(2) {
  white-space: nowrap;
}

.dronelicense-root .dronelicense-table--schedule thead th:first-child,
.dronelicense-root .dronelicense-table--schedule tbody td:first-child {
  width: 22%;
  white-space: nowrap;
}

.dronelicense-root .dronelicense-table--schedule thead th:last-child,
.dronelicense-root .dronelicense-table--schedule tbody td:last-child {
  width: 78%;
  max-width: 0;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: break-word;
  text-align: center;
}

.dronelicense-root .dronelicense-table--theory thead th:nth-child(1),
.dronelicense-root .dronelicense-table--theory tbody td:nth-child(1) {
  width: 11%;
}

.dronelicense-root .dronelicense-table--theory thead th:nth-child(2),
.dronelicense-root .dronelicense-table--theory tbody td:nth-child(2) {
  width: 16%;
}

/* Two-column practical tables (일정 / 훈련 항목) */
.dronelicense-root .dronelicense-table--two-col {
  min-width: 0;
  width: 100%;
}

.dronelicense-root .dronelicense-table--two-col thead th:first-child,
.dronelicense-root .dronelicense-table--two-col tbody td:first-child {
  width: 22%;
  white-space: nowrap;
}

.dronelicense-root .dronelicense-table--two-col thead th:last-child,
.dronelicense-root .dronelicense-table--two-col tbody td:last-child {
  width: 78%;
  max-width: 0;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: break-word;
  text-align: center;
}

.dronelicense-root .dronelicense-table-wrap:has(.dronelicense-table--two-col),
.dronelicense-root .dronelicense-table-wrap:has(.dronelicense-table--schedule) {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

/* ── Banner ── */
.dronelicense-root .dronelicense-banner {
  padding: 10px 14px;
  background: var(--dronelicense-color-banner-bg);
  border: 1px solid #f0dede;
  border-radius: var(--dronelicense-radius-sm);
}

.dronelicense-root .dronelicense-banner__text {
  font-size: var(--dronelicense-text-body);
  font-weight: 700;
  color: var(--dronelicense-color-accent);
  text-align: center;
  line-height: 1.4;
}

/* ── Mobile ── */
@media (max-width: 768px) {
  .dronelicense-root {
    --dronelicense-text-title: 1.05rem;
    --dronelicense-text-subtitle: 0.9375rem;
    --dronelicense-text-body: 0.8125rem;
    --dronelicense-text-tab: 0.875rem;
    --dronelicense-icon-circle: 36px;
    --dronelicense-icon-circle-inner: 20px;
    --dronelicense-icon-inline: 16px;
    --dronelicense-card-padding: 20px 16px 18px;
    --dronelicense-card-gap: 18px;
    --dronelicense-section-gap: 16px;
  }

  .dronelicense-root.dronelicense-preview {
    padding: 12px;
  }

  .dronelicense-root .dronelicense-tabs {
    gap: 6px;
  }

  .dronelicense-root .dronelicense-tab {
    padding: 10px 8px;
    font-size: var(--dronelicense-text-tab);
  }

  .dronelicense-root .dronelicense-summary {
    padding: 10px 12px;
  }

  .dronelicense-root .dronelicense-table--theory {
    min-width: 560px;
  }

  .dronelicense-root .dronelicense-table--two-col,
  .dronelicense-root .dronelicense-table--schedule {
    min-width: 0;
  }

  .dronelicense-root .dronelicense-card,
  .dronelicense-root .dronelicense-subsection {
    min-width: 0;
    max-width: 100%;
  }

  .dronelicense-root .dronelicense-table--schedule thead th:first-child,
  .dronelicense-root .dronelicense-table--schedule tbody td:first-child,
  .dronelicense-root .dronelicense-table--two-col thead th:first-child,
  .dronelicense-root .dronelicense-table--two-col tbody td:first-child {
    white-space: normal;
    max-width: 0;
    word-break: keep-all;
    overflow-wrap: break-word;
  }

  .dronelicense-root .dronelicense-table thead th,
  .dronelicense-root .dronelicense-table tbody td {
    padding: 8px 6px;
  }
}