/* ════════════════════════════════════════════════════════════
   Phase D3 — Universal widget token cascade
   Applies font + Persian-digit feature to ALL widgets via
   [data-pb-widget] attribute (set on every PageSection wrapper).
   Per-widget CSS files still handle their own radius/density/scale
   conversions for fine-grained control.
   ════════════════════════════════════════════════════════════ */

[data-pb-widget] {
    font-family: var(--w-font, var(--font-body));
    /* Persian digit OpenType features — Vazirmatn (ss01), IRANSansX (rdot), Shabnam (ss01/ss02) */
    font-feature-settings: "ss01" 1, "ss02" 1, "rdot" 1;
    -moz-font-feature-settings: "ss01=1, ss02=1, rdot=1";
}

/* Force descendants to inherit font + feature settings.
   Excludes icon font classes so they keep their glyph fonts.
   Specificity (0,1,1) wins over global body p/a/span (0,0,2). */
[data-pb-widget] *:not(i):not([class*="fa-"]):not([class*="ti-"]):not([class*="mdi-"]) {
    font-family: inherit;
    font-feature-settings: inherit;
}

/* ════════════════════════════════════════════════════════════
   Phase 3A — modular type scale adoption
   :where() = zero specificity: any widget CSS that sets its own
   font-size still wins. Only "un-styled" headings adopt the scale,
   so themes get typographic personality without breaking layouts.
   ════════════════════════════════════════════════════════════ */
[data-pb-widget] :where(h1, .h1) { font-size: var(--fs-h1); }
[data-pb-widget] :where(h2, .h2) { font-size: var(--fs-h2); }
[data-pb-widget] :where(h3, .h3) { font-size: var(--fs-h3); }
[data-pb-widget] :where(h4, .h4) { font-size: var(--fs-h4); }
[data-pb-widget] :where(h5, .h5) { font-size: var(--fs-h5); }
[data-pb-widget] :where(h6, .h6) { font-size: var(--fs-h6); }
[data-pb-widget] :where(.lead)   { font-size: var(--fs-lead); }

/* Section rhythm — applied by the wrapper when style_props.rhythm is set */
[data-pb-widget].pb-rhythm-sm { padding-top: var(--rhythm-sm); padding-bottom: var(--rhythm-sm); }
[data-pb-widget].pb-rhythm-md { padding-top: var(--rhythm-md); padding-bottom: var(--rhythm-md); }
[data-pb-widget].pb-rhythm-lg { padding-top: var(--rhythm-lg); padding-bottom: var(--rhythm-lg); }
[data-pb-widget].pb-rhythm-xl { padding-top: var(--rhythm-xl); padding-bottom: var(--rhythm-xl); }

/* Alternating surface — style_props.surface=alt */
[data-pb-widget].pb-surface-alt { background-color: var(--surface-alt); }

/* Phase 5B — bottom shape divider host */
[data-pb-widget].pb-has-divider { position: relative; }

/* ════════════════════════════════════════════════════════════
   Row-group column stacking (page_sections.col_index / mobile_order)
   .pb-col  : one column of a row group that stacks several sections
   Desktop  : sections stack vertically inside the column (independent heights, no gaps)
   < 992px  : the column dissolves (display:contents) so every section becomes a direct
              flex item of the .row and is ordered by --pb-m-order (per-section mobile order)
   ════════════════════════════════════════════════════════════ */
.pb-col { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; align-self: flex-start; }
.pb-col > .pb-col-item { min-width: 0; }
@media (max-width: 991.98px) {
    .pb-col { display: contents; }
    .pb-col-item {
        order: var(--pb-m-order, 0); width: 100%; max-width: 100%; min-width: 0;
        padding-inline: calc(var(--bs-gutter-x, 1.5rem) * .5);
        margin-top: var(--bs-gutter-y, 0);
    }
}

/* Marketplace home look: light-gray page + white rounded panels (opt-in via custom_class "pb-panel") */
html:has(.pb-col) body, body:has(.pb-col) .page-content, body:has(.pb-col) main { background: var(--pb-page-bg, #eceef1); }
.pb-panel { background: var(--surface, #fff); border-radius: 16px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(16,24,40,.04); }
.pb-panel > .bsw, .pb-panel > .qsw, .pb-panel > section { margin-block: 0; }
@media (max-width: 575.98px) { .pb-panel { padding: 14px; border-radius: 14px; } }

/* Landing skin (opt-in via custom_class "pb-landing") — coaching-landing homepage look.
   Shared tokens + section header pattern (title, blue underline, subtitle, «view all» link). */
.pb-landing {
    --pl-blue: #1f4fe0;
    --pl-blue-soft: #eaf1ff;
    --pl-navy: #0f1d4a;
    --pl-text: #1f2937;
    --pl-muted: #6b7280;
    --pl-panel: #f3f8fe;
    --pl-line: #e8edf5;
    margin-block: 28px;
}
.pb-landing .tst-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    text-align: right;
    margin: 0 0 22px;
}
.pb-landing :is(.tst-heading, .prc-title) {
    position: relative;
    display: inline-block;
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--pl-navy);
    text-align: right;
    margin: 0 0 14px;
    padding-bottom: 8px;
}
.pb-landing .tst-heading::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 28px;
    height: 3px;
    border-radius: 3px;
    background: var(--pl-blue);
}
.pb-landing :is(.tst-subtitle, .prc-subtitle) {
    font-size: .92rem;
    color: var(--pl-muted);
    margin: 0;
    text-align: right;
}
.pb-landing .tst-header__link {
    flex-shrink: 0;
    font-size: .85rem;
    font-weight: 600;
    color: var(--pl-blue);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.pb-landing .tst-header__link:hover { text-decoration: underline; }
@media (max-width: 575.98px) {
    .pb-landing { margin-block: 20px; }
    .pb-landing :is(.tst-heading, .prc-title) { font-size: 1.2rem; }
}