.Header_Main {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; /* Ensures vertical centering */
    background-color: var(--header-main-color);
    width: 100%;
    min-height: var(--header-height); /* Changed from height to min-height */
    padding: 0 0.625rem;
}

.Header_Buttons {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: fit-content;
    margin-bottom: 0.7rem;
}

.Header_Buttons_Menu_Div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 4.5rem;
    min-width: 3.75rem; /* Ensures buttons don't crush too small */
    height: 100%;
    cursor: pointer;
    user-select: none;
    font-size: 0.8rem;
}

/* Reset button styles to prevent browser overrides */
.Header_Buttons_Menu, .Header_Buttons_Settings,
.Header_Buttons_Info, .Header_Buttons_Delete {
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

.Header_Button_Svg {
    width: var(--header-height-svg);
    height: var(--header-height-svg);
}

.Header_Logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    font-weight: bold;
}

.Header_Logo_Img {
    width: calc(1.5 * var(--header-height-svg));
    height: auto;
}

.Header_Logo_Span {
    padding-left: 0.5rem;
    font-size: var(--header-logo-font-size);
    font-weight: lighter;
    color: var(--header-logo-font-color);
    user-select: none;
}


/* --- HAMBURGER MENU --- */
.hamburger-menu {
    display: none;
    flex-direction: column;
    justify-content: space-around;
    width: 2rem;
    height: 2rem;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 1000;
}

.hamburger-menu span {
    width: 2rem;
    height: 0.2rem;
    background: black;
    border-radius: 0.625rem;
    transition: all 0.05s;
}

.hamburger-menu.active span:nth-child(1) {
    transform: rotate(30deg) translate(0.5rem, 0.5rem);
}

.hamburger-menu.active span:nth-child(2) {
    opacity: 0;
}

.hamburger-menu.active span:nth-child(3) {
    transform: rotate(-30deg) translate(0.5rem, -0.5rem);
}

.run-btn-hidden {
    display: none !important;
}



@media (max-width: 768px) {
    :root {
        --header-logo-font-size: 1.3rem;  /* Increased from 1.1rem */
        --header-height-svg: 2rem;
    }

    .Header_Main {
        position: relative;
        justify-content: center;
        padding: 0.625rem 0.9375rem;
    }

    /* Show hamburger menu on the left */
    .hamburger-menu {
        display: flex;
        position: absolute;
        left: 0.9375rem;
        z-index: 1001;
    }

    /* Header buttons container - positioned on the right */
    .Header_Buttons {
        display: flex;
        position: absolute;
        right: 0.9375rem;
        flex-direction: row;
        width: auto;
        background-color: transparent;
        margin-bottom: 0;
        z-index: 998;
    }

    /* Keep Run button visible and styled */
    .Header_Buttons .Header_Buttons_Menu_Div:first-child:not(.run-btn-hidden) {
        display: flex !important;
        position: relative;
        flex-direction: column;
        width: 4.5rem;
        min-width: 3.75rem;
        padding: 0;
        margin: 0;
        background-color: transparent;
    }

    .Header_Buttons .Header_Buttons_Menu_Div:first-child.run-btn-hidden {
        display: none !important;
    }

    /* Hide all other buttons by default - they go in dropdown */
    .Header_Buttons .Header_Buttons_Menu_Div:not(:first-child) {
        display: none;
    }

    /* Dropdown menu for other buttons */
    .Header_Buttons.mobile-menu-open {
        position: absolute;
        top: 100%;
        left: 0;
        right: auto;
        width: auto;
        min-width: 12.5rem;
        flex-direction: column;
        background-color: var(--header-main-color);
        z-index: 999;
        box-shadow: 0.125rem 0.125rem 0.5rem rgba(0, 0, 0, 0.15);
        padding: 0;
    }

    /* Show all buttons when menu is open */
    .Header_Buttons.mobile-menu-open .Header_Buttons_Menu_Div:not(:first-child) {
        display: flex;
        width: 100%;
        padding: 0.75rem 1.25rem;
        justify-content: flex-start;
        min-height: auto;
        flex-direction: row;
        margin-bottom: 0;
        background-color: var(--header-main-color);
    }

    /* Hide Run button from dropdown when menu is open */
    .Header_Buttons.mobile-menu-open .Header_Buttons_Menu_Div:first-child {
        display: none !important;
    }

    /* Show SVG icons in mobile menu */
    .Header_Buttons.mobile-menu-open .Header_Button_Svg {
        display: block;
        margin-right: 0.625rem;
    }

    /* Show buttons in mobile menu */
    .Header_Buttons.mobile-menu-open button {
        display: flex;
        align-items: center;
    }

    /* Show and style labels in dropdown */
    .Header_Buttons.mobile-menu-open .Header_Buttons_Menu_Div label {
        display: block;
        font-size: 1rem;
        cursor: pointer;
        width: 100%;
        margin: 0;
    }

    /* Hide file input */
    .Header_Buttons #LoadInputFiles {
        display: none;
    }

    /* Logo centered in header */
    .Header_Logo {
        display: flex;
        position: relative;
        left: auto;
        right: auto;
        transform: none;
        z-index: 1000;
    }
    
    /* Increase title font size specifically */
    .Header_Logo_Span {
        font-size: 1.3rem;  /* Explicitly set larger size */
    }
}

@media (max-width: 480px) {
    :root {
        --header-logo-font-size: 1.1rem; 
        --header-height-svg: 1.6rem;
    }
    
    .Header_Buttons .Header_Buttons_Menu_Div:first-child {
        width: 3.5rem;
        min-width: 3rem;
    }
    
    /* Adjust logo font for very small screens - still readable */
    .Header_Logo_Span {
        font-size: 1.0rem;  /* Increased from 0.85rem */
        max-width: 8rem;       /* forces wrap before hitting the Run button */
        white-space: normal;   /* allow two-line wrap */
        line-height: 1.2;
        text-align: center;
    }
    
    /* Make logo image slightly smaller on tiny screens */
    .Header_Logo_Img {
        width: calc(1.2 * var(--header-height-svg));
    }

    /* Give the Run button a firm right anchor so it never drifts left */
    .Header_Buttons .Header_Buttons_Menu_Div:first-child {
        min-width: 2.8rem;
        width: 2.8rem;
    }
}

/* Very small screens (iPhone SE ~375px) - prevent title/Run button overlap */
@media (max-width: 400px) {
    .Header_Logo_Span {
        font-size: 0.9rem;
        max-width: 8rem;       /* forces wrap before hitting the Run button */
        white-space: normal;   /* allow two-line wrap */
        line-height: 1.2;
        text-align: center;
    }

    .Header_Logo_Img {
        width: calc(1.1 * var(--header-height-svg));
    }

    /* Give the Run button a firm right anchor so it never drifts left */
    .Header_Buttons .Header_Buttons_Menu_Div:first-child {
        min-width: 2.8rem;
        width: 2.8rem;
    }
}