/* ================================================
   FEEDCURATO® LIGHT THEME
   /themes/feedcurato-light/theme.css
   
   Solo variables CSS y overrides específicos.
   Los estilos base están en /themes/common/base.css
   ================================================ */

/* ========== VARIABLES CSS ========== */
:root {
    /* Colores base */
    --bg: #ffffff;
    --card: #f9fafb;
    --border: #e5e7eb;
    --text: #111827;
    --muted: #6b7280;
    --accent: #6366f1;
    
    /* Header */
    --header-bg: rgba(255, 255, 255, 0.95);
    
    /* Footer */
    --footer-bg: linear-gradient(180deg, var(--bg) 0%, var(--card) 100%);
    
    /* Fuentes (defaults - sobreescritos por panel) */
    --font-heading: 'Inter', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-title-size: 24px;
    --font-title-weight: 700;
    --font-body-size: 16px;
    --font-body-weight: 400;
}

/* ========== OVERRIDES ESPECÍFICOS LIGHT ========== */

/* Header con blur claro */
.header {
    background: var(--header-bg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border);
}

/* Footer con gradiente claro */
.footer {
    background: var(--footer-bg);
}

/* Hover en nav con tinte del accent */
.nav a:hover {
    background: rgba(99, 102, 241, 0.1);
}

/* Sidebar toggle hover */
.sidebar-toggle:hover {
    background: rgba(99, 102, 241, 0.1);
    border-color: var(--accent);
}

/* Search button hover */
.search-btn:hover {
    background: rgba(99, 102, 241, 0.1);
    border-color: var(--accent);
}

/* Sidebar nav hover */
.sidebar-nav a:hover {
    background: rgba(99, 102, 241, 0.1);
}

/* Sidebar close hover */
.sidebar-close:hover {
    background: rgba(99, 102, 241, 0.1);
    border-color: var(--accent);
}

/* Share button hover */
.share-btn:hover {
    border-color: var(--accent);
    background: rgba(99, 102, 241, 0.08);
}

/* Article content text color (específico light) */
.article-content {
    color: #111827;
}

.article-content p,
.article-content li,
.article-content td,
.article-content th {
    color: #111827;
}

.article-summary {
    color: #1f2937;
}

/* Blockquote color */
.article-content blockquote {
    color: #4b5563;
    border-left-color: var(--accent);
    background: rgba(99, 102, 241, 0.05);
}

/* Meta separator color */
.meta-separator {
    background: #d1d5db;
}

/* CTA horizontal con tinte del accent */
.cta-horizontal {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(99, 102, 241, 0.03) 100%);
    border-color: rgba(99, 102, 241, 0.2);
}

/* Card shadows en light */
.article-card:hover {
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

/* Search modal background claro */
.search-modal {
    background: rgba(255, 255, 255, 0.95);
}

/* Modal overlay claro */
.modal-overlay {
    background: rgba(0, 0, 0, 0.5);
}

/* Sidebar overlay */
.sidebar-overlay {
    background: rgba(0, 0, 0, 0.3);
}

/* Footer social hover colors */
.footer-social a.facebook:hover { background: #1877f2; }
.footer-social a.twitter:hover { background: #000000; }
.footer-social a.instagram:hover { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); }
.footer-social a.youtube:hover { background: #ff0000; }
.footer-social a.tiktok:hover { background: #000000; }
.footer-social a.linkedin:hover { background: #0a66c2; }
.footer-social a.telegram:hover { background: #0088cc; }
.footer-social a.whatsapp:hover { background: #25d366; }

/* Footer copyright color específico */
.footer-copyright {
    color: #9ca3af;
}

/* Figcaption color */
.article-content figcaption,
.article-featured-figure figcaption {
    color: #6b7280;
}

/* Time fresh color */
.time-fresh {
    color: #059669;
}

/* TL;DR colors específicos - Teal Vibrante */
.tldr-card {
    background: rgba(20, 184, 166, 0.1) !important;
    border-color: rgba(20, 184, 166, 0.3) !important;
}

.tldr-badge {
    background: #14b8a6 !important;
    color: #ffffff !important;
}

.tldr-text {
    color: #134e4a !important;
}

.tldr-link {
    color: #0d9488 !important;
}

.tldr-link:hover {
    color: #14b8a6 !important;
}

/* ========== OVERRIDES ADICIONALES LIGHT ========== */

/* Logo en header (si es texto) */
.logo {
    color: var(--text);
}

/* Menu toggle */
.menu-toggle {
    color: var(--text);
}

.menu-toggle:hover {
    background: rgba(99, 102, 241, 0.1);
}

/* Search button */
.search-btn {
    color: var(--text);
}

/* Nav links */
.nav a {
    color: var(--muted);
}

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

/* Article cards */
.article-card {
    background: var(--card);
    border: 1px solid var(--border);
}

/* Layouts horizontales (Img Izq, Img Der, Full Izq, Full Der) - sin borde ni background */
.latest-news-grid.layout-list-h .article-card,
.latest-news-grid.layout-list-h-inv .article-card,
.latest-news-grid.layout-2col .article-card,
.latest-news-grid.layout-2col-inv .article-card {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.latest-news-grid.layout-list-h .article-card:hover,
.latest-news-grid.layout-list-h-inv .article-card:hover,
.latest-news-grid.layout-2col .article-card:hover,
.latest-news-grid.layout-2col-inv .article-card:hover {
    transform: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

.latest-news-grid.layout-list-h .article-card:last-child,
.latest-news-grid.layout-list-h-inv .article-card:last-child,
.latest-news-grid.layout-2col .article-card:last-child,
.latest-news-grid.layout-2col-inv .article-card:last-child {
    border-bottom: none !important;
}

/* Section titles */
.section-title {
    color: var(--text);
}

/* Widget titles */
.widget-title {
    color: var(--text);
}

/* Related cards */
.related-card {
    background: var(--card);
    border: 1px solid var(--border);
}

/* Author card - LIGHT VERSION */
.author-card {
    background: transparent;
    border: none;
}

.author-card .author-name {
    color: var(--text);
}

.author-card .author-role {
    color: var(--muted);
}

.author-card .author-bio {
    color: #374151;
}

.author-card .author-articles {
    color: var(--accent);
}

.author-card .author-social a {
    background: var(--bg);
    border: 1px solid var(--border);
    color: var(--muted);
}

.author-card .author-social a:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: #ffffff;
}

/* Author avatar sin fondo */
.author-card .author-avatar,
.author-avatar {
    background: none !important;
    border: none !important;
}

/* Tags */
.article-tags a {
    background: var(--card);
    border: 1px solid var(--border);
    color: var(--muted);
}

.article-tags a:hover {
    border-color: var(--accent);
    color: var(--accent);
}

/* Breadcrumbs */
.breadcrumb a {
    color: var(--muted);
}

.breadcrumb a:hover {
    color: var(--accent);
}

/* Article meta */
.article-meta {
    color: var(--muted);
}

/* Trending widget */
.widget-trending-item {
    border-bottom-color: var(--border);
}

.widget-trending-title {
    color: var(--text);
}

.widget-trending-title:hover {
    color: var(--accent);
}

/* Category badge en cards */
.category-badge {
    background: var(--accent);
    color: #ffffff;
}

/* Share button */
.share-btn {
    background: var(--card);
    border: 1px solid var(--border);
    color: var(--text);
}

/* Read original CTA */
.cta-horizontal {
    background: var(--card);
    border: 1px solid var(--border);
}

.cta-horizontal .cta-title {
    color: var(--text);
}

.cta-horizontal .cta-text {
    color: var(--muted);
}

/* Disclaimer */
.disclaimer-box {
    background: rgba(99, 102, 241, 0.05);
    border: 1px solid rgba(99, 102, 241, 0.2);
}

.disclaimer-box a {
    color: var(--accent);
}

/* Cookie popup light */
.cookie-popup,
.cookie-modal-content {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
}

.cookie-popup p,
.cookie-modal-content p {
    color: #4b5563 !important;
}

.cookie-modal-content h3,
.cookie-modal-content .cookie-category-title,
.cookie-category-title {
    color: #111827 !important;
}

.cookie-modal-content .cookie-category,
.cookie-category {
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 16px !important;
    margin-bottom: 12px !important;
}

.cookie-category-description {
    color: #6b7280 !important;
}

.cookie-popup a,
.cookie-modal-content a {
    color: var(--accent) !important;
}

/* Cookie category titles (Essential, Analytics, Marketing) */
.cookie-category-header,
.cookie-category-header span,
.cookie-category h4,
.cookie-category-name {
    color: #111827 !important;
}

/* Cookie toggles - solo rounded, sin fondo rectangular */
.cookie-toggle,
.cookie-switch,
.toggle-switch {
    background: #d1d5db !important;
    border-radius: 24px !important;
    border: none !important;
}

.cookie-toggle.active,
.cookie-switch.active,
.cookie-toggle:checked,
.toggle-switch.active,
input[type="checkbox"]:checked + .cookie-toggle,
input[type="checkbox"]:checked + .cookie-switch {
    background: #10b981 !important;
}

/* Cookie buttons hover fix */
.cookie-btn-secondary,
.cookie-btn-outline,
.btn-cookie-secondary {
    color: #374151 !important;
    background: transparent !important;
    border: 1px solid #d1d5db !important;
}

.cookie-btn-secondary:hover,
.cookie-btn-outline:hover,
.btn-cookie-secondary:hover,
.cookie-popup button:not(.cookie-btn-primary):not(.btn-cookie-primary):hover {
    color: #111827 !important;
    background: #f3f4f6 !important;
    border-color: #9ca3af !important;
}

/* Reject optional y Essential only buttons */
.cookie-modal-content button:not([class*="primary"]):not([class*="accept"]):not([class*="save"]) {
    color: #374151 !important;
}

.cookie-modal-content button:not([class*="primary"]):not([class*="accept"]):not([class*="save"]):hover {
    color: #111827 !important;
    background: #f3f4f6 !important;
}

/* Scroll to top button light */
.scroll-top-btn {
    background: #ffffff;
    border: 1px solid var(--border);
    color: var(--accent);
}

.scroll-top-btn:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: #ffffff;
}

/* Drop Cap - Letra Capital */
.article-content > p:first-of-type::first-letter {
    float: left;
    font-size: 4em;
    line-height: 0.8;
    padding-right: 0.15em;
    font-weight: 700;
    color: var(--text);
    font-family: var(--font-heading);
}