/* Main header styling with total height of 270px */
.md-header {
    height: 90px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
/*    background-image: url("../img/banner.jpg"); */
/*    background-size: cover;
/*    background-position: center; /* Centers the image */
/*    background-repeat: no-repeat;   /* Prevents the image from repeating */
/*    height: 220px; */
/*    color: #fff; */
/*    position: relative; /* Ensures the header scrolls with content */
/*    z-index: auto; /* Remove stacking to prevent it from sticking */
} 

/* Align tab items and move search and GitHub to the right side */
.md-tabs {
    margin-top: auto; /* Forces tabs to sit at the bottom of the header */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Apply the same blue background color behind the header elements */
.md-header__inner {
    width: 100%;
    height: 50px;
    background-color: var(--md-primary-fg-color, #1976d2); /* Use the primary theme color */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1; /* Ensures it sits on top of other elements */
}

/* Ensure consistency with tab colors if using a specific color */
.md-header__source, .md-search {
    background-color: inherit;
}

/* Style adjustments for spacing */
.md-search {
    margin-right: 0px;
}

/* Adjust left navigation bar */
.md-sidebar--primary {
    position: sticky !important;; /* Makes the sidebar stick after scrolling */
    top: 50px !important;; /* Distance from the top before sticking */
    z-index: 10; /* Ensures it appears above other elements if needed */
}

/* Adjust right navigation bar (table of contents) */
.md-sidebar--secondary {
    position:sticky !important;; /* Makes the sidebar stick after scrolling */
    top: 50px !important;; /* Distance from the top before sticking */
    z-index: 10; /* Ensures it appears above other elements if needed */
}

/* Style for figure captions */
em.figcaption {
  font-style: italic;          /* Italicize the caption text */
  font-size: 0.9em;           /* Slightly smaller font size */
  color: #666;                /* Subtle gray color for contrast */
  text-align: center;         /* Center the caption */
  margin-top: 8px;            /* Space between image and caption */
  margin-bottom: 16px;        /* Space below caption */
  max-width: 100%;            /* Ensure caption doesn't overflow image */
  line-height: 1.4;           /* Improve readability */
}

/* Ensure figure container is centered and responsive */
figure {
  display: block;
  margin: 1em auto;           /* Center figure with vertical spacing */
  text-align: center;         /* Center inline content */
}

/* Style for images with the .figure class */
img.figure {
  max-width: 100%;            /* Responsive images */
  height: auto;               /* Maintain aspect ratio */
  border: 1px solid #ddd;     /* Subtle border */
  border-radius: 4px;         /* Rounded corners */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Light shadow */
  display: block;             /* Ensure image is block-level */
  margin: 0 auto;             /* Center image */
}

/* Style for tables to add vertical borders between cells */
.md-typeset table {
    border-collapse: collapse; /* Ensure borders are drawn correctly */
}

/* Add vertical borders to table cells */
.md-typeset th,
.md-typeset td {
    border-right: 1px solid #ddd; /* Vertical border between cells */
    border-left: 1px solid #ddd; /* Ensure left border for consistency */
    padding: 8px; /* Maintain padding for readability */
}

/* Remove right border from the last cell in each row */
.md-typeset th:last-child,
.md-typeset td:last-child {
    border-right: none; /* Avoid extra border on the rightmost cell */
}

/* Remove left border from the first cell in each row */
.md-typeset th:first-child,
.md-typeset td:first-child {
    border-left: none; /* Avoid extra border on the leftmost cell */
}