/*
Theme Name: JBA27
Theme URI: 
Author: Kalle Kemilä
Author URI: 
Description: 
Requires at least: 7.1
Tested up to: 7.1
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: ollie
Text Domain: jba27
Tags: 
*/


html { font-size: 105%; }

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content{ 
    font-size: 115%; 
    font-family: var(--wp--preset--font-family--expanded);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container .wp-block-navigation-item:hover > .wp-block-navigation-item__content {
 background: color-mix(in srgb, currentColor, transparent 90%) !important;
}


.wp-block-navigation-item.english a:before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 5px;
    vertical-align: -0.125em;
    background-color: currentColor;
    -webkit-mask: var(--english-icon) center / contain no-repeat;
    mask: var(--english-icon) center / contain no-repeat;
    --english-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3C!-- Icon from Google Material Icons by Material Design Authors - https://github.com/material-icons/material-icons/blob/master/LICENSE --%3E%3Cpath fill='currentColor' d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2m6.93 6h-2.95a15.7 15.7 0 0 0-1.38-3.56A8.03 8.03 0 0 1 18.92 8M12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96M4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2s.06 1.34.14 2zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56A8 8 0 0 1 5.08 16m2.95-8H5.08a8 8 0 0 1 4.33-3.56A15.7 15.7 0 0 0 8.03 8M12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96M14.34 14H9.66c-.09-.66-.16-1.32-.16-2s.07-1.35.16-2h4.68c.09.65.16 1.32.16 2s-.07 1.34-.16 2m.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95a8.03 8.03 0 0 1-4.33 3.56M16.36 14c.08-.66.14-1.32.14-2s-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2z'/%3E%3C/svg%3E");
}

  .top-site-wrapper .wp-block-search__input {
    width: 20px;
    border-radius: 9999px !important;
    transition: width 0.3s ease;
    background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 256 256'%3E%3Cpath fill='currentColor' d='M232.49 215.51L185 168a92.12 92.12 0 1 0-17 17l47.53 47.54a12 12 0 0 0 17-17ZM44 112a68 68 0 1 1 68 68a68.07 68.07 0 0 1-68-68'/%3E%3C/svg%3E" );
    background-repeat: no-repeat;
    background-position: center;
    }

    .top-site-wrapper input:not([type="submit"]):not([type="radio"]){
    border-radius: 5px;
    border: solid 0px 
color-mix(in srgb, var(--wp--preset--color--tertiary) 100%, var(--wp--preset--color--main) 20%);
    padding: 1px 10px;
    font-size: var(--wp--preset--font-size--x-small);
    background-color: #fff;
    box-shadow: none;
}

    .top-site-wrapper .wp-block-search__input::placeholder {
    font-size: 0;
    }


                                                    
    .wp-block-search__input:focus,
    .relevanssi-live-search-results[aria-expanded="true"] ~ .wp-block-search__inside-wrapper .wp-block-search__input,
    .wp-block-search__input:not(:placeholder-shown) {
    width: 200px;
    border-radius: 10px;
    background-image: none;
    }

    .relevanssi-live-search-results{
        color:var(--wp--preset--color--main)
           }

   header input {

border: 0 !important;

}

input:focus-visible, textarea:focus-visible, select:focus-visible {
    outline-color: var(--wp--preset--color--border-dark) !important;
    outline-offset: 1px;
}

.wp-block-search__input {
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
}




.wp-block-query.is-layout-flow.wp-block-query-is-layout-flow {
    flex-grow: 1;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container .current-menu-item > a, .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container .has-child button:hover {
    text-decoration: none;
}

.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
    text-decoration: none;
}


a.wp-block-navigation-item__content:not(.wp-block-navigation__responsive-container.is-menu-open *), .wp-block-navigation-item.has-child:not(.wp-block-navigation__responsive-container.is-menu-open *){
    padding: 6px 15px;
    transition: all 0.2s ease-in-out;
}

a.wp-block-navigation-item__content:not(.wp-block-navigation__responsive-container.is-menu-open *):not(.wp-block-navigation__submenu-container *), .wp-block-navigation-item.has-child:not(.wp-block-navigation__responsive-container.is-menu-open *):not(.wp-block-navigation__submenu-container *){
    border-radius: var(--wp--preset--border-radius--xs);
}



a.wp-block-navigation-item__content:hover, .wp-block-navigation-item.has-child:hover{
    background-image: linear-gradient(rgba(245, 245, 245, 0.1), rgba(245, 245, 245, 0.1));
    cursor: pointer;
}





.decoration-none * {
    text-decoration: none !important;
}

.site-header {
    position: absolute;
    width: 100%;
    z-index: 2;
    min-height: 0;
}
/* CSS identified as supporting the fixed state */
.site-header.fixed {
  position: fixed;
   /* top: calc(40px + var(--wp-admin--admin-bar--height, 0px)); */
  z-index: 3;
  width: 100%;
  /* Additional styles for smooth transition often applied here */
}

.top-site-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 3;
    overflow: hidden;
}

html.has-modal-open .top-site-wrapper {
    z-index: 0 !important;
}

.wp-block-navigation__submenu-container  {
    font-family: var(--wp--preset--font-family--condensed);
    letter-spacing: 0;
}

html.has-modal-open .wp-block-navigation__submenu-container  {
    font-family: unset;
}

.has-final-score .versus {
    display:none;
}

.wp-block-matchlist-match-context__item.matchlist-home-club-22343 > .wp-block-group.has-background {
    background-blend-mode: lighten;
}
.wp-block-matchlist-match-context__item .tickets, .wp-block-matchlist-match-context__item.has-final-score .tickets {
    display: none;
}

.wp-block-matchlist-match-context__item.matchlist-home-club-22343:not(.has-final-score) .tickets {
    display: flex;
}


.wp-block-matchlist-home-logo, .wp-block-matchlist-away-logo {
  text-align: center;
}
.wp-block-matchlist-home-logo img, .wp-block-matchlist-away-logo img {
  vertical-align: middle; 
}

.matchlisting .wp-block-matchlist-home-logo img, .matchlisting .wp-block-matchlist-away-logo img {
  vertical-align: middle; 
  max-height: 48px;
  width:auto;
}


.truncate {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}



/* Target the match item when it's a JBA home game (using the club ID 22343) */
.matchlist-home-club-22343 .ollie-row-stack {
    background-image: 
        linear-gradient(var(--wp--preset--color--primary-alt-accent), var(--wp--preset--color--primary-alt-accent)), 
        url('assets/dark-bg.png') !important;
    background-blend-mode: lighten; /* Still keep it for browsers that support it well */
    background-size: cover;
}

/* Fallback for Safari if lighten still fails: 
   Use semi-transparent overlay instead */
@supports not (background-blend-mode: lighten) {
    .matchlist-home-club-22343 .ollie-row-stack {
        background-image: 
            linear-gradient(rgba(20, 144, 197, 0.8), rgba(20, 144, 197, 0.8)), 
            url('assets/dark-bg.png') !important;
    }
}

.grainy:before {
content: "";
background-color: rgba(0, 0, 0, 0);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6…%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
background-repeat: repeat;
background-size: 91px;
opacity: .5;
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: inherit;
z-index: -1;
}


.animate{
  transition: transform 0.3s ease;
}
.animate .rotate-m45, .animate.arrow svg, .animate.rotate-m45 a:before {
  transform: rotate(-45deg);
    transition: transform 0.3s ease;
}
.animate:hover .rotate-m45, .animate.arrow:hover svg, .animate.rotate-m45:hover a:before {
  transform: rotate(0deg);
}

mark {
  padding: 0 .2em;
  border-radius: .05em;
  
}

.logo-carousel >* {
  align-items:center !important;
}
.wp-block-matchlist-match-boxscore-link a {
  display: flex;
  align-items: center;
}

.wp-block-matchlist-match-boxscore-link a:before {
  content: "";
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  margin-right: 0.5em;
  background-color: currentColor;
  
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 32 32'%3E%3Cpath stroke='%23000' stroke-width='2.667' d='M.915 16h30.17M16 31.085V.915m9.387 3.812-.902.902a12 12 0 0 1-16.97 0l-.902-.902m0 22.545.902-.901a12 12 0 0 1 16.97 0l.902.9m-19.758-.9A14.667 14.667 0 1 0 26.371 5.628 14.667 14.667 0 0 0 5.63 26.371Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 32 32'%3E%3Cpath stroke='%23000' stroke-width='2.667' d='M.915 16h30.17M16 31.085V.915m9.387 3.812-.902.902a12 12 0 0 1-16.97 0l-.902-.902m0 22.545.902-.901a12 12 0 0 1 16.97 0l.902.9m-19.758-.9A14.667 14.667 0 1 0 26.371 5.628 14.667 14.667 0 0 0 5.63 26.371Z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.post-header:has(+ .wp-block-post-featured-image) {
  padding-bottom: 100px;
}

.post-header + .wp-block-post-featured-image {
  margin-top: -150px;
}

.logo-grid div:has(figure) {
display: flex;
justify-content: center;
align-items: center;
}

.main-nav {
    backdrop-filter:saturate(0) contrast(9.9) blur(5px) brightness(50%);
}

.main-nav.has-modal-open {
    backdrop-filter: none !important;
}


a:-webkit-any-link {
    text-decoration: none;
}

::selection {
  background: var(--wp--preset--color--primary); /* WebKit/Blink Browsers */
  color:#fff;
}
::-moz-selection {
  background: var(--wp--preset--color--primary); /* Gecko Browsers */
}

.wp-block-table table {
	background: unset !important;
	border-radius: 5px !important;
	border: unset !important;
	font-size: unset;
}

.entry-content p a {word-break: break-all;}

.pretty{
  text-wrap: pretty;
}

.nosto {
  transition: transform 0.6s ease;
}
.nosto:hover {
  transform: translateY(-10px);
}

/* WordPress core's native tablet breakpoint (matches core block stacking, e.g. Columns block) */
@media (max-width: 781px) {
   .wp-block-matchlist-match-context__item .wp-block-matchlist-home-team {
        order:2;
    }
     .wp-block-matchlist-match-context__item .home-team, .wp-block-matchlist-match-context__item .away-team {
        min-width: 130px;
    }
    .wp-block-matchlist-home-logo, .wp-block-matchlist-away-logo {
        min-width: 60px;
    }

    .wp-block-matchlist-match-context__item .game-time-hours {
        min-width: 85px;
    }
        .top-site-wrapper:has(.wp-block-search__input:focus) .wp-block-group:has(form),
.top-site-wrapper:has(.wp-block-search__input:not(:placeholder-shown)) .wp-block-group:has(form) {
    justify-content: right !important;
}
        .top-site-wrapper:has(.wp-block-search__input:focus) .wp-block-buttons,
.top-site-wrapper:has(.wp-block-search__input:not(:placeholder-shown)) .wp-block-buttons {
    margin-left: -500px;
}
.wp-block-site-logo img {
    max-width: 45px;
}
}

/* Mobile */
@media (max-width: 480px) {
     .wp-block-matchlist-match-context__item .home-team, .wp-block-matchlist-match-context__item .away-team {
        min-width: 85px;
    }
.zoom-instagram-widget__item:last-of-type {
    display: none;
}
 .zoom-instagram .zoom-instagram-widget__items.layout-fullwidth {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    

}


@media (max-width: 600px) {
    header div.is-style-background-blur {
        backdrop-filter: blur(5px);
    }

     header div.is-style-background-blur:has(.is-menu-open) {
        backdrop-filter: none !important;
    }
}