/*
Theme Name: Ski Aspen
Template:   tcsn
Author: Studio Malt Development Team
Theme URI: https://studiomalt.com.au/
Author URI: https://studiomalt.com.au/
Description: A Wordpress block theme starter for Studio Malt projects.
Requires at least: 5.9
Tested up to: 6.1
Requires PHP: 5.6
Version: 0.2.0 Salem
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: malt

*/

.wp-child-theme-ski-aspen {
  --wp--preset--color--trip-4: var(--wp--preset--color--aspen-4);
  --wp--preset--color--trip-3: var(--wp--preset--color--aspen-3);
  --wp--preset--color--trip-2: var(--wp--preset--color--aspen-2);
  --wp--preset--color--trip-1: var(--wp--preset--color--aspen-1);

  --wp--preset--color--blue-4: var(--wp--preset--color--aspen-4);
  --wp--preset--color--blue-3: var(--wp--preset--color--aspen-3);
  --wp--preset--color--blue-2: var(--wp--preset--color--aspen-2);
  --wp--preset--color--blue-1: var(--wp--preset--color--aspen-1);

  --wp--preset--color--green-4: var(--wp--preset--color--aspen-4);
  --wp--preset--color--green-3: var(--wp--preset--color--aspen-3);
  --wp--preset--color--green-2: var(--wp--preset--color--aspen-2);
  --wp--preset--color--green-1: var(--wp--preset--color--aspen-1);

  --wp--preset--color--orange-4: var(--wp--preset--color--aspen-4);
  --wp--preset--color--orange-3: var(--wp--preset--color--aspen-3);
  --wp--preset--color--orange-2: var(--wp--preset--color--aspen-2);
  --wp--preset--color--orange-1: var(--wp--preset--color--aspen-1);

  --wp--preset--color--grey-4: var(--wp--preset--color--aspen-4);
  --wp--preset--color--grey-3: var(--wp--preset--color--aspen-2-5);
}

/* Override tcsn/trip-outline block styles */
.wp-block-tcsn-trip-outline {
  .text-xl.font-display {
    font-family: "Montserrat", sans-serif;
    font-style: italic;
  }
}

.bg-lined-aspen {
  background: linear-gradient(
    to right,
    transparent calc(50% - 68px),
    var(--wp--preset--color--aspen-4) calc(50% - 68px),
    var(--wp--preset--color--aspen-4) calc(50% - 43px),
    transparent calc(50% - 43px),
    transparent calc(50% - 31px),
    var(--wp--preset--color--aspen-3) calc(50% - 31px),
    var(--wp--preset--color--aspen-3) calc(50% - 6px),
    transparent calc(50% - 6px),
    transparent calc(50% + 6px),
    var(--wp--preset--color--aspen-2-5) calc(50% + 6px),
    var(--wp--preset--color--aspen-2-5) calc(50% + 31px),
    transparent calc(50% + 31px),
    transparent calc(50% + 43px),
    var(--wp--preset--color--aspen-2) calc(50% + 43px),
    var(--wp--preset--color--aspen-2) calc(50% + 68px),
    transparent calc(50% + 68px)
  );

  @media (min-width: 1024px) {
    background: linear-gradient(
      to bottom,
      transparent calc(50% - 68px),
      var(--wp--preset--color--aspen-4) calc(50% - 68px),
      var(--wp--preset--color--aspen-4) calc(50% - 43px),
      transparent calc(50% - 43px),
      transparent calc(50% - 31px),
      var(--wp--preset--color--aspen-3) calc(50% - 31px),
      var(--wp--preset--color--aspen-3) calc(50% - 6px),
      transparent calc(50% - 6px),
      transparent calc(50% + 6px),
      var(--wp--preset--color--aspen-2-5) calc(50% + 6px),
      var(--wp--preset--color--aspen-2-5) calc(50% + 31px),
      transparent calc(50% + 31px),
      transparent calc(50% + 43px),
      var(--wp--preset--color--aspen-2) calc(50% + 43px),
      var(--wp--preset--color--aspen-2) calc(50% + 68px),
      transparent calc(50% + 68px)
    );
  }
}

.swiper-pseudo-bg.swiper-pseudo-bg--aspen {
  .swiper-slide {
    .swiper-pseudo-bg-slide:before {
      background-color: var(--wp--preset--color--aspen-2);
    }
  }
}

.wp-block-twentybellows-taxonomy-query-filter.taxonomy-query-filter--aspen
  input[type="radio"] {
  &:checked + label:after,
  &:checked + label:after:hover {
    background-color: var(--wp--preset--color--aspen-3);
  }

  + label:hover:after {
    background-color: var(--wp--preset--color--aspen-2);
  }

  &[value] {
    order: initial;

    &:checked + label:after,
    &:checked + label:hover:after {
      background-color: var(--wp--preset--color--aspen-3) !important;
    }

    + label {
      order: initial;

      &:hover:after {
        background-color: var(--wp--preset--color--aspen-2) !important;
      }
    }
  }
}

.wp-block-tcsn-header {
  nav > ul > li > a:hover:after,
  nav > ul > li > a.active:after {
    background-color: var(--wp--preset--color--white);
  }

  .scrolled nav > ul > li > a:hover:after,
  .scrolled nav > ul > li > a.active:after {
    background-color: var(--wp--preset--color--aspen-4);
  }
}