/* ReplicaMade.io homepage left-navigation hotfix v8
 * Scope: homepage brand/type sidebar only.
 * Keeps V7 page geometry intact.
 */

.cms-home .home-brand-list,
.cms-home .home-watch-types {
    width:231px !important;
    max-width:231px !important;
    box-sizing:border-box !important;
}

.cms-home .home-brand-list .tab_link,
.cms-home .home-watch-types .tab_link {
    margin-bottom:4px !important;
}

.cms-home .home-brand-categories,
.cms-home .home-type-categories {
    margin:0 !important;
    padding:0 !important;
    width:100% !important;
    box-sizing:border-box !important;
}

.cms-home .home-brand-categories > li,
.cms-home .home-type-categories > li {
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

/* The legacy rule used height:19px together with vertical padding.  Under the
   modern box model that squeezed the text into the separator lines. */
.cms-home .home-brand-categories > li > a,
.cms-home .home-type-categories > li > a {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    min-height:23px !important;
    height:auto !important;
    padding:2px 12px 2px 15px !important;
    margin:0 !important;
    line-height:17px !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
    text-decoration:none !important;
}

.cms-home .home-brand-categories .brand-name,
.cms-home .home-type-categories .brand-name {
    display:block !important;
    float:none !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    background:none !important;
}

.cms-home .home-brand-categories .brand-count,
.cms-home .home-type-categories .brand-count {
    display:block !important;
    float:none !important;
    flex:0 0 auto !important;
    min-width:38px !important;
    margin:0 !important;
    text-align:right !important;
    white-space:nowrap !important;
    background:none !important;
}

.cms-home .home-brand-categories .brand-extra {
    display:none;
}

.cms-home .home-brand-categories .more-designers-row {
    border-top:1px solid #424242 !important;
    border-bottom:1px solid #1b1b1b !important;
}

.cms-home .more-designers-toggle {
    appearance:none !important;
    -webkit-appearance:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    min-height:27px !important;
    margin:0 !important;
    padding:3px 12px 3px 15px !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#c8c8c8 !important;
    font:normal 11px/19px Tahoma, Geneva, sans-serif !important;
    text-align:left !important;
    cursor:pointer !important;
    box-shadow:none !important;
}

.cms-home .more-designers-toggle:hover,
.cms-home .more-designers-toggle:focus,
.cms-home .more-designers-toggle.is-open {
    color:#a6bc3e !important;
    outline:none !important;
}

.cms-home .more-designers-icon {
    flex:0 0 auto !important;
    width:18px !important;
    text-align:right !important;
    color:#a6bc3e !important;
    font-size:15px !important;
    line-height:18px !important;
}

.cms-home .home-watch-types {
    margin-top:12px !important;
}

/* Make the same block usable when the sidebar becomes full width on phones. */
@media only screen and (max-width:640px) {
    .cms-home .home-brand-list,
    .cms-home .home-watch-types {
        width:100% !important;
        max-width:none !important;
    }
}