/* Root Variables untuk Theme */
:root {
    --bg-color: #030712;
    --card-bg: #111827;
    --border-color: #1f2937;
    --text-main: #f9fafb;
    --text-muted: #9ca3af;
    --accent: #00D4FF;
    --input-bg: #1f2937;
    --placeholder: #6b7280;
}

[data-theme="light"] {
    --bg-color: #f3f4f6;
    --card-bg: #ffffff;
    --border-color: #d1d5db;
    --text-main: #111827;
    --text-muted: #4b5563;
    --accent: #0284c7;
    --input-bg: #f9fafb;
    --placeholder: #9ca3af;
}

body { 
    background-color: var(--bg-color); 
    color: var(--text-main); 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    transition: all 0.3s ease;
}

.glass-card { 
    background: var(--card-bg); 
    border: 1px solid var(--border-color); 
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.qty-input { 
    background-color: var(--input-bg) !important; 
    color: var(--text-main) !important; 
    border: 1px solid var(--border-color) !important; 
    font-weight: 600;
}

.qty-input::placeholder {
    color: var(--placeholder) !important;
    opacity: 1;
}

.text-accent { color: var(--accent) !important; }
.text-secondary { color: var(--text-muted) !important; }
.extra-small { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }

.bottom-nav { 
    background: var(--card-bg); 
    border-top: 1px solid var(--border-color); 
}

/* Fix for Telegram Haptic & Copy */
.copy-btn:active { transform: scale(0.95); transition: 0.1s; }