/**
 * Gymarket Content Control — semantic article typography.
 * Foundation owns theme variables; this plugin owns content selectors.
 */
:root {
    --gmcc-heading: var(--gmf-content-heading, #172b3d);
    --gmcc-text: var(--gmf-content-text, #444444);
    --gmcc-muted: var(--gmf-content-muted, #6b7280);
    --gmcc-link: var(--gmf-content-link, #17689f);
    --gmcc-surface: var(--gmf-content-surface, #ffffff);
    --gmcc-surface-soft: var(--gmf-content-surface-soft, #f5f8fb);
    --gmcc-border: var(--gmf-content-border, #e5e7eb);
    --gmcc-accent: var(--gmf-content-accent, #10b981);
    --gmcc-accent-soft: var(--gmf-content-accent-soft, #dff8ed);
    --gmcc-h1: #111827;
    --gmcc-h2: #065f46;
    --gmcc-h3: #047857;
    --gmcc-h4: #1f2937;
    --gmcc-h5: #374151;
    --gmcc-h6: #6b7280;
}

html[data-gmf-theme="dark"] {
    --gmcc-h1: #f7fafc;
    --gmcc-h2: #6ee7b7;
    --gmcc-h3: #eef6ff;
    --gmcc-h4: #dbeafe;
    --gmcc-h5: #cbd5e1;
    --gmcc-h6: #9fb0bf;
}

/* Plain content text: readable but visually quieter than headings. */
:where(
    .wd-entry-content,
    .entry-content,
    .page-content,
    .woocommerce-Tabs-panel,
    .woocommerce-product-details__short-description,
    .elementor-widget-text-editor
) :where(p, li:not(.smart-timeline-item)) {
    color: var(--gmcc-text) !important;
    line-height: 1.9 !important;
    font-size: 16px !important;
    text-align: justify !important;
    opacity: 1 !important;
}

:where(
    .wd-entry-content,
    .entry-content,
    .page-content,
    .woocommerce-Tabs-panel,
    .woocommerce-product-details__short-description,
    .elementor-widget-text-editor
) :where(p, li) strong {
    color: var(--gmcc-heading) !important;
}

:where(
    .wd-entry-content,
    .entry-content,
    .page-content,
    .woocommerce-Tabs-panel,
    .woocommerce-product-details__short-description,
    .elementor-widget-text-editor
) a:not(.button):not(.btn):not(.wd-button) {
    color: var(--gmcc-link);
}

/* H1 — primary content title. */
.smart-heading-h1 {
    position: relative !important;
    display: block !important;
    overflow: hidden !important;
    margin: 45px 0 35px !important;
    padding: 18px 25px 18px 15px !important;
    border: 1px solid var(--gmcc-border) !important;
    border-right: 6px solid var(--gmcc-accent) !important;
    border-radius: 12px !important;
    background: var(--gmcc-surface) !important;
    box-shadow: 0 10px 25px -8px rgba(16, 185, 129, .20) !important;
    color: var(--gmcc-h1) !important;
    font-size: 26px !important;
    font-weight: 900 !important;
    line-height: 1.6 !important;
}
.smart-heading-h1::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 0 auto !important;
    width: 80px !important;
    background: linear-gradient(to left, var(--gmcc-accent-soft), transparent) !important;
    pointer-events: none;
}

/* H2 — major section: accent color + soft bar. */
.smart-heading-h2 {
    position: relative !important;
    display: block !important;
    margin: 40px 0 20px !important;
    padding: 12px 20px 12px 15px !important;
    border-right: 4px solid var(--gmcc-accent) !important;
    border-radius: 8px 0 0 8px !important;
    background: linear-gradient(to left, var(--gmcc-accent-soft), transparent) !important;
    color: var(--gmcc-h2) !important;
    font-size: 22px !important;
    font-weight: 850 !important;
    line-height: 1.55 !important;
}

/* H3 — subsection: bright neutral text with a green node. */
.smart-heading-h3 {
    position: relative !important;
    margin: 30px 0 15px !important;
    padding-right: 22px !important;
    color: var(--gmcc-h3) !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1.55 !important;
}
.smart-heading-h3::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    width: 10px !important;
    height: 10px !important;
    transform: translateY(-50%) !important;
    border-radius: 50% !important;
    background: var(--gmcc-accent) !important;
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--gmcc-accent) 14%, transparent) !important;
}

/* H4 — paragraph heading: blue-white text + marker underline in dark mode. */
.smart-heading-h4 {
    display: inline-block !important;
    margin: 25px 0 15px !important;
    padding: 0 5px !important;
    border-radius: 2px !important;
    background: linear-gradient(to top, var(--gmcc-accent-soft) 35%, transparent 35%) !important;
    color: var(--gmcc-h4) !important;
    font-size: 18px !important;
    font-weight: 750 !important;
}

.smart-heading-h5 {
    margin: 20px 0 10px !important;
    padding-right: 12px !important;
    border-right: 2px solid var(--gmcc-muted) !important;
    color: var(--gmcc-h5) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
}

.smart-heading-h6 {
    margin: 15px 0 10px !important;
    color: var(--gmcc-h6) !important;
    font-size: 15px !important;
    font-weight: 650 !important;
}

/* Structured list styles. */
ul.smart-timeline-list,
ul.smart-grid-list {
    margin: 30px 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
ul.smart-timeline-list > li::marker,
ul.smart-grid-list > li::marker { content: none !important; }

ul.smart-timeline-list > li.has-desc {
    position: relative !important;
    margin: 0 !important;
    padding: 0 50px 25px 0 !important;
    border: 0 !important;
    background: linear-gradient(var(--gmcc-accent), var(--gmcc-accent)) right 15px top 32px / 2px calc(100% - 32px) no-repeat !important;
    text-align: right !important;
}
ul.smart-timeline-list > li.has-desc:last-child {
    margin-bottom: 25px !important;
    padding-bottom: 0 !important;
    background-image: none !important;
}
ul.smart-timeline-list > li.simple-bullet {
    position: relative !important;
    margin-bottom: 25px !important;
    padding: 0 50px 0 0 !important;
    border: 0 !important;
    background: none !important;
}
ul.smart-timeline-list .timeline-node {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: var(--gmcc-accent) !important;
    box-shadow: 0 0 0 5px var(--gmcc-surface) !important;
}
ul.smart-timeline-list .timeline-node svg { width: 18px !important; height: 18px !important; stroke: #fff !important; }
ul.smart-timeline-list .timeline-title {
    display: flex !important;
    align-items: center !important;
    min-height: 32px !important;
    margin: 0 0 15px !important;
    color: var(--gmcc-heading) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}
ul.smart-timeline-list .timeline-body {
    padding: 16px 20px !important;
    border: 1px solid var(--gmcc-border) !important;
    border-radius: 12px !important;
    background: var(--gmcc-surface) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .05) !important;
    color: var(--gmcc-text) !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
}
ul.smart-timeline-list .timeline-text {
    color: var(--gmcc-text) !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    line-height: 32px !important;
}

ul.smart-grid-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 15px !important;
    direction: rtl !important;
}
ul.smart-grid-list > li {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 12px 15px !important;
    border: 1px solid var(--gmcc-border) !important;
    border-radius: 10px !important;
    background: var(--gmcc-surface) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04) !important;
}
ul.smart-grid-list .timeline-node {
    position: static !important;
    display: flex !important;
    flex: 0 0 26px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 26px !important;
    height: 26px !important;
    border-radius: 6px !important;
    background: var(--gmcc-accent) !important;
}
ul.smart-grid-list .timeline-node svg { width: 14px !important; height: 14px !important; stroke: #fff !important; }
ul.smart-grid-list :where(.timeline-text, .timeline-title) {
    margin: 0 !important;
    color: var(--gmcc-heading) !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    line-height: 1.65 !important;
    text-align: right !important;
}
ul.smart-grid-list .timeline-body { display: none !important; }

@supports not (color: color-mix(in srgb, white 50%, black)) {
    .smart-heading-h3::before { box-shadow: 0 0 0 5px rgba(16, 185, 129, .14) !important; }
}