/* LED Typography Override - Theme Independent Typography System - generated: 2025-12-09 06:53:17 */
/* FRONTEND ONLY - Admin area excluded */

/* Font Loading Optimization for CLS - fonts enqueued separately (no @import) */

/* CLS Optimization - Font Loading States */
.fonts-loading * {
    visibility: hidden;
}

.fonts-loaded * {
    visibility: visible;
}

/* High Priority Base Typography (mobile-first) */
/* Normal content tags - full typography styling */
html body a, html body abbr, html body acronym, html body address, html body applet, html body blockquote, html body center, html body cite, html body code, html body dd, html body del, html body dfn, html body div, html body dl, html body dt, html body fieldset, html body font, html body form, html body iframe, html body img, html body ins, html body kbd, html body label, html body legend, html body li, html body object, html body ol, html body p, html body pre, html body q, html body samp, html body small, html body span, html body sub, html body sup, html body tt, html body ul, html body var {
    font-family: var(--led-body-font-family, "Inter", sans-serif);
    font-weight: var(--led-body-weight, 400);
    line-height: var(--led-body-line-height, 1.5em);
    text-transform: var(--led-body-case, none);
    letter-spacing: var(--led-body-letter-spacing, normal);
}

/* Semantic formatting tags - only font-family, preserve their natural weight/styling */
html body b, html body big, html body em, html body i, html body s, html body strike, html body strong, html body u {
    font-family: var(--led-body-font-family, "Inter", sans-serif);
    line-height: var(--led-body-line-height, 1.5em);
    text-transform: var(--led-body-case, none);
    letter-spacing: var(--led-body-letter-spacing, normal);
    /* font-weight intentionally omitted to preserve semantic styling */
}

html body {
    font-family: var(--led-body-font-family, "Inter", sans-serif);
    font-weight: var(--led-body-weight, 400);
    line-height: var(--led-body-line-height, 1.5em);
    text-transform: var(--led-body-case, none);
    letter-spacing: var(--led-body-letter-spacing, normal);
}

/* Maximum Specificity Heading Overrides */
html body h1, html body h2, html body h3, html body h4, html body h5,
body.led-typography h1, body.led-typography h2, body.led-typography h3, body.led-typography h4, body.led-typography h5,
.led-typography h1, .led-typography h2, .led-typography h3, .led-typography h4, .led-typography h5 {
    font-family: var(--led-heading-font-family, "Oswald", sans-serif) !important;
    font-weight: var(--led-heading-weight, 600) !important;
    text-transform: var(--led-heading-case, uppercase) !important;
    letter-spacing: var(--led-heading-letter-spacing, normal);
    line-height: var(--led-heading-line-height, 1.1em);
    /* Zero padding, margins controlled explicitly below to honor settings */
    padding: 0;
}

/* Override theme h1-h6 padding and margins with higher specificity */
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
body.led-typography h1, body.led-typography h2, body.led-typography h3, body.led-typography h4, body.led-typography h5, body.led-typography h6,
.led-typography h1, .led-typography h2, .led-typography h3, .led-typography h4, .led-typography h5, .led-typography h6 {
    /* Keep padding reset only; margins set via variables below */
    padding: 0;
}

/* Heading Anchor Links - Inherit heading typography */
html body h1 a, html body h2 a, html body h3 a, html body h4 a, html body h5 a,
body.led-typography h1 a, body.led-typography h2 a, body.led-typography h3 a, body.led-typography h4 a, body.led-typography h5 a,
.led-typography h1 a, .led-typography h2 a, .led-typography h3 a, .led-typography h4 a, .led-typography h5 a {
    font-family: var(--led-heading-font-family, "Oswald", sans-serif) !important;
    font-weight: var(--led-heading-weight, 600) !important;
    text-transform: var(--led-heading-case, uppercase) !important;
    letter-spacing: var(--led-heading-letter-spacing, normal);
    line-height: var(--led-heading-line-height, 1.1em);
    text-decoration: none;
    color: inherit;
}

/* Heading Anchor Links - Hover States */
html body h1 a:hover, html body h2 a:hover, html body h3 a:hover, html body h4 a:hover, html body h5 a:hover,
body.led-typography h1 a:hover, body.led-typography h2 a:hover, body.led-typography h3 a:hover, body.led-typography h4 a:hover, body.led-typography h5 a:hover,
.led-typography h1 a:hover, .led-typography h2 a:hover, .led-typography h3 a:hover, .led-typography h4 a:hover, .led-typography h5 a:hover {
    text-decoration: underline !important;
    opacity: 0.8;
}

/* Heading Size Overrides (mobile-first) */
html body h1, .led-typography h1 {
    font-size: var(--led-h1-size, 30px);
}

html body h2, .led-typography h2 {
    font-size: var(--led-h2-size, 20px);
}

html body h3, .led-typography h3 {
    font-size: var(--led-h3-size, 18px);
}

html body h4, .led-typography h4 {
    font-size: var(--led-h4-size, 17px);
}

html body h5, .led-typography h5 {
    font-size: var(--led-h5-size, 16px);
}

/* ==========================================================================
   DIVI THEME COMPATIBILITY STYLES (Optional)
   ========================================================================== */

/* Divi compatibility: enforce typography inside Divi modules */
.et_pb_text,
.et_pb_blurb_description,
.et_pb_toggle_content,
.et_pb_accordion .et_pb_accordion_content,
.et_pb_module {
    font-family: var(--led-body-font-family, "Inter", sans-serif);
    font-weight: var(--led-body-weight, 400);
    line-height: var(--led-body-line-height, 1.5em);
    text-transform: var(--led-body-case, none);
    letter-spacing: var(--led-body-letter-spacing, normal);
    font-size: var(--led-body-font-size, 15px);
}

/* Divi module heading sizes */
.et_pb_text h1, .et_pb_module h1 { font-size: var(--led-h1-size, 30px) !important; }
.et_pb_text h2, .et_pb_module h2 { font-size: var(--led-h2-size, 20px) !important; }
.et_pb_text h3, .et_pb_module h3 { font-size: var(--led-h3-size, 18px) !important; }
.et_pb_text h4, .et_pb_module h4 { font-size: var(--led-h4-size, 17px) !important; }
.et_pb_text h5, .et_pb_module h5 { font-size: var(--led-h5-size, 16px) !important; }

/* Divi module heading anchor links */
.et_pb_text h1 a, .et_pb_text h2 a, .et_pb_text h3 a, .et_pb_text h4 a, .et_pb_text h5 a,
.et_pb_module h1 a, .et_pb_module h2 a, .et_pb_module h3 a, .et_pb_module h4 a, .et_pb_module h5 a {
    font-family: var(--led-heading-font-family, "Oswald", sans-serif) !important;
    font-weight: var(--led-heading-weight, 600) !important;
    text-transform: var(--led-heading-case, uppercase) !important;
    letter-spacing: var(--led-heading-letter-spacing, normal);
    line-height: var(--led-heading-line-height, 1.1em);
    text-decoration: none;
    color: inherit;
}

/* Divi module heading anchor links - hover */
.et_pb_text h1 a:hover, .et_pb_text h2 a:hover, .et_pb_text h3 a:hover, .et_pb_text h4 a:hover, .et_pb_text h5 a:hover,
.et_pb_module h1 a:hover, .et_pb_module h2 a:hover, .et_pb_module h3 a:hover, .et_pb_module h4 a:hover, .et_pb_module h5 a:hover {
    text-decoration: underline;
    opacity: 0.8;
}

/* Divi buttons - Divi has very specific button styles, so !important needed */
.et_pb_button, .et_pb_promo_button, .et_pb_more_button {
    font-family: var(--led-button-font-family, "Inter", sans-serif) !important;
    font-weight: var(--led-button-weight, 700) !important;
    text-transform: var(--led-button-case, none) !important;
    letter-spacing: var(--led-button-letter-spacing, normal);
    font-size: var(--led-button-font-size, 16px) !important;
    line-height: var(--led-button-line-height, 1.5em);
}

/* Divi Desktop Responsive Styles */
@media screen and (min-width: 768px) {
    /* Divi module heading sizes (desktop) */
    .et_pb_text h1, .et_pb_module h1 { font-size: var(--led-h1-size-desktop, 40px) !important; }
    .et_pb_text h2, .et_pb_module h2 { font-size: var(--led-h2-size-desktop, 25px) !important; }
    .et_pb_text h3, .et_pb_module h3 { font-size: var(--led-h3-size-desktop, 20px) !important; }
    .et_pb_text h4, .et_pb_module h4 { font-size: var(--led-h4-size-desktop, 17px) !important; }
    .et_pb_text h5, .et_pb_module h5 { font-size: var(--led-h5-size-desktop, 16px) !important; }

    /* Divi desktop heading anchor links ensure proper sizing */
    .et_pb_text h1 a, .et_pb_text h2 a, .et_pb_text h3 a, .et_pb_text h4 a, .et_pb_text h5 a,
    .et_pb_module h1 a, .et_pb_module h2 a, .et_pb_module h3 a, .et_pb_module h4 a, .et_pb_module h5 a {
        font-size: inherit !important;
    }
}

/* High Specificity Body Text Targets (mobile-first) */
html body .et-l--body,
html body p,
html body .resource-column,
html body .calculator-description,
html body .podcast-description,
html body .video-description,
body.led-typography p,
.led-typography p {
    font-family: var(--led-body-font-family, "Inter", sans-serif);
    font-size: var(--led-body-font-size, 15px);
    font-weight: var(--led-body-weight, 400);
    line-height: var(--led-body-line-height, 1.5em);
    text-transform: var(--led-body-case, none);
    letter-spacing: var(--led-body-letter-spacing, normal);
}

/* Small Body Text (mobile-first) */
html body .small-text, html body .small-body-text, .led-typography .small-text {
    font-size: var(--led-body-small-font-size, 13px);
}

/* List Typography (mobile-first) */
html body .et-l--body li,
html body li,
.led-typography li {
    font-family: var(--led-body-font-family, "Inter", sans-serif);
    font-weight: var(--led-body-weight, 400);
    line-height: var(--led-list-line-height, 1.5em);
    font-size: var(--led-list-font-size, 15px);
}

/* Button Typography (mobile-first) */
html body .et-l--body button, html body button, html body .green-btn, html body .blue-btn, html body .product-info-button, html body .shop-all-button, .led-typography button {
    font-family: var(--led-button-font-family, "Inter", sans-serif);
    font-size: var(--led-button-font-size, 16px);
    font-weight: var(--led-button-weight, 700);
    line-height: var(--led-button-line-height, 1.5em);
    text-transform: var(--led-button-case, none);
    letter-spacing: var(--led-button-letter-spacing, normal);
}

/* Price Typography (mobile-first) */
html body .price,
html body .price-value,
html body .product-info-price,
html body .price-amount,
html body .woocommerce-Price-currencySymbol,
html body .amount,
.led-typography .price {
    font-family: var(--led-price-font-family, "Oswald", sans-serif);
    font-size: var(--led-price-font-size, 16px);
    font-weight: var(--led-price-weight, 700);
    line-height: var(--led-price-line-height, 1.5em);
    text-transform: var(--led-price-case, none);
    letter-spacing: var(--led-price-letter-spacing, normal);
}

/* Content Container Specific Styles */
.content-container {
    img {
        border-radius: var(--led-image-border-radius, 8px);
    }

    .et-l--body ol,
    .et-l--body ul {
        padding: var(--led-list-padding, 0 12px);
    }

    table {
        max-width: var(--led-table-max-width, 600px);
        margin-bottom: var(--led-table-margin-bottom, 12px);
        border: none;
        border-collapse: separate;
        border-spacing: var(--led-table-border-spacing, 6px);
    }

    table tbody > tr > td,
    table thead > tr > th {
        border: var(--led-table-cell-border, 1px solid #E2E2E2);
        border-radius: var(--led-table-cell-border-radius, 8px);
        color: var(--led-table-cell-color, #646464);
        padding-left: var(--led-table-cell-padding-left, 12px);
        font-weight: var(--led-body-weight, 400);
        font-size: var(--led-table-cell-font-size, 15px);
        line-height: var(--led-table-cell-line-height, 1.5em);
        background-color: var(--led-table-cell-bg, rgba(226, 226, 226, 0.1));
    }

    table tbody td,
    table thead h4 {
        line-height: var(--led-table-cell-line-height, 1.5em);
        margin-top: var(--led-table-cell-margin-top, 0.6rem);
        margin-bottom: var(--led-table-cell-margin-bottom, 0.1rem);
    }
}

/* Global heading margins (mobile-first) with high specificity to override themes) */
html body h1, html body h2, html body h3, html body h4, html body h5,
body.led-typography h1, body.led-typography h2, body.led-typography h3, body.led-typography h4, body.led-typography h5,
.led-typography h1, .led-typography h2, .led-typography h3, .led-typography h4, .led-typography h5 {
    margin-top: var(--led-heading-margin-top, 1.25rem);
    margin-bottom: var(--led-heading-margin-bottom, 0.5rem);
}

/* Responsive Design */
@media screen and (max-width: 767px) {
    .content-container table {
        width: 100% !important;
    }
}

@media screen and (min-width: 768px) {
    /* Desktop typography overrides - match mobile specificity */
    html body,
    html body .et-l--body,
    html body p, 
    html body span,
    html body .resource-column,
    html body .calculator-description,
    html body .podcast-description,
    html body .video-description,
    body.led-typography p,
    .led-typography p,
    html body a, html body abbr, html body acronym, html body address, html body applet, html body b, html body big, html body blockquote, html body center, html body cite, html body code, html body dd, html body del, html body dfn, html body div, html body dl, html body dt, html body em, html body fieldset, html body font, html body form, html body i, html body iframe, html body img, html body ins, html body kbd, html body label, html body legend, html body li, html body object, html body ol, html body pre, html body q, html body s, html body samp, html body small, html body span, html body strike, html body strong, html body sub, html body sup, html body tt, html body u, html body ul, html body var {
        font-size: var(--led-body-font-size-desktop, 16px);
    }

    /* Small body text - match mobile specificity */
    html body .et-l--body .small-text,
    html body p.small-text,
    html body .small-body-text,
    html body .resource-column .small-text,
    html body .calculator-description .small-text,
    html body .podcast-description .small-text,
    html body .video-description .small-text,
    .led-typography .small-text {
        font-size: var(--led-body-small-font-size-desktop, 14px);
    }

    /* List typography - match mobile specificity */
    html body .et-l--body li,
    html body li,
    .led-typography li {
        font-size: var(--led-list-font-size-desktop, 16px);
    }

    /* Button typography - match mobile specificity */
    html body .et-l--body button, 
    html body button, 
    html body .green-btn, 
    html body .blue-btn, 
    html body .product-info-button, 
    html body .shop-all-button, 
    .led-typography button {
        font-size: var(--led-button-font-size-desktop, 18px);
    }

    /* Price typography - match mobile specificity */
    html body .price,
    html body .price-value,
    html body .product-info-price,
    html body .price-amount,
    html body .woocommerce-Price-currencySymbol,
    html body .amount,
    .led-typography .price {
        font-size: var(--led-price-font-size-desktop, 25px);
    }

    /* Headings desktop sizes - natural cascade override */
    html body h1, .led-typography h1 { 
        font-size: var(--led-h1-size-desktop, 40px);
    }
    html body h2, .led-typography h2 { 
        font-size: var(--led-h2-size-desktop, 25px);
    }
    html body h3, .led-typography h3 { 
        font-size: var(--led-h3-size-desktop, 20px);
    }
    html body h4, .led-typography h4 { 
        font-size: var(--led-h4-size-desktop, 17px);
    }
    html body h5, .led-typography h5 { 
        font-size: var(--led-h5-size-desktop, 16px);
    }

    /* Desktop heading anchor links ensure proper sizing */
    html body h1 a, html body h2 a, html body h3 a, html body h4 a, html body h5 a,
    .led-typography h1 a, .led-typography h2 a, .led-typography h3 a, .led-typography h4 a, .led-typography h5 a {
        font-size: inherit !important;
    }

    /* Global heading margins (desktop) - match specificity */
    html body h1, html body h2, html body h3, html body h4, html body h5,
    .led-typography h1, .led-typography h2, .led-typography h3, .led-typography h4, .led-typography h5 {
        margin-top: var(--led-heading-margin-top-desktop, 1.25rem);
        margin-bottom: var(--led-heading-margin-bottom-desktop, 1rem);
    }
    
    .content-container .et-l--body ol,
    .content-container .et-l--body ul {
        padding: var(--led-list-padding-desktop, 0 24px);
    }
    
    .content-container table td {
        font-size: var(--led-table-cell-font-size-desktop, 16px);
        color: var(--led-table-cell-color-desktop, black);
    }
}

/* Performance optimizations */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Theme independence - ensure our styles override theme defaults */
.content-container * {
    font-family: inherit;
}