/* Nini Market | Category description typography and layout */
/* Applies only to description HTML, not product cards, filters or navigation. */

body.filter-page .c-desc {
    --nm-content-text: #303846;
    --nm-content-heading: #d62828;
    --nm-content-heading-2: #0d2c54;
    --nm-content-heading-3: #2f5fa5;
    --nm-content-accent: #d62828;
    direction: rtl;
    color: var(--nm-content-text);
    font-size: 16px;
    line-height: 2;
    text-align: right;
    overflow-wrap: anywhere;
}

body.filter-page .c-desc :is(h1, h2, h3, h4, h5, h6) {
    font-family: inherit;
    font-weight: 700;
    line-height: 1.65;
    text-align: right;
    letter-spacing: normal;
}

body.filter-page .c-desc h1 {
    color: var(--nm-content-heading);
    font-size: 28px;
    margin: 18px 0 24px;
}

/* Editor HTML may contain inline styles on heading spans. */
body.filter-page .c-desc :is(h1, h2, h3) span {
    font-size: inherit !important;
    color: inherit !important;
}

body.filter-page .c-desc h2 {
    color: var(--nm-content-heading-2);
    font-size: 23px;
    margin: 43px 0 18px;
    padding-bottom: 8px;
    border-bottom: 1px solid #dce5f0;
}

body.filter-page .c-desc h3 {
    color: var(--nm-content-heading-3);
    font-size: 20px;
    margin: 36px 0 14px;
}

body.filter-page .c-desc h4 {
    color: var(--nm-content-heading-2);
    font-size: 18px;
    margin: 31px 0 12px;
}

body.filter-page .c-desc h5,
body.filter-page .c-desc h6 {
    color: #374151;
    font-size: 16px;
    margin: 28px 0 12px;
}

body.filter-page .c-desc p {
    color: inherit;
    font-size: inherit;
    line-height: 2;
    text-align: justify;
    margin: 0 0 15px;
}

body.filter-page .c-desc p:empty {
    display: none;
}

body.filter-page .c-desc a {
    color: var(--nm-content-accent);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

body.filter-page .c-desc a:hover,
body.filter-page .c-desc a:focus-visible {
    color: #a91f1f;
    text-decoration: none;
}

body.filter-page .c-desc :is(ul, ol) {
    margin: 10px 0 20px;
    padding-right: 26px;
    padding-left: 0;
    line-height: 2;
}

body.filter-page .c-desc ul { list-style: disc outside; }
body.filter-page .c-desc ol { list-style: decimal outside; }
body.filter-page .c-desc li { margin: 0 0 8px; }
body.filter-page .c-desc li::marker { color: var(--nm-content-accent); }

/* Fill and center tables within the category description. */
body.filter-page .c-desc table {
    display: table;
    width: 100% !important;
    max-width: 100% !important;
    margin: 26px auto !important;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #dce4ef;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 12px rgba(13, 44, 84, 0.05);
    font-size: 14px;
    line-height: 1.8;
}

body.filter-page .c-desc table :is(th, td) {
    padding: 13px 15px;
    color: #303846;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid #e5eaf1;
    border-left: 1px solid #e5eaf1;
}

body.filter-page .c-desc table tr > :last-child { border-left: 0; }
body.filter-page .c-desc table tr:last-child > * { border-bottom: 0; }

body.filter-page .c-desc table > thead > tr:first-child > *,
body.filter-page .c-desc table > tbody:first-child > tr:first-child > * {
    background: #edf3fb;
    color: #0d2c54;
    font-weight: 700;
}

body.filter-page .c-desc table > tbody > tr:nth-child(even) > * {
    background: #f8fafc;
}

body.filter-page .c-desc img {
    max-width: 100%;
    height: auto !important;
    border-radius: 10px;
}

body.filter-page .c-desc figure {
    max-width: 100%;
    margin: 20px auto;
    text-align: center;
}

body.filter-page .c-desc figcaption {
    color: #6b7280;
    font-size: 13px;
    text-align: center;
    margin-top: 8px;
}

body.filter-page .c-desc blockquote {
    background: #fff7fa;
    border-right: 3px solid var(--nm-content-accent);
    border-radius: 8px;
    margin: 20px 0;
    padding: 13px 18px;
    line-height: 2;
}

body.filter-page .c-desc :is(strong, b) { font-weight: 700; }
body.filter-page .c-desc hr { border: 0; border-top: 1px solid #e5e7eb; margin: 24px 0; }

@media (max-width: 767px) {
    body.filter-page .c-desc {
        font-size: 14px;
        line-height: 2;
        overflow-x: auto; /* Lets wide tables scroll without stretching the whole page. */
    }

    body.filter-page .c-desc h1 { font-size: 23px; margin-top: 14px; margin-bottom: 19px; }
    body.filter-page .c-desc h2 { font-size: 20px; margin-top: 36px; }
    body.filter-page .c-desc h3 { font-size: 18px; margin-top: 30px; }
    body.filter-page .c-desc h4 { font-size: 16px; margin-top: 27px; }
    body.filter-page .c-desc :is(h5, h6) { font-size: 15px; }
    body.filter-page .c-desc p { margin-bottom: 13px; }

    body.filter-page .c-desc table {
        min-width: 560px; /* Keep columns readable; the description scrolls horizontally on small screens. */
        max-width: none !important;
        font-size: 13px;
    }

    body.filter-page .c-desc table :is(th, td) { padding: 9px 10px; }
}