/*
 Theme Name:   Holiday Travel Cruise Child
 Theme URI:    https://example.com/holiday-travel-cruise-child
 Description:  Child theme for Holiday Travel Cruise
 Author:       Oksana Mironova
 Template:     holiday-travel-cruise
 Version:      1.0.0
*/
/* Tokens */
/* Tokens */
:root {
  --accent: #00A8E8;
  --accent-2: #00A8E8; /* used for widget hover text */
  --accent-dark: #003459; /* gradient start */
  --bg-main: #050b23;
  --fontF-main:  "Inter", sans-serif;
}
body {
	background: var(--bg-main) !important;
	font-family: var(--fontF-main) !important;
}

/* #offcanvas-menu:not(.offcanvas-menu-active){ pointer-events:none; } */

#masthead {
    margin-bottom: 4em;
    position: sticky!important;
    top:0;
    left: 0;
    right: 0;
    z-index: 100;
}
.page-template-home-template .main-header {
    border-bottom: 0;
    position: sticky;
    top:0;
    left: 0;
    right: 0;
    z-index: 100;
}

/* header styles */
.main-header,
#top-banner {
	background: var(--bg-main);
}
.header-widgets .sidebar ul li a:hover { color: var(--accent); }
.site-navigation ul.primary-menu.theme-menu li a:hover, .site-navigation .menu > li > a:focus {
color: var(--accent) !important;
}
/* .site-navigation .primary-menu ul {
  background-color: var(--accent) !important;
} */
:where([style*="#24ACB4"], .main-navigation .sub-menu, .site-navigation .primary-menu ul) {
  background-color: var(--accent) !important;
}


/* Text color = accent */
a,
.article-box a,
#top-banner .banner-box h2 span,
.featured h6.main-heading,
.video-btn a:hover,
.video-btn a:hover i,
.header-widgets .sidebar ul li a:hover,
.sidebar ul li a:hover, #bestcruise-section .bestcruise-box:hover h4 a, #bestcruise-section .bestcruise-box:hover .bestcruise-icon  {
  color: var(--accent);
}
.postcat-name { color: var(--accent) !important; }

/* Widget hover (kept different) */
.widget a:hover,
.widget a:focus { color: var(--accent); }

/* Background = accent */
.search-form-main input.search-submit,
#top-banner .slide-btn a:hover,
.video-btn a i,
#top-banner form.wpcf7-form p input.wpcf7-form-control.wpcf7-submit,
#bestcruise-section .bestcruise-box a.read-btn:hover,
a.btn-text,
span.onsale,
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale,
.woocommerce .woocommerce-ordering select,
.woocommerce-account .woocommerce-MyAccount-navigation ul li,
/* .site-navigation .current_page_item > a,
.site-navigation .current-menu-item > a, */
.site-navigation .menu > li > a:hover,
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover,
.posts-navigation .nav-previous a:hover,
.posts-navigation .nav-next a:hover,
.navigation.pagination .nav-links a.current,
.navigation.pagination .nav-links a:hover,
.navigation.pagination .nav-links span.current,
.navigation.pagination .nav-links span:hover,
.comment-respond input#submit,
.sidebar h5,
.sidebar h2.wp-block-heading,
.sidebar .tagcloud a:hover,
p.wp-block-tag-cloud a:hover,
.pro-button a,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.added_to_cart,
a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained {
  background: var(--accent);
}
/*  back to top button */
#button {
	background: var(--bg-main);
}
#button:hover, #button:active {
	background: var(--accent);
}


/* Submenu background */
.main-navigation .sub-menu { background-color: var(--accent); }

/* Footer styles */
.site-footer#colophon { background: var(--bg-main); }
aside#pages ul li:hover { color: var(--accent); }
#colophon .widget a, .sidebar .wp-block-heading a {
	text-decoration: none;
}
#colophon a:hover, #colophon a:focus { color: var(--accent); }
.footer-column .widget ul li:hover {
/* 	color: #E3C2A0 !important; */
	color: var(--accent);
}

/* Borders / icons using accent */
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover,
.posts-navigation .nav-previous a:hover,
.posts-navigation .nav-next a:hover,
.navigation.pagination .nav-links a.current,
.navigation.pagination .nav-links a:hover,
.navigation.pagination .nav-links span.current,
.navigation.pagination .nav-links span:hover {
  border: 1px solid var(--accent);
}
.woocommerce-message,
.woocommerce-info { border-top-color: var(--accent); }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--accent); }

/* Gradient using tokens */
.module-border-wrap {
  -moz-border-image: -moz-linear-gradient(to bottom left, var(--accent-dark) 0%, var(--accent) 100%);
  -webkit-border-image: -webkit-linear-gradient(to bottom left, var(--accent-dark) 0%, var(--accent) 100%);
  border-image: linear-gradient(to bottom left, var(--accent-dark) 0%, var(--accent) 100%) 1;
}

/* Animation */
@keyframes loading {
  0%, 100% {
    transform: translateY(-2.5rem);
    background-color: var(--accent);
  }
  50% {
    transform: translateY(2.5rem);
    background-color: var(--accent);
  }
}

/* Mobile-only overrides */
@media screen and (max-width: 1000px) {
  .site-navigation .menu > li > a:hover,
  #site-navigation .menu ul li a:hover { color: var(--accent); }

  .toggle-nav i,
  .sidenav,
  .sidenav .closebtn { background: var(--accent); }
}

/*  mobile navigation*/

/* Overlay hidden by default; shown when .is-open */
  #offcanvas-menu {
    position: fixed;
    inset: 0;
    display: none;
    justify-content: flex-end;
    background: rgba(0, 0, 0, 0.8);
    z-index: 100000;
  }
  #offcanvas-menu.is-open { display: flex; }

  /* Sliding dark panel */
  #offcanvas-menu .offcanvas-wraper {
    background: #050b23;               /* dark background */
    color: #fff;                       /* light text */
    width: 80%;
    max-width: 420px;
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(100%);
    transition: transform 0.4s ease-in-out;
    padding: 20px;
  }
  #offcanvas-menu.is-open .offcanvas-wraper { transform: translateX(0);  }
/* #offcanvas-menu.is-open .offcanvas-wraper > *{ transform: translateX(0); opacity:1; } */
/* #offcanvas-menu .offcanvas-wraper > * {
  transform: translateX(30px);
  opacity: 0;
  transition: transform 0.4s ease, opacity 0.4s ease;
} */

  /* Menu basics */
  #offcanvas-menu .offcanvas-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  #offcanvas-menu .offcanvas-menu-list > li { display: block; }
  #offcanvas-menu .offcanvas-main-navigation a {
    display: block;
    padding: 14px 16px;
    text-decoration: none;
    color: #fff;                       /* light text on dark bg */
  }
  #offcanvas-menu .offcanvas-main-navigation a:hover,
  #offcanvas-menu .offcanvas-main-navigation a:focus {
    background: rgba(255, 255, 255, 0.08); /* subtle hover wash */
    color: var(--accent);                   /* accent highlight */
    outline: none;
  }

  /* Active/current items */
  #offcanvas-menu .offcanvas-main-navigation .current-menu-item > a,
  #offcanvas-menu .offcanvas-main-navigation .current_page_item > a,
  #offcanvas-menu .offcanvas-main-navigation li.submenu-toggle-active > a {
    color: var(--accent);
  }

  /* Submenus (tap to toggle in JS) */
  #offcanvas-menu .offcanvas-main-navigation .sub-menu {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 20px;
    border-left: 1px solid rgba(255, 255, 255, 0.15);
  }
  #offcanvas-menu .offcanvas-main-navigation li.submenu-toggle-active > .sub-menu {
    display: block;
  }

  /* Close button */
  #offcanvas-menu .button-offcanvas-close {
    background: var(--accent);
    color: #fff;
    border: none;
    padding: 6px 10px;
    cursor: pointer;
  }
#offcanvas-menu.is-open .offcanvas-wraper > *,
#offcanvas-menu.offcanvas-menu-active .offcanvas-wraper > * {
  opacity: 1;
  transform: translateX(0);
}
#offcanvas-menu:not(.is-open){ pointer-events:none; }