/* creator-nav.css
 * Мобильный нижний таб-бар креатора (вынесен из dashboard-creator-jobs.html TASK-571).
 * Подключается глобально через index.html — фрагмент creator-nav.html вставляется
 * на всех экранах креатора (каталог / кошелёк / профиль).
 */

/* --- Базовые стили таб-бара (управляет display) --- */
.cj-mobile-nav {
    display: none;
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 800;
    background: var(--card); border-top: 1px solid var(--line);
    height: 56px; justify-content: space-around; align-items: center;
}

/* --- Элементы вкладок --- */
.cj-nav-item {
    display: flex; flex-direction: column; align-items: center;
    color: var(--muted); text-decoration: none; font-size: 12px;
    gap: 2px; padding: 8px 12px; line-height: 1.2;
    background: none; border: none; cursor: pointer;
    position: relative;
}
.cj-nav-item.cj-nav-active { color: var(--primary); }
.cj-nav-icon { font-size: 18px; line-height: 1; }
.cj-nav-label { font-size: 11px; font-weight: 500; }

/* --- Бейдж на вкладке «Мои» --- */
.cj-nav-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 16px; height: 16px; padding: 0 4px; border-radius: 99px;
    background: var(--danger); color: var(--card); font-size: 10px; font-weight: 700;
    line-height: 1; position: absolute; top: 4px; right: 4px;
}

/* --- Мобильный адаптив: показываем таб-бар и добавляем отступ снизу --- */
@media (max-width: 640px) {
    .cj-mobile-nav { display: flex; }
    /* Отступ снизу для всех экранов креатора, чтобы таб-бар не перекрывал контент */
    .creator-jobs,
    .cw-screen,
    .creator-profile { padding-bottom: 70px; }
}