/* ==========================================================================
   DYNAMIC THEME: NOTO SANS + MODERN COMPACT PALETTE
   ========================================================================== */

/* Import Google Fonts Noto Sans */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');

/* LIGHT THEME CONFIGURATION */
:root, .theme-light {
    /* Base Specs */
    --font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    
    /* System Colors */
    --background-primary: #f2efec;      /* Your White */
    --background-secondary: #e8e4e0;    /* Slightly darker white for sidebars */
    --text-normal: #19191a;             /* Your Black */
    --text-muted: #5e5e60;              /* Accessible dark gray */
    --text-faint: #d9d9d9;              /* Your Gray */
    --divider-color: #d9d9d9;           /* Your Gray */

    /* Accent Flow */
    --link-color: #ee772d;              /* Your Orange (Strong contrast on light) */
    --link-color-hover: #089e4e;        /* Your Green */
    --interactive-accent: #13c8e7;      /* Your Blue */
    
    /* Header Palette */
    --h1-color: #ee772d;
    --h2-color: #089e4e;
    --h3-color: #13c8e7;
}

/* DARK THEME CONFIGURATION */
.theme-dark {
    /* System Colors */
    --background-primary: #19191a;      /* Your Black */
    --background-secondary: #232325;    /* Slightly lighter black for sidebars */
    --text-normal: #f2efec;             /* Your White */
    --text-muted: #d9d9d9;              /* Your Gray */
    --text-faint: #5e5e60;              
    --divider-color: #5e5e60;

    /* Accent Flow */
    --link-color: #13c8e7;              /* Your Blue (Pops gorgeously on dark) */
    --link-color-hover: #ee772d;        /* Your Orange */
    --interactive-accent: #089e4e;      /* Your Green */

    /* Header Palette (Inverted for visual balance) */
    --h1-color: #13c8e7;
    --h2-color: #089e4e;
    --h3-color: #ee772d;
}

/* ==========================================================================
   GLOBAL STRUCTURE & MODERN TYPOGRAPHY
   ========================================================================== */

body.publish-view {
    font-family: var(--font-family) !important;
    background-color: var(--background-primary);
    color: var(--text-normal);
    line-height: 1.6;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Headings */
.publish-view h1, .publish-view h2, .publish-view h3, 
.publish-view h4, .publish-view h5, .publish-view h6 {
    font-family: var(--font-family);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.publish-view h1 { color: var(--h1-color); border-bottom: 1px solid var(--divider-color); padding-bottom: 0.3em; }
.publish-view h2 { color: var(--h2-color); }
.publish-view h3 { color: var(--h3-color); }

/* Navigation and Sidebar Adjustments */
.publish-view .site-body-left, 
.publish-view .site-body-right {
    background-color: var(--background-secondary);
}

/* Custom Styled Links */
.publish-view a.internal-link, 
.publish-view a.external-link {
    color: var(--link-color);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid transparent;
    transition: color 0.2s ease, border-color 0.2s ease;
}

.publish-view a.internal-link:hover, 
.publish-view a.external-link:hover {
    color: var(--link-color-hover);
    border-bottom-color: var(--link-color-hover);
}

/* Active navigation item highlight */
.nav-view .nav-item.is-active {
    color: var(--link-color) !important;
    font-weight: 600;
}
