/* =======================================================
MEGA MENU – DEKORACNYKAMEN.SK
FULL CLEAN VERSION (bez duplicit, 100 % funkčné)
======================================================= */
/* -------------------------------------------------------
ZÁKLADNÁ KARTIČKA menu-level-2
------------------------------------------------------- */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li {
box-sizing: border-box;
background: #F7F3E8; /* natur béžová */
border-radius: 14px;
padding: 14px 10px 12px;
margin: 12px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.07);
display: flex !important;
flex-direction: column;
align-items: center !important;
justify-content: flex-start;
text-align: center !important;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
/* Hover efekt */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li:hover,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li:hover {
transform: translateY(-2px);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}
/* -------------------------------------------------------
OBRÁZKY
------------------------------------------------------- */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li .menu-image,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li .menu-image {
width: 100%;
display: flex !important;
justify-content: center !important;
align-items: center !important;
margin-bottom: 10px;
}
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li .menu-image img,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li .menu-image img {
max-width: 140px;
height: auto;
border-radius: 6px;
}
/* -------------------------------------------------------
TEXTY – názvy + popisy (menu-level-2)
------------------------------------------------------- */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li > div,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li > div {
width: 100%;
display: flex !important;
flex-direction: column;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
}
/* Hlavný názov kategórie */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li span:first-child,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li span:first-child {
font-size: 12px !important;
font-weight: 600 !important;
text-align: center !important;
max-width: 160px !important;
margin-bottom: 4px;
display: block;
}
/* Popisy – menšie 8px */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li > div span:not(:first-child),
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li > div span:not(:first-child) {
font-size: 8px !important;
line-height: 1.25 !important;
opacity: 0.8 !important;
max-width: 150px !important;
white-space: normal !important;
text-align: center !important;
margin: 0 auto !important;
padding: 0 !important;
display: block !important;
}
/* -------------------------------------------------------
SUBKATEGÓRIE – menu-level-3 (tie malé podkategórie)
------------------------------------------------------- */
nav#navigation ul.menu-level-3 > li > a {
font-size: 8px !important;
line-height: 1.25 !important;
text-align: center !important;
display: block !important;
opacity: 0.85 !important;
max-width: 150px !important;
margin: 0 auto !important;
padding: 0 !important;
white-space: normal !important;
}
/* -------------------------------------------------------
6 kolón
------------------------------------------------------- */
@media (min-width: 1200px) {
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li,
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li {
flex: 0 0 calc(100% / 6 - 24px) !important;
}
}
/* ================================
POPISY NA 10 PX
================================ */
nav#navigation ul.menu-level-2[aria-label="Produkty"] > li > div span:not(:first-child),
nav#navigation ul.menu-level-2[aria-label="Rozdelenie podľa"] > li > div span:not(:first-child) {
font-size: 10px !important;
line-height: 1.35 !important;
opacity: 0.85 !important;
max-width: 160px !important;
text-align: center !important;
margin: 0 auto !important;
white-space: normal !important;
}
/* ================================
PODKATEGÓRIE NA 10 PX
================================ */
nav#navigation ul.menu-level-3 > li > a {
font-size: 10px !important;
line-height: 1.35 !important;
opacity: 0.85 !important;
text-align: center !important;
display: block !important;
max-width: 160px !important;
margin: 0 auto !important;
white-space: normal !important;
}
/* ============================================
ODSTRÁNENIE CIAROK
============================================ */
nav#navigation ul.menu-level-3 > li::before,
nav#navigation ul.menu-level-3 > li::after {
content: "" !important;
display: none !important;
}
nav#navigation ul.menu-level-3 > li a::before,
nav#navigation ul.menu-level-3 > li a::after {
content: "" !important;
display: none !important;
}
nav#navigation ul.menu-level-3 {
list-style: none !important;
}
/* skrytie oddelovacích znakov */
nav#navigation ul.menu-level-3 > li {
font-size: 0 !important;
}
/* obnovíme font pre */
nav#navigation ul.menu-level-3 > li > a {
font-size: 10px !important;
line-height: 1.3 !important;
opacity: 0.9;
text-align: center !important;
max-width: 160px;
white-space: normal;
display: block;
margin: 0 auto;
}
/* Odstránenie prázdnej medzery */
nav#navigation ul.menu-level-3 > li {
font-size: 0 !important;
line-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
height: auto !important;
vertical-align: middle !important;
}
/* a znovu nastavíme font pre */
nav#navigation ul.menu-level-3 > li > a {
font-size: 10px !important;
line-height: 1.35 !important;
display: block !important;
padding: 0 !important;
margin: 0 auto !important;
text-align: center !important;
white-space: normal !important;
}
/* Odstránenie prázdneho miesta spôsobeného submenu šípkou */
nav#navigation .submenu-arrow {
display: none !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0 !important;
}