/*
Theme Name: Primera Vocal
Author: lopandpe
Author URI: https://lopandpe.com

Version: 1.1
Text Domain: primeravocal
*/

.wp-block-search__input {
  background-color: transparent;
  color: inherit;
}
.wp-block-search__inside-wrapper {
  border: none !important;
  color: black;
}
header .wp-block-columns{
  align-items: center !important;
}
header .wp-block-search__inside-wrapper {
  color: var(--wp--preset--color--primary);
  position: relative;
  .wp-block-search__button{
    padding: 0px 5px;
    color:  var(--wp--preset--color--primary) !important;
    background-color: #FFF !important;
  }
  &:after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border-bottom: 1px solid var(--wp--preset--color--primary);
    transition: width 0.2s ease-in;
  }
}

header{
  margin-block-start: 0px !important;
  .current-menu-item {
    text-decoration: underline;
  }
}
footer{
  text-align: center;
  border-top: 1px solid var(--wp--preset--color--primary);
}
footer.wp-block-column{
  margin-bottom: 20px;
}
footer ul.wp-block-categories{
  list-style: none;
  padding: 0px;
  margin: 0px;
}
footer p{
  margin-bottom: 0px;
  margin-block-start: 0px !important;
}
footer a:where(:not(.wp-element-button)){
  color: #100605;
  text-decoration: none;
  margin-bottom: 10px;
  display: block;
}
footer  a:where(:not(.wp-element-button)):hover{
  color: var(--wp--preset--color--secondary);
}

.wp-block-query-pagination-numbers{
  display: flex;
  gap: 20px;
}
@media screen and (min-width: 600px){

  header .wp-block-search__inside-wrapper {
    &:after{
      width: 0px;
    }
    .wp-block-search__input{
      opacity: 0;
      transition: opacity 0.2s ease-in;
    }
    &:hover{
      &:after{
        width: 100%;
      }
      .wp-block-search__input{
        opacity: 1;
      }
    }
  }

  footer a:where(:not(.wp-element-button)){
    display: inline-block;
  }
}
@media screen and (min-width: 768px){
  footer{
    text-align: left;
  }
  footer ul.wp-block-categories{
    column-count: 2;
  }
}

@media screen and (max-width: 600px){
  .wp-block-navigation.items-justified-right {
    --navigation-layout-justification-setting: flex-start;
    --navigation-layout-justify: flex-start;
  }
  .wp-container-core-navigation-layout-1.wp-container-core-navigation-layout-1{
    justify-content: center;
    padding-bottom: 10px;
  }
  .wp-block-site-logo {
    text-align: center;
  }
}