:root {
    --teal: #287981;
    --teal-dark: #26727a;
    --accent: #f14635;
    --ink: #000000cc;
    --card-shadow: 0 12px 40px rgba(0,0,0,.15);
    --card-shadow-lg: 0 20px 60px rgba(0,0,0,.25);

    --primary-500: 40 121 129;
    --primary-600: 38 114 122;
}

.login {
    background: linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%);
}

.login .form-signin {
    background: white;
    border-radius: 12px;
    box-shadow: var(--card-shadow-lg);
}

.bg-primary-500 {
    background-color: rgb(var(--teal)) !important;
}

.bg-primary-500:hover {
    background-color: rgb(var(--teal-dark)) !important;
}

.text-primary-500 {
    color: var(--accent) !important;
}

.dark\:bg-gray-900, [data-theme="dark"] .bg-gray-900 {
    background-color: var(--teal) !important;
}

.bg-white {
    box-shadow: var(--card-shadow) !important;
}

.dashboard-card {
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: var(--card-shadow);
    border: 1px solid #e5e7eb;
}

.dashboard-metric {
    display: flex;
    align-items: center;
    gap: 16px;
}

.metric-icon {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: white;
}

.metric-icon.products { background-color: #3b82f6; }
.metric-icon.sales { background-color: #10b981; }
.metric-icon.orders { background-color: #f59e0b; }
.metric-icon.competitors { background-color: #ef4444; }
.metric-icon.reviews { background-color: #8b5cf6; }
.metric-icon.rating { background-color: #f59e0b; }

.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }

@media (min-width: 768px) {
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.gap-6 { gap: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }

.metric-content h3 {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.metric-content p {
    margin: 0.25rem 0 0 0;
}

.metric-content p:first-of-type {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
}

.metric-content p:last-of-type {
    font-size: 0.875rem;
    color: #6b7280;
}
