/**
 * Project: Forum 2026 - Speakers Section Fix
 */


 .speakers-section{
    padding-top: 20px;
    padding-bottom: 20px;
 }

/* Kontener: Resetujemy do układu poziomego */
.speakers-section-header.wp-block-group.is-layout-flex {
    display: flex !important;
    flex-direction: row; /* Układ obok siebie */
    flex-wrap: nowrap !important; /* Blokujemy przeskakiwanie do nowej linii na desktopie */
    justify-content: space-between;
    align-items: flex-end; /* Wyrównanie do dołu, jak na załączonym obrazku */
    gap: 40px; /* Odstęp między tekstem a nagłówkiem */
}

.speakers-section-header{
    
    padding-bottom: 60px;
}

/* Nagłówek: Usuwamy 100% szerokości */
.speakers-section-header .wp-block-heading {
    color: var(--h1-text-color); 
    font-family: var(--font-primary);
    font-size: var(--h1-font-size);
    line-height: var(--h1-line-height);
    font-weight: var(--h1-font-weight);
    

    flex: 0 1 auto; /* Nie zajmuje 100%, tylko tyle ile potrzebuje */
    margin: 0;
    white-space: nowrap; /* Zapobiega łamaniu "2026" do nowej linii jeśli jest miejsce */
}
.speakers-section .wp-element-button{
    background-color: var(--button-inverted-bg-color) !important;
    outline: var(--button-hover-outline) !important;
}

.speakers-section .wp-element-button:hover{
    background-color: var(--button-inverted-hover-color) !important;
    outline: none !important;
}
/* Paragraf: Dajemy mu elastyczność */
.speakers-section-header p {
    flex: 1;
    margin: 0;
    max-width: 500px; /* Opcjonalnie: ograniczenie szerokości tekstu dla czytelności */
    font-weight: var(--p-font-weight);
    font-size: var(--p-font-size);
    text-align: right; /* Dodane: wyrównanie tekstu do prawej */
}

/* ==========================================================================
   Mobile UI Adjustments - zmieniamy punkt łamania na mniejszy (np. tablet)
   ========================================================================== */
@media screen and (max-width: 768px) {
    .speakers-section-header.wp-block-group.is-layout-flex {
        flex-direction: column !important; /* Dopiero na telefonie jeden pod drugim */
        align-items: flex-start;
        gap: 20px;
    }

    .speakers-section-header .wp-block-heading {
        font-size: var(--mobile-scaled-h1-font-size) !important;
        width: 100%;
        white-space: normal;
    }
.speakers-section-header p {
    text-align: left;
}
}