/*
 * Ультра-минималистичный дизайн для CoffeeRanks
 * Полная переработка дизайна: убираем ВСЕ лишние бортики и упрощаем цвета
 * Дата: 2025-07-08
 */

/* =============================================================================
   ПОЛНАЯ ПЕРЕУСТАНОВКА ЦВЕТОВОЙ ПАЛИТРЫ
   ============================================================================= */

:root {
  /* ТОЛЬКО 3 ОСНОВНЫХ ЦВЕТА */
  --color-primary: #2C1810;     /* Темно-коричневый - основной */
  --color-secondary: #5D4037;   /* Средне-коричневый - акценты */
  --color-neutral: #F8F9FA;     /* Очень светлый серый - фон */
  --color-white: #FFFFFF;       /* Белый */
  
  /* Вспомогательные оттенки */
  --color-text: #2C1810;
  --color-text-light: #6C757D;
  --color-border: #E9ECEF;
  --color-hover: #1A0F08;
  
  /* Убираем все старые цвета */
  --primary-coffee: var(--color-primary) !important;
  --secondary-coffee: var(--color-secondary) !important;
  --accent-gold: var(--color-secondary) !important;
  --neutral-cream: var(--color-neutral) !important;
  --primary-color: var(--color-primary) !important;
  --secondary-color: var(--color-secondary) !important;
  --background-color: var(--color-neutral) !important;
}

/* =============================================================================
   ГЛОБАЛЬНАЯ ОЧИСТКА ВСЕХ ГРАНИЦ
   ============================================================================= */

* {
  border: none !important;
  outline: none !important;
}

/* Исключения - только там где РЕАЛЬНО нужно */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea,
select {
  border: 1px solid var(--color-border) !important;
  border-radius: 4px !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 2px rgba(44, 24, 16, 0.1) !important;
}

/* Таблицы - только внутренние границы */
table {
  border-collapse: collapse !important;
}

th, td {
  border-bottom: 1px solid var(--color-border) !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}

/* =============================================================================
   ЦВЕТОВАЯ УНИФИКАЦИЯ
   ============================================================================= */

/* Переопределяем ВСЕ цвета на минимальную палитру */
.header,
.main-header,
.navbar,
.nav,
.navigation {
  background-color: var(--color-white) !important;
  color: var(--color-text) !important;
}

.footer,
.main-footer {
  background-color: var(--color-neutral) !important;
  color: var(--color-text) !important;
}

.card,
.product-card,
.coffee-card,
.method-card,
.blog-card {
  background-color: var(--color-white) !important;
  color: var(--color-text) !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  border-radius: 8px !important;
}

.btn,
.button,
button {
  background-color: var(--color-primary) !important;
  color: var(--color-white) !important;
  border-radius: 4px !important;
  padding: 8px 16px !important;
  transition: background-color 0.2s ease !important;
}

.btn:hover,
.button:hover,
button:hover {
  background-color: var(--color-hover) !important;
}

.btn-secondary,
.btn-outline {
  background-color: transparent !important;
  color: var(--color-primary) !important;
  border: 1px solid var(--color-border) !important;
}

.btn-secondary:hover,
.btn-outline:hover {
  background-color: var(--color-neutral) !important;
}

/* =============================================================================
   УБИРАЕМ ВСЕ ДЕКОРАТИВНЫЕ ЭЛЕМЕНТЫ
   ============================================================================= */

/* Убираем тени, градиенты, анимации */
.shadow,
.shadow-sm,
.shadow-md,
.shadow-lg,
.shadow-xl {
  box-shadow: none !important;
}

.gradient,
.bg-gradient {
  background-image: none !important;
}

/* Убираем закругления где не нужно */
.rounded,
.rounded-lg,
.rounded-xl {
  border-radius: 0 !important;
}

/* Исключение - карточки товаров могут быть слегка закруглены */
.product-card,
.coffee-card {
  border-radius: 8px !important;
}

/* =============================================================================
   УПРОЩЕННАЯ НАВИГАЦИЯ
   ============================================================================= */

.nav-links a,
.navbar a,
.navigation a {
  color: var(--color-text) !important;
  text-decoration: none !important;
  padding: 8px 12px !important;
  transition: color 0.2s ease !important;
}

.nav-links a:hover,
.navbar a:hover,
.navigation a:hover {
  color: var(--color-primary) !important;
  background-color: var(--color-neutral) !important;
}

.nav-links a.active,
.navbar a.active,
.navigation a.active {
  color: var(--color-primary) !important;
  font-weight: 500 !important;
}

/* =============================================================================
   ЛОГОТИП И БРЕНДИНГ
   ============================================================================= */

.logo {
  color: var(--color-primary) !important;
}

.logo-text {
  font-weight: 600 !important;
  color: var(--color-primary) !important;
}

.logo-tagline {
  color: var(--color-text-light) !important;
  font-size: 0.8em !important;
}

/* =============================================================================
   ФОРМЫ
   ============================================================================= */

.form-group,
.form-control,
.input-group {
  margin-bottom: 16px !important;
}

label {
  color: var(--color-text) !important;
  font-weight: 500 !important;
  margin-bottom: 4px !important;
  display: block !important;
}

/* =============================================================================
   КАРТОЧКИ ТОВАРОВ
   ============================================================================= */

.coffee-list,
.products-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 20px !important;
  padding: 20px 0 !important;
}

.product-card {
  padding: 16px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.product-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
}

.product-image {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
  margin-bottom: 12px !important;
}

.product-title {
  color: var(--color-text) !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}

.product-price {
  color: var(--color-primary) !important;
  font-weight: 700 !important;
  font-size: 1.1em !important;
}

.product-roaster {
  color: var(--color-text-light) !important;
  font-size: 0.9em !important;
}

/* =============================================================================
   МОБИЛЬНАЯ АДАПТАЦИЯ
   ============================================================================= */

@media (max-width: 768px) {
  .coffee-list,
  .products-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
    gap: 15px !important;
    padding: 15px !important;
  }
  
  .nav-links {
    flex-direction: column !important;
  }
  
  .nav-links a {
    padding: 12px !important;
    text-align: center !important;
  }
}

/* =============================================================================
   ПЕРЕОПРЕДЕЛЕНИЕ СПЕЦИФИЧНЫХ СТИЛЕЙ BOOTSTRAP И LEGACY CSS
   ============================================================================= */

.container-fluid,
.container {
  background-color: var(--color-white) !important;
}

.row {
  margin: 0 !important;
}

.col,
.col-md-6,
.col-lg-4,
.col-sm-12 {
  padding: 10px !important;
}

/* Убираем все цветные фоны */
.bg-primary,
.bg-secondary,
.bg-success,
.bg-info,
.bg-warning,
.bg-danger,
.bg-light,
.bg-dark {
  background-color: var(--color-white) !important;
  color: var(--color-text) !important;
}

/* Убираем все цветные тексты кроме основных */
.text-primary,
.text-secondary,
.text-success,
.text-info,
.text-warning,
.text-danger {
  color: var(--color-text) !important;
}

.text-muted {
  color: var(--color-text-light) !important;
}

/* =============================================================================
   ДОПОЛНИТЕЛЬНЫЕ ИСПРАВЛЕНИЯ
   ============================================================================= */

/* Убираем отступы где не нужно */
.no-margin {
  margin: 0 !important;
}

.no-padding {
  padding: 0 !important;
}

/* Убираем декоративные списки */
ul, ol {
  list-style: none !important;
  padding-left: 0 !important;
}

/* Только там где нужно - вернуть стили списков */
.content ul,
.blog-content ul,
.article ul {
  list-style: disc !important;
  padding-left: 20px !important;
}

.content ol,
.blog-content ol,
.article ol {
  list-style: decimal !important;
  padding-left: 20px !important;
}

/* =============================================================================
   ФИНАЛЬНАЯ ОЧИСТКА
   ============================================================================= */

/* Убираем все что может добавлять цвета или границы */
hr {
  border: none !important;
  height: 1px !important;
  background-color: var(--color-border) !important;
  margin: 20px 0 !important;
}

blockquote {
  border-left: 3px solid var(--color-primary) !important;
  padding-left: 16px !important;
  margin: 16px 0 !important;
  color: var(--color-text-light) !important;
}

code {
  background-color: var(--color-neutral) !important;
  color: var(--color-text) !important;
  padding: 2px 4px !important;
  border-radius: 3px !important;
}

pre {
  background-color: var(--color-neutral) !important;
  color: var(--color-text) !important;
  padding: 16px !important;
  border-radius: 4px !important;
  overflow-x: auto !important;
}