/*
 * Envio24 – Post-Payment Screens (Success / Multibanco / MB WAY)
 *
 * Style dedykowane wyłącznie dla ekranów wyświetlanych po płatności TOPUP.
 * Dotyczy komunikatów sukcesu, oczekiwania na Multibanco i autoryzacji MB WAY.
 *
 * @version 1.1.0
 * @package envio24-core/assets/css/order-form/
 *
 * SPIS TREŚCI (PL):
 * 1) Wrapper i panel główny
 * 2) Ikona statusu
 * 3) Tytuł i tekst
 * 4) Dane referencyjne Multibanco (e24-async-data-box)
 * 5) Komunikat ostrzegawczy (notice)
 * 6) Przyciski akcji
 * 7) Ochrona przed nadpisaniem przez motyw (Kadence)
 * 8) RWD
 *
 * ZMIANY 1.1.0 (PL):
 * - Dopracowano layout danych referencyjnych Multibanco:
 *   "Entidade: 44311", "Referência: 778 578 984", "Montante: 10,50 €"
 *   w jednej linii, bez rozbijania na dwa wiersze.
 * - Wyrównano wizualnie etykietę i wartość w środku.
 * - Wartości liczbowe otrzymały krój nagłówkowy (Rubik),
 *   przy zachowaniu tej samej wielkości czcionki co etykiety.
 */

/* ========================================
 * 1) WRAPPER I PANEL GŁÓWNY
 * ===================================== */

.e24-success-panel-wrapper {
    padding: 30px 20px;
}

.e24-success-panel {
    text-align: center;
    padding: 30px 40px;
    background: var(--e24-color-surface, #ffffff);
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 14px 45px rgba(0, 0, 0, 0.05);
    max-width: 600px;
    margin: 0 auto;
}

/* ========================================
 * 2) IKONA STATUSU
 * ===================================== */

.e24-success-icon {
    color: var(--e24-brand-accent, #D35400);
    margin-bottom: 4px;
    display: flex;
    justify-content: center;
}

/* ========================================
 * 3) TYTUŁ I TEKST
 * ===================================== */

.e24-success-title {
    font-family: "Rubik", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px;
    color: var(--e24-brand-dark, #2F353B);
}

.e24-success-text {
    font-family: "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    color: var(--e24-text-muted, #777777);
    line-height: 1.65;
    margin-bottom: 16px;
}

.e24-success-text strong {
    color: var(--e24-text-main, #444444);
}

/* ========================================
 * 4) DANE REFERENCYJNE MULTIBANCO
 * ===================================== */

.e24-async-data-box {
    background: #FAFAFA;
    border: 1px solid #EEE;
    border-radius: 8px;
    padding: 0px 14px;
    margin: 14px 0;
    text-align: center;
}

.e24-async-data-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 0;
    flex-wrap: wrap;
}

.e24-async-data-row + .e24-async-data-row {
    border-top: 1px solid #E8E8E8;
}

.e24-async-data-label {
    font-family: "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #777777;
    line-height: 1.4;
}

.e24-async-data-value {
    font-family: "Rubik", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--e24-text-main, #444444);
    line-height: 1.4;
    letter-spacing: 0.2px;
}

/* ========================================
 * 5) KOMUNIKAT OSTRZEGAWCZY (NOTICE)
 * ===================================== */

.e24-async-notice {
    margin-bottom: 24px;
    text-align: left;
    align-items: center;
}

.e24-async-notice__icon {
    display: flex;
    align-items: center;
}

/* ========================================
 * 6) PRZYCISKI AKCJI
 * ===================================== */

.e24-success-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 8px;
}

/* ========================================
 * 7) OCHRONA PRZED NADPISANIEM PRZEZ MOTYW (KADENCE)
 * ===================================== */

.e24-success-panel a.e24-btn--primary {
    color: #FFFFFF !important;
    text-decoration: none !important;
}

.e24-success-panel a.e24-btn--primary:hover {
    background-color: #BE4C00 !important;
    color: #FFFFFF !important;
}

.e24-success-panel a.e24-btn--secondary {
    color: var(--e24-brand-accent, #D35400) !important;
    text-decoration: none !important;
}

.e24-success-panel a.e24-btn--secondary:hover {
    background-color: rgba(211, 84, 0, 0.05) !important;
    color: var(--e24-brand-accent, #D35400) !important;
}

/* ========================================
 * 8) RWD
 * ===================================== */

@media (max-width: 768px) {
    .e24-success-panel-wrapper {
        padding: 30px 10px;
    }

    .e24-success-panel {
        padding: 40px 20px;
    }

    .e24-success-title {
        font-size: 20px;
    }

    .e24-success-text {
        font-size: 14px;
    }

    .e24-async-data-box {
        padding: 16px;
    }

    .e24-async-data-row {
        flex-direction: row;
        gap: 4px;
    }

    .e24-async-data-label,
    .e24-async-data-value {
        font-size: 14px;
    }

    .e24-success-actions {
        flex-direction: column;
    }

    .e24-success-actions .e24-btn {
        width: 100%;
    }
}