/* ---
Header Styles
--- */
.site-header {
    background-color: #000;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #2a2a2a;
    position: sticky;
    top: 0;
    z-index: 100;
}

.header-container {
    max-width: 1600px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.site-logo a {
    display: flex;
    align-items: center;
}

.site-search .search-form {
    display: flex;
    align-items: center;
    background-color: #1a1a1a;
    border-radius: 25px;
    border: 1px solid #525252;
    overflow: hidden;
    transition: border-color 0.3s ease;
}

.site-search .search-form:focus-within {
    border-color: #1683C6;
}

.site-search .search-field {
    background: none;
    border: none;
    color: #fff;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    outline: none;
    width: 250px;
    transition: width 0.3s ease;
}

.site-search .search-field::placeholder,
.search-form .search-field:focus {
    color: #fff !important;
}

.site-search .search-submit {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.75rem 1rem 0.75rem 0; /* Adjusted padding */
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-search .search-submit svg {
    width: 20px;
    height: 20px;
    fill: #525252;
    transition: fill 0.3s ease;
}

.site-search .search-form:focus-within .search-submit svg,
.site-search .search-submit:hover svg {
    fill: #1683C6;
}

/* Visually hide the label, but keep it for screen readers */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

/* ---
Responsive Adjustments for Header
--- */
@media (max-width: 768px) {
    .header-container {
        flex-direction: column;
        gap: 1rem;
    }

    .site-search {
        width: 100%;
    }

    .site-search .search-field {
        width: 100%; /* Full width on mobile */
    }
    
    .search-form {
        justify-content: space-between;
    }
}