/**
 * Woo Subcategory Indenter — Frontend styles
 * Makes subcategories visually indented and clearly subordinate.
 * Works with:
 *  - Classic widget: Product Categories
 *  - Gutenberg block: Product Categories List (wc-blocks)
 *  - Header menus (classic + Elementor)
 *  - Optional: category tiles styling
 */

/* ---------- 1) Widget "Product Categories" ---------- */
.widget_product_categories ul.children {
  margin-left: 16px;
  padding-left: 12px;
  border-left: 2px solid #e6eef5;
}
.widget_product_categories ul.children a {
  font-weight: 500;
  opacity: 0.95;
}
.widget_product_categories li.cat-parent > a::after {
  content: "\203A"; /* › */
  float: right;
  opacity: .6;
}

/* ---------- 2) Gutenberg/Woo Blocks: Product Categories List ---------- */
/* Indentation by depth */
.wc-block-product-categories-list .wc-block-product-categories-list--depth-1 { margin-left: 16px; }
.wc-block-product-categories-list .wc-block-product-categories-list--depth-2 { margin-left: 32px; }
.wc-block-product-categories-list .wc-block-product-categories-list--depth-3 { margin-left: 48px; }
.wc-block-product-categories-list .wc-block-product-categories-list__item .wc-block-product-categories-list--children {
  border-left: 2px solid #e6eef5;
  padding-left: 12px;
}

/* ---------- 3) Header menu (classic WP menus) ---------- */
.main-navigation .sub-menu,
.menu .sub-menu {
  margin-left: 14px;
  border-left: 2px solid #e6eef5;
  padding-left: 12px;
}
.menu .sub-menu a { font-size: 0.95em; opacity: .95; }

/* ---------- 3b) Elementor Nav Menu ---------- */
.elementor-nav-menu--dropdown .sub-menu,
.elementor-nav-menu .sub-menu {
  margin-left: 14px;
  border-left: 2px solid #e6eef5;
  padding-left: 12px;
}
.elementor-nav-menu .sub-menu .elementor-sub-item { font-size: 0.95em; opacity: .95; }

/* ---------- 4) Optional: tiles of subcategories on category pages ---------- */
.woocommerce ul.products li.product-category {
  border: 1px solid #eef3f8;
  border-radius: 10px;
  padding: 8px;
  transition: box-shadow .2s ease;
}
.woocommerce ul.products li.product-category:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
}
.woocommerce .product-category .woocommerce-loop-category__title { font-weight: 600; }

/* Safety: don't let borders show inside very tight sidebars */
.widget_product_categories ul.children { box-sizing: border-box; }