/* =========================================================
   TERRACOTTA PALETTE  —  single source of truth
   (navbar.css loads first, so these vars are available
    to index.css, toc.css and parva.css)
   ========================================================= */

:root {
    --terracotta:       #BD5434;   /* primary accent            */
    --terracotta-dark:  #963A22;   /* navbar / active / hover   */
    --terracotta-mid:   #CA6547;   /* upaparva heading          */
    --text-brown:       #5A4037;   /* body text                 */
    --hover-bg:         #FCF5F2;   /* soft hover background      */
    --border-soft:      #D9A18F;   /* card bottom border        */
    --border-faint:     #E8C8BD;   /* list item hairline        */
    --cream:            #FFF3E0;   /* light-on-dark text        */
    --nav-hover:        #F5D8CF;   /* navbar link hover         */
    --shadow-soft:      rgba(150, 58, 34, 0.15);
    --shadow-strong:    rgba(150, 58, 34, 0.22);
}


/* =========================================================
   NAVBAR
   (scoped to .mahabharata-navbar so it never leaks onto
    any other Bootstrap navbar on the site)
   ========================================================= */

.mahabharata-navbar {
    background-color: var(--terracotta-dark);
}

.mahabharata-navbar .navbar-brand,
.mahabharata-navbar .nav-link {
    color: #fff;
}

.mahabharata-navbar .nav-link:hover {
    color: var(--nav-hover);
}

.mahabharata-navbar .nav-link.active {
    color: #fff;
}

/* The little "." separator between links */
.mahabharata-navbar .nav-separator span {
    color: var(--nav-hover);
    opacity: 0.7;
}


/* =========================================================
   FIXED-TOP OFFSET
   The navbar is position:fixed, so page content would slide
   underneath it. This pushes the body down by the bar height.
   ---> If you already set body padding-top globally elsewhere,
        delete this block to avoid double spacing.
   ========================================================= */

body {
    padding-top: 64px;
}

@media (max-width: 767.98px) {
    body {
        padding-top: 58px;
    }
}