/* =========================================
   Placify – Categorie e Sottocategorie
   ========================================= */

.placify-catmenu {
    font-family: inherit;
    font-size: 15px;
}

/* ---- Gruppo (IN / OUT / OVER) ----
   Le variabili CSS vengono iniettate inline dal template:
   --tab-color   : colore principale del tab
   --tab-text    : colore testo dell'etichetta
   --tab-bg-20   : colore tab al 20% per hover/selected
----------------------------------------------------- */
.placify-catmenu__group {
    margin-bottom: 8px;
}

/* ---- Header tab ---- */
.placify-catmenu__tab {
    display: inline-block;
    padding: 5px 14px;
    background-color: var(--tab-color);
    color: var(--tab-text);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 1.2;
}

/* ---- Linea spessa 2px sotto il tab ---- */
.placify-catmenu__divider {
    height: 2px;
    background-color: var(--tab-color);
    width: 100%;
    margin-bottom: 2px;
}

/* ---- Lista subcategorie (Skincare, Bodycare…) ---- */
.placify-catmenu__list {
    list-style: none;
    margin: 0 0 16px 0;
    padding: 0;
}

.placify-catmenu__item {
    border: none;
}

/* ---- Link subcategoria (livello 2) ---- */
.placify-catmenu__subcat-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    color: #1a1a1a;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    border-bottom: 1px solid #e8e8e8;
    transition: color 0.15s ease;
}

.placify-catmenu__subcat-link:hover {
    color: var(--tab-color);
    text-decoration: none;
}

/* ---- Chevron — colore del tab madre, leggermente più grande ---- */
.placify-catmenu__arrow {
    color: var(--tab-color);
    font-size: 18px;
    flex-shrink: 0;
    margin-left: 8px;
    line-height: 1;
}

/* ---- Pannello espanso (sub-subcategorie) ---- */
.placify-catmenu__sublist {
    list-style: none;
    margin: 0;
    padding: 0 0 6px 0;
}

/* ---- "Tutti i prodotti Skincare" ---- */
.placify-catmenu__subitem--all {
    padding-top: 4px;
}

.placify-catmenu__sublink--all {
    color: #1a1a1a;
    font-size: 14px;
    font-weight: 400;
}

/* ---- Link sub-subcategoria (livello 3, es. Crema mani) ---- */
.placify-catmenu__subitem {
    list-style: none;
}

.placify-catmenu__sublink {
    display: block;
    padding: 7px 0 7px 14px;
    color: #444;
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    border-left: 2px solid transparent;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/* ---- Hover su sub-subcategorie e "Tutti i prodotti" ---- */
.placify-catmenu__sublink:hover {
    background-color: var(--tab-bg-20);
    border-left-color: var(--tab-color);
    color: #1a1a1a;
    text-decoration: none;
}

/* ---- Voce corrente ---- */
.placify-catmenu__sublink--current {
    background-color: var(--tab-bg-20);
    border-left-color: var(--tab-color);
    font-weight: 700;
    color: #1a1a1a;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .placify-catmenu {
        font-size: 14px;
    }
    .placify-catmenu__subcat-link {
        padding: 9px 0;
        font-size: 14px;
    }
}