/* ===========================================================
   TradeSmart Crypto — Combined Coin Widget Styles
   Extracted from inline <style> blocks in 3 Code Snippets:
   1) coin_header_bar        (Coins header for dynamic coin pages)
   2) trading_chart          (For new coins dynamically use tradingview)
   3) coin_market_stats      (Market stats of all new coin dynamic)
   =========================================================== */

/* --- 1. Coin Header Bar (.coin-hbar) --- */
.coin-hbar{width:100%;background:#111111;padding:16px 24px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;border-bottom:2px solid #FFD700;}
.coin-hbar-left{display:flex;align-items:center;gap:14px;}
.coin-hbar-icon{width:44px;height:44px;border-radius:50%;border:2px solid #222222;flex-shrink:0;object-fit:cover;background:#1a1a1a;}
.coin-hbar-name{font-size:18px;font-weight:800;color:#ffffff;letter-spacing:1px;}
.coin-hbar-symbol{font-size:10px;font-weight:800;color:#FFD700;letter-spacing:3px;text-transform:uppercase;margin-top:3px;}
.coin-hbar-center{display:flex;align-items:center;gap:14px;}
.coin-hbar-price{font-size:24px;font-weight:800;color:#ffffff;font-family:'Courier New',monospace;letter-spacing:-0.5px;}
.coin-hbar-change{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;font-size:13px;font-weight:800;font-family:'Courier New',monospace;border-radius:3px;}
.coin-hbar-right{display:flex;align-items:center;gap:6px;}
.coin-hbar-nav-btn{display:inline-block;padding:7px 14px;border:1px solid #333333;font-size:9px;font-weight:800;color:#888888;letter-spacing:2px;text-transform:uppercase;text-decoration:none !important;transition:all 0.2s;background:transparent;cursor:pointer;}
.coin-hbar-nav-btn:hover{border-color:#FFD700;color:#FFD700 !important;text-decoration:none !important;}
@media(max-width:768px){
    .coin-hbar{padding:12px 16px;gap:8px;}
    .coin-hbar-price{font-size:18px;}
    .coin-hbar-name{font-size:14px;}
    .coin-hbar-icon{width:34px;height:34px;}
    .coin-hbar-nav-btn{padding:5px 8px;font-size:8px;letter-spacing:1px;}
    .coin-hbar-symbol{display:none;}
}

/* --- 2. TradingView Chart Wrap (.tsc-chart-*) --- */
.tsc-chart-wrap{width:100%;background:#ffffff;border:1px solid #eeeeee;overflow:hidden;box-sizing:border-box;}
.tsc-chart-header{padding:12px 16px;background:#111111;border-bottom:2px solid #FFD700;display:flex;align-items:center;justify-content:space-between;}
.tsc-chart-title{font-size:9px;font-weight:800;letter-spacing:3px;color:#FFD700;text-transform:uppercase;}
.tsc-chart-live{display:flex;align-items:center;gap:5px;font-size:9px;color:#888888;letter-spacing:1px;text-transform:uppercase;}
.tsc-chart-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;animation:tsc-chart-pulse 2s infinite;}
@keyframes tsc-chart-pulse{0%,100%{opacity:1;}50%{opacity:0.3;}}
.tsc-chart-body{width:100%;height:380px !important;background:#ffffff;}
.tsc-chart-body #tradingview_dynamic{width:100%;height:100%;}
@media(max-width:768px){
    .tsc-chart-body{height:300px;}
}

/* --- 3. Coin Market Stats (.cms-*) --- */
.cms-wrap{width:100%;font-family:'Inter',sans-serif;background:#ffffff;overflow:hidden;box-sizing:border-box;}
.cms-header{padding:12px 16px;background:#111111;border-bottom:2px solid #FFD700;}
.cms-header-title{font-size:9px;font-weight:800;letter-spacing:3px;color:#FFD700;text-transform:uppercase;}
.cms-rows{padding:0;}
.cms-row{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-bottom:1px solid #f5f5f5;transition:background 0.2s;}
.cms-row:last-child{border-bottom:none;}
.cms-row:hover{background:#fffdf0;}
.cms-label{font-size:10px;font-weight:700;color:#999999;letter-spacing:1px;text-transform:uppercase;}
.cms-value{font-size:13px;font-weight:700;color:#111111;font-family:'Courier New',monospace;text-align:right;}
.cms-value-gold{color:#FFD700 !important;}
.cms-btns{padding:14px 16px;display:flex;gap:8px;border-top:1px solid #f0f0f0;position:relative;}
.cms-btn{flex:1;padding:11px;border:none;cursor:pointer;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;transition:all 0.2s;background:#FFD700;color:#000000;}
.cms-btn:hover{background:#f0cc00;}
.cms-popover{display:none;position:absolute;bottom:62px;width:240px;background:#0a0a0a;border:1px solid #FFD700;padding:14px;z-index:9999;flex-direction:column;align-items:center;text-align:center;animation:cms-fadeup 0.2s ease;}
#cms-pop-buy{left:16px;}
#cms-pop-wallet{right:16px;}
@keyframes cms-fadeup{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.cms-pop-img{width:100%;height:auto;border-radius:4px;display:block;margin-bottom:10px;border:1px solid #222;}
.cms-pop-label{color:#555555;font-size:9px;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px;display:block;}
.cms-pop-logo{height:20px;width:auto;filter:brightness(1.5);}
