/* ============================================================
   Мега-меню «Коллекции» (десктоп). Часть 9.
   Базовые dk-классы (.dk-nav-item/.dk-mega-panel/.dk-nav-trigger/.dk-caret)
   приходят из catalog_mega/style.css (грузится на странице). Здесь — только
   раскладка «список коллекций + превью».
   ============================================================ */

.dk-coll-layout{ display: flex; }

.dk-coll-nav{
    width: 280px; flex-shrink: 0;
    border-right: 1px solid #f0f0f0; padding-right: 32px;
}
.dk-coll-nav ul{ list-style: none; margin: 0; padding: 0; }

/* группы коллекций (родители) внутри списка */
.dk-coll-group{ margin-bottom: 26px; }
.dk-coll-group:last-child{ margin-bottom: 0; }
.dk-coll-group_flat{ margin-bottom: 8px; }

.dk-coll-nav li a{
    display: block; height: 40px; line-height: 40px;
    font-size: 15px; font-weight: 400; color: #1a1a1a; text-decoration: none;
    transition: color 150ms ease;
}
.dk-coll-nav li a:hover,
.dk-coll-nav li a.active{ color: var(--dk-accent, #6E6E6E); }

.dk-coll-preview{
    flex: 1; padding-left: 40px;
    display: flex; align-items: center; gap: 28px;
}
.dk-coll-photo{
    width: 260px; height: 180px; flex-shrink: 0; border-radius: 4px;
    background: #f2ece8 center/cover no-repeat;
    transition: opacity 200ms ease;
}
.dk-coll-text h4.dk-coll-title{
    font-size: 20px; font-weight: 500; margin: 0 0 8px; color: #1a1a1a;
}
.dk-coll-text p.dk-coll-sub{
    font-size: 14px; color: #666; margin: 0 0 18px;
}

.dk-btn-outline{
    display: inline-flex; align-items: center; gap: 6px;
    height: 40px; padding: 0 22px; font-size: 14px; color: #1a1a1a;
    border: 1px solid #1a1a1a; border-radius: 2px; text-decoration: none;
    transition: border-color 150ms ease, color 150ms ease;
}
.dk-btn-outline:hover{ border-color: var(--dk-accent, #6E6E6E); color: var(--dk-accent, #6E6E6E); }

/* плавная смена превью при наведении */
.dk-coll-preview.dk-swapping .dk-coll-photo,
.dk-coll-preview.dk-swapping .dk-coll-text{ opacity: 0; }
.dk-coll-preview .dk-coll-text{ transition: opacity 200ms ease; }
