/*
 * eggb-theme-conversion.css — EggBlocks conversion theme
 *
 * Bold system-ui, affiliate/deal-focused.
 * Warm palette with a strong red accent — urgency and action.
 *
 * Color philosophy:
 *   - Warm neutrals: off-white surface, ink borders
 *   - Bold, heavy typography — everything screams "act now"
 *   - Accent: confident red — deal-focused, not alarming
 *   - Buttons are bolder than other themes
 *
 * Link AFTER eggb-base.css.
 */

/* ─────────────────────────────────────────────
   Root-level token fallbacks
───────────────────────────────────────────── */

:root {
  --eggb-text-muted:    #6b7280;
  --eggb-text-xs:       .6875rem;
  --eggb-text-sm:       .875rem;
  --eggb-text-md:       1.0625rem;
  --eggb-text-lg:       1.75rem;
  --eggb-sh-title-size: 1.25rem;
}

/* ─────────────────────────────────────────────
   Token overrides on .eggb-block
───────────────────────────────────────────── */

.eggb-block {
  /* Accent: confident red — deal/affiliate focused */
  --eggb-accent:     #dc2626;

  /* Surface: warm off-white */
  --eggb-surface:    #faf9f7;

  /* Border: warm ink hairline */
  --eggb-border:     rgba(28, 20, 10, .10);

  /* Muted text: warm gray */
  --eggb-text-muted: #6b7280;

  /* Shape — slightly rounded, approachable */
  --eggb-radius:      4px;
  --eggb-radius-chip: 4px;
  --eggb-border-w:    1px;

  /* Standard inner padding */
  --eggb-block-pad:   1rem 1.125rem;

  /* Signal colors */
  --eggb-positive: #16a34a;
  --eggb-negative: #dc2626;

  /* Editorial type colors */
  --eggb-note:    #dc2626;
  --eggb-tip:     #16a34a;
  --eggb-warning: #d97706;
  --eggb-insight: #7c3aed;

  /* Text color */
  --eggb-text: #1c1917;
  color: var(--eggb-text);

  /* Type scale */
  --eggb-text-xs:     .6875rem;
  --eggb-text-sm:     .875rem;
  --eggb-text-md:     1.0625rem;
  --eggb-text-lg:     1.75rem;

  /* Section header */
  --eggb-sh-title-size: 1.25rem;
}

/* ─────────────────────────────────────────────
   Typography — system-ui, bold and clear
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-section-title {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
}

.eggb-theme-conversion .eggb-score-num {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  letter-spacing: -.03em;
}

/* Product / verdict title — bold, action-oriented */
.eggb-theme-conversion .eggb-vd-name {
  font-weight: 700;
  line-height: 1.3;
}

/* ─────────────────────────────────────────────
   Button — bold, deal-focused
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-btn {
  font-size:      .875rem;
  font-weight:    700;
  letter-spacing: .01em;
  padding:        .5em 1.2em;
}

/* ─────────────────────────────────────────────
   Chip — warm ink border
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-chip {
  --eggb-chip-bg:     transparent;
  --eggb-chip-border: rgba(28, 20, 10, .30);
  --eggb-chip-color:  rgba(28, 20, 10, .80);
  font-size:   .75rem;
  font-weight: 600;
}

/* ─────────────────────────────────────────────
   Award badge
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-award {
  --eggb-award-bg:     color-mix(in srgb, var(--eggb-accent) 12%, transparent);
  --eggb-award-border: color-mix(in srgb, var(--eggb-accent) 35%, transparent);
  --eggb-award-color:  var(--eggb-accent);
  font-size:   .6875rem;
  font-weight: 700;
}

/* ─────────────────────────────────────────────
   Score
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-score-num {
  font-size:      2.25rem;
}

.eggb-theme-conversion .eggb-score-denom {
  opacity: .55;
}

/* ─────────────────────────────────────────────
   Price primitives
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-price-old,
.eggb-theme-conversion .eggb-price-meta {
  color: var(--eggb-text-muted);
}

.eggb-theme-conversion .eggb-price-old {
  font-size: var(--eggb-text-sm);
}

.eggb-theme-conversion .eggb-price-meta {
  font-size: var(--eggb-text-xs);
}

/* ─────────────────────────────────────────────
   Rule
───────────────────────────────────────────── */

.eggb-theme-conversion .eggb-rule {
  opacity: .10;
}

/* ─────────────────────────────────────────────
   Block panel
───────────────────────────────────────────── */

.eggb-theme-conversion.eggb-block--panel {
  background:    var(--eggb-surface);
  border:        var(--eggb-border-w) solid var(--eggb-border);
  border-radius: var(--eggb-radius);
}

.eggb-theme-conversion.eggb-block--accented {
  border-top: 3px solid var(--eggb-accent);
}

.eggb-theme-conversion .eggb-card {
  background:    var(--eggb-surface);
  border:        var(--eggb-border-w) solid var(--eggb-border);
  border-radius: var(--eggb-radius);
}

.eggb-theme-conversion .eggb-divider-v {
  width:       1px;
  background:  currentColor;
  opacity:     .12;
  flex-shrink: 0;
}
