/**
 * TransferJet — rich content.
 *
 * Hyvä's templates mark CMS blocks, category descriptions and product
 * descriptions with class="prose", but @tailwindcss/typography is not part of
 * this build, so nothing defines it. Rather than pull in the plugin — which
 * brings its own opinionated type scale that would fight the JetTheme
 * typography — .prose is defined here with the values this theme wants.
 *
 */

 /* The short description is authored as dash-prefixed lines separated by <br/>,
   so the text sits directly in the container rather than in <p> elements —
   .prose p never reaches it. leading-relaxed was removed from the template so
   this rule can own the value. */
.product-description {
    line-height: 2;
}
/* Scoped to the elements inside rather than .prose itself, so a utility on the
   container still wins if a template sets one. */
.prose p,
.prose li,
.prose td {
    line-height: 2;
}

.prose > * + * {
    margin-top: 1em;
}

.prose p {
    margin-bottom: 1em;
}

.prose p:last-child {
    margin-bottom: 0;
}

.prose h2,
.prose h3,
.prose h4 {
    margin-bottom: 0.5em;
    margin-top: 1.5em;
}

.prose h2:first-child,
.prose h3:first-child,
.prose h4:first-child {
    margin-top: 0;
}

.prose ul,
.prose ol {
    margin-bottom: 1em;
    padding-left: 1.5em;
}

.prose ul {
    list-style: disc outside;
}

.prose ol {
    list-style: decimal outside;
}

.prose li {
    margin-bottom: 0.25em;
}

.prose a {
    color: var(--color-secondary);
    text-decoration: underline;
}

.prose a:hover {
    color: var(--color-secondary-darker);
}

.prose strong,
.prose b {
    font-weight: 700;
}

.prose table {
    margin-bottom: 1em;
    width: 100%;
}

.prose th,
.prose td {
    border-bottom: 1px solid var(--color-border);
    padding: 0.5em 0.75em;
    text-align: left;
}

/* ---------------------------------------------------------------------------
   Category descriptions.

   Authored in Page Builder, so the markup arrives as nested rows and inner
   wrappers carrying inline styles — padding on the row, a margin on the inner
   element — which cannot be overridden from here without !important and are
   not worth fighting. What is worth setting is what Page Builder leaves alone:
   the space the block occupies in the page, and the treatment of a bare text
   node, which Page Builder emits with no <p> around it.
   --------------------------------------------------------------------------- */

.category-description {
    margin-bottom: 2rem;
}

/* Page Builder's row and inner wrappers already carry their own inline
   padding; collapsing the outer margins stops it compounding into a gap far
   larger than intended. */
.category-description > [data-content-type="row"]:first-child {
    padding-block-start: 0 !important;
}

.category-description > [data-content-type="row"]:last-child {
    padding-block-end: 0 !important;
}

.category-description [data-element="inner"]:last-child {
    margin-block-end: 0 !important;
}

/* A bare text node inside an html element gets no <p>, so the .prose rules for
   paragraphs miss it. */
.category-description [data-content-type="html"] {
    line-height: 1.6;
}