/*
Theme Name: Arsenal
Author: AxeCode 
Description: Кастомная тема Arsenal для футбольного клуба Арсенал Дзержинск.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.9
*/

/*
 █████╗ ██╗  ██╗███████╗ ██████╗ ██████╗ ██████╗ ███████╗           ████████╗███████╗ ██████╗██╗  ██╗
██╔══██╗╚██╗██╔╝██╔════╝██╔════╝██╔═══██╗██╔══██╗██╔════╝           ╚══██╔══╝██╔════╝██╔════╝██║  ██║
███████║ ╚███╔╝ █████╗  ██║     ██║   ██║██║  ██║█████╗                ██║   █████╗  ██║     ███████║
██╔══██║ ██╔██╗ ██╔══╝  ██║     ██║   ██║██║  ██║██╔══╝                ██║   ██╔══╝  ██║     ██╔══██║
██║  ██║██╔╝ ██╗███████╗╚██████╗╚██████╔╝██████╔╝███████╗    ██╗       ██║   ███████╗╚██████╗██║  ██║
╚═╝  ╚═╝╚═╝  ╚═╝╚══════╝ ╚═════╝ ╚═════╝ ╚═════╝ ╚══════╝    ╚═╝       ╚═╝   ╚══════╝ ╚═════╝╚═╝  ╚═╝
   
e-mail: hello@axecode.tech

 /* ==========================================================================
   CSS RESET - Сброс стандартных стилей браузера
   ========================================================================== */

/* Универсальный селектор: убираем margin и padding у всех элементов */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

/* Гарантируем полную высоту для html и body */
html, body {
	width: 100%;
	height: 100%;
}

/* Убираем стандартные отступы у заголовков и параграфов */
h1, h2, h3, h4, h5, h6, p {
	margin: 0;
	padding: 0;
}

/* Убираем стандартные стили у списков */
ul, ol, li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Сбрасываем стили для форм и кнопок */
button, input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	border: none;
	padding: 0;
	margin: 0;
	background: none;
	cursor: pointer;
}

/* Убираем стандартный стиль ссылок */
a {
	color: inherit;
	text-decoration: none;
}

/* Гарантируем, что изображения не выходят за границы контейнера */
img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Убираем стандартные отступы таблиц */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* ==========================================================================
   Основные стили темы
   ========================================================================== */

:root {
	/* Контейнер */
	--container-max-width: 1280px;
	--container-padding-x: 20px;
	--container-padding-y: 20px;
	
	/* ============================================
	   ЦВЕТОВАЯ ПАЛИТРА ARSENAL
	   ============================================ */
	
	/* Красная палитра Arsenal */
	--red-900: #990000; /* Темный бордовый для текста и акцентов */
	--red-800: #cc0000; /* Для активных состояний */
	--red-700: #ff1a1a; /* Основной яркий красный */
	--red-600: #ff3333; /* Для hover-эффектов */
	--red-500: #ff4d4d; /* Более светлый акцент */
	--red-400: #dc2626; /* Альтернативный красный */
	--red-100: #ffe5e5; /* Светлый фон для выделения */
	--red-50: #fff0f0;  /* Очень светлый фон */
	
	/* Черные и темные оттенки */
	--color-black: #000000;
	--color-black-soft: #0a0a0a; /* Мягкий черный для текста */
	--color-charcoal: #212121; /* Темный серо-черный (уголь) */
	--color-dark-slate: #101828; /* Очень темный серо-синий */
	--color-dark-gray: #1a1a1a; /* Темно-серый */
	
	/* Белые оттенки */
	--color-white: #ffffff;
	
	/* Серая палитра */
	--gray-900: #0a0a0a; /* Почти черный текст */
	--gray-800: #101828; /* Темный текст заголовков */
	--gray-700: #364153; /* Темный вторичный серый */
	--gray-600: #4a5565; /* Серый вторичный текст */
	--gray-500: #6a7282; /* Средний серый */
	--gray-400: #98a2b3; /* Серый для границ */
	--gray-300: #d1d5dc; /* Светло-серая граница */
	--gray-200: #e5e7eb; /* Светло-серый фон/границы */
	--gray-100: #f0f1f3; /* Очень светлый серый */
	--gray-50: #f9fafb;  /* Фон страниц */
	
	/* Зеленая палитра (футбольное поле) */
	--green-800: #008236; /* Темный зеленый поле */
	--green-700: #00a63e; /* Основной зеленый поле */
	--green-600: #16a34a; /* Средний зеленый */
	--green-500: #22c55e; /* Светлый зеленый */
	--green-100: #093733; /* Темный зеленовато-бежевый */
	
	/* Синяя палитра */
	--blue-700: #155dfc; /* Синий для гостевой команды */
	
	/* Золотой */
	--color-gold: #f0b100; /* Золотой для достижений */
	
	/* Бежевый */
	--color-beige: #ead6be; /* Бежевый акцент */
	
	/* Социальные сети */
	--social-facebook: #1877f2;
	--social-instagram-1: #f58529;
	--social-instagram-2: #dd2a7b;
	--social-instagram-3: #8134af;
	--social-whatsapp: #25d366;
	--social-twitter: #1da1f2;
	
	/* Тени */
	--shadow-hover: #1f1f1f1f; /* Тень для hover состояний карточек */
	
	/* ============================================
	   СЕМАНТИЧЕСКИЕ ЦВЕТА
	   ============================================ */
	
	/* Текст */
	--color-text: #333333;
	--color-text-dark: #0a0a0a;
	--color-text-darker: #101828;
	--color-text-light: #ffffff;
	--color-text-secondary: #4a5565;
	--color-text-muted: #364153;
	--secondary-color: #ffffff;
	
	/* Границы */
	--color-border: #e5e7eb;
	--color-border-light: #d1d5dc;
	
	/* Футбольное поле */
	--color-field: #00a63e;
	--color-field-dark: #008236;
	
	/* Матч: домашняя/гостевая команда */
	--color-home: #ff1a1a;
	--color-away: #155dfc;
}

body {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color: var(--color-text, #333333);
	background-color: var(--color-white, #ffffff);
}

/* Контейнер */
.container {
	max-width: var(--container-max-width, 1280px);
	margin: 0 auto;
	padding: var(--container-padding-y) var(--container-padding-x);
}

/* Заголовки */
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 1rem;
	font-weight: 700;
	line-height: 1.2;
}

/* Ссылки */
a {
	color: var(--red-700, #FF1A1A);
	text-decoration: none;
	transition: color 0.3s ease;
}

a:hover {
	color: #1a1a1a;
}

/* Изображения */
img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* ==========================================================================
   PAGE-SPECIFIC VARIABLES OVERRIDES
   Переопределения переменных для отдельных страниц
   ========================================================================== */

/* Календарь / Новости / Тренеры / Команда */
.calendar-page,
.news-page,
.teams-section,
.standings-page {
	--container-padding-x: 20px;
}

/* История клуба */
.club-page {
	--container-padding-x: 16px;
	--container-padding-y: 32px;
}

/* Матч */
.match-page {
	--container-padding-x: 3.9375rem;
	--container-padding-y: 1.5rem;
}

/* Страница игрока */
.player-page {
	--container-padding-x: 40px;
}

/* Основные секции (news, last-games, tournament, sponsors) */
.news-section,
.last-games-section,
.tournament-table-section,
.sponsors-section {
	--container-padding-x: 1rem;
}

/* Футер и шапка */
.footer-main,
.footer-bottom {
	--container-padding-x: 1rem;
}

.header-container {
	--container-padding-x: 1.25rem;
}

/* Single новость */
.single-news-page {
	--container-padding-y: 48px;
}

/* ==========================================================================
   MEDIA QUERIES - Адаптивные переменные
   ========================================================================== */

@media (max-width: 1200px) {
	/* Плагинеры */
	.news-page {
		--container-padding-x: 40px;
	}
}

@media (max-width: 1024px) {
	/* Матч на планшете */
	.match-page {
		--container-padding-x: 1.5rem;
		--container-padding-y: 1rem;
	}
}

@media (max-width: 768px) {
	/* Основной отступ для всех при переходе на планшет */
	.calendar-page,
	.news-page,
	.teams-section,
	.standings-page,
	.club-page {
		--container-padding-x: 8px;
		--container-padding-y: 16px;
	}

	/* История */
	.club-page__content {
		--container-padding-x: 8px;
		--container-padding-y: 16px;
	}

	/* Игрок на планшете */
	.player-page {
		--container-padding-x: 20px;
	}

	/* Матч на планшете */
	.match-page {
		--container-padding-x: 1.5rem;
		--container-padding-y: 1rem;
	}
}

@media (max-width: 480px) {
	/* Мобильный */
	.calendar-page,
	.news-page,
	.teams-section,
	.standings-page,
	.club-page {
		--container-padding-x: 4px;
		--container-padding-y: 12px;
	}

	/* История */
	.club-page__content {
		--container-padding-x: 4px;
		--container-padding-y: 12px;
	}

	/* Игрок на мобильном */
	.player-page {
		--container-padding-x: 12px;
	}

	/* Матч на мобильном */
	.match-page {
		--container-padding-x: 0.5rem;
		--container-padding-y: 0.5rem;
	}
}
