/* Design System Override — Notion Color System */
/* Maps Tailwind classes to Notion Design System variables */

/* ===== TAILWIND TO NOTION BLUE MAPPINGS ===== */

/* Background colors */
.bg-blue-600 {
    background-color: var(--color-primary) !important;
    color: white !important;
}

.bg-blue-600 * {
    color: white !important;
}

.bg-blue-700 {
    background-color: var(--color-primary) !important;
    color: white !important;
}

.bg-blue-700 * {
    color: white !important;
}

.hover\:bg-blue-600:hover,
.hover\:bg-blue-700:hover {
    background-color: var(--color-primary) !important;
    opacity: 0.9 !important;
    color: white !important;
}

/* Text colors */
.text-blue-600 {
    color: var(--color-primary) !important;
}

.text-blue-700 {
    color: var(--color-primary) !important;
}

.hover\:text-blue-600:hover,
.hover\:text-blue-700:hover {
    color: var(--color-primary) !important;
    opacity: 0.9 !important;
}

/* Inline style overrides */
[style*="background-color: var(--color-primary)"] {
    background-color: var(--color-primary) !important;
    color: white !important;
}

[style*="background-color: var(--color-primary)"] * {
    color: white !important;
}

[style*="color: var(--color-primary)"] {
    color: var(--color-primary) !important;
}

/* ===== DESIGN SYSTEM ELEMENTS ===== */

/* Category colors unified to primary */
.artigo-category,
.cat-politica,
.cat-economia,
.cat-educacao,
.cat-saude,
.cat-tecnologia,
.cat-esportes,
.cat-entretenimento,
.cat-geral {
    background-color: var(--color-primary) !important;
    color: white !important;
}

/* Card styles */
.artigo-card {
    border: var(--border-whisper) !important;
    box-shadow: var(--shadow-card) !important;
    background-color: var(--color-bg) !important;
}

.artigo-card:hover {
    box-shadow: var(--shadow-deep) !important;
}

/* Font override */
body,
button,
input,
textarea,
select,
h1, h2, h3, h4, h5, h6,
p, span, a, div {
    font-family: var(--font-family) !important;
}

/* Link styles */
a[style*="color: var(--color-primary)"] {
    color: var(--color-primary) !important;
}

a[style*="color: var(--color-primary)"]:hover {
    opacity: 0.8 !important;
    color: var(--color-primary) !important;
}

/* Badge and pill styles */
.artigo-category {
    border-radius: var(--radius-pill) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.125px !important;
}