<?php defined('ABSPATH') || exit; ?>

<!-- ANNOUNCEMENT -->
<div class="lux-announcement">
  Free delivery on orders above $90
</div>

<!-- HEADER -->
<header class="lux-header">
  <div class="lux-header-inner">

    <!-- LEFT -->
    <div class="lux-left">
      <button class="lux-btn lux-menu-toggle" aria-label="Menu">
        <svg viewBox="0 0 24 24"><path d="M4 6h16M4 12h16M4 18h16"/></svg>
      </button>

      <button class="lux-btn lux-search-toggle" aria-label="Search">
        <svg viewBox="0 0 24 24">
          <circle cx="11" cy="11" r="7"/>
          <line x1="21" y1="21" x2="16.5" y2="16.5"/>
        </svg>
      </button>
    </div>

    <!-- LOGO -->
    <a href="<?php echo esc_url(home_url('/')); ?>" class="lux-logo">OTCHERA</a>

    <!-- RIGHT -->
    <div class="lux-right">
      <a href="<?php echo esc_url(wc_get_cart_url()); ?>" class="lux-btn lux-cart">
        <svg viewBox="0 0 24 24">
          <path d="M6 6h15l-2 10H8z"/>
          <circle cx="9" cy="20" r="1"/>
          <circle cx="18" cy="20" r="1"/>
        </svg>
        <span class="lux-cart-count">
          <?php echo WC()->cart->get_cart_contents_count(); ?>
        </span>
      </a>

      <a href="<?php echo esc_url(site_url('/wishlist')); ?>" class="lux-btn">
        <svg viewBox="0 0 24 24"><path d="M12 21s-7-4.4-7-10a4 4 0 018-2 4 4 0 018 2c0 5.6-7 10-7 10z"/></svg>
      </a>

      <a href="<?php echo esc_url(wc_get_page_permalink('myaccount')); ?>" class="lux-btn">
        <svg viewBox="0 0 24 24"><circle cx="12" cy="8" r="4"/><path d="M4 22c0-4 4-6 8-6s8 2 8 6"/></svg>
      </a>
    </div>

  </div>
</header>

<div class="lux-overlay"></div>

<!-- MENU -->
<aside class="lux-menu">

  <button class="lux-menu-close">✕ close</button>

  <div class="lux-menu-actions">
    <a href="<?php echo esc_url(wc_get_page_permalink('myaccount')); ?>">Account</a>
    <a href="<?php echo esc_url(site_url('/wishlist')); ?>">Wishlist</a>
    <a href="<?php echo esc_url(wc_get_cart_url()); ?>">Cart</a>
  </div>

  <!-- SEARCH -->
  <div class="lux-menu-search">
    <?php get_search_form(); ?>
  </div>

  <!-- CATEGORIES -->
  <div class="lux-menu-cats">
    <h4>Categories</h4>
    <ul>
      <?php
      $parents = get_terms([
        'taxonomy' => 'product_cat',
        'hide_empty' => true,
        'parent' => 0
      ]);

      foreach ($parents as $parent):
        $children = get_terms([
          'taxonomy' => 'product_cat',
          'hide_empty' => true,
          'parent' => $parent->term_id
        ]);
      ?>
      <li class="lux-cat">
        <button class="lux-cat-toggle">
          <span><?php echo esc_html($parent->name); ?></span>
          <?php if ($children): ?><i></i><?php endif; ?>
        </button>

        <?php if ($children): ?>
        <ul class="lux-sub">
          <?php foreach ($children as $child): ?>
          <li>
            <a href="<?php echo esc_url(get_term_link($child)); ?>">
              <?php echo esc_html($child->name); ?>
            </a>
          </li>
          <?php endforeach; ?>
        </ul>
        <?php endif; ?>
      </li>
      <?php endforeach; ?>
    </ul>
  </div>

  <div class="lux-contact">
    <a href="/contact">Contact us</a>
  </div>

  <div class="lux-menu-footer">
    <div class="lux-socials">
      <a href="#">Instagram</a>
      <a href="#">Facebook</a>
      <a href="#">TikTok</a>
    </div>
    <div class="lux-footer-logo">OTCHERA</div>
  </div>

</aside>

/* ANNOUNCEMENT */
.lux-announcement{
  position:fixed;top:0;width:100%;height:28px;
  background:#000;color:#fff;
  text-align:center;line-height:28px;
  font-size:12px;z-index:1000;
}

/* HEADER */
.lux-header{
  position:fixed;top:28px;width:100%;height:60px;
  background:#fffcfb;z-index:999;
  transition:transform .35s ease,background .35s ease;
}
.home .lux-header{background:transparent;}
.lux-header.scrolled{background:#fff;}
.lux-header.hide{transform:translateY(-100%);}

.lux-header-inner{
  height:60px;display:flex;align-items:center;
  justify-content:space-between;padding:0 20px;
  position:relative;
}

/* LOGO */
.lux-logo{
  position:absolute;left:50%;
  transform:translateX(-50%);
  font-size:22px;font-weight:500;
  text-decoration:none;color:#000;
}

/* ICONS */
.lux-left,.lux-right{display:flex;gap:14px;}
.lux-btn{background:none;border:none;cursor:pointer;padding:0;}
.lux-header svg{
  width:20px;height:20px;
  stroke:#000;fill:none;stroke-width:1.5;
}

/* OVERLAY */
.lux-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.4);
  opacity:0;pointer-events:none;
  transition:.3s;z-index:1100;
}
.lux-overlay.active{opacity:1;pointer-events:auto;}

/* MENU */
.lux-menu{
  position:fixed;top:0;left:0;height:100%;
  width:100%;max-width:420px;
  background:#fff;padding:24px;
  transform:translateX(-100%);
  transition:.35s ease;z-index:1200;
  overflow-y:auto;
}
.lux-menu.active{transform:translateX(0);}

/* MENU ACTIONS */
.lux-menu-actions{
  display:flex;justify-content:center;
  gap:12px;margin:20px 0;
}
.lux-menu-actions a{
  padding:8px 14px;border:1px solid #ddd;
  border-radius:20px;font-size:13px;
}

/* SEARCH */
.lux-menu-search input{
  width:100%;padding:10px;border:1px solid #ddd;
}

/* CATEGORIES */
.lux-menu-cats ul{list-style:none;padding:0;}
.lux-cat-toggle,
.lux-sub-toggle{
  width:100%;display:flex;
  justify-content:space-between;
  padding:12px 0;border:none;
  background:none;font-size:14px;
  cursor:pointer;
}

.lux-cat-toggle i,
.lux-sub-toggle i{
  width:10px;height:10px;
  border-right:1.5px solid #000;
  border-bottom:1.5px solid #000;
  transform:rotate(45deg);
  transition:.25s;
}

.lux-cat.open > .lux-cat-toggle i,
.lux-sub-cat.open > .lux-sub-toggle i{
  transform:rotate(-135deg);
}

.lux-sub,
.lux-sub-sub{display:none;padding-left:14px;}

.lux-cat.open > .lux-sub{display:block;}
.lux-sub-cat.open > .lux-sub-sub{display:block;}

/* FOOTER */
.lux-menu-footer{text-align:center;margin-top:40px;}
.lux-socials{display:flex;justify-content:center;gap:16px;margin-bottom:12px;}

/* PAGE SPACING */
body:not(.home){padding-top:88px;}
/* CART COUNT */
.lux-cart {
  position: relative;
}

.lux-cart-count {
  position: absolute;
  top: -6px;
  right: -8px;
  min-width: 16px;
  height: 16px;
  background: #000;
  color: #fff;
  font-size: 10px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lux-cart-count:empty {
  display: none;
}

document.addEventListener('DOMContentLoaded', () => {

  const menu = document.querySelector('.lux-menu');
  const overlay = document.querySelector('.lux-overlay');
  const menuBtn = document.querySelector('.lux-menu-toggle');
  const searchBtn = document.querySelector('.lux-search-toggle');
  const closeBtn = document.querySelector('.lux-menu-close');
  const searchInput = document.querySelector('.lux-menu-search input');

  function openMenu(focusSearch = false) {
    menu.classList.add('active');
    overlay.classList.add('active');
    document.body.style.overflow = 'hidden';

    if (focusSearch && searchInput) {
      setTimeout(() => {
        searchInput.focus();
        searchInput.scrollIntoView({ behavior: 'smooth' });
      }, 200);
    }
  }

  function closeMenu() {
    menu.classList.remove('active');
    overlay.classList.remove('active');
    document.body.style.overflow = '';
  }

  menuBtn?.addEventListener('click', () => openMenu());
  searchBtn?.addEventListener('click', () => openMenu(true));
  closeBtn?.addEventListener('click', closeMenu);
  overlay?.addEventListener('click', closeMenu);

  document.addEventListener('click', e => {
    const toggle = e.target.closest('.lux-cat-toggle');
    if (toggle) {
      e.preventDefault();
      toggle.closest('.lux-cat').classList.toggle('open');
    }
  });

  /* HEADER SCROLL */
  const header = document.querySelector('.lux-header');
  let lastScroll = 0;

  window.addEventListener('scroll', () => {
    const current = window.pageYOffset;

    if (current > lastScroll && current > 120) {
      header.classList.add('hide');
    } else {
      header.classList.remove('hide');
    }

    if (document.body.classList.contains('home')) {
      header.classList.toggle('scrolled', current > 80);
    }

    lastScroll = current;
  });

});
0
Account
Wishlist
Cart

Categories

Contact Us

Sihlouette Tight 20

$35.00

Other colors

Bronz
Nero

Sizes

2
3
4
5
Our Client Advisors are delighted to assist you. Contact us at +1 800 929 3467

X-PRESS Shaping Tights are designed for the woman looking to instantly refine her silhouette. Featuring five strategic modelling belts, these tights provide targeted compression to slim and contour multiple areas of the body. The specialized structure offers tummy support and a subtle butt-lift, while a medium-pressure waistband defines the waistline and a dedicated compression zone slims the hips. Finished with an openwork weave for a seamless transition from torso to leg, they are the perfect foundation for pencil skirts and form-fitting dresses.

Composition

polyamide 77%, elastane 23%

Reviews

There are no reviews yet.

Be the first to review “Sihlouette Tight 20”

Your email address will not be published. Required fields are marked *

X-PRESS Shaping Tights are designed for the woman looking to instantly refine her silhouette. Featuring five strategic modelling belts, these tights provide targeted compression to slim and contour multiple areas of the body. The specialized structure offers tummy support and a subtle butt-lift, while a medium-pressure waistband defines the waistline and a dedicated compression zone slims the hips. Finished with an openwork weave for a seamless transition from torso to leg, they are the perfect foundation for pencil skirts and form-fitting dresses.

Composition

polyamide 77%, elastane 23%

Reviews

There are no reviews yet.

Be the first to review “Sihlouette Tight 20”

Your email address will not be published. Required fields are marked *

Login

To access your account

Privacy statement
Sign in with email
I forgot my password

Don't have an account yet?

Sign up now