/* ====================================================================
   APDM Frontend Structure CSS v4.1.0
   Базовые структурные стили (БЕЗ дизайна)
   Дизайн-стили генерируются динамически через PHP
   ==================================================================== */

/* ====================================================================
   ОСНОВНЫЕ КОНТЕЙНЕРЫ
   ==================================================================== */

.aepb-page-content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* Базовые стили для всех блоков (БЕЗ дизайна) */
.aepb-block {
    width: 100%;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    /* Дизайн-стили добавляются через APDM PHP */
}

/* ====================================================================
   ВЫРАВНИВАНИЕ И ПОЗИЦИОНИРОВАНИЕ
   ==================================================================== */

.aepb-align-left { 
    text-align: left !important; 
}

.aepb-align-center { 
    text-align: center !important; 
}

.aepb-align-right { 
    text-align: right !important; 
}

/* ====================================================================
   RICH TEXT BLOCKS - Только структура
   ==================================================================== */

.aepb-rich-text-block {
    line-height: 1.7;
    font-size: 16px;
    /* Цвета и фоны задаются через APDM */
}

.aepb-rich-text-block h1,
.aepb-rich-text-block h2,
.aepb-rich-text-block h3,
.aepb-rich-text-block h4,
.aepb-rich-text-block h5,
.aepb-rich-text-block h6 {
    margin-top: 0;
    margin-bottom: 20px;
    line-height: 1.3;
    font-weight: 700;
    /* Цвета наследуются от APDM */
}

.aepb-rich-text-block h1 { font-size: 2.5em; }
.aepb-rich-text-block h2 { font-size: 2.1em; }
.aepb-rich-text-block h3 { font-size: 1.8em; }
.aepb-rich-text-block h4 { font-size: 1.5em; }
.aepb-rich-text-block h5 { font-size: 1.3em; }
.aepb-rich-text-block h6 { font-size: 1.1em; }

.aepb-rich-text-block p {
    margin: 0 0 20px 0;
    line-height: 1.7;
    /* Цвет наследуется от APDM */
}

.aepb-rich-text-block ul,
.aepb-rich-text-block ol {
    margin: 0 0 20px 0;
    padding-left: 30px;
}

.aepb-rich-text-block li {
    margin-bottom: 8px;
    line-height: 1.6;
    /* Цвет наследуется от APDM */
}

.aepb-rich-text-block a {
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: all 0.3s ease;
    /* Цвета управляются через APDM */
}

.aepb-rich-text-block a:hover {
    border-bottom-color: currentColor;
}

.aepb-rich-text-block table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    border-radius: 8px;
    overflow: hidden;
    /* Фон и цвета через APDM */
}

.aepb-rich-text-block th,
.aepb-rich-text-block td {
    padding: 12px 15px;
    text-align: left;
    /* Границы и цвета через APDM */
}

.aepb-rich-text-block th {
    font-weight: 600;
    /* Фон и цвета через APDM */
}

.aepb-rich-text-block blockquote {
    margin: 30px 0;
    padding: 20px 30px;
    font-style: italic;
    font-size: 1.1em;
    /* Фон, границы и цвета через APDM */
}

/* ====================================================================
   IMAGE BLOCKS - Только позиционирование
   ==================================================================== */

.aepb-image-block {
    text-align: center;
}

.aepb-image-block.aepb-align-left {
    text-align: left;
}

.aepb-image-block.aepb-align-right {
    text-align: right;
}

.aepb-image {
    max-width: 100%;
    height: auto;
    display: block;
    /* Стили (радиусы, тени, hover) управляются через APDM */
}

.aepb-align-center .aepb-image {
    margin: 0 auto;
}

.aepb-align-left .aepb-image {
    margin: 0 auto 0 0;
}

.aepb-align-right .aepb-image {
    margin: 0 0 0 auto;
}

/* ====================================================================
   TEXT + IMAGE BLOCKS - Flexbox структура
   ==================================================================== */

.aepb-text-image-block {
    display: flex;
    gap: 30px;
    align-items: flex-start;
    /* Цвета и фоны через APDM */
}

.aepb-layout-image-left {
    flex-direction: row;
}

.aepb-layout-image-right {
    flex-direction: row-reverse;
}

.aepb-layout-image-top {
    flex-direction: column;
}

.aepb-layout-image-bottom {
    flex-direction: column-reverse;
}

.aepb-text-content {
    flex: 1;
    min-width: 0; /* Prevents flex items from overflowing */
}

.aepb-image-content {
    flex: 0 0 auto;
}

/* ====================================================================
   GALLERY BLOCKS - Grid структура
   ==================================================================== */

.aepb-gallery-block {
    display: grid;
    gap: 20px;
    /* Фон, отступы, цвета через APDM */
}

.aepb-gallery-block[data-columns="2"] {
    grid-template-columns: repeat(2, 1fr);
}

.aepb-gallery-block[data-columns="3"] {
    grid-template-columns: repeat(3, 1fr);
}

.aepb-gallery-block[data-columns="4"] {
    grid-template-columns: repeat(4, 1fr);
}

.aepb-gallery-block[data-columns="6"] {
    grid-template-columns: repeat(6, 1fr);
}

.aepb-gallery-item {
    position: relative;
    overflow: hidden;
    /* Радиусы через APDM */
}

.aepb-gallery-item img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: all 0.3s ease;
    /* Hover эффекты через APDM */
}

/* ====================================================================
   BUTTON BLOCKS - Только позиционирование
   ==================================================================== */

.aepb-button-block {
    text-align: center;
}

.aepb-button-block.aepb-align-left {
    text-align: left;
}

.aepb-button-block.aepb-align-right {
    text-align: right;
}

.aepb-button {
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    border: none;
    text-align: center;
    position: relative;
    overflow: hidden;
    vertical-align: middle;
    transition: all 0.3s ease;
    /* ВСЕ стили (цвета, размеры, радиусы) через APDM */
}

.aepb-button:hover {
    text-decoration: none;
}

/* ====================================================================
   SHORTCODE BLOCKS
   ==================================================================== */

.aepb-shortcode-block {
    position: relative;
    /* Стили через APDM */
}

/* ====================================================================
   HTML BLOCKS
   ==================================================================== */

.aepb-html-block {
    position: relative;
    /* Стили через APDM */
}

.aepb-html-block > * {
    max-width: 100%;
}

/* ====================================================================
   COLUMN BLOCKS - Grid структура
   ==================================================================== */

.aepb-columns-block {
    display: grid;
    gap: 30px;
    /* Фон, отступы, цвета через APDM */
}

.aepb-columns-block[data-columns="2"] {
    grid-template-columns: repeat(2, 1fr);
}

.aepb-columns-block[data-columns="3"] {
    grid-template-columns: repeat(3, 1fr);
}

.aepb-columns-block[data-columns="4"] {
    grid-template-columns: repeat(4, 1fr);
}

.aepb-column {
    position: relative;
    /* Цвета через APDM */
}

.aepb-column h1,
.aepb-column h2,
.aepb-column h3,
.aepb-column h4,
.aepb-column h5,
.aepb-column h6 {
    margin-top: 0;
    /* Цвета через APDM */
}

.aepb-column p {
    line-height: 1.7;
    margin-bottom: 15px;
    /* Цвета через APDM */
}

.aepb-column a {
    text-decoration: none;
    transition: color 0.3s ease;
    /* Цвета через APDM */
}

/* ====================================================================
   RESPONSIVE DESIGN - Структурные изменения
   ==================================================================== */

/* Tablet */
@media (max-width: 1024px) {
    .aepb-page-content {
        padding: 0 15px;
    }
    
    .aepb-text-image-block {
        gap: 25px;
    }
    
    .aepb-gallery-block {
        gap: 15px;
    }
    
    .aepb-gallery-block[data-columns="4"],
    .aepb-gallery-block[data-columns="6"] {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .aepb-columns-block {
        gap: 25px;
    }
    
    .aepb-gallery-item img {
        height: 200px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .aepb-page-content {
        padding: 0 10px;
    }
    
    .aepb-rich-text-block h1 { font-size: 2.2em; }
    .aepb-rich-text-block h2 { font-size: 1.9em; }
    .aepb-rich-text-block h3 { font-size: 1.6em; }
    
    /* Text + Image становится стековым на мобильных */
    .aepb-text-image-block {
        flex-direction: column !important;
        gap: 20px;
    }
    
    .aepb-text-content,
    .aepb-image-content {
        width: 100%;
    }
    
    /* Колонки становятся одиночными */
    .aepb-columns-block {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }
    
    /* Галереи адаптируются */
    .aepb-gallery-block[data-columns="3"],
    .aepb-gallery-block[data-columns="4"],
    .aepb-gallery-block[data-columns="6"] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .aepb-gallery-item img {
        height: 150px;
    }
    
    /* Кнопки становятся блочными */
    .aepb-button {
        display: block;
        width: 100%;
        max-width: 300px;
        margin: 0 auto;
    }
    
    .aepb-button-block.aepb-align-left .aepb-button,
    .aepb-button-block.aepb-align-right .aepb-button {
        margin: 0 auto;
    }
    
    /* Таблицы */
    .aepb-rich-text-block table {
        font-size: 14px;
    }
    
    .aepb-rich-text-block th,
    .aepb-rich-text-block td {
        padding: 8px 10px;
    }
}

/* Small Mobile */
@media (max-width: 480px) {
    .aepb-rich-text-block h1 { font-size: 1.8em; }
    .aepb-rich-text-block h2 { font-size: 1.6em; }
    .aepb-rich-text-block h3 { font-size: 1.4em; }
    
    .aepb-gallery-block[data-columns="2"],
    .aepb-gallery-block[data-columns="3"],
    .aepb-gallery-block[data-columns="4"],
    .aepb-gallery-block[data-columns="6"] {
        grid-template-columns: 1fr;
    }
    
    .aepb-gallery-item img {
        height: 200px;
    }
    
    /* Делаем таблицы прокручиваемыми горизонтально */
    .aepb-rich-text-block table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        font-size: 13px;
    }
    
    .aepb-text-image-block {
        gap: 15px;
    }
    
    .aepb-columns-block {
        gap: 15px;
    }
}

/* ====================================================================
   UTILITIES - Служебные классы
   ==================================================================== */

/* Clearfix для старых браузеров */
.aepb-clearfix::after {
    content: "";
    display: table;
    clear: both;
}

/* Скрытие элементов */
.aepb-hidden {
    display: none !important;
}

/* Отступы */
.aepb-no-margin {
    margin: 0 !important;
}

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

/* ====================================================================
   PRINT STYLES - Стили для печати
   ==================================================================== */

@media print {
    .aepb-page-content {
        padding: 0;
        max-width: none;
    }
    
    .aepb-block {
        break-inside: avoid;
        page-break-inside: avoid;
    }
    
    .aepb-button {
        display: none;
    }
    
    .aepb-rich-text-block img,
    .aepb-image-block img,
    .aepb-text-image-block img,
    .aepb-gallery-item img {
        max-width: 100% !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }
    
    .aepb-text-image-block,
    .aepb-columns-block {
        flex-direction: column;
        grid-template-columns: 1fr;
    }
    
    .aepb-column {
        box-shadow: none !important;
        border: 1px solid #ccc;
        break-inside: avoid;
        page-break-inside: avoid;
    }
    
    /* Убираем все тени и эффекты для печати */
    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }
}

/* ====================================================================
   ACCESSIBILITY - Доступность
   ==================================================================== */

/* Фокус для навигации с клавиатуры */
.aepb-button:focus {
    outline: 3px solid rgba(0, 123, 255, 0.5);
    outline-offset: 2px;
}

/* Улучшенная читаемость */
.aepb-rich-text-block {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Плавные переходы для анимаций */
@media (prefers-reduced-motion: reduce) {
    .aepb-block,
    .aepb-button,
    .aepb-image,
    .aepb-gallery-item img {
        transition: none !important;
        animation: none !important;
    }
}

/* ====================================================================
   PERFORMANCE - Оптимизация производительности
   ==================================================================== */

/* GPU ускорение для анимаций */
.aepb-button,
.aepb-image,
.aepb-gallery-item img {
    will-change: transform;
}

/* Сглаживание шрифтов */
.aepb-rich-text-block,
.aepb-button {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ====================================================================
   КОНЕЦ ФАЙЛА
   
   ВАЖНО: Этот файл содержит ТОЛЬКО структурные стили
   Все дизайн-стили (цвета, фоны, тени, эффекты) генерируются
   динамически через PHP в плагине APDM и выводятся в <head>
   ==================================================================== */