
/* 
  TRY2.css - Battle-tested fixes
  LAST TOUCHED: [2025-12-26]
  WARNING: DO NOT "CLEAN" THIS FILE
  EVERY LINE IS HERE FOR A REASON
*/

/* ============================================================
   1. THE SLIDER & BANNER (Locked: Swiping & Arrow Clicks)
   ============================================================ */



#tvmain-slider { height: auto !important; min-height: 0 !important; }

.tvcmsmain-slider-wrapper, .tv-main-slider, .owl-carousel, .owl-stage-outer {
    height: auto !important;
    max-height: 600px !important;
    overflow: hidden !important;
}

#tvmain-slider .owl-item img {
    width: 100% !important;
    height: auto !important;
    max-height: 600px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
}


/* THE ARROWS */
.tvmain-slider-next-pre-btn {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100% !important;
    max-width: 1600px !important;
    height: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.tvmain-slider-next-pre-btn a {
    pointer-events: auto !important;
    transition: color 0.3s ease !important;
}

.tvmain-slider-next-pre-btn a:hover {
    color: #d9c8b1 !important;
}

@media (max-width: 767px) {
    .tvmain-slider-next-pre-btn { display: none !important; }
}

/* BANNER GAPS */
.tvcmsmain-slider-wrapper { margin-bottom: 80px !important; padding-bottom: 0 !important; }
@media (max-width: 991px) {
    .tvcmsmain-slider-wrapper { margin-bottom: 20px !important; }
}


/* ============================================================
   3. THE FOOTER (Locked: Shrink & Social Alignment)
   ============================================================ */
.footer-container {
    background-color: #f1e7d8 !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-size: auto !important;
    min-height: auto !important;
    padding-top: 35px !important;
    width: 100% !important;
}

.footer-container a:hover {
    color: #f5f5f5 !important; /* Soft white/cream hover */
}

.footer-after {
    background-color: #d9c8b1 !important;
    padding: 15px 0 !important;
    width: 100% !important;
    display: block !important;
}

.tvcopylink.col-xl-6.col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    text-align: center !important;
    display: block !important;
}

.footer-container .block-social {
    padding-bottom: 25px !important;
    margin-top: -20px !important;
    top: -25px !important;
    position: relative !important;
}


/*Centering Sekite Mus for 1200+*/
.footer-container .container.tvfooter-logo-link-wrapper .block-social.tvcmsfooter-social-icon.col-xl-5.col-lg-12.col-md-12.col-sm-12,
.footer-container .block-social.tvcmsfooter-social-icon,
.block-social.tvcmsfooter-social-icon {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    display: block !important;
    top: 0 !important;
}

/* This targets the EXACT problematic screen range and enforces your size */
@media (min-width: 1281px) and (max-width: 1500px) {
    .block_newsletter .tvnewsletter-title {
        font-size: 30px !important;
    }
}
/* Smooth footer link hover (simple text transition) */
.footer-container a {
    /* soft color fade for hover, keeps keyboard/focus users in mind */
    transition: color 350ms ease, opacity 350ms ease !important;}


/* ========== MOBILE STYLES (Screen width <= 991px) ========== */
@media (max-width: 991px) {
    /* BG Image Container */
    .footer-container {
        background-size: cover !important;
        background-position: center top !important;
        background-repeat: no-repeat !important;
        height: 100% !important;
        /* width: crop !important; */ /* REMOVE THIS LINE */
        display: block !important;
    }
    
    /* Social Block */
    .footer-container .block-social {
        margin-top: 0px !important;
        padding-bottom: 20px !important;
    }
    
    /* Copyright Link */
    .tvcopylink.col-xl-6.col-md-6 {
        margin-bottom: 0 !important;
        margin-top: 0 !important;   
    }
}


/* ============================================================
   4. FACEBOOK FLOATING TAB 
   ============================================================ */
.floating-likebox, .floatfb, .fb-floating, .facebook-block, .fb-page, .abtlikebox, 
.tv-social-float, .tvblock-social-content, .tv-footer-social-icon-wrapper, 
.tvfacebook-wrapper, .social-sidebar {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: fixed !important;
    left: -60px !important;
    top: 50% !important;
    height: auto !important;
    transition: left 0.3s ease-in-out !important;
    overflow: visible !important;
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.2) !important;
}

.floating-likebox:hover, .floatfb:hover, .fb-floating:hover, .facebook-block:hover, 
.fb-page:hover, .abtlikebox:hover, .tv-social-float:hover, .tvblock-social-content:hover, 
.tv-footer-social-icon-wrapper:hover, .tvfacebook-wrapper:hover, .social-sidebar:hover {
    left: 0 !important;
}

@media (max-width: 768px), (min-resolution: 2dppx) {
    .floating-likebox, .floatfb, .fb-floating, .facebook-block, .fb-page, .abtlikebox, 
    .tv-social-float, .tvblock-social-content, .tv-footer-social-icon-wrapper, 
    .tvfacebook-wrapper, .social-sidebar {
        width: 250px !important;
        left: -200px !important;
        top: 60px !important;
    }
}



/* ============================================================
   5. HEADER & LOGO (Balanced Mobile/Tablet - Compromise)
   ============================================================ */

.tv-header-logo img,
.tvcms-header-logo-wrapper img  {
    max-width: 180px !important;
    height: auto !important;
    transform: scale(1.2) !important;
}

@media (min-width: 1350px){ .tv-header-logo img,
.tvcms-header-logo-wrapper img {
    margin-left: 40px  !important;
    
}
}
  
  @media (min-width: 992px) {
  .col-lg-2 {
      width: 19% !important;}
 
}


@media (max-width: 991px) {
    .tvcmsmobile-header-menu,
    .tvcmsmobile-header-logo-right-wrapper,
    .tvcmsmobile-header-search {
        display: flex !important;
        justify-content:  flex-end !important;
        height: auto !important; 
      
    }
    .tvcmsmobile-header-logo-right-wrapper .logo {
        max-width: 140px !important;
        margin-top: 0 !important;
        height: auto !important;
       
    }
    .tvcmsmain-slider-wrapper {
        margin-top: auto !important; 
        margin-bottom: 30px !important; 
    }
    .tvmobile-sliderbar-btn {
        display: flex !important;
        justify-content: flex-start !important;
        width: 100% !important;
    }
   
}


/* ============================================================
   6. WIDE SCREEN FIX (Prevent Stretching on 1920px+ Screens)
   ============================================================ */
@media (min-width: 1631px) {
    img.tv-img-responsive, .tvbanner-hover-wrapper img, img.tvmain-slider-img, .tvcmssliderofferbanners-one .tvimage-lazy {
        object-fit: contain !important;
    }
}

/* ============================================================
   7. SMALL PC/MOBILE FIX (Visos Prekes Tag)
   ============================================================ */
/* 1. This keeps it on one line */
.menu-subtitle {
    white-space: nowrap !important;
    position: absolute !important;
}

/* 2. This is the fix for the "flying off to the side" issue */
@media (max-width: 991px) {
    /* We target the parent link to make sure the tag stays with the text */
    .tvcmsmobile-header-menu ul li a {
        position: relative !important; 
        display: inline-block !important; /* Forces the 'anchor' to be only as wide as the text */
    }

    .menu-subtitle {
        font-size: 9px !important;
        padding: 0 5px !important;
        /* Position it relative to the TEXT, not the screen edge */
        left: 0 !important;   
        top: -12px !important; 
        right: auto !important; /* Kills that 'right: 4px' that was pulling it away */
        width: fit-content !important;
    }
}

.tvcmscategory-slider, .tvcmscustomer-services, .tvcmsmultibanners, .tvcmssingle-block, .tvcmstabcategory-product-slider, 
.tvcmsmain-video, .tvcmscategory-chain-slider, .tvcmstestimonial, .tvcmsblog-event, .tvcmstab-title-product, .tvcmsspecial-product, 
.tvcmsfeatured-product, .tvcmsbest-seller-product, .tvcmsnew-product, .tvcmssame-category-product, .tvcmscross-selling-product, 
.tvcmslike-product, .tvcmsadvance-block {
        margin-bottom: 80px !important;
}
 
/* ============================================================
   PRODUCT CARDS: LOWER THE ICON LINE + KEEP TRANSPARENCY
   ============================================================ */

/* 1. Force the image container to let go of the bottom */
.tvproduct-image {
    position: relative !important;
    margin-bottom: 0 !important;
    overflow: visible !important; /* This stops the 'cutting off' */
}

/* 2. Position the bar RELATIVE so it pushes text, but use TOP to shove it down */
.tvproduct-hover-btn {
    position: relative !important; 
    display: flex !important;
    justify-content: center !important;
    
    /* YOUR TRANSPARENT BAR - UNTOUCHED */
    background: rgba(255, 255, 255, 1) !important; 
    
    /* THE MOVER: Increase 'top' to shove it lower toward the price */
    top: 135px !important; 
    padding: 8px  !important;
    margin-bottom: 30px !important; /* Space to prevent it eating the Price/Title */
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    bottom:  auto !important;
    
}
.tvproduct-info-box-wrapper {
    transition: transform 0.4s ease !important;
}

/* 3. Shift the Name/Price down so the icons don't sit on their head */
.tvproduct-info-box-wrapper {
    padding-top: 30px !important; /* Creates a 'landing zone' for the icons */
    margin-bottom: 2px !important;
}
/* ============================================================
   MOBILE VERSION: NO MASSIVE GAPS
   ============================================================ */
@media (max-width: 991px) {
    .tvproduct-hover-btn {
        position: relative !important;
        display: flex !important;
        justify-content: center !important;
        background: rgba(255, 255, 255, 1) !important;
        
        /* Mobile doesn't get the 125px shove */
        top: 5px !important; 
        
        padding: 5px 0 !important;
        margin-bottom: 10px !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
      
    }

    .tvproduct-info-box-wrapper {
        padding-top: 10px !important; /* No more giant gap on mobile */
    }
}
  /* Move the Stars Down */
    .tvproduct-item-star {
        margin-top: 10px !important; /* Shove them down to make room */
        transition: transform 0.4s ease !important;
    }

    /* Push text down when icons slide in so it isn't cramped */
    .tvproduct-wrapper:hover .tvproduct-info-box-wrapper {
        transform: translateY(10px) !important;
    }

    /* Push text down when icons slide in so it isn't cramped */
    @media (max-width: 991px) {
        .tvproduct-wrapper:hover .tvproduct-info-box-wrapper {
        transform: none !important;
        }}

/*GALLERY SCROLLBAR SIMPLE FIX*/
#product-modal .js-modal-mask {
    max-height: 600px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 10px !important;
}

#product-modal .thumb-container {
    margin-bottom: 15px !important;
}

/*CATEGORY PAGE*/
@media (min-width: 1631px) {
  img.tv-img-responsive, .tvbanner-hover-wrapper img, img.tvmain-slider-img, .tvcmssliderofferbanners-one .tvimage-lazy {
    object-fit: contain;
  }
}

/*CATEGORY BLOCK*/

@media (min-width: 768px) {
    .block-category.tv-category-block-wrapper {
        display: grid !important;
        grid-template-columns: 1fr 250px !important; /* Bump to 250px */
        grid-template-areas: 
            "title image"
            "description image" !important;
        gap: 15px 30px !important;
        align-items: start !important;
        padding: 10px 30px !important; /* Reduce top/bottom padding */
    }

    .tv-category-cover {
        grid-area: image !important;
        width: 250px !important; /* Match grid column */
        height: 250px !important; /* Square looks more intentional */
        overflow: hidden !important;
    }

    .tv-category-cover img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        margin: 0 !important;
    }

    .tv-all-page-main-title-wrapper {
        grid-area: title !important;
        align-self: end !important;
    }

    .tv-all-page-main-title {
        /*font-size: 28px !important; Remove if you don't want bigger */
        margin-bottom: 0 !important;
    }

    #category-description {
        grid-area: description !important;
        align-self: start !important;
        margin-top: 0 !important;
    }
}

/* Icon small screen cut off fix */
.tvall-product-wrapper-info-box {
    padding: 5px 5px !important;
}


/* ============================================================
   FIX THE INVISIBLE WALL WITHOUT TOUCHING POINTER-EVENTS
   ============================================================ */
/* ONLY FOR TABLET (992px-1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
    #left-column.tv-left-right-panel-hide:not(.open) {
        display: none !important;
    }
}

/* Remove The Theme Configurator Icons */
.tvtheme-control, 
.tvtheme-control-wrapper, 
.tvtheme-control-icon,
.tvtheme-layout-icon,
.tvtheme-layout-wrapper
{
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* 1. TARGET THE CORRECT WRAPPER AND ALL CHILD LINKS/LABELS */
.tvright-sticky-wrapper,
.tvright-sticky-wrapper a,
.tvright-sticky-wrapper span,
.tvright-sticky-wrapper div {
    /* Apply transition to the BASE so it works for both hover-in AND hover-out */
    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

/* 2. ENSURE THE LABELS SLIDE OUT GENTLY */
.tvright-sticky-wrapper a span {
    display: inline-block !important; /* Required for transform/width transitions to work */
    transition: all 0.5s ease-in-out !important;
}
/*Spacing fix */
.tvlowqty b:before {
    content: "! "; /* Adds colon + space before the number */
}
.tvinstock b:before {
    content: " "; /* Space after the number */
}
/* Fix ONLY the click blocking, don't touch your positioning */
.tvproduct-btn-color {
    pointer-events: none !important;
}

.tvproduct-btn-color > * {
    pointer-events: auto !important;
}