/* Scoped exclusively to the MAIN MENU and INFO widgets. */
.zs-sidebar-menu {
    margin-bottom: 20px;
    background: #221e20;
    border: 1px solid rgba(169, 137, 83, .17);
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 5px 14px rgba(0, 0, 0, .16);
}
.zs-sidebar-menu > .topic-list--header {
    background: linear-gradient(110deg, #302a26, #252123 74%);
    box-shadow: none;
    border: 0;
    border-bottom: 1px solid rgba(181, 146, 82, .23);
}
.zs-sidebar-menu .topic-list-header--title {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0;
    padding: 12px 18px;
    color: #e0c58f;
    font: 600 13px/20px Arial, sans-serif;
    letter-spacing: 1.25px;
    text-transform: uppercase;
}
.zs-sidebar-menu .topic-list-header--title i.fa {
    width: 20px;
    margin: 0;
    color: #b99b64;
    font-size: 14px;
    text-align: center;
}
.zs-sidebar-menu > .topic-list--content {
    background: transparent;
    box-shadow: none;
    overflow: visible;
}
.zs-sidebar-menu .topic-sidebar-widget--ad {
    margin: 0;
    padding: 6px 10px 8px;
    background: transparent;
    border: 0;
}
.zs-sidebar-menu table { width: 100%; border-collapse: collapse; border: 0; margin: 0; }
.zs-sidebar-menu td { padding: 0; border: 0; }
.zs-sidebar-menu li {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
}
.zs-sidebar-menu li::marker { content: none; }
.zs-sidebar-menu li::before { content: none; }
.zs-sidebar-menu tr + tr td { border-top: 1px solid rgba(176, 152, 111, .075); }
.zs-sidebar-menu li > a {
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
    min-height: 29px;
    margin: 0;
    padding: 4px 11px;
    border-radius: 3px;
    background: transparent;
    color: #cfc6b6;
    text-decoration: none;
    font: 400 13px/20px Arial, sans-serif;
    letter-spacing: .1px;
    transition: background-color .16s ease, color .16s ease;
}
.zs-sidebar-menu li > a > i.fa {
    flex: 0 0 20px;
    width: 20px;
    margin: 0;
    color: #b99b64;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
}
.zs-sidebar-menu li > a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    bottom: 7px;
    width: 2px;
    background: #c9a664;
    opacity: 0;
}
.zs-sidebar-menu li > a:hover,
.zs-sidebar-menu li > a:focus-visible {
    background-color: rgba(189, 152, 82, .1);
    color: #f1dbaf;
    text-decoration: none;
}
.zs-sidebar-menu li > a:hover::before,
.zs-sidebar-menu li > a:focus-visible::before { opacity: 1; }
.zs-sidebar-menu li > a:hover > i.fa,
.zs-sidebar-menu li > a:focus-visible > i.fa { color: #e0be7c; }
.zs-sidebar-menu li > a:focus-visible { outline: 1px solid #b99b64; outline-offset: -1px; }
@media (pointer: coarse) { .zs-sidebar-menu li > a { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .zs-sidebar-menu li > a { transition: none; } }

/* INFO: one gentle highlight per eight-second cycle, including the cart. */
.zs-sidebar-menu li > a[href="?view=shop"] {
    animation: zs-sidebar-shop-pulse 8s ease-in-out infinite;
}
.zs-sidebar-menu li > a[href="?view=shop"] > i.fa {
    animation: zs-sidebar-shop-icon-pulse 8s ease-in-out infinite;
}
@keyframes zs-sidebar-shop-pulse {
    0%, 64%, 100% { color:#cfc6b6; background-color:transparent; text-shadow:none; }
    80% { color:#dfd1b8; background-color:rgba(189,152,82,.035); text-shadow:0 0 4px rgba(211,179,117,.12); }
    90% { color:#d6cbb7; background-color:rgba(189,152,82,.015); text-shadow:none; }
}
@keyframes zs-sidebar-shop-icon-pulse {
    0%, 64%, 100% { color:#b99b64; }
    80% { color:#cfb37b; }
    90% { color:#c2a66f; }
}
.zs-sidebar-menu li > a[href="?view=shop"]:hover,
.zs-sidebar-menu li > a[href="?view=shop"]:focus-visible,
.zs-sidebar-menu li > a[href="?view=shop"]:hover > i.fa,
.zs-sidebar-menu li > a[href="?view=shop"]:focus-visible > i.fa { animation:none; }
@media (prefers-reduced-motion: reduce) {
    .zs-sidebar-menu li > a[href="?view=shop"],
    .zs-sidebar-menu li > a[href="?view=shop"] > i.fa { animation:none; }
}
