.swap-toggle-wrap { width: 100%; }
.swap-toggle-item { width: 100%; position: relative; }

/* HEADER */
.swap-toggle-header {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 28px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.swap-toggle-header-text { font-weight: 700; font-size: 18px; }
.swap-toggle-arrow { display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.swap-toggle-arrow-open { color: inherit; }

/* CONTENT */
.swap-toggle-content {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: stretch;
}
.swap-toggle-arrow-close {
    position: absolute;
    top: 20px;
    right: 24px;
    cursor: pointer;
    z-index: 5;
}
.swap-toggle-content-image { flex: 0 0 45%; min-height: 320px; }
.swap-toggle-content-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.swap-toggle-content-text {
    flex: 1;
    padding: 40px 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.swap-toggle-content-title { font-size: 26px; font-weight: 700; margin: 0 0 18px 0; }
.swap-toggle-content-desc p { margin: 0 0 14px 0; opacity: 0.95; }

/* ANIMATION */
.swap-toggle-header, .swap-toggle-content { animation: swapFadeIn 0.25s ease; }
@keyframes swapFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* RESPONSIVE — tablet & mobile */
@media (max-width: 1024px) {
    .swap-toggle-content {
        flex-direction: column;
        height: auto !important;
        min-height: 0 !important;
    }
    .swap-toggle-content-image { flex-basis: auto; min-height: 220px; }
    .swap-toggle-content-text { padding: 28px 24px; }
}
