/**
 * Semantic action / status contrast tokens for design-shell routes.
 * Bright lime / yellow / light-green CTAs use dark ink; dark accents keep light ink.
 * Loaded via DesignStyles after product/account/course sheets.
 */

.site-scene {
  --action-ink-dark: #07110a;
  --action-ink-light: #f8faf8;

  --action-primary-bg: var(--accent, #1769e0);
  --action-primary-text: var(--action-ink-light);
  --action-primary-border: color-mix(in srgb, var(--accent, #1769e0) 55%, transparent);
  --action-primary-hover-bg: color-mix(in srgb, var(--accent, #1769e0) 88%, #000 12%);

  --action-secondary-bg: color-mix(in srgb, var(--panel-a, #fff) 88%, transparent);
  --action-secondary-text: var(--page-ink, #13212c);
  --action-secondary-border: color-mix(in srgb, var(--accent, #1769e0) 28%, transparent);

  --action-lime-bg: var(--signal, #a6f43d);
  --action-lime-text: var(--action-ink-dark);

  --status-success-bg: color-mix(in srgb, #1f9d57 18%, transparent);
  --status-success-text: #0d5c32;
  --status-warning-bg: color-mix(in srgb, #d97706 18%, transparent);
  --status-warning-text: #7a3f05;
  --status-error-bg: color-mix(in srgb, #dc2626 16%, transparent);
  --status-error-text: #8b1515;
  --status-current-bg: color-mix(in srgb, var(--accent, #1769e0) 16%, transparent);
  --status-current-text: var(--accent, #1769e0);
}

/* Classic: blue accent → light primary text */
.site-scene[data-theme="classic"] {
  --action-primary-text: var(--action-ink-light);
  --action-primary-bg: var(--accent);
}

/* Poisoned / immolated accents are bright — dark primary ink for AA */
.site-scene[data-theme="poisoned"],
.site-scene[data-theme="immolated"] {
  --action-primary-bg: var(--accent);
  --action-primary-text: var(--action-ink-dark);
  --action-lime-bg: var(--signal);
  --action-lime-text: var(--action-ink-dark);
}

/* Dark surfaces (poisoned/immolated/flayed panels): status chips need light ink */
.site-scene[data-theme="poisoned"],
.site-scene[data-theme="immolated"],
.site-scene[data-theme="flayed"] {
  --status-success-text: #b8f5c8;
  --status-warning-text: #ffd89a;
  --status-error-text: #ffb4b4;
}

/* ---------- Primary CTA surfaces that sit on bright accents ---------- */

.site-scene[data-theme="flayed"] .continue-learning-card__cta,
.site-scene[data-theme="poisoned"] .continue-learning-card__cta,
.site-scene[data-theme="immolated"] .continue-learning-card__cta {
  color: var(--action-primary-text) !important;
  -webkit-text-fill-color: var(--action-primary-text) !important;
}

.site-scene[data-theme="flayed"] .product-btn,
.site-scene[data-theme="flayed"] .product-page .open-task-btn,
.site-scene[data-theme="flayed"] .product-page .login-btn,
.site-scene[data-theme="flayed"] .product-page button[type="submit"],
.site-scene[data-theme="flayed"] .product-page .exam-actions > button,
.site-scene[data-theme="flayed"] .product-page .funnel-offer-card__btn--primary,
.site-scene[data-theme="flayed"] .product-page .account-ui-nextgen .account-ui-btn--primary,
.site-scene[data-theme="flayed"] .product-page .account-ui-nextgen a.account-ui-btn--primary,
.site-scene[data-theme="flayed"] .product-page .account-ui-nextgen button.account-ui-btn--primary,
.site-scene[data-theme="flayed"] .product-page .account-ui-nextgen .account-continue-card__cta.account-ui-btn--primary,
.site-scene[data-theme="flayed"] .course-system-btn--primary,
.site-scene[data-theme="flayed"] .cng-cta--primary,
.site-scene[data-theme="flayed"] .exam-nextgen .exam-actions > button.primary,
.site-scene[data-theme="flayed"] .auth-nextgen .auth-submit,
.site-scene[data-theme="flayed"] .checkout-nextgen .checkout-submit,
.site-scene[data-theme="poisoned"] .product-btn,
.site-scene[data-theme="poisoned"] .product-page .open-task-btn,
.site-scene[data-theme="poisoned"] .product-page .login-btn,
.site-scene[data-theme="poisoned"] .product-page button[type="submit"],
.site-scene[data-theme="poisoned"] .product-page .exam-actions > button,
.site-scene[data-theme="poisoned"] .product-page .funnel-offer-card__btn--primary,
.site-scene[data-theme="poisoned"] .product-page .account-ui-nextgen .account-ui-btn--primary,
.site-scene[data-theme="poisoned"] .product-page .account-ui-nextgen a.account-ui-btn--primary,
.site-scene[data-theme="poisoned"] .product-page .account-ui-nextgen button.account-ui-btn--primary,
.site-scene[data-theme="poisoned"] .product-page .account-ui-nextgen .account-continue-card__cta.account-ui-btn--primary,
.site-scene[data-theme="poisoned"] .course-system-btn--primary,
.site-scene[data-theme="immolated"] .product-btn,
.site-scene[data-theme="immolated"] .product-page .open-task-btn,
.site-scene[data-theme="immolated"] .product-page .login-btn,
.site-scene[data-theme="immolated"] .product-page button[type="submit"],
.site-scene[data-theme="immolated"] .product-page .exam-actions > button,
.site-scene[data-theme="immolated"] .product-page .funnel-offer-card__btn--primary,
.site-scene[data-theme="immolated"] .product-page .account-ui-nextgen .account-ui-btn--primary,
.site-scene[data-theme="immolated"] .product-page .account-ui-nextgen a.account-ui-btn--primary,
.site-scene[data-theme="immolated"] .product-page .account-ui-nextgen button.account-ui-btn--primary,
.site-scene[data-theme="immolated"] .product-page .account-ui-nextgen .account-continue-card__cta.account-ui-btn--primary,
.site-scene[data-theme="immolated"] .course-system-btn--primary {
  color: var(--action-primary-text) !important;
  -webkit-text-fill-color: var(--action-primary-text) !important;
}

/* Landing primary CTAs on bright accents */
.site-scene[data-theme="poisoned"] .primary-cta,
.site-scene[data-theme="flayed"] .primary-cta,
.site-scene[data-theme="immolated"] .primary-cta {
  color: var(--action-ink-dark) !important;
  -webkit-text-fill-color: var(--action-ink-dark) !important;
}

/* Account / course primary on bright accents */
.site-scene[data-theme="flayed"] .account-ui-btn--primary,
.site-scene[data-theme="flayed"] .account-ui-btn--primary:hover,
.site-scene[data-theme="flayed"] .account-ui-btn--primary:active,
.site-scene[data-theme="poisoned"] .account-ui-btn--primary,
.site-scene[data-theme="poisoned"] .account-ui-btn--primary:hover,
.site-scene[data-theme="poisoned"] .account-ui-btn--primary:active,
.site-scene[data-theme="immolated"] .account-ui-btn--primary,
.site-scene[data-theme="immolated"] .account-ui-btn--primary:hover,
.site-scene[data-theme="immolated"] .account-ui-btn--primary:active {
  color: var(--action-ink-dark);
  -webkit-text-fill-color: var(--action-ink-dark);
}

.site-scene[data-theme="flayed"] .course-lms-premium .course-system-btn--primary,
.site-scene[data-theme="flayed"] .course-lms-premium a.course-system-btn--primary,
.site-scene[data-theme="poisoned"] .course-lms-premium .course-system-btn--primary,
.site-scene[data-theme="poisoned"] .course-lms-premium a.course-system-btn--primary,
.site-scene[data-theme="immolated"] .course-lms-premium .course-system-btn--primary,
.site-scene[data-theme="immolated"] .course-lms-premium a.course-system-btn--primary {
  color: var(--action-ink-dark) !important;
  -webkit-text-fill-color: var(--action-ink-dark) !important;
}

/* Flayed: lime-green accent → dark primary text */
.site-scene[data-theme="flayed"] {
  --action-primary-bg: var(--accent);
  --action-primary-text: var(--action-ink-dark);
  --action-lime-bg: var(--accent);
  --action-lime-text: var(--action-ink-dark);
}
.site-scene[data-theme="classic"] .account-chip--success {
  color: var(--status-success-text);
}
.site-scene[data-theme="classic"] .account-chip--warning {
  color: var(--status-warning-text);
}
.site-scene[data-theme="classic"] .account-chip--error {
  color: var(--status-error-text);
}

/* Focus visibility across themes */
.site-scene :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline-color: var(--accent, #1769e0);
}

/* ---------- Flayed readability: IDs, chips, muted labels ---------- */

.site-scene[data-theme="flayed"] {
  --label-ink: #f4faf5;
  --label-muted: #b7c6bc;
  --chip-bg: color-mix(in srgb, var(--accent, #93f23f) 14%, #0d2e21);
  --chip-border: color-mix(in srgb, var(--accent, #93f23f) 42%, #2d7048);
  --chip-ink: #f4faf5;
}

.site-scene[data-theme="flayed"] .number-intro-page .number-task-id,
.site-scene[data-theme="flayed"] .product-page .search-task-id,
.site-scene[data-theme="flayed"] .task-detail-nextgen .tdn-chips span,
.site-scene[data-theme="flayed"] .number-intro-page .number-task-stat-chip,
.site-scene[data-theme="flayed"] .number-intro-page .number-task-difficulty,
.site-scene[data-theme="flayed"] .training-page .training-stat-chip,
.site-scene[data-theme="flayed"] .course-nextgen .cng-chip {
  color: var(--chip-ink) !important;
  -webkit-text-fill-color: var(--chip-ink) !important;
  background: var(--chip-bg) !important;
  border-color: var(--chip-border) !important;
  font-weight: 800;
}

.site-scene[data-theme="flayed"] .number-intro-page .number-task-id,
.site-scene[data-theme="flayed"] .product-page .search-task-id {
  font-size: 13px;
  min-height: 30px;
  letter-spacing: 0.02em;
}

.site-scene[data-theme="flayed"] .product-page .search-task-id {
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid var(--chip-border);
  border-radius: 999px;
  background: var(--chip-bg);
}

.site-scene[data-theme="flayed"] .number-intro-page .number-task-index,
.site-scene[data-theme="flayed"] .number-intro-page .number-task-meta,
.site-scene[data-theme="flayed"] .number-intro-page .number-task-topic,
.site-scene[data-theme="flayed"] .number-intro-page .number-task-card-footer,
.site-scene[data-theme="flayed"] .task-catalog-scene .task-status,
.site-scene[data-theme="flayed"] .task-catalog-scene .catalog-result-line {
  color: var(--label-muted) !important;
  -webkit-text-fill-color: var(--label-muted) !important;
  font-weight: 700;
}

.site-scene[data-theme="flayed"] .number-intro-page .number-task-stat-chip strong,
.site-scene[data-theme="flayed"] .training-page .training-stat-chip strong {
  color: var(--label-ink) !important;
  -webkit-text-fill-color: var(--label-ink) !important;
}

.site-scene[data-theme="flayed"] .course-nextgen .cng-btn-primary,
.site-scene[data-theme="flayed"] .course-nextgen a.cng-btn-primary {
  color: var(--action-ink-dark) !important;
  -webkit-text-fill-color: var(--action-ink-dark) !important;
}

.site-scene[data-theme="flayed"] .course-nextgen .cng-kicker {
  color: #2de1b2 !important;
  -webkit-text-fill-color: #2de1b2 !important;
  font-weight: 850;
}
