/**
 * Marthoma Church Theme - Typography
 *
 * @package MarthomaChurch
 */

/* CSS Custom Properties for Typography */
:root {
    /* Font Families */
    --marthoma-font-heading: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --marthoma-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --marthoma-font-nav: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    /* Font Sizes */
    --marthoma-font-size-base: 16px;
    --marthoma-font-size-h1: 40px;
    --marthoma-font-size-h2: 35px;
    --marthoma-font-size-h3: 28px;
    --marthoma-font-size-h4: 23px;
    --marthoma-font-size-h5: 21px;
    --marthoma-font-size-h6: 18px;
    --marthoma-font-size-small: 14px;

    /* Font Weights */
    --marthoma-font-weight-heading: 600;
    --marthoma-font-weight-body: 400;
    --marthoma-font-weight-nav: 500;
    --marthoma-font-weight-button: 500;

    /* Line Heights */
    --marthoma-line-height-heading: 1.3;
    --marthoma-line-height-body: 1.6;

    /* Letter Spacing */
    --marthoma-letter-spacing-heading: -0.02em;
    --marthoma-letter-spacing-body: 0;
}

/* Body */
body {
    font-family: var(--marthoma-font-body);
    font-size: var(--marthoma-font-size-base);
    font-weight: var(--marthoma-font-weight-body);
    line-height: var(--marthoma-line-height-body);
    color: var(--marthoma-text, #7A7A7A);
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--marthoma-font-heading);
    font-weight: var(--marthoma-font-weight-heading);
    line-height: var(--marthoma-line-height-heading);
    letter-spacing: var(--marthoma-letter-spacing-heading);
    color: var(--marthoma-primary, #000000);
    margin-bottom: 0.5em;
}

h1, .h1 {
    font-size: var(--marthoma-font-size-h1);
}

h2, .h2 {
    font-size: var(--marthoma-font-size-h2);
}

h3, .h3 {
    font-size: var(--marthoma-font-size-h3);
}

h4, .h4 {
    font-size: var(--marthoma-font-size-h4);
}

h5, .h5 {
    font-size: var(--marthoma-font-size-h5);
}

h6, .h6 {
    font-size: var(--marthoma-font-size-h6);
}

/* Paragraphs */
p {
    margin-bottom: 1em;
}

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

/* Links */
a {
    color: var(--marthoma-button, #375EFB);
    transition: color 0.3s ease;
}

a:hover {
    color: var(--marthoma-accent, #5251FF);
}

/* Small text */
small,
.text-small {
    font-size: var(--marthoma-font-size-small);
}

/* Strong/Bold */
strong,
b {
    font-weight: 600;
}

/* Emphasis */
em,
i {
    font-style: italic;
}

/* Blockquotes */
blockquote {
    font-size: 1.125em;
    font-style: italic;
    border-left: 4px solid var(--marthoma-button, #375EFB);
    padding-left: 1.5em;
    margin: 1.5em 0;
    color: var(--marthoma-secondary, #54595F);
}

blockquote cite {
    display: block;
    font-size: 0.875em;
    font-style: normal;
    margin-top: 0.5em;
    color: var(--marthoma-text, #7A7A7A);
}

/* Code */
code,
pre {
    font-family: 'Monaco', 'Consolas', 'Courier New', monospace;
    font-size: 0.9em;
}

code {
    background: var(--marthoma-light-gray, #F5F5F5);
    padding: 0.2em 0.4em;
    border-radius: 3px;
}

pre {
    background: var(--marthoma-dark-navy, #072538);
    color: #fff;
    padding: 1.5em;
    border-radius: 8px;
    overflow-x: auto;
}

pre code {
    background: none;
    padding: 0;
}

/* Lists */
ul,
ol {
    margin: 1em 0;
    padding-left: 1.5em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li {
    margin-bottom: 0.5em;
}

/* Elementor Typography Overrides */
.elementor h1,
.elementor h2,
.elementor h3,
.elementor h4,
.elementor h5,
.elementor h6,
.elementor .elementor-heading-title {
    font-family: var(--marthoma-font-heading) !important;
    font-weight: var(--marthoma-font-weight-heading) !important;
}

.elementor-widget-container p,
.elementor-widget-text-editor p,
.elementor p {
    font-family: var(--marthoma-font-body) !important;
}

/* Navigation Typography */
.elementor-nav-menu a,
.e-n-menu-title-text,
.site-navigation a {
    font-family: var(--marthoma-font-nav) !important;
    font-weight: var(--marthoma-font-weight-nav) !important;
}

/* Responsive Typography */
@media (max-width: 1024px) {
    :root {
        --marthoma-font-size-h1: 36px;
        --marthoma-font-size-h2: 30px;
        --marthoma-font-size-h3: 26px;
    }
}

@media (max-width: 768px) {
    :root {
        --marthoma-font-size-h1: 32px;
        --marthoma-font-size-h2: 28px;
        --marthoma-font-size-h3: 24px;
        --marthoma-font-size-h4: 20px;
        --marthoma-font-size-h5: 18px;
        --marthoma-font-size-h6: 16px;
    }
}

@media (max-width: 480px) {
    :root {
        --marthoma-font-size-h1: 28px;
        --marthoma-font-size-h2: 24px;
        --marthoma-font-size-h3: 22px;
        --marthoma-font-size-h4: 18px;
        --marthoma-font-size-h5: 17px;
        --marthoma-font-size-h6: 16px;
        --marthoma-font-size-base: 15px;
    }
}
