/*
Theme Name: Musico Child
Theme URI: https://themes.themegoods.com/musico/landing
Description: Premium Music WordPress Theme
Version: 1.0
Author: ThemeGoods
Author URI: https://themeforest.net/user/ThemeGoods
License: GNU General Public License
License URI: https://themeforest.net/licenses/regular_extended
Text Domain: musico
Template: musico
*/

/* Show Pointer cursor when <a> link doesn't have href */

a:not([href]) {
  cursor: pointer;
}

/* Scroll Bar Fix for VIVE plugin */

body.elementor-page #wrapper {
	overflow: unset!important;
}

/* Touch Action Fix */

@media (max-width: 768px) {
  .tg_multi_layouts_slider_wrapper .slideshow,
  .slick-slider,
  .swiper {
    touch-action: auto !important;
    pointer-events: auto;
  }
  .tg_multi_layouts_slider_wrapper .slideshow__slides,
  .slick-list,
  .swiper-wrapper {
    touch-action: auto !important;
    pointer-events: none; /* block swipe */
  }
  /* keep the nav controls clickable */
  .tg_multi_layouts_slider_wrapper .slideshow__nav--arrows,
  .tg_multi_layouts_slider_wrapper .slideshow__nav--arrows button,
  .slick-arrow,
  .swiper-button-prev,
  .swiper-button-next,
  .swiper-pagination {
    pointer-events: auto;
  }
}


/* Header */

.top_bar {
  border-bottom: none;
}

/* Unbox only the main content area and the footer */
#page_content_wrapper .standard_wrapper,
#content_wrapper .standard_wrapper,
#footer_wrapper .standard_wrapper {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible;
}

/* Full-bleed utility for Elementor containers */
.e-con.full-bleed {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-sizing: border-box;
}

/* Do not let inner boxes cap the width */
.e-con.full-bleed> :is(.e-con-inner, .elementor-container, .e-con-boxed) {
  max-width: none;
  width: 100%;
}

/* Keep the editor canvas sane */
.elementor-editor-active .e-con.full-bleed {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* Prevent horizontal scrollbar from the vw breakout */
html,
body {
  overflow-x: hidden;
}


/* Team Carousel */

.team-carousel-wrapper.style2 .item,
.portfolio-classic-grid-wrapper .portfolio-classic-img {
  border-radius: 0 !important;
}

.team-carousel-handle a {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-align: center;
  transition: background-color 0.3s ease;
}

@media only screen and (max-width: 767px) {
  .animated-headline.ah-headline.zoom span {
    text-align: center;
  }
}

.team-carousel-wrapper .item:hover .item-bg {
  transform: scale(1.15);
}

.team-carousel-handle a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 90px;
  height: 118px;
  background-image: url('/wp-content/uploads/2025/08/instagram-logo.svg');
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.team-carousel-handle a:hover::before {
  opacity: 1;
}

.team-carousel-handle a:hover {
  background-color: rgba(0, 0, 0, 0.6);
}

.team-carousel-wrapper .owl-carousel .owl-dots {
  margin-top: 50px;
}

.team-carousel-wrapper .owl-carousel .owl-dots .owl-dot span,
.team-carousel-wrapper .owl-carousel .owl-dots .owl-dot.active span {
  transform: translate3d(0px, -50%, 0px) scale(0.5);
}

/* Team Grid Adjustment */

.portfolio-classic .portfolio-classic-grid-wrapper {
  opacity: 0;
  transition: 1.2s cubic-bezier(0.230, 1.000, 0.320, 1.000);
  position: relative;
}

.portfolio-classic .portfolio-classic-grid-wrapper .portfolio-classic-img.grid_tilt::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 2;
  content: '';
  background: linear-gradient(to bottom, rgba(15, 15, 15, .6), rgba(15, 15, 15, .6) 100%);
  transition: opacity .65s cubic-bezier(.05, .2, .1, 1);
  opacity: 0;
}

.portfolio-classic .portfolio-classic-grid-wrapper .portfolio-classic-img.grid_tilt.nolink::before {
  background: transparent;
}

.portfolio-classic .portfolio-classic-img {
  position: relative;
}

.portfolio-classic .portfolio-classic-img a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  display: block;
}

.portfolio-classic .portfolio-classic-img.nolink a {
  width: unset;
  height: unset;
  display: unset;
}

.portfolio-classic .portfolio-classic-img a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 90px;
  height: 118px;
  background-image: url('/wp-content/uploads/2025/08/instagram-logo.svg');
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 4;
}

.portfolio-classic .portfolio-classic-img.nolink a::before {
  background-image: unset;
  z-index: unset;
}

.portfolio-classic .portfolio-classic-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0);
  padding: 10px 25px 22px;
  pointer-events: none;
}

.portfolio-classic .portfolio-classic-content a {
  pointer-events: auto;
}

.portfolio-classic .portfolio-classic-grid-wrapper:hover .portfolio-classic-content {
  opacity: 0.2;
}

.portfolio-classic .portfolio-classic-grid-wrapper:hover .portfolio-classic-content.nolink {
  opacity: 1;
}

.portfolio-classic .portfolio-classic-grid-wrapper:hover .portfolio-classic-img.grid_tilt::before,
.portfolio-classic .portfolio-classic-grid-wrapper:hover .portfolio-classic-img a::before {
  opacity: 1;
}

.portfolio-classic-grid-wrapper .portfolio-classic-img>div::before {
  position: absolute;
  top: unset;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  display: block;
  z-index: 1;
  content: '';
  opacity: 1;
  background: linear-gradient(to bottom, rgba(15, 15, 15, 0), rgba(15, 15, 15, .75) 100%);
  transition: opacity .65s cubic-bezier(.05, .2, .1, 1);
}

.portfolio-classic-container.contain .portfolio-classic-grid-wrapper:hover .portfolio-classic-img {
  clip-path: none;
}

.portfolio-classic-container.contain .portfolio-classic-grid-wrapper:hover .portfolio-classic-content {
  transform: none;
}

.portfolio-classic-container.vive-team-grid .portfolio-classic-description {
  margin-top: 0;
}

.portfolio-classic-container .portfolio-classic-content h3 {
  letter-spacing: 0;
}

@media (max-width: 767px) {

  .portfolio-classic-grid-wrapper .portfolio-classic-img>div::before,
  .portfolio-classic .portfolio-classic-grid-wrapper .portfolio-classic-img.grid_tilt::before {
    bottom: -1px;
    height: calc(100% + 1px);
  }
}


.video_grid_wrapper,
.video_grid_wrapper * {
  animation: none !important;
  transition: none !important;
}

.video_grid_wrapper,
a.video_card,
.ldt-clean-player {
  background: #000 !important;
}

/* Video Card */
.portfolio_classic_container.video_grid .video_card:hover .video_card__image {
  transform: unset;
}

/* Lock scroll when lightbox is open */
html.ldt-lock {
  overflow: hidden;
}

/* Portal root */
#ldt-portal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  pointer-events: none;
}

#ldt-portal .ldt-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .92);
  opacity: 0;
  transition: opacity .18s ease;
  display: grid;
  place-items: center;
  pointer-events: auto;
}

#ldt-portal.is-open .ldt-overlay {
  opacity: 1;
}

/* Frame */
#ldt-portal .ldt-frame {
  width: min(92vw, 1180px);
  background: #000;
  position: relative;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .5);
  border-radius: 0;
}

#ldt-portal .ldt-aspect {
  padding-top: 56.25%;
}

/* 16:9 */
#ldt-portal .ldt-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: #000;
  border-radius: 0;
}

/* Simple close button */
#ldt-portal .ldt-close {
  position: fixed;
  top: 14px;
  right: 14px;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .70);
  color: #fff;
  font-size: 26px;
  line-height: 1;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .15s ease;
  outline: none;
}

#ldt-portal .ldt-close:hover {
  color: #454545;
  background: rgba(255, 255, 255, 1);
}

#ldt-portal .ldt-close:focus {
  outline: none;
}


/* Prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  #ldt-portal .ldt-overlay {
    transition: none;
  }
}

/* Hide portal fully when not open */
#ldt-portal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  pointer-events: none;
  display: none;
}

#ldt-portal.is-open {
  display: block;
}

#ldt-portal:not(.is-open) .ldt-overlay {
  pointer-events: none;
}

/* Reduce radius on very small screens */
@media (max-width: 600px) {

  #ldt-portal .ldt-frame,
  #ldt-portal .ldt-iframe {
    border-radius: 0;
  }
}

/* Hide portal fully when not open */
#ldt-portal {
  display: none;
}

#ldt-portal.is-open {
  display: block;
}

/* Belt and braces so the backdrop never traps clicks when closed */
#ldt-portal:not(.is-open) .ldt-overlay {
  pointer-events: none;
}

/* History */
.swiper-button-prev span.ti-angle-up,
.swiper-button-next span.ti-angle-down {
  display: none;
}

/* Layout */
.tg_background_list_title h3 {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  line-height: 1.1;
}

/* Stop the old mask box */
.tg_background_list_title h3::before {
  content: none;
}

/* Shared FA icon look */
.tg_background_list_column .tg_background_list_title h3::before {
  font-size: 1.25em;
  line-height: 1;
  margin-right: .5rem;
  display: inline-block;
  vertical-align: middle;
}

/* Facebook */
.tg_background_list_column.has-facebook .tg_background_list_title h3::before {
  font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands";
  /* FA6: facebook-f = \f39e. FA5 fallback: \f09a */
  content: "\f39e";
  font-weight: 400;
}

.tg_background_list_column.has-facebook .tg_background_list_title h3::before:where(:not(:empty)) {}

/* If the icon does not show, try changing the content to "\f09a" */

/* YouTube */
.tg_background_list_column.has-youtube .tg_background_list_title h3::before {
  font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands";
  content: "\f167";
  /* works in FA5 and FA6 */
  font-weight: 400;
}

/* Instagram */
.tg_background_list_column.has-instagram .tg_background_list_title h3::before {
  font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands";
  content: "\f16d";
  /* works in FA5 and FA6 */
  font-weight: 400;
}

/* Twitter or X */
.tg_background_list_column.has-x .tg_background_list_title h3::before {
  font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands";
  /* FA6 X logo = \e61b. FA5 fallback is the bird = \f099 */
  content: "\e61b";
  font-weight: 400;
}

/* If you only have FA5, change the content above to "\f099" */

/* TikTok */
.tg_background_list_column.has-tiktok .tg_background_list_title h3::before {
  font-family: "Font Awesome 6 Brands";
  content: "\e07b";
  /* FA6 only */
  font-weight: 400;
}


/* Social Slides */
.tg_background_list_wrapper .tg_background_list_content div.tg_background_list_link a.button {
  padding: 9px 20px;
}

.tg_background_img.hover .tg_background_list_content {
  overflow-y: hidden !important;
}

/* Social slides: clamp overflow on mobile */
@media (max-width: 767px) {
  .tg_background_list_wrapper .tg_background_list_column .tg_background_list_content {
    padding: 20px 20px 30px;
  }

  .tg_background_list_wrapper {
    position: relative;
    overflow-y: hidden;
  }

  .tg_background_list_wrapper .tg_background_list_column,
  .tg_background_list_wrapper figure.tg_background_img {
    overflow-y: hidden;
    margin: 0;
  }

  .tg_background_list_wrapper .tg_background_img img {
    display: block;
    max-width: 100%;
    height: auto;
  }

  /* Stop hover zoom or nudge from adding extra pixels on mobile */
  .tg_background_list_wrapper .tg_background_img:hover img,
  .tg_background_list_wrapper .tg_background_list_column:hover {
    transform: none !important;
  }
}


/* Make the video grid use flex so it reflows with no gaps */
.portfolio_classic_content_wrapper.video_grid.portfolio_classic {
  display: flex;
  flex-wrap: wrap;
  column-gap: 30px;
  row-gap: 50px;
}

.portfolio_classic_content_wrapper.video_grid .portfolio_classic_grid_wrapper {
  float: none !important;
  margin: 0 !important;
  /* 3 columns desktop */
  flex: 0 0 calc((100% - 2 * 30px) / 3);
}

@media (max-width: 1023px) {

  /* 2 columns tablet */
  .portfolio_classic_content_wrapper.video_grid .portfolio_classic_grid_wrapper {
    flex: 0 0 calc((100% - 30px) / 2);
  }
}

@media (max-width: 767px) {

  /* 1 column mobile */
  .portfolio_classic_content_wrapper.video_grid .portfolio_classic_grid_wrapper {
    flex: 0 0 100%;
  }
}

/* old float helper is no longer needed */
.portfolio_classic_content_wrapper.video_grid .portfolio_classic_grid_wrapper.last {
  margin-right: 0 !important;
}

/* 2) Pure CSS filtering using :has to remove non-matches from layout */
.portfolio_classic_container:has(.filter_tag_btn[data-rel="music-video"].active) .portfolio_classic_grid_wrapper:not(.music-video) {
  display: none !important;
}

.portfolio_classic_container:has(.filter_tag_btn[data-rel="concert"].active) .portfolio_classic_grid_wrapper:not(.concert) {
  display: none !important;
}

/* when All is active show everything */
.portfolio_classic_container:has(.filter_tag_btn[data-rel="all"].active) .portfolio_classic_grid_wrapper {
  display: block !important;
}


.slideshow__nav button#prev-slide {
    display: none !important;
}

/* Hide the existing SVG inside the button */
#next-slide .icon {
  display: none !important;
}

/* Add your custom arrow image instead */
#next-slide {
  position: relative;
  width: 150px;   /* adjust as needed */
  height: 30px;  /* adjust as needed */
  background: url('/wp-content/themes/musico-child/images/arrow-next-dolls.svg') no-repeat center center;
  background-size: contain;
  border: none; /* keep it clean */
  padding: 0;
}


@media (max-width: 767px) {
  .js .tg_multi_layouts_slider_wrapper.slideshow {
    max-height: 380px !important;
    height: 380px !important;
  }
  .tg_multi_layouts_slider_wrapper .slide-imgwrap {
    position: relative !important;
    top: 0 !important;
    /* override the inline top:-200px */
    left: 0 !important;
    transform: none !important;
    margin-bottom: -20px;
    margin-top: -150px;
  }
  .tg_multi_layouts_slider_wrapper .slide--layout-6 .slide__img {
    width: 60%;
    padding-bottom: 60%;
  }
  .tg_multi_layouts_slider_wrapper .slide__title {
    position: relative !important;
    transform: none !important;
    padding: 0.5em 0 !important;
    width: 100% !important;
    margin-bottom: 32px;
    ;
  }
  .tg_multi_layouts_slider_wrapper .slide__title-sub {
    font-size: 1em;
  }
  /* make each slider a positioning context */
  .tg_multi_layouts_slider_wrapper {
    position: relative;
  }
  /* arrows bar overlays the slide */
  .tg_multi_layouts_slider_wrapper .slideshow__nav--arrows {
    top: 100%;
  }
  .tg_multi_layouts_slider_wrapper .slideshow__nav--arrows button#prev-slide {
    display: none;
  }
}

/* Stack logo block, menu list, and bottom block vertically in the mobile drawer */
.mobile_menu_wrapper .mobile_menu_content {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
}

/* Ensure each block behaves like a full-width row */
.mobile_menu_wrapper ul.mobile_main_nav {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.mobile-social {
    margin-left: -7px;
}

.mobile-social a {
    margin: 0 7px;
}

.mobile-social a i {
  font-size: 1.2em;
}


/* Password Protected Page Style */

.post-password-form p {
  display: flex;
  align-items: center;   /* vertical centering */
  gap: 10px;             /* space between label and input */
}

.post-password-form label {
  float: none;           /* override theme float */
  margin: 0;             /* reset margin */
}


body.tmc-protected {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 30px;
  box-sizing: border-box;
  background: #fff;
}

body.tmc-protected .post-password-form {
  max-width: 600px;
  margin: 0 auto;
  width: 100%;
}


/* Ensure only the form stays visible */
body.tmc-protected .inner,
body.tmc-protected .inner_wrapper,
body.tmc-protected .sidebar_content {
  width: 100%;
  max-width: 500px;          /* limit form width */
  margin: 0 auto;
}


body.tmc-protected .elementor-location-header,
body.tmc-protected .elementor-location-footer,
body.tmc-protected #menu_wrapper,
body.tmc-protected .header_style_wrapper,
body.tmc-protected .footer_bar,
body.tmc-protected #footer,
body.tmc-protected .page_title_wrapper {
  display: none !important;
}

body.tmc-protected .inner_wrapper { padding-top: 40px; }
body.tmc-protected { background: #fff; }