.vcpr-section { margin:20px 0; }

/* Elementor Coin Grid wrapper (side-by-side cards) */
.vcpr-grid-coins{
    --vcpr-cols:3;
    display:grid;
    grid-template-columns:repeat(var(--vcpr-cols), minmax(0, 1fr));
    gap:16px;
}

@media (max-width: 1024px){
    .vcpr-grid-coins{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
    .vcpr-grid-coins{ grid-template-columns:repeat(1, minmax(0, 1fr)); }
}

.vcpr-market-grid,
.vcpr-account-grid {
    display:flex;
    flex-wrap:wrap;
    gap:16px;
}

.vcpr-market-card,
.vcpr-card-box,
.vcpr-grid-card,
.vcpr-single-coin,
.vcpr-buy-sell-widget,
.vcpr-candle-widget {
    border-radius:16px;
    padding:16px;
    background:#ffffff;
    box-shadow:0 10px 25px rgba(0,0,0,0.06);
    flex:1 1 260px;
}

.vcpr-market-header,
.vcpr-grid-head,
.vcpr-single-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:8px;
    font-weight:600;
}

.vcpr-single-title{
    display:flex;
    gap:6px;
    align-items:baseline;
}
.vcpr-single-change{
    white-space:nowrap;
    font-size:13px;
}

.vcpr-market-chart { margin:4px 0 8px; height:46px; }

/* Trade modal supply + validation */
.vcpr-trade-coinname{ font-weight:700; font-size:16px; margin-bottom:4px; }
.vcpr-trade-coinsupply{ font-size:13px; opacity:0.85; margin:2px 0 8px; }
.vcpr-supply-warning{ font-size:12px; color:#d50000; margin-top:6px; }

/* Keep sparkline charts crisp + compact (no stretching/pixelation) */
.vcpr-market-chart canvas,
.vcpr-market-chart .vcpr-line-chart,
.vcpr-market-chart .vcpr-candle-chart {
    display:block;
    width:100%;
    height:100%; /* fill parent; parent controls height */
    max-height:100%;
}

.vcpr-btn-buy {
    background:#00c853;
    color:#fff;
    border:none;
    padding:8px 16px;
    border-radius:999px;
    cursor:pointer;
}
.vcpr-btn-sell {
    background:#d50000;
    color:#fff;
    border:none;
    padding:8px 16px;
    border-radius:999px;
    cursor:pointer;
}
.vcpr-btn-buy[disabled],
.vcpr-btn-sell[disabled] {
    opacity:0.5;
    cursor:not-allowed;
}

.vcpr-wallet-line { margin-bottom:16px; }

.vcpr-tabs-nav {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:16px;
}
.vcpr-tab-btn {
    border-radius:999px;
    border:1px solid #ddd;
    background:#f5f5f5;
    padding:8px 16px;
    cursor:pointer;
}
.vcpr-tab-btn.active {
    background:#00c853;
    color:#fff;
    border-color:#00c853;
}
.vcpr-tabs-container { display:block; }
.vcpr-tab-pane { display:none; }
.vcpr-tab-pane.active { display:block; }

.vcpr-field { margin-bottom:12px; }
.vcpr-field label {
    display:block;
    margin-bottom:4px;
    font-weight:500;
}
.vcpr-field input,
.vcpr-field textarea,
.vcpr-field select {
    width:100%;
    padding:8px 10px;
    border-radius:8px;
    border:1px solid #ddd;
}

.vcpr-submit-btn {
    background:#00c853;
    color:#fff;
    border:none;
    border-radius:999px;
    padding:8px 20px;
    cursor:pointer;
}

.vcpr-message { margin-top:8px; font-size:13px; }

.vcpr-table { width:100%; border-collapse:collapse; }
.vcpr-table th,
.vcpr-table td {
    border:1px solid #eee;
    padding:8px;
}

.vcpr-pl-pos { color:#00c853; }
.vcpr-pl-neg { color:#d50000; }

.vcpr-modal {
    position:fixed;
    top:0;left:0;width:100%;height:100%;
    background:rgba(0,0,0,0.55);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:9999;
}
.vcpr-modal-content {
    background:#fff;
    padding:20px;
    border-radius:12px;
    min-width:320px;
    max-width:420px;
}
.vcpr-modal-close {
    float:right;
    cursor:pointer;
}

/* % change + arrow */
.vcpr-market-meta,
.vcpr-grid-meta,
.vcpr-single-meta {
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:4px 0 8px;
}
.vcpr-change {
    font-size:13px;
    display:inline-flex;
    align-items:center;
    gap:4px;
    font-weight:600;
}
.vcpr-change-arrow { font-size:11px; }
.vcpr-change-up { color:#00c853; }
.vcpr-change-down { color:#d50000; }

/* Ticker */
.vcpr-ticker {
    overflow:hidden;
    white-space:nowrap;
    border-radius:999px;
    border:1px solid #eee;
    padding:4px 8px;
}
.vcpr-ticker-track {
    display:inline-block;
    animation:vcpr-ticker 20s linear infinite;
}
.vcpr-ticker-item {
    display:inline-block;
    margin-right:32px;
    font-size:13px;
}
@keyframes vcpr-ticker {
    0% { transform:translateX(0); }
    100% { transform:translateX(-50%); }
}

.vcpr-portfolio-summary { margin-top:16px; }

.vcpr-trade-summary p { margin:2px 0; font-size:13px; }

/* Withdraw method toggle */
.vcpr-withdraw-bank { display:none; }

/* Popup notification top-right */
.vcpr-popup {
    position:fixed;
    top:20px;
    right:20px;
    background:#323232;
    color:#fff;
    padding:10px 16px;
    border-radius:8px;
    box-shadow:0 6px 16px rgba(0,0,0,0.3);
    z-index:10000;
    font-size:14px;
    opacity:0;
    transform:translateY(-10px);
    transition:all .2s ease-out;
}
.vcpr-popup.show {
    opacity:1;
    transform:translateY(0);
}

/* Line chart */
.vcpr-line-chart,
.vcpr-candle-chart {
    width:100%;
}

/* Announcement bar */
.vcpr-announcement-bar {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    background:linear-gradient(90deg,#00c853,#0091ea);
    color:#fff;
    padding:6px 12px;
    font-size:14px;
    z-index:9998;
}
.vcpr-announcement-inner {
    max-width:1200px;
    margin:0 auto;
}

/* Locked badge */
.vcpr-locked-badge {
    display:inline-block;
    padding:2px 8px;
    border-radius:999px;
    background:#ff6d00;
    color:#fff;
    font-size:11px;
    margin-bottom:6px;
}

/* Center success popup */
.vcpr-center-popup {
    position:fixed;
    top:0;left:0;width:100%;height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,0.5);
    z-index:10001;
}
.vcpr-center-popup-inner {
    background:#fff;
    padding:24px 28px;
    border-radius:16px;
    text-align:center;
    box-shadow:0 14px 40px rgba(0,0,0,0.25);
}
.vcpr-center-icon {
    width:48px;
    height:48px;
    border-radius:50%;
    background:#00c853;
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    margin-bottom:10px;
}
.vcpr-center-title {
    font-size:18px;
    font-weight:600;
    margin-bottom:6px;
}
.vcpr-center-body { font-size:14px; }

/* Alert button */
.vcpr-alert-form {
    display:flex;
    gap:4px;
}
.vcpr-alert-form input[type="number"] {
    max-width:90px;
    padding:4px 6px;
}
.vcpr-alert-btn {
    padding:4px 10px;
    border-radius:999px;
    border:none;
    background:#0091ea;
    color:#fff;
    cursor:pointer;
}

/* Responsive */
@media (max-width:768px) {
    .vcpr-market-card,
    .vcpr-card-box,
    .vcpr-grid-card,
    .vcpr-single-coin,
    .vcpr-buy-sell-widget,
    .vcpr-candle-widget {
        flex:1 1 100%;
    }
}


/* === UI fixes: header spacing + right-side % === */
.vcpr-single-head{ gap:12px; }
.vcpr-single-title{ flex:1 1 auto; min-width:0; }
.vcpr-single-change{ margin-left:auto; }

/* === Buttons spacing + meta spacing === */
.vcpr-single-meta{ margin-top:6px; margin-bottom:10px; }
.vcpr-single-actions,
.vcpr-buy-sell-actions{
    display:flex;
    gap:12px;
    margin-top:10px;
    flex-wrap:wrap;
}
.vcpr-buy-sell-widget .vcpr-current-price{
    margin:8px 0 6px;
    font-size:13px;
    opacity:0.95;
}

/* Trade modal coin info */
.vcpr-trade-coininfo{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:10px 12px;
    background:#f6f8ff;
    border:1px solid #e8ecff;
    border-radius:12px;
    margin:8px 0 14px;
}
.vcpr-trade-coinname{ font-weight:700; }
.vcpr-trade-coinprice{ font-size:13px; white-space:nowrap; }

/* Trade modal header layout (keep simple, like coin card) */
.vcpr-trade-coininfo{margin-bottom:14px;}
.vcpr-trade-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;}
.vcpr-trade-coinname{font-size:20px;font-weight:700;line-height:1.2;}
.vcpr-trade-coinprice{font-size:16px;font-weight:700;white-space:nowrap;}
.vcpr-trade-line{font-size:15px;font-weight:600;margin-top:6px;}


/* ===== FIX: Trade popup header sequence (do not place supply/wallet in same row) ===== */
#vcpr-trade-modal .vcpr-trade-coininfo{
    display:block !important;
    justify-content:initial !important;
    align-items:initial !important;
}
#vcpr-trade-modal .vcpr-trade-line{
    display:block !important;
    width:100%;
}

/* === User Custom UI Styles (bundled) === */
.vcpr-btn-sell {
    background: #ae1e50;
    color: #fff;
    border: none;
    margin-left: 12px;
    padding: 10px 40px;
    border-radius: 10px;
    cursor: pointer;
}
.vcpr-btn-buy {
    background: #54ab74;
    color: #fff;
    border: none;
    margin-left: 12px;
    padding: 10px 40px;
    border-radius: 10px;
    cursor: pointer;
}

/* ensure popup/action area buttons keep same style */
.vcpr-buy-sell-actions .vcpr-btn-buy,
.vcpr-buy-sell-actions .vcpr-btn-sell,
.vcpr-grid-actions .vcpr-btn-buy,
.vcpr-grid-actions .vcpr-btn-sell {
    border: none;
    padding: 10px 40px;
    border-radius: 10px;
    cursor: pointer;
}

.vcpr-market-card,
.vcpr-card-box,
.vcpr-grid-card,
.vcpr-single-coin,
.vcpr-buy-sell-widget,
.vcpr-candle-widget {
    border-radius: 16px;
    padding: 16px;
    background: #ffffff;
    box-shadow: 0 10px 25px rgb(0 0 0 / 37%);
    flex: 1 1 260px;
}
/* === End User Custom UI Styles === */


/* === Popup widget rebuild (requested sequence) === */
#vcpr-trade-modal .vcpr-popup-header{width:100%; margin-bottom:14px;}
#vcpr-trade-modal .vcpr-trade-row{display:flex; justify-content:space-between; align-items:flex-start; gap:16px;}
#vcpr-trade-modal .vcpr-trade-left{display:flex; flex-direction:column; gap:6px;}
#vcpr-trade-modal .vcpr-trade-coin{font-weight:800; font-size:20px; line-height:1.2;}
#vcpr-trade-modal .vcpr-trade-subline{font-weight:700; font-size:14px; opacity:0.9;}
#vcpr-trade-modal .vcpr-trade-price{font-weight:800; font-size:16px; white-space:nowrap;}
/* === End popup widget rebuild === */