/* Thème de couleurs basé sur le logo green-collector */
:root {
    --primary-color: #3c828c;
    --secondary-color: #32828c;
    --accent-color: #489ca8;
    --background-color: #f8f9fa;
    --text-color: #ffffff;
    --text-secondary: #666666;
    --border-color: #1e4146;
    --hover-color: #4ea9b6;
    --success-color: #22c55e;
    --warning-color: #f59e0b;
    --error-color: #ef4444;
    --white-color: #ffffff;
    --black-color: #000000;
    --gray-color: #808080;
}

/* Application du thème */
header {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
}

.logo::before {
    color: var(--accent-color);
}

nav a {
    color: var(--text-color);
}

nav a:hover {
    opacity: 0.8;
}

nav a.active {
    color: var(--accent-color);
}

.cart-count {
    background: var(--warning-color);
}

.hero {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
}

.card {
    border-color: var(--border-color);
}

.card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 10px 25px rgba(60, 130, 140, 0.1);
}

.cta {
    background: linear-gradient(135deg, var(--warning-color), var(--accent-color));
}

.cta:hover {
    background: linear-gradient(135deg, var(--accent-color), var(--warning-color));
}

.section-title {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}

.feature-icon {
    color: var(--accent-color);
}

.specs-table th {
    background: var(--primary-color);
}

.certification-badge {
    background: var(--primary-color);
}

.search-btn {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
}

.search-btn:hover {
    box-shadow: 0 12px 25px rgba(60, 130, 140, 0.25);
}

.sort-btn:hover, .sort-btn.active {
    background: var(--primary-color);
    color: var(--text-color);
    border-color: var(--primary-color);
}

.result-category {
    background: var(--accent-color);
    color: var(--text-color);
}

.result-price {
    color: var(--warning-color);
}

.result-cta {
    background: linear-gradient(135deg, var(--warning-color), var(--accent-color));
}

footer {
    background: #1a2f0f;
}

.suggestion-tag:hover {
    background: var(--primary-color);
    color: var(--text-color);
    border-color: var(--primary-color);
}