/* --- 1. ГЛОБАЛЬНЫЕ СТИЛИ --- */

body { 

    background-color: #f4f7f6 !important; 

    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; 

}



/* --- 2. НАВИГАЦИЯ --- */

.btn-nav-icon {

    background: none !important;

    border: none !important;

    color: rgba(255, 255, 255, 0.9) !important;

    font-size: 1.5rem;

    width: 40px; height: 40px;

    display: inline-flex; align-items: center; justify-content: center;

    text-decoration: none !important;

    transition: color 0.2s ease;

}

.btn-nav-icon:hover { color: #ffc107 !important; }



/* --- 3. ЕДИНЫЙ СТИЛЬ КАРТОЧЕК --- */
.article-card, .auth-card, .profile-sidebar, .card { 
    background: #fff !important; 
    margin-bottom: 24px !important; 
    border-radius: 12px !important; 
    overflow: hidden; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
    border: none !important;
    display: block;
}



.auth-card {

    padding: 40px;

    margin: 2rem auto;

    width: 100%;

    max-width: 400px;

}



/* --- 4. ФОРМЫ И КНОПКИ --- */

form p input, .form-control {

    display: block;

    width: 100%;

    padding: 12px 15px;

    font-size: 1rem;

    border: 1px solid #e0e6ed !important;

    border-radius: 12px !important;

    margin-bottom: 15px !important;

}



.btn-success-custom, .btn-primary {

    background-color: #2ecc71 !important;

    border: none !important;

    color: white !important;

    padding: 12px;

    border-radius: 12px !important;

    font-weight: 700;

    width: 100%;

}


/* --- 5. ДЕТАЛИ ПРОФИЛЯ --- */
.profile-sidebar { 
    padding: 30px 20px !important; 
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Центровка фото и ника */
    text-align: center !important;
}

.main-profile-img { 
    width: 130px; 
    height: 130px; 
    object-fit: cover; 
    border-radius: 20px; 
    border: 4px solid #fff; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.1); 
    margin: 0 auto 15px !important; /* Центровка фото */
}

/* Статистика внизу сайдбара — она должна быть на всю ширину */
.profile-stats-box {
    width: 100%;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #f1f4f8;
}

.profile-stat-row {
    display: flex;
    justify-content: space-between; /* Текст слева, цифра справа */
    font-size: 0.85rem;
    margin-bottom: 5px;
}

/* --- 6. МОБИЛЬНАЯ АДАПТАЦИЯ (ЖЕСТКО) --- */
@media (max-width: 575.98px) {
    .container { padding-left: 10px !important; padding-right: 10px !important; }
    .row { margin-left: 0 !important; margin-right: 0 !important; }
    [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; }

    .profile-sidebar { padding: 25px 15px !important; }
    .main-profile-img { width: 110px; height: 110px; }
}

/* --- АВАТАР В ПРОФИЛЕ (БОЛЬШОЙ) --- */
.profile-avatar-big { 
    width: 140px !important; 
    height: 140px !important; 
    object-fit: cover; 
    border-radius: 20px; 
    border: 4px solid #fff; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.1); 
    margin: 0 auto 15px !important; 
    display: block;
}

/* --- АВАТАР В ЛЕНТЕ (МАЛЕНЬКИЙ) --- */
.author-ava-small { 
    width: 44px !important; 
    height: 44px !important; 
    object-fit: cover; 
    border-radius: 10px !important; 
    border: 2px solid #fff;
}

/* Индикатор статуса (кругляшок) */
.status-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-left: 6px;
    vertical-align: middle;
}

/* Цвета для кругляшка */
.dot-online { 
    background-color: #2ecc71 !important; 
    box-shadow: 0 0 8px rgba(46, 204, 113, 0.6); /* Эффект свечения */
}
.dot-offline { 
    background-color: #95a5a6 !important; 
}

/* Убираем жирную голубую рамку у полей ввода */
.form-control:focus, 
form p input:focus, 
textarea:focus {
    border-color: #2ecc71 !important; /* Цвет рамки при клике (сделал зеленым под стиль) */
    box-shadow: none !important;      /* Убираем толстое свечение */
    outline: 0 !important;
    border-width: 1px !important;    /* Оставляем тонкую линию */
}

/* Если хочешь оставить легкое, едва заметное свечение вместо жирного */
.form-control:focus {
    box-shadow: 0 0 0 0.1rem rgba(46, 204, 113, 0.15) !important; 
}

/* --- ГЛОБАЛЬНАЯ ЧИСТКА ПОЛЕЙ ВВОДА (Логин, Рега, Статьи) --- */
.form-control, 
input[type="text"], 
input[type="password"], 
input[type="email"], 
textarea {
    background-color: #fff !important; /* Всегда белый фон */
    border: 1px solid #e0e6ed !important; /* Тонкая серая рамка в покое */
    box-shadow: none !important;
    color: #333 !important;
}

/* Состояние при клике (Focus) для ВСЕХ полей */
.form-control:focus, 
input:focus, 
textarea:focus {
    background-color: #fff !important;
    border-color: #2ecc71 !important; /* Тонкая зеленая рамка */
    box-shadow: 0 0 0 0.1rem rgba(46, 204, 113, 0.15) !important; /* Легкое свечение */
    outline: 0 !important;
}


/* --- УБИРАЕМ ГОЛУБОЙ ЦВЕТ ПРИ АВТОЗАПОЛНЕНИИ (Chrome, Safari, Edge) --- */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important; /* Заливаем фон белым внутри тени */
    -webkit-text-fill-color: #333 !important; /* Цвет текста */
    transition: background-color 5000s ease-in-out 0s; /* Защита от перекрашивания */
}

/* --- ПРИНУДИТЕЛЬНЫЙ СТИЛЬ ДЛЯ ВСЕХ ИНПУТОВ (Логин, Рега, Статьи) --- */
.form-control, 
input[type="text"], 
input[type="password"], 
input[type="email"], 
textarea {
    background-color: white !important;
    border: 1px solid #e0e6ed !important;
    border-radius: 12px !important; /* Чтобы везде были одинаково скруглены */
}

/* Фокус (когда тыкаешь мышкой) */
.form-control:focus, 
input:focus, 
textarea:focus {
    background-color: white !important;
    border-color: #2ecc71 !important; /* Твоя тонкая зеленая рамка */
    box-shadow: 0 0 0 0.1rem rgba(46, 204, 113, 0.15) !important;
    outline: none !important;
}