/* ================================
   ОБЩИЕ СТИЛИ ДЛЯ WRAPPER
   ================================ */

/* Контейнер для блоков - необходим для FLOAT блоков */
.page-content {
    position: relative; /* Для позиционирования FLOAT блоков */
    min-height: 100vh; /* Минимальная высота для FLOAT блоков */
}

/* ================================
   0_wrapper.php - Внешний блок
   ================================ */

/* Отключенный блок (enabled: false) */
.block.disabled {
    display: none !important; /* Полностью скрываем блок */
}

/* Внешний блок */
.block {
    min-width: 0;
    margin: 0;
    border: 1px solid #1a1a1a;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 14px); /* Дефолт: полная высота */
    box-sizing: border-box;
    flex-shrink: 0; /* Сохраняем расчётную ширину блока, чтобы работал горизонтальный скролл */
}

/* ================================
   SIZE - Управление высотой блока
   ================================ */

/* SIZE: 1 (100% высоты) */
.block[data-size="1"] {
    height: calc(100vh - 14px);
}

/* SIZE: 2/3 (67% высоты) */
.block[data-size="2/3"] {
    height: calc(67vh - 14px);
}

/* SIZE: 1/2 (50% высоты) */
.block[data-size="1/2"] {
    height: calc(50vh - 14px);
}

/* SIZE: 1/3 (33% высоты) */
.block[data-size="1/3"] {
    height: calc(33vh - 14px);
}

/* Свернутый блок */
.block.collapsed {
    height: auto;
}

/* Для BOTTOM: свернутый блок сохраняет высоту SIZE, чтобы таб прижался к низу */
.block.position-bottom.collapsed[data-size="1"] {
    height: calc(100vh - 14px);
    border: none;
    background: transparent;
}

.block.position-bottom.collapsed[data-size="2/3"] {
    height: calc(67vh - 14px);
    border: none;
    background: transparent;
}

.block.position-bottom.collapsed[data-size="1/2"] {
    height: calc(50vh - 14px);
    border: none;
    background: transparent;
}

.block.position-bottom.collapsed[data-size="1/3"] {
    height: calc(33vh - 14px);
    border: none;
    background: transparent;
}

/* Скрываем контент когда блок свернут */
.block.collapsed .content-block {
    display: none;
}

/* Внутреннее содержимое */
.content-block {
    font-size: 13px;
    color: #333;
    padding: 0px;
    background: #f9f9f9;
    margin: 0;
    flex: 1;
    overflow-y: auto;
}

/* ================================
   ПОЗИЦИОНИРОВАНИЕ БЛОКОВ
   ================================ */

/* Горизонтальное выравнивание (left/center/right) */
.block.position-left {
    order: 1; /* Блоки слева идут первыми */
}

.block.position-center {
    order: 2; /* Блоки по центру идут вторыми */
}

.block.position-right {
    order: 3; /* Блоки справа идут последними */
}

/* Вертикальное позиционирование: BOTTOM - прижат к низу */
.block.position-bottom {
    margin-top: auto; /* Прижимаем блок к низу */
}

/* Вертикальное положение таба (top/bottom/fixed) */

/* TOP - таб вверху (по умолчанию, ничего не меняем) */
.block.position-top {
    /* Таб уже вверху по умолчанию */
}

/* BOTTOM - таб внизу */
.block.position-bottom .tab {
    order: 2; /* Таб идёт вниз */
    padding: 5px 8px; /* Увеличиваем высоту на 10px (5px сверху + 5px снизу) */
}

.block.position-bottom .content-block {
    order: 1; /* Контент идёт вверх */
}

/* FIXED - блок всегда открыт, не сворачивается */
.block.position-fixed {
    /* Стили как обычно, JS отключит сворачивание */
}

/* Для BOTTOM: когда блок свернут, скрываем content-block */
.block.position-bottom.collapsed .content-block {
    display: none;
}

/* Для BOTTOM: когда блок свернут, прижимаем таб к низу */
.block.position-bottom.collapsed .tab {
    margin-top: auto; /* Прижимаем таб к низу блока */
}

/* ================================
   FLOAT БЛОКИ (вырываются из потока)
   ================================ */

/* Базовые стили для FLOAT блока */
.block.float {
    position: absolute;
    z-index: 100; /* Всегда сверху */
}

/* Горизонтальное позиционирование FLOAT блоков */
.block.float.position-left {
    left: 0; /* Прижат к левому краю */
}

.block.float.position-center {
    left: 0;
    right: 0;
    margin-left: auto; /* Центрируем */
    margin-right: auto;
}

.block.float.position-right {
    right: 0; /* Прижат к правому краю */
}

/* Вертикальное позиционирование FLOAT блоков */
.block.float.position-top {
    top: 14px; /* Отступ от header */
}

.block.float.position-bottom {
    bottom: 0; /* Прижат к низу */
}

.block.float.position-fixed {
    top: 14px; /* Всегда вверху */
}

/* FLOAT блок bottom в collapsed состоянии */
.block.float.position-bottom.collapsed {
    bottom: 0; /* Таб остается внизу */
    height: auto; /* Высота по контенту (только таб) */
    border: none; /* Убираем бордер */
    background: transparent; /* Прозрачный фон */
}