/* assets/css/style.css */
:root {
    --primary-bg: #131921;
    --secondary-bg: #232f3e;
    --accent-color: #febd69;
    --text-on-dark: #ffffff;
    --body-bg: #f3f3f3;
}

/* DARK THEME */
.theme-dark {
    --primary-bg: #000000;
    --secondary-bg: #1a1a1a;
    --accent-color: #3b82f6;
    --body-bg: #0f172a;
}
.theme-dark .bg-white { background-color: #1e293b !important; color: white !important; }
.theme-dark .text-gray-800, .theme-dark .text-gray-900, .theme-dark .text-gray-700 { color: #f1f5f9 !important; }
.theme-dark .text-gray-600 { color: #94a3b8 !important; }
.theme-dark .border-gray-200, .theme-dark .border { border-color: #334155 !important; }

/* LUXURY GOLD */
.theme-luxury {
    --primary-bg: #1a1a1a;
    --secondary-bg: #2d2d2d;
    --accent-color: #d4af37;
    --body-bg: #fdfbf7;
}
.theme-luxury .text-blue-600 { color: #b8860b !important; }
.theme-luxury .bg-blue-600 { background-color: #d4af37 !important; }

/* OCEAN BLUE */
.theme-ocean {
    --primary-bg: #075985;
    --secondary-bg: #0ea5e9;
    --accent-color: #38bdf8;
    --body-bg: #f0f9ff;
}

/* MINIMAL WHITE */
.theme-minimal {
    --primary-bg: #ffffff;
    --secondary-bg: #f8fafc;
    --accent-color: #000000;
    --body-bg: #ffffff;
    --text-on-dark: #000000;
}
.theme-minimal header.amazon-header { border-bottom: 1px solid #e2e8f0; }
.theme-minimal .bg-white { border: 1px solid #f1f5f9; }

/* SHARED STYLES */
body {
    font-family: 'Inter', sans-serif;
    background-color: var(--body-bg) !important;
}

header.amazon-header { background-color: var(--primary-bg) !important; color: var(--text-on-dark) !important; }
header.amazon-header a { color: inherit !important; }
.bg-secondary { background-color: var(--secondary-bg) !important; color: var(--text-on-dark) !important; }
.text-accent { color: var(--accent-color) !important; }
.btn-accent { background-color: var(--accent-color) !important; color: black !important; }

.product-card {
    transition: all 0.3s ease;
}

.product-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.1);
}

.ad-container {
    background: #eee;
    margin: 20px 0;
    padding: 10px;
    text-align: center;
    border: 1px dashed #ccc;
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888;
    font-size: 0.8rem;
}
