.deposit-workspace-layout {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    width: 100%;
}
.deposit-left-col {
    flex: 1.3;
    background: #ffffff;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.01);
}
.deposit-right-col {
    flex: 0.8;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.deposit-title-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
}
.deposit-title {
    font-size: 28px;
    font-weight: 700;
    color: #000000;
    margin: 0;
}
.deposit-guide-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 20px;
    background: #f2f3f5;
    color: #000000;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s;
}
.deposit-guide-btn:hover {
    background: #e4e6eb;
}
.book-icon {
    stroke-width: 2.5;
}
.deposit-step-section {
    display: flex;
    gap: 20px;
    margin-bottom: 28px;
}
.step-num-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 28px;
}
.step-num-circle {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    background: #f2f3f5;
    color: #888888;
    flex-shrink: 0;
}
.step-num-circle.active-step {
    background: #000000;
    color: #ffffff;
}
.step-connecting-line {
    width: 2px;
    flex: 1;
    background: #e4e6eb;
    margin: 10px 0;
    min-height: 40px;
}
.step-content-col {
    flex: 1;
}
.step-heading {
    font-size: 16px;
    font-weight: 600;
    color: #000000;
    margin-bottom: 16px;
    margin-top: 4px;
}
.deposit-select-wrapper {
    position: relative;
    width: 100%;
}
.deposit-select-control {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    border-radius: 12px;
    background: #f8f9fa;
    border: 1px solid #e4e6eb;
    cursor: pointer;
    transition: all 0.2s ease;
}
.deposit-select-control:hover {
    border-color: #cccccc;
    background: #f2f3f5;
}
.selected-crypto-val, 
.selected-network-val {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 600;
    font-size: 15px;
    color: #000000;
}
.crypto-logo, 
.network-logo, 
.chip-logo {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
    color: #ffffff;
    flex-shrink: 0;
}
img.crypto-logo, 
img.network-logo, 
img.chip-logo {
    object-fit: cover;
    background: transparent;
}
.logo-usdt, .chip-usdt { background: #00b57a; }
.logo-btc, .chip-btc { background: #f7931a; }
.logo-eth, .chip-eth { background: #627eea; }
.logo-bch, .chip-bch { background: #8dc351; }
.logo-trx, .chip-trx { background: #ef193c; }
.logo-bsc { background: #f3ba2f; color: #000000 !important; }
.logo-trc { background: #ef193c; }
.logo-erc { background: #627eea; }
.logo-apt { background: #2dd4bf; color: #000000 !important; }
.logo-xpl { background: #10b981; }
.logo-matic { background: #8247e5; }
.logo-arb { background: #28a0f0; }
.logo-sol { background: #14f195; color: #000000 !important; }
.logo-op { background: #ff0420; }
.logo-avax { background: #e84142; }
.logo-usdc, .chip-usdc { background: #2775ca; }
.select-chevron {
    font-size: 10px;
    color: #888888;
    transition: transform 0.2s;
}
.deposit-select-control.open .select-chevron {
    transform: rotate(180deg);
}
.deposit-select-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #ffffff;
    border: 1px solid #e4e6eb;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    z-index: 100;
    overflow: hidden;
}
.deposit-select-dropdown.open {
    display: block;
}
.network-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-weight: 500;
    color: #000000;
}
.network-option:hover {
    background: #f8f9fa;
}
.crypto-search-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}
.crypto-search-input {
    border: none;
    background: transparent;
    font-size: 15px;
    font-weight: 500;
    color: #000000;
    width: 100%;
    outline: none;
    font-family: inherit;
    padding: 0;
}
.search-input-icon {
    flex-shrink: 0;
}
.deposit-select-control.open-search {
    border-color: #000000;
    background: #ffffff;
}
.dropdown-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px 8px 20px;
}
.dropdown-section-header .section-title {
    font-size: 12px;
    font-weight: 600;
    color: #888888;
}
.clear-recent-btn {
    background: none;
    border: none;
    color: #888888;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s;
}
.clear-recent-btn:hover {
    color: #ef193c;
    background: #f2f3f5;
}
.recent-chips-row {
    display: flex;
    gap: 10px;
    padding: 0 20px 14px 20px;
    flex-wrap: wrap;
    border-bottom: 1px solid #f2f3f5;
}
.recent-chip {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #f2f3f5;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    color: #000000;
    cursor: pointer;
    transition: all 0.2s;
    user-select: none;
}
.recent-chip:hover {
    background: #e4e6eb;
}
.recent-chip .chip-logo {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: 800;
    color: #ffffff;
}
.popular-coins-list {
    max-height: 280px;
    overflow-y: auto;
    padding-bottom: 8px;
}
.crypto-option-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 20px;
    cursor: pointer;
    transition: background 0.2s;
}
.crypto-option-row:hover {
    background: #f8f9fa;
}
.crypto-option-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.crypto-option-title-line {
    display: flex;
    align-items: center;
    gap: 8px;
}
.crypto-title {
    font-size: 15px;
    font-weight: 700;
    color: #000000;
}
.crypto-subtitle {
    font-size: 12px;
    color: #888888;
}
.earn-badge {
    background: #e8fbf3;
    color: #00b57a;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
}
.fast-chips-row {
    display: flex;
    gap: 10px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.fast-chip-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    background: #f2f3f5;
    font-size: 13px;
    font-weight: 500;
    color: #000000;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: all 0.2s ease;
}
.fast-chip-btn:hover {
    background: #e4e6eb;
}
.fast-chip-btn.active {
    background: #ffffff;
    border-color: #000000;
    font-weight: 600;
}
.deposit-details-card {
    display: flex;
    gap: 24px;
    padding: 24px;
    border: 1px solid #e4e6eb;
    border-radius: 16px;
    background: #fafafa;
    align-items: center;
}
.deposit-qr-container {
    flex-shrink: 0;
    background: #ffffff;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid #e4e6eb;
    display: flex;
    align-items: center;
    justify-content: center;
}
.qr-code-box {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.deposit-address-container {
    flex: 1;
}
.address-network-label {
    font-size: 13px;
    color: #888888;
    margin-bottom: 8px;
    font-weight: 500;
}
.address-copy-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #ffffff;
    padding: 12px 16px;
    border: 1px solid #e4e6eb;
    border-radius: 12px;
}
.address-text {
    font-size: 15px;
    font-weight: 600;
    color: #888888;
    font-family: 'Outfit', sans-serif;
    word-break: break-all;
    line-height: 1.4;
    user-select: all;
}
.addr-highlight {
    color: #f3ba2f; 
    font-weight: 700;
}
.copy-btn {
    background: #f2f3f5;
    color: #000000;
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
    flex-shrink: 0;
}
.copy-btn:hover {
    background: #e4e6eb;
    transform: scale(1.05);
}
.copy-btn:active {
    transform: scale(0.95);
}
.deposit-p2p-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
    border-radius: 16px;
    padding: 20px;
    border: 1px solid #e4e6eb;
    text-decoration: none;
    color: inherit;
    transition: all 0.2s ease;
}
.deposit-p2p-card:hover {
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border-color: #cccccc;
    transform: translateY(-2px);
}
.p2p-card-left {
    display: flex;
    gap: 16px;
    align-items: center;
}
.p2p-icon-box {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fafafa;
    border: 1px solid #e4e6eb;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000000;
    flex-shrink: 0;
}
.p2p-card-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.p2p-card-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.p2p-title {
    font-size: 15px;
    font-weight: 700;
    color: #000000;
}
.p2p-badge {
    background: #fef9c3;
    color: #854d0e;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
}
.p2p-sub {
    font-size: 12px;
    color: #888888;
}
.p2p-arrow {
    font-size: 20px;
    color: #cccccc;
    font-weight: 300;
}
.deposit-tips-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 24px;
    border: 1px solid #e4e6eb;
}
.tips-title {
    font-size: 15px;
    font-weight: 700;
    color: #000000;
    margin-bottom: 16px;
    margin-top: 0;
}
.tips-list {
    list-style: disc;
    padding-left: 20px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.tips-list li {
    font-size: 12px;
    color: #888888;
    line-height: 1.6;
}
.tips-highlight {
    color: #000000;
    font-weight: 600;
}
.deposit-faq-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 24px;
    border: 1px solid #e4e6eb;
}
.faq-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}
.faq-title {
    font-size: 15px;
    font-weight: 700;
    color: #000000;
}
.faq-more {
    font-size: 12px;
    color: #888888;
    text-decoration: none;
    font-weight: 600;
}
.faq-more:hover {
    color: #000000;
}
.faq-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
}
.faq-list li {
    border-bottom: 1px solid #f2f3f5;
}
.faq-list li:last-child {
    border-bottom: none;
}
.faq-list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 0;
    font-size: 13px;
    font-weight: 500;
    color: #000000;
    text-decoration: none;
    transition: color 0.2s;
}
.faq-list li a:hover {
    color: #888888;
}
.faq-arrow {
    color: #cccccc;
    font-size: 16px;
}
.toast-msg {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(100px);
    background: #000000;
    color: #ffffff;
    padding: 12px 24px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    z-index: 1000;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    pointer-events: none;
}
.toast-msg.show {
    transform: translateX(-50%) translateY(0);
}
.sidebar-item.active {
    background-color: #f2f3f5 !important;
    color: #000000 !important;
    font-weight: 700 !important;
}
@media (max-width: 992px) {
    .deposit-workspace-layout {
        flex-direction: column;
        gap: 24px;
    }
    .deposit-left-col, .deposit-right-col {
        width: 100%;
        flex: none;
    }
}
@media (max-width: 768px) {
    .deposit-left-col {
        padding: 20px 16px;
    }
    .deposit-details-card {
        flex-direction: column;
        gap: 16px;
        align-items: center;
        padding: 16px;
    }
    .deposit-address-container {
        width: 100%;
    }
    .address-copy-row {
        gap: 8px;
        padding: 10px 12px;
    }
    .address-text {
        font-size: 13px;
    }
    .deposit-title {
        font-size: 22px;
    }
    .deposit-guide-btn span {
        display: none;
    }
    .deposit-guide-btn {
        padding: 8px;
        border-radius: 50%;
    }
}