@charset "UTF-8"; /*# The coding page CSS */
/**
 * =============================================================================
 * @encoding UTF-8
 * @author [Zerohold](//zerohold.sd1.su)
 * @project [Telega FM](//telega.fm)
 * @summary Стили для темы оформления проекта
 * @created 2025-10
 * @modified 2025-10
 *
 * @file D:\controls-psr\telega.fm\cdn.telega.fm\css\themes\telega.css
 * @link https://cdn.telega.fm/css/telega.css
 *
 * @remarks
 * - Тема для главной страницы проекта в мессенджер стиле
 * - Цвета в стиле Telegram с теплыми тонами
 * =============================================================================
 */

/* ОСНОВНЫЕ ПЕРЕМЕННЫЕ ТЕМЫ */
body[data-theme="telegafm"]
{
  /* Базовые цвета (base colors) */
  --primary: #027C64;
  --primary-hover: #026B56;
  --primary-dark: #015A47;
  --secondary: #6b7280;
  --secondary-hover: #4b5563;
  --success: #10b981;
  --success-hover: #059669;
  --warning: #f59e0b;
  --warning-hover: #d97706;
  --danger: #ef4444;
  --danger-hover: #dc2626;
  --info: #06b6d4;
  --info-hover: #0891b2;

  /* Цвета фона (background colors) */
  --bg-primary: #FFFFFF;
  --bg-secondary: #F0F0F0;
  --bg-tertiary: #F8F8F8;
  --bg-accent: #E5DDD5;

  /* Цвета текста (text colors) */
  --text-primary: #000000;
  --text-secondary: #475569;
  --text-muted: #A0A0A0;
  --text-inverse: #ffffff;

  /* Цвета границ (border colors) */
  --border-color: #E0E0E0;
  --border-color-hover: #027C64;

  /* Цвета Header & Footer */
  --header-footer-bg-color: #F0F0F0;
  --header-footer-bg-image: none;
  --header-footer-border-color: #E0E0E0;

  /* Цвета для Header компонентов */
  --bg-header: #F0F0F0;
  --text-header: #000000;
  --bg-feed: #FFFFFF;
  --bg-date: #E5DDD5;
  --text-meta: #64748B;
  --bg-post: #FFFFFF;
  --border-color: #E0E0E0;
  --bg-post-hover: #F8F8F8;
  --border-color-hover: #027C64;
  --text-channel: #027C64;
  --text-post: #000000;
  --text-link: #027C64;
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.1);

  /* Цвета теней (shadow colors) */
  --shadow-color: rgba(0, 0, 0, 0.1);

  /* Хлебные крошки (breadcrumbs) */
  --breadcrumb-bg-start: #F8F8F8;
  --breadcrumb-bg-end: #E0E0E0;
  --breadcrumb-border: #CBD5E1;
  --breadcrumb-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  --breadcrumb-color: #475569;
  --breadcrumb-link-color: #027C64;
  --breadcrumb-link-hover-color: #026B56;
  --breadcrumb-link-hover-bg: rgba(2, 124, 100, 0.1);
  --breadcrumb-divider-color: #64748B;

  /* Цвета уведомлений (Alert Colors) */
  --alert-blue-bg: #E0F2FE;
  --alert-blue-border: #7DD3FC;
  --alert-blue-text: #0C4A6E;
  --alert-yellow-bg: #FEF9C3;
  --alert-yellow-border: #FDE047;
  --alert-yellow-text: #854D0E;
  --alert-green-bg: #DCFCE7;
  --alert-green-border: #86EFAC;
  --alert-green-text: #166534;
  --alert-purple-bg: #F5D0FE;
  --alert-purple-border: #F0ABFC;
  --alert-purple-text: #701A75;
  --alert-indigo-bg: #E0E7FF;
  --alert-indigo-border: #A5B4FC;
  --alert-indigo-text: #3730A3;
  --alert-gray-bg: #F3F4F6;
  --alert-gray-border: #D1D5DB;
  --alert-gray-text: #374151;
  --alert-red-bg: #FEE2E2;
  --alert-red-border: #FCA5A5;
  --alert-red-text: #991B1B;

  /* Содержание статьи (supply) */
  --supply-bg: #F8F8F8;
  --supply-border-color: #E0E0E0;
  --supply-header-text-color: #000000;
  --supply-indicator-color: #027C64;
  --supply-link-color: #475569;
  --supply-link-hover-color: #027C64;
  --supply-link-hover-bg: rgba(2, 124, 100, 0.1);
  --supply-number-color: #027C64;
  --supply-sub-number-color: #64748B;
}

/* КОМПОНЕНТЫ */

/* Уведомления (Alerts) */
body[data-theme="telegafm"] .alert-success
{
  color: #166534;
  background-color: #DCFCE7;
  border-color: #86EFAC;
}

body[data-theme="telegafm"] .alert-warning
{
  color: #854D0E;
  background-color: #FEF9C3;
  border-color: #FDE047;
}

body[data-theme="telegafm"] .alert-danger
{
  color: #991B1B;
  background-color: #FEE2E2;
  border-color: #FCA5A5;
}

body[data-theme="telegafm"] .alert-info
{
  color: #0C4A6E;
  background-color: #E0F2FE;
  border-color: #7DD3FC;
}

/* Оверлей загрузки (Loading Overlay) */
body[data-theme="telegafm"] .loading-overlay
{
  background-color: rgba(255, 255, 255, 0.8);
}

/* Кнопки прокрутки (Scroll Controls) */
body[data-theme="telegafm"] .scroll-control
{
  background-color: rgba(240, 240, 240, 0.9);
}

body[data-theme="telegafm"] .scroll-control:hover
{
  background-color: #F0F0F0;
}

body[data-theme="telegafm"] .scroll-btn:hover
{
  background-color: #E5DDD5;
}

/* Элементы форм (Form Controls) */
body[data-theme="telegafm"] .form-select
{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

body[data-theme="telegafm"] .form-input:focus,
body[data-theme="telegafm"] .form-textarea:focus,
body[data-theme="telegafm"] .form-select:focus,
body[data-theme="telegafm"] .form-input.focus
{
  border-color: #027C64;
  box-shadow: 0 0 0 2px rgba(2, 124, 100, 0.25);
}

/* Фокус кнопок (Button Focus) */
body[data-theme="telegafm"] .btn:focus
{
  box-shadow: 0 0 0 2px rgba(2, 124, 100, 0.25);
}

/* Модальное окно (Modal) */
body[data-theme="telegafm"] .modal
{
  background-color: rgba(0, 0, 0, 0.5);
}

/* Зона для перетаскивания файлов (Drop Zone) */
body[data-theme="telegafm"] .drop-zone:hover
{
  border-color: #027C64;
}

body[data-theme="telegafm"] .drop-zone.dragover
{
  border-color: #027C64;
  background-color: rgba(2, 124, 100, 0.05);
  color: #027C64;
}

/* Переключатель тем (Theme Switcher) */
body[data-theme="telegafm"] .theme-option:hover
{
  background-color: #E5DDD5;
}

body[data-theme="telegafm"] .theme-option.active
{
  background-color: #027C64;
  color: #FFFFFF;
}

body[data-theme="telegafm"] .theme-switcher-modal .theme-option:hover
{
  background-color: #E5DDD5;
}

body[data-theme="telegafm"] .theme-switcher-modal .theme-option.active
{
  background-color: #027C64;
  color: #FFFFFF;
}

/* Спиннер (Spinner) */
body[data-theme="telegafm"] .spinner
{
  border-color: #E0E0E0;
  border-top-color: #027C64;
}

/* Кнопки в шапке (Header Buttons) */
body[data-theme="telegafm"] .header-btn:hover
{
  background-color: rgba(2, 124, 100, 0.1);
}

/* Элементы карточек (Card Elements) */
body[data-theme="telegafm"] .card-header,
body[data-theme="telegafm"] .card-footer
{
  background-color: #F8F8F8;
  background-image: none;
  border-color: #E0E0E0;
  color: #000000;
}

body[data-theme="telegafm"] .card-header
{
  border-bottom-color: #E0E0E0;
}

body[data-theme="telegafm"] .card-footer
{
  border-top-color: #E0E0E0;
}

/* Элементы модального окна (Modal Elements) */
body[data-theme="telegafm"] .modal-header,
body[data-theme="telegafm"] .modal-footer
{
  background-color: #F0F0F0;
  background-image: none;
  border-color: #E0E0E0;
  color: #000000;
}

body[data-theme="telegafm"] .modal-header
{
  border-bottom-color: #E0E0E0;
}

body[data-theme="telegafm"] .modal-footer
{
  border-top-color: #E0E0E0;
}

/* Хлебные крошки (Breadcrumbs) */
body[data-theme="telegafm"] .breadcrumb-item a
{
  color: #027C64;
}

body[data-theme="telegafm"] .breadcrumb-item a:hover
{
  color: #026B56;
}

body[data-theme="telegafm"] .breadcrumb-item.active
{
  color: #A0A0A0;
}

body[data-theme="telegafm"] .breadcrumb-arrow .breadcrumb-item:not(:last-child)::after
{
  color: #027C64;
}

body[data-theme="telegafm"] .breadcrumb-pills .breadcrumb-item a
{
  background-color: #F8F8F8;
  color: #475569;
}

body[data-theme="telegafm"] .breadcrumb-pills .breadcrumb-item a:hover
{
  background-color: rgba(2, 124, 100, 0.1);
}

body[data-theme="telegafm"] .breadcrumb-pills .breadcrumb-item.active
{
  background-color: #027C64;
  color: #FFFFFF;
}

/* Таблицы (Tables) */
body[data-theme="telegafm"] .param-table
{
  background-color: #FFFFFF;
  border-color: #E0E0E0;
}

body[data-theme="telegafm"] .param-table th
{
  background-color: #F8F8F8;
  color: #000000;
  border-color: #E0E0E0;
}

body[data-theme="telegafm"] .param-table td
{
  border-color: #E0E0E0;
  color: #000000;
}

body[data-theme="telegafm"] .param-table tbody tr:hover
{
  background-color: #F0F0F0;
}

body[data-theme="telegafm"] .param-table tbody tr:nth-child(even)
{
  background-color: #F8F8F8;
}

/* Эффект мерцания (Shimmer Effect) */
body[data-theme="telegafm"] .shimmer
{
  background-image: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, 0.1) 50%, transparent 100%);
}

/* Логотип в шапке (Header Logo) */
body[data-theme="telegafm"] .header-logo
{
  background-image: url("data:image/svg+xml,%3csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='16' cy='16' r='16' fill='%230088cc'/%3e%3cpath d='M7 15.5L25 8L20 24L15 17L7 15.5Z' fill='white'/%3e%3cpath d='M15 17L20 24L17.5 19.5L15 17Z' fill='%23cce6ff'/%3e%3crect x='5' y='20' width='12' height='2' rx='1' fill='white' opacity='0.8'/%3e%3crect x='5' y='24' width='8' height='2' rx='1' fill='white' opacity='0.6'/%3e%3c/svg%3e");
}