/* The app shell owns the page's top inset. Legacy page wrappers must not add
   a second inset. Page wrappers add exactly --throne-page-inline inside the
   shell's side padding so titles and first panels start at the same x on every
   seller page; widths and control layouts inside that edge remain page-owned. */
:root {
    --throne-page-heading-size: 2rem;
    --throne-page-top: 2.5rem;
    --throne-page-content-inset: 2.5rem;
    --throne-page-inline: clamp(12px, 1.4vw, 22px);
}

html:not(.throne-landing-root) body .throne-main {
    padding-top: var(--throne-page-top) !important;
}

html:not(.throne-landing-root) body .throne-main :is(
    .throne-content-wrapper, .throne-main-content, .ev-container,
    .dashboard-home, .inventory-page, .tcg-repricer-page, .ebay-repricer-page,
    .ebay-analytics-page, .tr-ebay-offers, .config-page-shell, .analytics-page,
    .batches-page, .auto-repricer-page, .users-page, .database-page,
    .image-queue-page, .limits-page, .news-admin, #scanner-authed-content > .main,
    .create-batch-flow, .create-batch-overview, .create-batch-title-row
) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* H1 is the page title, including detail views and access gates. Do not match
   seller-authored marketplace previews or change section/dialog hierarchy. */
body .guide-main h1,
body .scanner-main h1,
body .page > .sheet > .hero h1,
html:not(.throne-landing-root) body .throne-main h1:not(
    .description-preview-frame *, .lot-final-description-frame *
) {
    color: var(--throne-text-primary, #0f172a) !important;
    font-family: var(--throne-font) !important;
    font-size: var(--throne-page-heading-size) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.025em !important;
    margin: 0 !important;
    min-width: 0;
    max-width: 100%;
    text-transform: none;
    overflow-wrap: anywhere;
    -webkit-text-fill-color: currentColor;
}

html:not(.throne-landing-root) body .throne-main h1 > span {
    color: inherit !important;
    -webkit-text-fill-color: currentColor;
}

html:not(.throne-landing-root) body .throne-main :is(
    .throne-page-subtitle, .pokemon-page-header p, .tcg-repricer-title p,
    .er-title p, .inventory-header p, .analytics-page-header p,
    .ebay-analytics-header p, .overview-subtitle, .buylist-subtitle,
    .batch-header-summary, .create-batch-subtitle, .ea-title p, .admin-subtitle,
    .users-header p, .database-header p, .image-queue-header p, .limits-header p,
    .news-admin .tr-command-header p
) {
    color: var(--throne-text-secondary) !important;
    font-family: var(--throne-font);
    font-size: 0.9375rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: normal;
    margin-top: 0.375rem !important;
}

html:not(.throne-landing-root) body .throne-main :is(
    .throne-page-header, .pokemon-page-header, .inventory-header,
    .tcg-repricer-header, .er-header, .analytics-page-header,
    .dashboard-header, .config-command-header, .overview-header,
    .buylist-header, .admin-header, .ar-header, .create-batch-title-row,
    .tr-command-header, .tr-command-row, .users-header, .database-header,
    .image-queue-header, .limits-header
):not(.config-command-header) {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top-width: 0;
    align-items: flex-start !important;
}

/* Inventory stacks its title and horizontally scrolling navigation in one
   column. Preserve stretching so the navigation stays inside the viewport. */
html:not(.throne-landing-root) body .inventory-manager-header.tr-command-header {
    align-items: stretch !important;
}

html:not(.throne-landing-root) body .throne-main :is(
    .admin-header .admin-badge, .overview-header .overview-badge,
    .buylist-header .buylist-badge, .users-header .users-kicker
) {
    display: none;
}

/* Legal pages use the same open page header above their document cards. */
html:not(.throne-landing-root) body .legal-hero {
    padding: 0 0 1.5rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

body :is(.legal-hero, .guide-hero, .guide-hub-hero, .page > .sheet > .hero)
    > :is(.legal-kicker, .guide-kicker),
body :is(.guide-hero, .page > .sheet > .hero) > div > .guide-kicker {
    display: none;
}

body .guide-main :is(.guide-hero, .guide-hub-hero) {
    padding-top: var(--throne-page-content-inset);
    align-items: start;
}

/* Breadcrumbs occupy the header's top inset instead of pushing article titles
   below the guide directory's title. Keep room for wrapping on narrow screens. */
body .guide-main {
    display: grid;
    align-content: start;
}

body .guide-main > :is(.guide-breadcrumbs, .guide-hero, .guide-hub-hero) {
    grid-area: 1 / 1;
}

body .guide-main > .guide-breadcrumbs {
    align-self: start;
    padding-top: 0.5rem;
    z-index: 1;
}

body .guide-main :is(.guide-hero-lede, .guide-hub-hero > p),
body .scanner-intro > p:last-child {
    color: var(--throne-text-secondary, #475569);
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.5;
    margin-top: 0.375rem;
}

body .scanner-main {
    padding-top: var(--throne-page-content-inset);
}

body .scanner-intro > .scanner-eyebrow {
    display: none;
}

@media (max-width: 1024px) {
    :root {
        /* The shell switches to its navigation button at the tablet breakpoint. */
        --throne-page-top: 5rem;
    }
}

@media (max-width: 768px) {
    :root {
        --throne-page-heading-size: 1.625rem;
        --throne-page-content-inset: 4rem;
    }
}

/* Phones: the shell's 16px side padding is the whole frame. */
@media (max-width: 767px) {
    :root {
        --throne-page-inline: 0px;
    }
}
