/*
Theme Name: vitos
Theme URI: https://richwp.com/themes/vitos
Author: Felix Krusch
Author URI: https://richwp.com
Description: custom
Requires at least: 6.5
Tested up to: 6.6
Requires PHP: 7.2.24
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vitos
Tags: custom
*/

body {overflow-x: hidden !important;}










/* Fade Effects */
/* Base state: Elements start hidden and offset */
[class*="rich-effect-"] {
    opacity: 0;
    transition: opacity 400ms ease-out, transform 400ms ease-out;
  }
  
  /* When element comes into view */
  .rich-effect-animate {
    opacity: 1;
    transform: translate(0, 0) scale(1); /* Resets back to normal */
  }
  
  /* Fading effects (Corrected) */
  .rich-effect-fade {
    opacity: 0;
  }
  
  .rich-effect-animate.rich-effect-fade {
    opacity: 1; /* This ensures fade-in happens */
  }
  
  /* Sliding effects (Now properly animated) */
  .rich-effect-slide-left {
    transform: translateX(-50px);
  }
  
  .rich-effect-slide-right {
    transform: translateX(50px);
  }
  
  .rich-effect-slide-up {
    transform: translateY(50px);
  }
  
  .rich-effect-slide-down {
    transform: translateY(-50px);
  }
  
  /* Ensure the animation moves the element to its final position */
  .rich-effect-animate.rich-effect-slide-left {
    transform: translateX(0);
  }
  
  .rich-effect-animate.rich-effect-slide-right {
    transform: translateX(0);
  }
  
  .rich-effect-animate.rich-effect-slide-up {
    transform: translateY(0);
  }
  
  .rich-effect-animate.rich-effect-slide-down {
    transform: translateY(0);
  }
  
  /* Zoom effects (Now properly animated) */
  .rich-effect-zoom-in {
    transform: scale(0.8);
  }
  
  .rich-effect-zoom-out {
    transform: scale(1.2);
  }
  
  .rich-effect-animate.rich-effect-zoom-in {
    transform: scale(1);
  }
  
  .rich-effect-animate.rich-effect-zoom-out {
    transform: scale(1);
  }


  


  /* RichSlider */
  .richslider {
    overflow-x: hidden !important;
  }


/* Rich Details Block */
.rich-details.wp-block-details summary {
  list-style: none;
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rich-details.wp-block-details summary::-webkit-details-marker,
.rich-details.wp-block-details summary::marker {
  display: none;
}


.rich-details.wp-block-details summary::after {
  content: "+";
  transition: transform 0.2s ease;
  color: var(--wp--preset--color--accent-1);
  margin-left: 50px;
  display: block;
}

/* Rotate marker when details is open */
.rich-details.wp-block-details[open] summary::after {
  transform: rotate(45deg);
}

.rich-details.wp-block-details > :not(summary) {
  max-width: var(--wp--style--global--content-size);
}







html, body {
  overflow-x: hidden;
}

.page-transition-overlay {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    pointer-events: none;
    background-color: var(--wp--preset--color--contrast); /* Add the background color back */
    transform: translateY(-100%);
}

.page-transition-overlay::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Center the pseudo-element */
    width: 150px; /* Set width for the background image */
    height: 150px; /* Adjust height based on logo's aspect ratio; tweak as needed */
    background: url('https://vitossportinggoods.com/wp-content/uploads/capri-ball-66.webp') no-repeat center center;
    background-size: 150px auto; /* 400px wide, auto height to maintain aspect ratio */
}

.rich-transition {
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}

/* FADE */
.fade-out { animation-name: fadeOut; }
.fade-in { animation-name: fadeIn; }

@keyframes fadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* SLIDE - exit to right, entry from right */
.slide-out { animation-name: slideOutRight; }
.slide-in { animation-name: slideInRight; }

@keyframes slideOutRight {
  from { transform: translateX(0%); opacity: 1; }
  to { transform: translateX(100%); opacity: 0; }
}

@keyframes slideInRight {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0%); opacity: 1; }
}

/* SCALE - entrance small to normal, exit normal to small */
.scale-out { animation-name: scaleOut; }
.scale-in { animation-name: scaleIn; }

@keyframes scaleOut {
  from { transform: scale(1); opacity: 1; }
  to { transform: scale(0.8); opacity: 0; }
}

@keyframes scaleIn {
  from { transform: scale(0.8); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* WIPE */
.wipe-in {
  animation-name: wipeIn;
}

.wipe-out {
  animation-name: wipeOut;
}

@keyframes wipeOut {
  from { transform: translateY(-100%); }
  to { transform: translateY(0%); }
}

@keyframes wipeIn {
  from { transform: translateY(0%); }
  to { transform: translateY(-100%); }
}

.rich-text-blend {
  opacity: 1;
}

.rich-blend-char {
  opacity: 0.3;
}

.rich-skew {transform: matrix(1, -.12, 0, .99, 0, 0);}
.rich-skew-opp {transform: matrix(1, 0.12, 0, 1.01, 0, 0);}

/* Page Template specific */
.post-template-single-hero-image .vitos-title-author-date-box{padding-left:0 !important; padding-right:0 !important;}