/* =====================================================
   CFM STYLISH CATEGORY DROPDOWN
===================================================== */

/* Standard dropdown */
.cfm-dropdown{
    position:absolute;top:100%;left:0;
    min-width:220px;
    background:var(--cfm-dropdown-bg);
    border-radius:0 0 12px 12px;
    border-top:3px solid var(--cfm-accent);
    box-shadow:0 12px 40px rgba(74,30,0,0.32);
    padding:8px 0;
    opacity:0;visibility:hidden;
    transform:translateY(-8px);
    transition:opacity 0.25s,transform 0.25s,visibility 0.25s;
    z-index:200;
    list-style:none;
}
.cfm-has-dropdown:hover>.cfm-dropdown,
.cfm-has-dropdown:focus-within>.cfm-dropdown{
    opacity:1;visibility:visible;transform:translateY(0);
}
.cfm-dropdown .cfm-menu-item{width:100%}
.cfm-dropdown-link{
    display:flex;align-items:center;gap:8px;
    height:auto;padding:10px 18px;
    color:rgba(250,243,232,0.88);
    font-size:13px;font-weight:400;
    border-bottom:1px solid rgba(255,255,255,0.06);
    transition:all 0.22s;
}
.cfm-dropdown-link:hover{
    background:rgba(255,255,255,0.1);
    color:var(--cfm-accent);
    padding-left:24px;
}
/* Sub-dropdown */
.cfm-dropdown__sub{
    position:absolute;top:0;left:100%;
    min-width:200px;
    background:var(--cfm-dropdown-bg);
    border-radius:0 12px 12px 0;
    border-top:3px solid var(--cfm-accent);
    border-left:1px solid rgba(255,255,255,0.1);
    box-shadow:8px 4px 28px rgba(74,30,0,0.25);
    padding:8px 0;
    opacity:0;visibility:hidden;
    transform:translateX(-8px);
    transition:opacity 0.22s,transform 0.22s,visibility 0.22s;
    z-index:201;
    list-style:none;
}
.cfm-dropdown .cfm-has-dropdown:hover>.cfm-dropdown__sub{
    opacity:1;visibility:visible;transform:translateX(0);
}

/* =====================================================
   MEGA CATEGORY DROPDOWN
   Used when menu item has class "cfm-mega"
===================================================== */
.cfm-mega-dropdown{
    position:absolute;top:100%;left:50%;
    transform:translateX(-50%) translateY(-8px);
    width:680px;max-width:95vw;
    background:#fff;
    border-radius:0 0 14px 14px;
    border-top:3px solid var(--cfm-accent);
    box-shadow:0 16px 50px rgba(74,30,0,0.22);
    padding:16px;
    opacity:0;visibility:hidden;
    transition:opacity 0.28s,transform 0.28s,visibility 0.28s;
    z-index:300;
    list-style:none;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
}
.cfm-has-dropdown:hover>.cfm-mega-dropdown,
.cfm-has-dropdown:focus-within>.cfm-mega-dropdown{
    opacity:1;visibility:visible;
    transform:translateX(-50%) translateY(0);
}
.cfm-mega-header{
    grid-column:1/-1;
    font-family:var(--cfm-font-heading);
    font-size:13px;font-weight:600;
    color:var(--cfm-primary);
    padding:0 4px 10px;
    border-bottom:1px solid rgba(74,30,0,0.1);
    margin-bottom:4px;
    text-transform:uppercase;letter-spacing:1px;
}
.cfm-mega-item{}
.cfm-mega-link{
    display:flex;flex-direction:column;align-items:center;
    gap:7px;padding:10px 8px;
    border-radius:8px;
    text-align:center;
    text-decoration:none;
    transition:all 0.25s;
    border:1.5px solid transparent;
}
.cfm-mega-link:hover{
    background:var(--cfm-cream);
    border-color:var(--cfm-accent);
    transform:translateY(-2px);
}
.cfm-mega-img{
    width:56px;height:56px;
    border-radius:8px;
    object-fit:cover;
    display:block;
    border:1.5px solid rgba(74,30,0,0.1);
    transition:border-color 0.25s;
}
.cfm-mega-link:hover .cfm-mega-img{border-color:var(--cfm-accent)}
.cfm-mega-img-fallback{
    width:56px;height:56px;
    border-radius:8px;
    background:var(--cfm-cream-dark);
    display:flex;align-items:center;justify-content:center;
    font-size:24px;color:rgba(74,30,0,0.3);
    border:1.5px solid rgba(74,30,0,0.1);
}
.cfm-mega-label{
    font-size:11px;font-weight:600;
    color:var(--cfm-primary);
    text-transform:uppercase;letter-spacing:0.5px;
    line-height:1.3;
}
.cfm-mega-link:hover .cfm-mega-label{color:var(--cfm-accent)}

/* Menu icon (optional) */
.cfm-menu-icon{font-size:13px;color:var(--cfm-accent);margin-right:2px}

/* Menu arrow animation */
.cfm-menu-arrow{display:inline-flex;align-items:center;margin-left:3px;transition:transform 0.28s}
.cfm-has-dropdown:hover>.cfm-menu-link .cfm-menu-arrow{transform:rotate(180deg)}

/* "Categories" label highlight */
.cfm-menu-top.cfm-has-dropdown .cfm-menu-link span{
    position:relative;
}
.cfm-menu-top.cfm-has-dropdown:hover>.cfm-menu-link{
    color:var(--cfm-menu-hover);
}

/* Mobile dropdown */
@media(max-width:900px){
    .cfm-dropdown,.cfm-mega-dropdown{
        position:static;opacity:1;visibility:visible;
        transform:none!important;
        box-shadow:none;border-radius:0;
        background:rgba(0,0,0,0.18);
        border-top:none;
        display:none;
        padding:0;width:100%;
        grid-template-columns:1fr;
    }
    .cfm-has-dropdown.open>.cfm-dropdown,
    .cfm-has-dropdown.open>.cfm-mega-dropdown{display:block}
    .cfm-mega-header{padding:10px 20px 8px;border-bottom:1px solid rgba(255,255,255,0.08)}
    .cfm-mega-item{width:100%}
    .cfm-mega-link{flex-direction:row;justify-content:flex-start;padding:10px 20px 10px 36px;text-align:left;border-radius:0;border:none;gap:10px}
    .cfm-mega-link:hover{background:rgba(255,255,255,0.08);transform:none;border:none}
    .cfm-mega-img,.cfm-mega-img-fallback{width:28px;height:28px;font-size:14px}
    .cfm-mega-label{font-size:13px;color:rgba(250,243,232,0.85);text-transform:none}
}