/* header  */
header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: var(--shadow-md);
    padding: 0 var(--container-padding);
      @media(max-width: 1000px) {
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        gap: var(--space-4);
        padding: var(--space-4) var(--container-padding);
      }    
    
}
/* header buttons */
header .header-btns{
    display: none;
    @media(max-width: 1000px) {
        display: flex;
        align-items: center;
        gap: var(--space-5);
        width: 100%;

    }
    
}



header .logo-nav{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 50%;
}

header .logo-nav.hidden{
    @media(max-width: 1000px) {
        display: none;
    }
}


/* logo */
header .logo-nav a .logo {
    @media(max-width: 1000px) {
        display: none;
    }
}
header .logo-nav .logo img{
    object-fit:  cover;
}

/* nav */
header .logo-nav nav ul{
    display: flex;
    align-items: center;
    gap: var(--space-5);

    @media(max-width: 1000px) {
       flex-direction: column;
    }
}

header .logo-nav nav ul li a{
    font-weight:var(--weight-medium);
}

header .logo-nav nav ul li a:hover{
    color: var(--color-primary);
    border-bottom: 2px solid var(--color-primary);
    padding-bottom: var(--space-1);
}

/* search */

header .search{
    margin-right: var(--space-5);
}

header .search.hidden{
     @media(max-width: 1000px) {
        display: none;

    }
    
}

header .search form input{
    height: var(--input-height);
    border: var(--border);
    border-radius: var(--radius-md);
    padding: 0 var(--space-3);
    width: var(--input-width);
}

header .search form input:focus{
    border: var(--border-active);
}