/*
 * =========================================================
 * ОСНОВНЫЕ ВКЛАДКИ ПРИЛОЖЕНИЯ
 * =========================================================
 */

.main-tabs {
    display: flex;
    gap: 2px;

    margin-bottom: 15px;

    border-bottom: 1px solid #ccc;
}


.main-tab {
    padding: 10px 20px;

    border: 1px solid #ccc;
    border-bottom: none;

    border-radius: 5px 5px 0 0;

    background: #e9e9e9;

    color: #444;

    font-size: 14px;

    cursor: pointer;
}


.main-tab:hover {
    background: #dedede;
}


/*
 * Активная вкладка
 */

.main-tab.active {
    background: #ffffff;

    color: #222;

    font-weight: bold;

    position: relative;

    bottom: -1px;
}


/*
 * =========================================================
 * Содержимое вкладок
 * =========================================================
 */

.tab-content {
    display: none;
}


.tab-content.active {
    display: block;
}


/*
 * =========================================================
 * Заглушки будущих разделов
 * =========================================================
 */

.future-tab-placeholder {
    min-height: 300px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #ffffff;

    border: 1px solid #ccc;
    border-radius: 4px;

    color: #888;

    font-size: 16px;
}