/* ---  Levé menu - Hlavní kategorie ---*/
/* ---  First Child --- */
#categories>div:first-child>.topic>a {
    background: transparent;
    color: var(--color-font); 
    text-transform: uppercase;
}

#categories>div:first-child>.topic>a:hover {
    border: 1px solid #d66344;
    background-color: #fff0ec;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div:first-child.active>.topic>a {
    background: var(--gradient-blue);
    color: var(--color-white);
    text-decoration: none;
}

#categories>div:first-child.active>.topic>a:hover {
    border: 1px solid #d66344;
    background: none;
    background-color: #fff0ec;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div:first-child>.topic>a>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-font);
    border-right: 2px solid var(--color-font);
}

#categories>div:first-child>.topic>a:hover>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-primary-hover);
    border-right: 2px solid var(--color-primary-hover);
}
/* ---  END First Child --- */


/* ---  Nth Child 2 --- */
#categories>div:nth-child(2)>.topic>a {
    background: transparent; 
    color: var(--color-font);
    text-transform: uppercase;
}

#categories>div:nth-child(2)>.topic>a:hover {
    border: 1px solid #d66344;
    background: none;
    background-color: #fff0ec;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div:nth-child(2).active>.topic>a {
    background: var(--gradient-blue);    
    color: var(--color-white);
    text-decoration: none;
}

#categories>div:nth-child(2).active>.topic>a:hover {
    border: 1px solid #d66344;
    background: none;
    background-color: #fff0ec;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div:nth-child(2)>.topic>a>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-font);
    border-right: 2px solid var(--color-font);
}

#categories>div:nth-child(2)>.topic>a:hover>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-primary-hover);
    border-right: 2px solid var(--color-primary-hover);
}
/* ---  END Nth Child 2 --- */


/* ---  Topic --- */
#categories>div>.topic>a {
    text-decoration: none;
    text-transform: uppercase; 
    padding: 7px 16px 7px 23px;
}

#categories>div>.topic>a:hover {
    border: 1px solid #d66344;
    background-color: #fff0ec;
    text-decoration: underline; 
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div>.topic.active>a {
    background: var(--gradient-blue);
    color: var(--color-white);   
    text-decoration: none;
}

#categories>div>.topic.active>a:hover {
    border: 1px solid #d66344;
    background-color: #fff0ec;
    text-decoration: underline; 
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px; 
}

#categories>div.expandable>.topic.active>a {
    text-decoration: none;
}

#categories>div.active>.topic>a {
    background-color: transparent;
    background: var(--gradient-blue);
    color: var(--color-white); 
}

#categories>div>.topic.active>a:hover {
    border: 1px solid #d66344;
    background: none;
    background-color: #fff0ec;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div>.topic.child-active>a:hover {
    border: 1px solid #d66344;
    background: none;
    background-color: #fff0ec;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div.expandable>.topic>a:hover>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-primary-hover);
    border-right: 2px solid var(--color-primary-hover);
}

#categories>div.active>.topic>a>span.cat-trigger:before {
    border-bottom: 1px solid var(--color-white);
    border-right: 1px solid var(--color-white);
}
/* --- END Topic --- */

/* --- Poslední - Značky --- */
#categories>div:last-child>.topic>a {
    background: transparent;
    color: var(--color-primary);
    text-transform: uppercase;
    margin-top: 20px;
}

#categories>div:last-child>.topic>a:hover {
    border: 1px solid #d66344;
    background-color: #fff0ec;
    text-transform: uppercase;
    text-decoration: underline;
    color: var(--color-primary-hover);
    padding: 6px 15px 6px 22px;
}

#categories>div:last-child.active>.topic>a {
    background: var(--gradient-blue);
    color: var(--color-white);
    text-decoration: none;
}
/* --- END Poslední - Značky --- */

/* ---  END Levé menu - Hlavní kategorie --- */

/* ---  Levé menu - Vnořené kategorie --- */
/* ---  Kategorie 1. řádu ---*/
#categories>div.active ul.active>li>a {
    font-weight: normal;
    padding: 8px 26px;
}

#categories>div.active ul.active li>a>span.cat-trigger:before {
    border-bottom: 1px solid var(--color-font);
    border-right: 1px solid var(--color-font);
} 

#categories>div.active ul.active>li>a:hover {
    color: var(--color-primary-hover);
    font-weight: 700;
    text-decoration: underline;
    padding: 8px 26px;
}

#categories>div.active ul.active li>a:hover>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-primary-hover);
    border-right: 2px solid var(--color-primary-hover);
} 

#categories>div.active ul.active>li.active>a {
    background-color: transparent;
    font-weight: 700;
    color: var(--color-primary);
}

#categories>div.active ul.active>li.active>a>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-primary);
    border-right: 2px solid var(--color-primary);
}

#categories>div.active ul.active>li.active>a:hover {
    background-color: transparent;
    font-weight: 700;
    color: var(--color-primary-hover);
}

#categories>div.active ul.active>li.active>a:hover>span.cat-trigger:before {
    border-bottom: 2px solid var(--color-primary-hover);
    border-right: 2px solid var(--color-primary-hover);
} 
/* --- END Kategorie 1. řádu --- */

/* ... Kategorie 2. řádu --- */
#categories>div.active ul.active li.expandable ul>li>a {
    color: #706e6f;
    font-weight: 400;
}

#categories>div.active ul.active li.expandable ul>li>a>span.cat-trigger:before {
    border-bottom: 1px solid #706e6f;
    border-right: 1px solid #706e6f;
}

#categories>div.active ul.active li.expandable ul>li>a:hover {
    color: var(--color-primary-hover);
    font-weight: 400;
    text-decoration: underline;
}

#categories>div.active ul.active li.expandable ul>li>a:hover>span.cat-trigger:before {
    border-bottom: 1px solid var(--color-primary-hover);
    border-right: 1px solid var(--color-primary-hover);
}

#categories ul.active.expanded li.expandable ul li.active a {
    color: var(--color-primary);
    text-decoration: none;    
}

#categories ul.active.expanded li.expandable ul li.active a>span.cat-trigger:before {
    border-bottom: 1px solid var(--color-primary);
    border-right: 1px solid var(--color-primary);
}

#categories ul.active.expanded li.expandable ul li.active a:hover {
    color: var(--color-primary-hover);
    text-decoration: underline;    
}

#categories ul.active.expanded li.expandable ul li.active a:hover>span.cat-trigger:before {
    border-bottom: 1px solid var(--color-primary-hover);
    border-right: 1px solid var(--color-primary-hover);
}
/* --- END Kategorie 2.řádu --- */

/* ---  Levé menu - Vnořené kategorie --- */