/* Teljesen átlátszó hártya, homályosítás nélkül */
#szaki-panel-halyog, #szaki-hl-halyog {
    display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0,0); z-index: 99998; 
}

/* Beúszó panel (500px széles) */
#szaki-globalis-szerkeszto, #szaki-hl-panel {
    position: fixed; top: 0; left: 0; width: 500px; max-width: 100vw; height: 100%;
    background: #fff; box-shadow: 5px 0 25px rgba(0,0,0,0.15); padding: 30px 20px;
    z-index: 99999; font-family: inherit; box-sizing: border-box; overflow-y: auto;
    transform: translateX(-105%); transition: transform 0.3s ease-in-out;
}
#szaki-globalis-szerkeszto.nyitva, #szaki-hl-panel.nyitva {
    transform: translateX(0);
}

.szaki-dinamikus-csoport, .szaki-hl-csoport { margin-bottom: 20px; }
.szaki-dinamikus-label, .szaki-hl-label { display: block; margin-bottom: 8px; font-weight: 400; font-size: 15px; color: #000; letter-spacing: 0.5px;}
.szaki-dinamikus-input, .szaki-hl-input { width: 100%; padding: 0 16px; min-height:45px; border: 1px solid #ccc; border-radius: 8px; font-size: 15px; box-sizing: border-box; font-family: inherit; transition: border-color 0.2s;}
.szaki-dinamikus-input:focus, .szaki-hl-input:focus { border-color: #0F2532; outline: none; }
textarea.szaki-dinamikus-input, textarea.szaki-hl-input { resize: vertical; min-height: 100px; padding-top: 12px;}

/* Gombok formázása */
#szaki-szerkeszto-mentes, #szaki-hl-mentes {
    background: #0F2532; color: #fff; border: none; padding: 14px 20px; border-radius: 50px; 
    width: 100%; font-weight: 400; cursor: pointer; font-size: 16px; margin-top: 10px; 
    text-align: center; transition: background-color 0.2s ease, opacity 0.2s;
}
#szaki-szerkeszto-mentes:hover, #szaki-hl-mentes:hover {
    background: #233D4C;
}
#szaki-szerkeszto-megsem, #szaki-hl-megsem {
    background: transparent; color: #888; border: none; padding: 12px 20px; 
    width: 100%; margin-top: 5px; cursor: pointer; font-size: 14px; font-weight: 400;
    text-align: center; transition: color 0.2s ease;
}
#szaki-szerkeszto-megsem:hover, #szaki-hl-megsem:hover {
    color: #333;
}

/* Bezáró X a Headless panelhez */
#szaki-hl-bezaro-x {
    position: absolute; top: 20px; right: 20px; cursor: pointer; color: #999;
}
#szaki-hl-bezaro-x:hover { color: #333; }
#szaki-hl-cim { margin-top:0; margin-bottom:25px; color:#111; font-size: 22px; font-weight:700; }
.szaki-hl-alcim { margin-top:-20px; margin-bottom:20px; color:#666; font-size: 14px; }