/*
Theme Name: M Lite
Theme URI: 
Author: M Agency
Author URI: 
Description: 
Requires at least: 6.0
Tested up to: 6.6
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: twentytwentyfour
Text Domain: m-lite
Tags: 
*/

/**
 * General Styles
 */
header.wp-block-template-part {
  position: absolute;
  width: 100%;
  z-index: 10;
}

:focus-visible {
  outline: 0 !important;
}

/*
 * Pop-up Plugin Customizations
 */
body.has-floating-popup {
  overflow: initial;
}

.wp-block-makeiteasy-popup {
  &.popup-fixed.position-right {
    right: -320px;
    transition: right 300ms;
    visibility: visible;
    z-index: 100;
  
    &.is-open {
      right: 0;
    }

    .makeiteasy-popup-wrapper {
      height: fit-content;
      width: clamp(290px, 100vw, 320px);

      &.has-above-close .makeiteasy-popup-close {
        background-color: transparent !important;
      }
    }
  }
}

/*
 * Video (glightbox) customizations
 */
.is-style-video-link a {
  display: block;
  position: relative;

  &:after {
    background-image: url('assets/images/play-button.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 80px 80px;
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: background 200ms;
    width: 100%;
  }

  &:hover:after {
    background-size: 90px 90px;
  }
}

@media screen and (min-width: 992px) {
  .is-style-video-link a { 
    &:after {
      background-size: 120px 120px;
    }
  
    &:hover:after {
      background-size: 130px 130px;
    }
  }
}