html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
    outline: none;
    box-shadow: none;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

/* --- FIX MAGASSÁG BEÁLLÍTÁSA A PANELEKNEK --- */

/* 1. LÉPÉS: A két panel belső tartalmának adunk egy fix magasságot.
   Ez az érték (pl. 500px vagy 65vh) tetszőlegesen módosítható.
   Az 'overflow-y: auto' biztosítja, hogy a gördítősáv csak akkor jelenjen meg,
   ha a tartalom valóban hosszabb, mint a rendelkezésre álló hely. */

#editor-column .card-body {
    height: 100vh; /* A nézetablak magasságának 100%-a */
    overflow-y: auto;
}

/* 2. LÉPÉS: Biztosítjuk, hogy a CodeMirror kitöltse a szülőjének
   (a .card-body-nak) a most már fix magasságát. */
.CodeMirror {
    height: 100%;
}


#description-column {
    max-height: 60vh;
    overflow-y: auto;
}
#editor-column {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* --- ÚJ RÉSZ: FELADATLEÍRÁS MAGASSÁGÁNAK MAXIMALIZÁLÁSA --- */
#feladatLeiras {
    max-height: 30vh; /* A nézetablak magasságának maximum 30%-a */
    overflow-y: auto; /* Gördítősáv hozzáadása, ha a tartalom túlcsordul */
}

/* ALSÓ SOR magasságának beállítása */
#munkaterulet .row:last-child {
    height: calc(100vh - 300px); /* fejléced + leírás magassága */
    min-height: 300px;
}

/* Oszlopok kitöltik a sort */
#munkaterulet .col-md-8,
#munkaterulet .col-md-4 {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Kártya és card-body kitölti a helyet */
#munkaterulet .card.h-100,
#munkaterulet .card-body.d-flex {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* CodeMirror kitölti a card-body-t */
.CodeMirror {
    height: 100% !important;
    min-height: 200px;
}
#codeEditor {
    flex-grow: 1;
    width: 100%;
    min-height: 200px;
}

/* Oldalsó menü alapból minimális szélességű */
#accordionSidebar {
    width: 70px !important;
    transition: width 0.3s;
    overflow-x: hidden;
}

/* Ha az egér fölé viszed, kitágul */
#accordionSidebar:hover {
    width: 250px !important;
}

/* Menü szövegek elrejtése alapból, hover-re mutatás */
#accordionSidebar .sidebar-brand-text,
#accordionSidebar .nav-link span {
    opacity: 0;
    transition: opacity 0.3s;
    white-space: nowrap;
}

#accordionSidebar:hover .sidebar-brand-text,
#accordionSidebar:hover .nav-link span {
    opacity: 1;
}
