/* --- css/layout.css --- */

.main-header {
   position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: var(--header-padding-y) var(--header-padding-x);
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1000; /* Ensure header is above other content */

    background-color: var(--header-bg-color);
    border-bottom: 1px solid var(--header-border-color);
    outline-offset: -1px;
}

.main-header__logo img {
    width: 165px;
    height: 35px;
    display: block;
}

.main-header__right-side {
    display: flex;
    align-items: center;
    gap: var(--spacing-lg);
}