.dark-theme-toggler {
    margin-bottom: 9px;
}

.img-one-row {
    display: flex !important;
    justify-content: center !important;  /* Centers the row */
    margin-bottom: 5px !important;  /* Vertical gap between rows */
}
.img-one-row p {
    display: flex !important;
    justify-content: center !important;  /* Centers images within the p tag */
    gap: 5px !important;
    width: 100% !important;
    margin: 0 !important;
}
.img-one-row img {
    width: 50% !important;
    object-fit: cover !important;
    aspect-ratio: 16/9 !important;
}

/* Tighten vertical spacing between sections */
.main-container .section.level1,
.main-container .section.level2,
.main-container .section.level3 {
    margin-top: 1rem !important;
}
.main-container h1,
.main-container h2,
.main-container h3 {
    margin-top: 0.75rem !important;
    margin-bottom: 0.5rem !important;
}

/* Make sidebar a flex column so logos always sit at the bottom */
.Sidebar {
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    overflow: hidden !important;
}

/* TOC fills remaining space and scrolls internally */
#toc {
    flex: 1 !important;
    overflow-y: auto !important;
    min-height: 0 !important;
}

/* Logos pinned to bottom — no longer need sticky */
.sidebar-logos {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: center;
    padding: 1rem 0.75rem 0.75rem;
    border-top: 1px solid var(--border-color, rgba(0,0,0,0.1));
    background: var(--sidebar-background, #fff);
}

/* Hamburger toggle — only visible when sidebar is collapsed (<1000px) */
.sidebar-hamburger {
    display: none;
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 20;
    flex-direction: column;
    gap: 5px;
    background: var(--sidebar-background, #fff);
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 5px;
    padding: 7px 8px;
    cursor: pointer;
}

@media (max-width: 1000px) {
    .sidebar-hamburger {
        display: flex;
    }
    .Sidebar {
        width: var(--sidebar-width, 280px) !important;
    }
}

.sidebar-hamburger span {
    display: block;
    width: 20px;
    height: 2px;
    background: var(--text-color, #333);
    border-radius: 2px;
}

/* Individual logo styling */
.sidebar-logo {
    width: 80px;
    height: auto;
    max-height: 80px;
    object-fit: contain;
    opacity: 0.95;
    transition: opacity 0.2s;
    display: block;
}

.sidebar-logo:hover {
    opacity: 1;
}

/* Background container for company logo only */
.company-logo {
    width: 80px;
    background-color: #2f3136; /* Dark background */
    padding: 0.5rem;
    border-radius: 6px;
}

/* Client logo - no background */
.client-logo {
    width: 180px;
}

/* Rounded edges only on images in the report content */
.main-container img:not(.sidebar-logo) {
    border-radius: 8px;
}


/* CUSTOM SLIDER */
.custom-image-slider {
position: relative;
width: 100%;
overflow: hidden;
aspect-ratio: 16 / 9;

.slider-before,
.slider-after {
position: absolute;
width: 100%;
display: block;
top: 0;
left: 0;
height: 100%;
object-fit: cover;
user-select: none;
}

.slider-after {
overflow: hidden;
}

.slider-handle {
position: absolute;
top: 0;
left: 50%;
width: 4px;
height: 100%;
background-color: #fff;
cursor: ew-resize;
}

.slider-handle::before,
.slider-handle::after {
content: "";
position: absolute;
top: 50%;
width: 0;
height: 0;
border-top: 12px solid transparent;
border-bottom: 12px solid transparent;
cursor: ew-resize;
transition: all 0.2s ease-out;
}

.slider-handle::before {
left: -24px;
border-right: 16px solid #fff;
}

.slider-handle::after {
right: -24px;
border-left: 16px solid #fff;
}
