/*
 * ===========================================
 * Pelagos Documentation - Custom Styles
 * ===========================================
 *
 * Table of Contents:
 * 1. Global heading styles
 * 2. Navigation sidebar
 *    2.1 Section titles
 *    2.2 Active links
 *    2.3 Section spacing
 *    2.4 Section headings
 *    2.5 Emoji styles (commented)
 * 3. Utility styles (commented)
 * ===========================================
 */

/* ------------------------------------------
   1. GLOBAL HEADING STYLES
   ------------------------------------------ */

/* Increase the boldness of all headings */
h1, h2, h3, h4, h5, h6 {
    font-weight: 900 !important;  /* Can use 700, 800, or 900 for different boldness levels */
}

/* Optional class for extra-bold headers (commented out)
 * .bold-header {
 *     font-weight: 900 !important;
 * }
 */

/* ------------------------------------------
   2. NAVIGATION SIDEBAR
   ------------------------------------------ */

/* 2.1 Navigation section titles */
.md-nav__title {
    font-weight: 200;
    font-size: 1.1rem;
    /* color: var(--md-primary-fg-color); */  /* Theme color - currently disabled */
}

/* 2.2 Active links (for emoji sections) */
.md-nav__link--active {
    font-weight: 600;
}

/* 2.3 Spacing between sidebar sections */
.md-nav__item--section {
    margin-top: 1.0em;
}

/* 2.4 Section headings in sidebar */
.md-nav__item--section > .md-nav__link {
    font-weight: 700;
    font-size: 0.75rem;          /* 12px if base is 16px */
    color: var(--md-primary-fg-color);
    border-bottom: 2px solid var(--md-primary-fg-color);  /* Underline the title */
    padding-bottom: 0.3rem;
    margin-bottom: 0.5rem;
}

/* 2.5 Emoji styles in navigation (commented out)
 * .md-nav__link .emojione,
 * .md-nav__link .twemoji {
 *     margin-right: 0.7rem;
 * }
 */

/* ------------------------------------------
   3. UTILITY STYLES (Commented - kept for reference)
   ------------------------------------------ */

/*
 * Sticky header styles from Tailwind CSS
 * Originally used for sticky positioning with specific spacing
 *
 * Selector was empty in original - needs proper element to apply to
 * Example: .sticky-header {
 *     position: sticky;           /* Sticky positioning */
 *     top: -1rem;                 /* -top-4 = -1rem (typically -16px) */
 *     z-index: 1;                 /* z-1 */
 *     display: flex;              /* Flex layout */
 *     align-items: center;        /* Center items vertically */
 *     gap: 0.75rem;               /* gap-3 = 12px */
 *     padding-left: 0.75rem;      /* px-3 */
 *     padding-right: 0.75rem;     /* px-3 */
 *     font-weight: 600;           /* font-semibold */
 *     font-size: 0.75rem;         /* text-xs = 12px */
 *     text-transform: uppercase;  /* Uppercase text */
 *     letter-spacing: 0.025em;    /* tracking-wide */
 *     margin-top: 0.5rem;         /* mt-2 = 8px */
 *     padding-top: 1rem;          /* pt-4 = 16px */
 *     padding-bottom: 0.75rem;    /* pb-3 = 12px */
 *     margin-bottom: -0.375rem;   /* -mb-1.5 = -6px */
 * }
 */