/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/


.elementor-alert-danger {
    color: red;
    font-size: 1.5em;
}

        
span.sold { left: 47% !important; bottom: 6px; }

.wcl-progress-meter {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

span.sold {
  margin-left: -1.4em !important;
}

@keyframes animate {
  0% {
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    transform: translateY(-1000px) rotate(720deg);
    opacity: 0;
  }
}

.background-imgs li {
  position: absolute !important;
  display: block !important;
  list-style: none !important;
  width: 95px !important;
  height: 95px !important;
  background-image: url('https://jackpotzcompetitions.com/wp-content/uploads/Jackpotz-Competitions-Logos-1.webp') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: transparent !important;
  animation: animate 15s linear infinite !important;
  opacity: 0.5 !important;
}

/* Positions */
.background-imgs li.img1 {
  left: 10% !important;
  width: 110px !important;
  height: 110px !important;
  bottom: -110px !important;
  animation-delay: 3s !important;
}
.background-imgs li.img2 {
  left: 35% !important;
  width: 85px !important;
  height: 85px !important;
  bottom: -85px !important;
  animation-delay: 4s !important;
}
.background-imgs li.img3 {
  left: 65% !important;
  width: 95px !important;
  height: 95px !important;
  bottom: -95px !important;
  animation-delay: 6s !important;
}
.background-imgs li.img4 {
  left: 20% !important;
  width: 105px !important;
  height: 105px !important;
  bottom: -105px !important;
  animation-delay: 1s !important;
}
.background-imgs li.img5 {
  left: 50% !important;
  width: 115px !important;
  height: 115px !important;
  bottom: -115px !important;
  animation-delay: 8s !important;
}
.background-imgs li.img6 {
  left: 75% !important;
  width: 90px !important;
  height: 90px !important;
  bottom: -90px !important;
  animation-delay: 3s !important;
}
.background-imgs li.img7 {
  left: 5% !important;
  width: 100px !important;
  height: 100px !important;
  bottom: -100px !important;
  animation-delay: 5s !important;
}
.background-imgs {
  position: fixed !important;
  width: 100vw !important;
  height: 100vh !important;
  top: 0 !important;
  left: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
  z-index: 0 !important;
  pointer-events: none !important;
}



@media (max-width: 768px) {
  #customer_login.u-columns {
    display: flex !important;
    flex-direction: column !important;
  }

  #customer_login .u-column1 {
    order: 2 !important; /* Login second */
  }

  #customer_login .u-column2 {
    order: 1 !important; /* Register first */
  }
}

.animated-gradient {
  display: inline-block !important;
  background: radial-gradient(circle, #fffba3, #fff066, #ffd700, #ffffcc, #fffba3) !important;
  background-size: 300% 300% !important;
  background-position: 0% 50% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: swirlGradient 6s ease-in-out infinite !important;
  font-weight: bold !important;
}

@keyframes swirlGradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.elementor-widget-icon-box a:after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
}
.elementor-icon-box-icon {
  z-index: 2 !important;
}

.elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce a {
  color: #000000 !important;
}

@media (max-width: 768px) {
  .my-instant-wins-wrapper .woocommerce-orders-table__cell_prize a {
    margin-right: -80px !important;
    display: block !important;
  }
}

.wc-item-meta.instant-winn {
  font-weight: bold !important;
  font-size: 1.3rem !important; /* merged sizes into one */
  background: linear-gradient(
    90deg,
    #1a1a1a 0%,
    #333 25%,
    #999 50%,
    #333 75%,
    #1a1a1a 100%
  ) !important;
  background-size: 400% 100% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: dark-shimmer 6.8s linear infinite !important;
}

a[href*="order_again"] {
  display: none !important;
}

.elementor-icon-list-icon i.fab.fa-whatsapp::before {
  content: "\f232" !important; /* WhatsApp icon */
  font-family: "Font Awesome 5 Brands" !important;
  font-weight: 900 !important;
  background: linear-gradient(
    90deg,
    #128C7E,
    #25D366,
    #DCF8C6,
    #25D366,
    #128C7E
  ) !important;
  background-size: 300% 300% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: whatsapp-green-glow 3s ease-in-out infinite !important;
  display: inline-block !important;
}

/* remove tap/click highlight on mobiles */
* { -webkit-tap-highlight-color: rgba(0,0,0,0) !important; }

/* keep it off for the common tappable bits */
a, button, img, [role="button"] { -webkit-tap-highlight-color: rgba(0,0,0,0) !important; }



.elementor-37 .elementor-element.elementor-element-fdaf937 #elementor-menu-cart__toggle_button {
  --toggle-button-background-color: transparent !important;
}

.elementor-37 .elementor-element.elementor-element-fdaf937 .elementor-menu-cart__toggle .elementor-button,
.elementor-37 .elementor-element.elementor-element-fdaf937 .elementor-menu-cart__toggle .elementor-button:hover,
.elementor-37 .elementor-element.elementor-element-fdaf937 .elementor-menu-cart__toggle .elementor-button:focus,
.elementor-37 .elementor-element.elementor-element-fdaf937 .elementor-menu-cart__toggle .elementor-button:active {
  background: none !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

#elementor-menu-cart__toggle_button .elementor-button-text,
#elementor-menu-cart__toggle_button .woocommerce-Price-amount,
#elementor-menu-cart__toggle_button .woocommerce-Price-amount bdi,
#elementor-menu-cart__toggle_button .elementor-button-icon {
  background: none !important;
  background-color: transparent !important;
}



/* 4) Beat the kit rule only for this one button — DISABLED
.elementor-kit-5 .elementor-element.elementor-element-fdaf937 #elementor-menu-cart__toggle_button.elementor-button {
  background: none !important;
  background-color: transparent !important;
}
*/

/* Keep text white on the button — DISABLED
#elementor-menu-cart__toggle_button,
#elementor-menu-cart__toggle_button .elementor-button-text,
#elementor-menu-cart__toggle_button .woocommerce-Price-amount,
#elementor-menu-cart__toggle_button .woocommerce-Price-amount bdi {
  color: #fff !important;
}
*/

.accordion__title-text {
    margin: 0 !important;
    margin-top: 3px !important; /* changed from -5px */
    background: #e5e5e5;
    text-align: center;
    font-size: 16px;
    padding: 2px 0;
    border-radius: 0 0 7px 7px; /* new rounded corners */
}

.prize-status {
    display: flex;
    padding: 5px 4px;
}



/* ================================
   Lion Animation Positioning Fix
   ================================ */

/* Default for desktop & tablet */
html body .lion-animation {
    position: absolute !important;
    top: -64px !important;   /* 15px higher than current */
    right: 20px !important;
    width: 80px !important;
    height: auto !important;
    z-index: 99 !important;
    animation: popIn 0.6s ease-out !important;
}

/* Adjustment for small screens (mobile) */
@media (max-width: 560px) {
    html body .lion-animation {
        top: -104px !important; /* push further up on mobile */
        right: 6px !important; /* optional: bring it in a little */
    }
}

section#order-details {
    margin-bottom: 45px;
}

.my-element {
    margin-bottom: 25px !important;
}



body.login h1.wp-login-logo a {
  background-image: url('https://jackpotzcompetitions.com/wp-content/uploads/Jackpotz-Competitions-GB.webp') !important;
  background-repeat: no-repeat !important;
  background-position: centre !important;
  background-size: contain !important;
  width: 260px !important;
  height: 260px !important;
  text-indent: -9999px !important;
  display: block !important;
}





/* Lottery answers – round corners properly */
ul.lottery-pn-answers li label {
    display: block !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* Selected state keeps rounded corners + green background */
ul.lottery-pn-answers li.selected label {
    background: #ffd958 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* ================================
   Marquee text (scrolling effect)
   ================================ */
.marquee {
  overflow: hidden;
  display: flex;
}

.marquee h3 {
  white-space: nowrap;
}




.remove-background, #elementor-menu-cart__toggle_button {
  background: none !important;
  background-color: transparent !important;
}





body.login h1.wp-login-logo a {
  background-image: url('https://jackpotzcompetitions.com/wp-content/uploads/Jackpotz-Competitions-GB.webp') !important;
  background-repeat: no-repeat !important;
  background-position: centre !important;
  background-size: contain !important;
  width: 260px !important;
  height: 260px !important;
  text-indent: -9999px !important;
  display: block !important;
}


/* FIX: Force Checkout Button Text to be Dark Grey */
.elementor-widget-woocommerce-menu-cart .elementor-button.elementor-button--checkout,
.elementor-widget-woocommerce-menu-cart .elementor-button.elementor-button--checkout span,
.elementor-widget-woocommerce-menu-cart .elementor-button.elementor-button--checkout .elementor-button-text {
    color: #333333 !important;
}

/* Ensure Hover state text is also Dark Grey */
.elementor-widget-woocommerce-menu-cart .elementor-button.elementor-button--checkout:hover,
.elementor-widget-woocommerce-menu-cart .elementor-button.elementor-button--checkout:hover span {
    color: #333333 !important;
}


.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--downloads{
  display: none !important;
}


/* Fix My Account tickets table order on mobile */
@media (max-width: 768px){
  .woocommerce-account .woocommerce-orders-table.shop_table_responsive{
    direction: ltr !important;
  }

  .woocommerce-account .woocommerce-orders-table.shop_table_responsive td{
    text-align: left !important;
  }

  .woocommerce-account .woocommerce-orders-table.shop_table_responsive td::before{
    float: left !important;
    text-align: left !important;
  }
}

/* Hide WooCommerce mobile table labels on My Account */
@media (max-width: 768px){
  .woocommerce-account 
  .woocommerce-orders-table.shop_table_responsive 
  td::before{
    display: none !important;
  }
}


/* Remove border just on My Account tickets table */
.woocommerce-account .woocommerce-orders-table.shop_table{
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.woocommerce-account .woocommerce-orders-table.shop_table th,
.woocommerce-account .woocommerce-orders-table.shop_table td{
  border: 0 !important;
}


/* Style Spending Limit + Lock buttons */
.woocommerce-MyAccount-content button.button {
    background-color: #222222 !important;
    color: #ffd958 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-weight: bold !important;
    margin-bottom: 20px !important;
}


/* Side cart: View basket button background */
.elementor-menu-cart__footer-buttons a.elementor-button--view-cart{
  background-color: #2f2f2f !important;
}

/* Style competition progress bar */
progress {
    width: 100%;
    height: 15px;
    border-radius: 9px;
    overflow: hidden; /* Important for rounded corners */
    background-color: #e9e6ed;

   
}

/* Chrome / Safari */
progress::-webkit-progress-bar {
    background-color: #e9e6ed;
    border-radius: 9px;
   
}

progress::-webkit-progress-value {
    border-radius: 9px;
    background-image: linear-gradient(
        79deg,
        var(--e-global-color-767a676) 0%,
        #FFDD6A 100%
    );
  
}

/* Firefox */
progress::-moz-progress-bar {
    border-radius: 9px;
    background-image: linear-gradient(
        79deg,
        var(--e-global-color-767a676) 0%,
        #FFDD6A 100%
    );
}

/* Make progress bar slimmer on mobile */
@media (max-width: 768px) {
    progress {
        height: 19px !important;
    }
}




.badges .badge:nth-child(3) {
    display: none !important;
}

select.orderby {
    display: none !important;
}

/* Jackpotz Luxury Button Shine Animation */

/* Apply to checkout, cart checkout, and Lucky Dip buttons */
#place_order,
.elementor-button--checkout,
.single_add_to_cart_button {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Shared stronger shine effect */
#place_order::before,
.elementor-button--checkout::before,
.single_add_to_cart_button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -170%;
    width: 55%;
    height: 100%;

    background: linear-gradient(
        115deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.08) 30%,
        rgba(255,255,255,0.35) 45%,
        rgba(255,255,255,0.85) 50%,
        rgba(255,255,255,0.35) 55%,
        rgba(255,255,255,0.08) 70%,
        rgba(255,255,255,0) 100%
    );

    transform: skewX(-22deg);
    filter: blur(1.5px);
    animation: smoothShine 9s ease-in-out infinite;
    pointer-events: none;
}

/* Shine movement */
@keyframes smoothShine {
    0% {
        left: -170%;
    }

    28% {
        left: 170%;
    }

    100% {
        left: 170%;
    }
}


/* ========================================
   POPUP BOX / MAIN MODAL
======================================== */
.alertable {
  background: #ffffff;
  border-radius: 18px;
  padding: 28px;
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.18);
  text-align: center;
}


/* ========================================
   DARK BACKGROUND OVERLAY BEHIND POPUP
======================================== */
.alertable-overlay {
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(3px);
}


/* ========================================
   MAIN MESSAGE TEXT
======================================== */
.alertable-message {
  margin-bottom: 22px;
  color: #383838;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 700;
  text-align: center;
}


/* ========================================
   INPUT FIELD
======================================== */
.alertable-input {
  width: 100%;
  border-radius: 12px;
  border: 2px solid #e5e5e5;
  background: #fafafa;
  font-size: 16px;
  color: #222222;
  padding: 14px;
  transition: all 0.2s ease;
  box-sizing: border-box;
}


/* ========================================
   INPUT FIELD WHEN CLICKED
======================================== */
.alertable-input:focus {
  outline: none;
  border-color: #F2C83B;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(242, 200, 59, 0.18);
}


/* ========================================
   BUTTON AREA
======================================== */
.alertable-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
}


/* ========================================
   MAIN CONFIRM / OK BUTTON
======================================== */
.alertable-ok {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  background: linear-gradient(180deg, #f7dc67 0%, #f2c83b 55%, #e7bb21 100%) !important;
  border: 2px solid #efd15b !important;
  color: #383838 !important;

  border-radius: 16px;

  /* easier to click */
  padding: 16px 50px;

  font-weight: 800;
  font-size: 16px;
  letter-spacing: 0.3px;
  line-height: 1;

  cursor: pointer;

  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.45),
    0 6px 18px rgba(242, 200, 59, 0.35);

  transition: all 0.2s ease;
}


/* ========================================
   MAIN CONFIRM / OK BUTTON HOVER EFFECT
======================================== */
.alertable-ok:hover {
  transform: translateY(-2px);
  filter: brightness(1.03);

  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.55),
    0 10px 22px rgba(242, 200, 59, 0.45);
}


/* ========================================
   CANCEL BUTTON
======================================== */
.alertable-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  background: linear-gradient(180deg, #f7dc67 0%, #f2c83b 55%, #e7bb21 100%);
  border: 2px solid #efd15b;
  color: #383838;

  border-radius: 16px;

  padding: 16px 34px;

  font-weight: 700;
  font-size: 15px;
  line-height: 1;

  cursor: pointer;

  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.45),
    0 6px 18px rgba(242, 200, 59, 0.25);

  transition: all 0.2s ease;
}


/* ========================================
   CANCEL BUTTON HOVER EFFECT
======================================== */
.alertable-cancel:hover {
  transform: translateY(-2px);
  filter: brightness(1.03);

  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.55),
    0 10px 22px rgba(242, 200, 59, 0.35);
}


/* ========================================
   MOBILE BUTTON SIZE
======================================== */
@media (max-width: 576px) {

  .alertable-ok,
  .alertable-cancel {
    width: 100%;
    max-width: 320px;
  }

}