/* css/v5-frames.css */

/* ============================================================
   FRAMES — базовые каркасные элементы
   header / body / footer / separators
   ============================================================ */

/* ============================================================
   HEADER — верхний блок (row, фиксированная высота)
   ============================================================ */

.v5-frame-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--v5-gap-normal);
    padding: var(--v5-padding);
    flex-shrink: 0;
    height: var(--v5-height-large);
    min-height: var(--v5-height-large);
    max-height: var(--v5-height-large);
    border-bottom: var(--v5-border-width) solid var(--v5-primary-base);

}

.v5-frame-header .v5-icon {
    height: calc(32px * var(--v5-scale));
    width: calc(32px * var(--v5-scale));
    flex-shrink: 0;
}


/* ============================================================
   BODY — растягивающийся блок
   ============================================================ */

.v5-frame-body {
    display: flex;
    gap: var(--v5-gap-normal);
    padding: var(--v5-padding);
    flex: 1;
    /*padding-bottom: calc(var(--v5-padding) + var(--v5-scrollbar-height));*/
    min-height: 34px;
    min-width: 0;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
}

/* Колонка + вертикальный скролл */
.v5-frame-body--col {
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Строка + горизонтальный скролл */
.v5-frame-body--row {
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}

/* ============================================================
   FRAME-BODY -- FIT — без padding и gap (для PDF, iframe)
   ============================================================ */

.v5-frame-body--fit {
    padding: 0;
    gap: 0;
    overflow: hidden;
}
/*
.v5-frame-body::-webkit-scrollbar {
    width: 6px; height: 6px;
}

.v5-frame-body::-webkit-scrollbar-track {
    background: transparent;
}

.v5-frame-body::-webkit-scrollbar-thumb {
    background: var(--v5-primary-secondary);
    border-radius: calc(var(--v5-scrollbar-width) / 2);
}

.v5-frame-body::-webkit-scrollbar-thumb:hover {
    background: var(--v5-primary-base);
}
*/
/* ============================================================
   FOOTER — нижний блок (row, фиксированная высота)
   ============================================================ */

.v5-frame-footer {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--v5-gap-normal);
    padding: var(--v5-padding);
    flex-shrink: 0;
    height: var(--v5-height-large);
    min-height: var(--v5-height-large);
    max-height: var(--v5-height-large);
    border-top: var(--v5-border-width) solid var(--v5-primary-base);
}

/* ============================================================
   SEPARATORS
   ============================================================ */

.v5-separator-h {
    width: 100%;
    height: var(--v5-border-width);
    background: var(--v5-primary-base);
    flex-shrink: 0;
}

.v5-separator-v {
    height: 100%;
    width: var(--v5-border-width);
    background: var(--v5-primary-base);
    flex-shrink: 0;
}