/******************************
 * SPELL WARD — MASTER CSS (UNIFIED)
 * Bez zásahu do layoutu, jen vzhled + robustní selektory
 ******************************/

/* ========== 1) PROMĚNNÉ (ponechány tvoje + aliasy) ========== */
:root{
  /* původní */
  --c-bg:#fff;
  --c-fg:#000;
  --shadow-sm:0 2px 10px rgba(0,0,0,.12);
  --shadow:0 6px 25px rgba(0,0,0,.18);
  --shadow-lg:0 8px 35px rgba(0,0,0,.25);
  --t:.25s;

  /* aliasy */
  --sw-bg:var(--c-bg);
  --sw-fg:var(--c-fg);
  --sw-muted:#f5f5f5;
  --sw-line:#e6e6e6;
  --sw-shadow-sm:var(--shadow-sm);
  --sw-shadow:var(--shadow);
  --sw-shadow-lg:var(--shadow-lg);
  --sw-t:var(--t);
}

/* ========== 2) HORNÍ MENU (nezměněn layout, jen vzhled) ========== */
.menu-helper,
.menu-helper .menu-level-1,
.menu-helper .menu-level-2,
ul[data-testid="headerMenuItems"]{
  background:var(--c-bg); color:var(--c-fg);
}

.menu-helper a,
a[data-testid="headerMenuItem"]{
  color:var(--c-fg); text-decoration:none;
  border-radius:6px; transition:all var(--t) ease;
}

/* Hover + aktivní (1. i 2. úroveň) */
.menu-helper .menu-level-1 > li:hover > a,
.menu-helper .menu-level-1 > li:focus-within > a,
.menu-helper .menu-level-2 > li:hover > a,
.menu-helper .menu-level-2 > li:focus-within > a,
.menu-helper .menu-level-2 > li > a:hover,
.menu-helper .menu-level-2 > li > a:focus-visible,
a[data-testid="headerMenuItem"]:hover,
a[data-testid="headerMenuItem"]:focus-visible,
.menu-helper li.active > a,
.menu-helper a.active{
  background:var(--c-fg) !important; color:#fff !important;
}

/* Šipka submenu */
.menu-helper .submenu-arrow{border-top-color:var(--c-fg);}
.menu-helper .menu-level-1 > li:hover > a .submenu-arrow,
.menu-helper .menu-level-1 > li:focus-within > a .submenu-arrow{border-top-color:#fff;}

/* „Více“ */
.menu-helper.visible[data-testid="hamburgerMenu"]{
  background:var(--c-bg); color:var(--c-fg);
  border-radius:10px; cursor:pointer; transition:all var(--t) ease;
}
.menu-helper.visible[data-testid="hamburgerMenu"]:hover,
.menu-helper.visible[data-testid="hamburgerMenu"]:focus-within,
.menu-helper.visible[data-testid="hamburgerMenu"][aria-expanded="true"]{
  background:var(--c-fg); color:#fff;
}

/* Dropdowny */
.menu-helper .menu-level-1 > li > ul.menu-level-2,
.menu-helper.visible[data-testid="hamburgerMenu"] ul.menu-level-2{
  background:#fff !important; border:1px solid var(--c-fg) !important;
  border-radius:12px !important; overflow:hidden !important; padding:6px 0 !important;
  box-shadow:var(--shadow) !important; clip-path:inset(0 round 12px);
}
.menu-helper .menu-level-2 > li > a{
  display:block; padding:10px 16px; color:var(--c-fg);
  border-radius:0; white-space:nowrap;
  transition:background .2s ease,color .2s ease,transform var(--t) ease;
}

/* Jemný lift */
.menu-helper .menu-level-1 > li > a{transition:all var(--t) ease; position:relative; z-index:1;}
.menu-helper .menu-level-1 > li:hover > a{transform:translateY(-2px); box-shadow:var(--shadow-lg);}
.menu-helper .menu-level-2 > li > a:hover{transform:translateY(-1px); box-shadow:var(--shadow);}

/* Horní lišta – stín */
.menu-helper{transition:all .3s ease; box-shadow:0 4px 20px rgba(0,0,0,.12);}

/* ========== 3) LEVÉ MENU – KATEGORIE (box-categories) ========== */
.box.box-bg-variant.box-categories,
.box.box-bg-variant.box-categories .box-content,
.box.box-bg-variant.box-categories .content,
.box.box-bg-variant.box-categories #categories,
.box.box-bg-variant.box-categories .categories,
.box.box-bg-variant.box-categories .topic{
  background:#000 !important; color:#fff !important;
}

.box-categories{
  background:#000; color:#fff; border-radius:10px;
  padding:22px 18px 22px 22px; overflow:hidden;
  box-shadow:var(--shadow); transition:all .3s ease;
}
.box-categories:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg);}
.box-categories h4{color:#fff; margin:10px 0 16px 10px;}
.box-categories ul{list-style:none; margin:0; padding:0;}

.box-categories #categories a,
.box-categories .categories a,
.box-categories .topic a{
  display:block; padding:10px 14px; color:#fff; text-decoration:none;
  border-radius:6px; transition:all var(--t) ease;
}

/* Hover + aktivní */
.box-categories #categories a:hover,
.box-categories #categories a:focus-visible,
.box-categories .categories a:hover,
.box-categories .categories a:focus-visible,
.box-categories .topic a:hover,
.box-categories .topic a:focus-visible,
.box-categories #categories li.active > a,
.box-categories .categories li.active > a,
.box-categories .topic li.active > a,
.box-categories #categories a.active,
.box-categories .categories a.active,
.box-categories .topic a.active{
  background:#fff !important; color:#000 !important;
  transform:translateY(-2px); box-shadow:var(--shadow-lg);
}

/* Vnoření + skrytí cat-triggeru */
.box-categories ul ul a{padding-left:24px !important;}
.box-categories .cat-trigger{display:none !important;}

/* ========== 4) TLAČÍTKA (globál) ========== */
.btn,.button,a.btn,a.button,button,input[type="submit"]{
  border-radius:10px !important; transition:all var(--t) ease;
  box-shadow:0 3px 10px rgba(0,0,0,.25);
}
.btn:hover,.button:hover,a.btn:hover,a.button:hover,button:hover,input[type="submit"]:hover{
  box-shadow:var(--shadow); transform:translateY(-1px);
}

/* ========== 5) PRODUKTOVÉ KARTY ========== */
.product,.product-item,.products-block .product{
  transition:all .3s ease; border-radius:10px; overflow:hidden;
  background:#fff; box-shadow:0 4px 20px rgba(0,0,0,.12);
}
.product:hover,.product-item:hover,.products-block .product:hover{
  transform:translateY(-4px); box-shadow:var(--shadow-lg);
}
.product img,.product-item img,.products-block .product img{transition:transform .3s ease;}
.product:hover img,.product-item:hover img,.products-block .product:hover img{transform:scale(1.05);}

/* ========== 6) SUBCATEGORIES KARTY ========== */
.subcategories.with-image{list-style:none; margin:0 -8px; padding:0;}
.subcategories.with-image > li{padding:8px;}
.subcategories.with-image > li > a{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  background:#fff; color:#000; text-decoration:none;
  border-radius:12px; padding:18px 14px; height:100%;
  box-shadow:0 4px 20px rgba(0,0,0,.12);
  transition:transform var(--t) ease, box-shadow var(--t) ease;
}
.subcategories.with-image > li > a .image{line-height:0;}
.subcategories.with-image > li > a .image img{max-width:100%; height:auto; transition:transform var(--t) ease;}
.subcategories.with-image > li > a .text{text-align:center; font-size:18px; line-height:1.35; margin-top:4px; color:#000;}
.subcategories.with-image > li > a:hover,
.subcategories.with-image > li > a:focus-visible{transform:translateY(-4px); box-shadow:var(--shadow-lg);}
.subcategories.with-image > li > a:hover .image img,
.subcategories.with-image > li > a:focus-visible .image img{transform:scale(1.05);}

/* ========== 7) OBSAH – PLNÁ ŠÍŘKA ========== */
#content-wrapper{
  max-width:100% !important; width:100% !important;
  margin:0 !important; padding:0 !important;
}

/* ========== 8) PROFILOVÉ MENU (client-center) ========== */
.sidebar .client-center-box{
  width:100%; box-sizing:border-box;
  background:#fff; padding:14px 18px; margin:10px 0 20px;
  border-radius:12px; box-shadow:var(--shadow-sm);
}
.client-center-box ul{list-style:none; margin:0; padding:0;}
.client-center-box ul li{margin:4px 0;}
.client-center-box ul li a{
  display:block; padding:10px 12px; color:#000; text-decoration:none;
  border-radius:8px; transition:all var(--t) ease;
}
.client-center-box ul li a:hover,
.client-center-box ul li.active a{background:#111; color:#fff;}
.client-center-box .logout a{
  display:inline-block; margin-top:6px; background:#000; color:#fff;
  border-radius:6px; padding:8px 12px; font-size:13px; text-align:center;
  transition:all var(--t) ease;
}
.client-center-box .logout a:hover{background:#333;}

/* ========== 9) AFFILIATE / CLIENT NAV (ROBUST) ========== */
/* Box (funguje v <aside>, v .sidebar-inner, i jako „volný“ .box) */
aside.sidebar[data-testid="sidebarMenu"] .box.box-sm.box-bg-variant,
.sidebar-inner .box.box-sm.box-bg-variant,
.box.box-sm.box-bg-variant{
  background:#fff; border:1px solid var(--sw-line);
  border-radius:12px; box-shadow:var(--sw-shadow-sm);
  padding:14px 18px; margin:10px 0 20px;
}

/* Seznam uvnitř boxu + „volně stojící“ UL poblíž panelu */
aside.sidebar[data-testid="sidebarMenu"] .box.box-sm.box-bg-variant > ul,
.sidebar-inner .box.box-sm.box-bg-variant > ul,
.box.box-sm.box-bg-variant > ul,
.sidebar-inner > ul,
aside.sidebar[data-testid="sidebarMenu"] > ul{
  list-style:none; margin:0; padding:0;
}

/* Položky (i když UL visí mimo box) */
aside.sidebar[data-testid="sidebarMenu"] .box.box-sm.box-bg-variant > ul > li,
.sidebar-inner .box.box-sm.box-bg-variant > ul > li,
.box.box-sm.box-bg-variant > ul > li,
.sidebar-inner > ul > li,
aside.sidebar[data-testid="sidebarMenu"] > ul > li{
  margin:4px 0; padding:0; border-bottom:1px solid #eee;
}
aside.sidebar[data-testid="sidebarMenu"] .box.box-sm.box-bg-variant > ul > li:last-child,
.sidebar-inner .box.box-sm.box-bg-variant > ul > li:last-child,
.box.box-sm.box-bg-variant > ul > li:last-child,
.sidebar-inner > ul > li:last-child,
aside.sidebar[data-testid="sidebarMenu"] > ul > li:last-child{
  border-bottom:0;
}

/* VŠECHNY odkazy s role="tab" v panelu (ať jsou v LI nebo visí samotné) */
aside.sidebar[data-testid="sidebarMenu"] a[role="tab"][data-toggle="tab"],
.sidebar-inner a[role="tab"][data-toggle="tab"],
.box.box-sm.box-bg-variant a[role="tab"][data-toggle="tab"],
/* fallback pro „volné“ odkazy vložené mimo box/ul: */
.sidebar-inner > a[role="tab"][data-toggle="tab"],
aside.sidebar[data-testid="sidebarMenu"] > a[role="tab"][data-toggle="tab"]{
  display:block; width:100%;
  padding:10px 12px; color:#000; text-decoration:none;
  border-radius:8px; transition:all var(--t) ease;
  font-size:15px; line-height:1.35; background:transparent; box-shadow:none; border:0;
}

/* Hover + aktivní stav (funguje, i když .active je na <li>) */
li.active > a[role="tab"][data-toggle="tab"],
aside.sidebar[data-testid="sidebarMenu"] a[role="tab"][data-toggle="tab"]:hover,
.sidebar-inner a[role="tab"][data-toggle="tab"]:hover,
.box.box-sm.box-bg-variant a[role="tab"][data-toggle="tab"]:hover,
.sidebar-inner > a[role="tab"][data-toggle="tab"]:hover,
aside.sidebar[data-testid="sidebarMenu"] > a[role="tab"][data-toggle="tab"]:hover,
aside.sidebar[data-testid="sidebarMenu"] a[role="tab"][data-toggle="tab"]:focus-visible,
.sidebar-inner a[role="tab"][data-toggle="tab"]:focus-visible,
.box.box-sm.box-bg-variant a[role="tab"][data-toggle="tab"]:focus-visible,
.sidebar-inner > a[role="tab"][data-toggle="tab"]:focus-visible,
aside.sidebar[data-testid="sidebarMenu"] > a[role="tab"][data-toggle="tab"]:focus-visible{
  background:#111 !important; color:#fff !important;
  transform:translateY(-1px); box-shadow:var(--shadow);
}

/* Zvýraznění jména ve strong (když je na aktivní kartě) */
li.active > a[role="tab"][data-toggle="tab"] strong{
  font-weight:700; font-size:16px;
}

/* Logout – sjednocený vzhled, přepis bootstrapu jen lokálně */
li.logout > a[data-testid="buttonSignout"],
.box.box-sm.box-bg-variant li.logout > a[data-testid="buttonSignout"],
.sidebar-inner .box.box-sm.box-bg-variant li.logout > a[data-testid="buttonSignout"],
aside.sidebar[data-testid="sidebarMenu"] li.logout > a[data-testid="buttonSignout"],
/* i kdyby byl „volně“ */
.sidebar-inner > a[data-testid="buttonSignout"],
aside.sidebar[data-testid="sidebarMenu"] > a[data-testid="buttonSignout"]{
  display:block; width:100%;
  margin-top:6px; background:#000; color:#fff !important;
  border-radius:8px; padding:8px 12px; font-size:13px; text-align:center;
  transition:all var(--t) ease; border:none !important; box-shadow:none !important;
  text-decoration:none !important;
}
li.logout > a[data-testid="buttonSignout"]:hover,
li.logout > a[data-testid="buttonSignout"]:focus-visible,
.sidebar-inner > a[data-testid="buttonSignout"]:hover,
aside.sidebar[data-testid="sidebarMenu"] > a[data-testid="buttonSignout"]:hover{
  background:#333; color:#fff !important;
}

/* ========== 10) TOP PRODUKTY – HOVER LIFT ========== */
.top-products li.display-image{transition:transform var(--t) ease, box-shadow var(--t) ease;}
.top-products li.display-image:hover{transform:translateY(-4px); box-shadow:0 8px 25px rgba(0,0,0,.15);}
.top-products li.display-image img{transition:transform .4s ease;}
.top-products li.display-image:hover img{transform:scale(1.05);}
.top-products-name,.top-products-content strong{transition:color var(--t) ease;}
.top-products li.display-image:hover .top-products-name{color:#111;}
.top-products li.display-image:hover .top-products-content strong{color:#000;}

/* ========== 11) DARK VARIANTA (přidej .sw-dark na <body>) ========== */
.sw-dark{
  --c-bg:#0e0e0e;
  --c-fg:#fff;
  --sw-bg:#0e0e0e;
  --sw-fg:#fff;
  --sw-muted:#161616;
  --sw-line:#222;
}
.sw-dark .menu-helper,
.sw-dark .menu-helper .menu-level-1,
.sw-dark .menu-helper .menu-level-2,
.sw-dark ul[data-testid="headerMenuItems"]{ background:#0e0e0e; color:#fff; }
.sw-dark a[data-testid="headerMenuItem"]{ color:#fff; }
.sw-dark .menu-helper .menu-level-1 > li > ul.menu-level-2{ background:#111 !important; border-color:#fff !important; }
.sw-dark .box-categories{ background:#000; color:#fff; }
.sw-dark .product,.sw-dark .product-item,.sw-dark .products-block .product{ background:#141414; }
.sw-dark .subcategories.with-image > li > a{ background:#141414; color:#fff; }
.sw-dark .client-center-box{ background:#141414; }
.sw-dark .client-center-box ul li a{ color:#eee; }
.sw-dark .client-center-box ul li a:hover,
.sw-dark .client-center-box ul li.active a{ background:#fff; color:#000; }
.sw-dark aside.sidebar[data-testid="sidebarMenu"] .box.box-sm.box-bg-variant,
.sw-dark .sidebar-inner .box.box-sm.box-bg-variant,
.sw-dark .box.box-sm.box-bg-variant{
  background:#141414; border-color:#222;
}
.sw-dark .box.box-sm.box-bg-variant > ul > li{ border-color:#1c1c1c; }

/* Tab odkazy v darku */
.sw-dark aside.sidebar[data-testid="sidebarMenu"] a[role="tab"][data-toggle="tab"],
.sw-dark .sidebar-inner a[role="tab"][data-toggle="tab"],
.sw-dark .box.box-sm.box-bg-variant a[role="tab"][data-toggle="tab"],
.sw-dark .sidebar-inner > a[role="tab"][data-toggle="tab"],
.sw-dark aside.sidebar[data-testid="sidebarMenu"] > a[role="tab"][data-toggle="tab"]{
  color:#eee;
}
.sw-dark li.active > a[role="tab"][data-toggle="tab"],
.sw-dark aside.sidebar[data-testid="sidebarMenu"] a[role="tab"][data-toggle="tab"]:hover,
.sw-dark .sidebar-inner a[role="tab"][data-toggle="tab"]:hover,
.sw-dark .box.box-sm.box-bg-variant a[role="tab"][data-toggle="tab"]:hover,
.sw-dark .sidebar-inner > a[role="tab"][data-toggle="tab"]:hover,
.sw-dark aside.sidebar[data-testid="sidebarMenu"] > a[role="tab"][data-toggle="tab"]:hover{
  background:#fff !important; color:#000 !important;
}

.sw-dark li.logout > a[data-testid="buttonSignout"],
.sw-dark .sidebar-inner > a[data-testid="buttonSignout"],
.sw-dark aside.sidebar[data-testid="sidebarMenu"] > a[data-testid="buttonSignout"]{
  background:#111; color:#ddd !important; border:none;
}
