/* =========================================
   LIGHT RETRO — aspecto periódico / recorte de prensa
   Capa sobre styles.css; solo [data-theme="retro"]
   ========================================= */

/* Grano de papel (muy sutil) */
[data-theme="retro"] body::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 99999;
    opacity: 0.035;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 180px 180px;
}

/* Esquinas rectas en UI principal */
[data-theme="retro"] .prisma-mode-toggle,
[data-theme="retro"] .mode-btn,
[data-theme="retro"] .feed-mode-btn,
[data-theme="retro"] .prisma-article,
[data-theme="retro"] .comp-article-img,
[data-theme="retro"] .event-card-preview-img,
[data-theme="retro"] .quality-score-chip,
[data-theme="retro"] .ling-score-badge,
[data-theme="retro"] .comparison-tabs,
[data-theme="retro"] .phone-screen #prismaCompTabs.comparison-tabs,
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs.comparison-tabs,
[data-theme="retro"] details.src-medio-card,
[data-theme="retro"] .src-section-stats .src-stat {
    border-radius: 0 !important;
}

/* ── Masthead (cabecera de sección) ── */
[data-theme="retro"] .face-header-fixed {
    border-bottom: 1px solid var(--ink);
    padding-top: 28px !important;
}

[data-theme="retro"] .phone-screen .face-header {
    background: var(--paper-light) !important;
    padding-top: 10px !important;
    padding-bottom: 8px !important;
}

[data-theme="retro"] .phone-screen .face-tag {
    color: var(--brand) !important;
    letter-spacing: 0.22em !important;
    font-weight: 700 !important;
    font-size: 0.5rem !important;
}

[data-theme="retro"] .face-tag::after {
    content: '';
    display: block;
    width: min(300px, 55vw);
    height: 3px;
    background: var(--brand);
    margin-top: 8px;
}

[data-theme="retro"] .phone-screen .face-header h2 {
    font-family: var(--font-serif) !important;
    font-weight: 900 !important;
    font-size: 0.85rem !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}

[data-theme="retro"] .event-card::before {
    display: none;
}

[data-theme="retro"] .event-card h3::before {
    content: '';
    display: block;
    width: 40px;
    height: 2px;
    background: var(--ink);
    margin-bottom: 10px;
    opacity: 0.35;
}

[data-theme="retro"] .event-card p {
    text-align: justify;
    hyphens: auto;
}

[data-theme="retro"] .phone-screen .event-card-content {
    padding: 4px 18px 0;
}

[data-theme="retro"] .phone-screen .event-card h3::before {
    content: '';
    display: block;
    width: 56px;
    height: 3px;
    background: var(--brand);
    margin-bottom: 12px;
}

[data-theme="retro"] .phone-screen .event-card h3 {
    font-family: var(--font-serif) !important;
    font-weight: 900 !important;
    line-height: 1.12 !important;
    letter-spacing: -0.02em !important;
}

[data-theme="retro"] .phone-screen .event-card p {
    text-align: justify;
    line-height: 1.72 !important;
}

[data-theme="retro"] .event-card-title-btn {
    font-family: inherit;
    font-weight: inherit;
    text-align: left;
}

/* ── Comparativa: columnas de periódico ── */
[data-theme="retro"] #prismaColPais,
[data-theme="retro"] #prismaColMundo {
    background: var(--paper-light) !important;
}

[data-theme="retro"] .comparison-col {
    border-right: 1px solid var(--ink);
    background: var(--paper-light);
}

[data-theme="retro"] .comparison-col:last-child {
    border-right: none;
}

[data-theme="retro"] .col-header {
    background: var(--paper);
    border-bottom: 1.5px solid var(--ink);
    padding: 16px 20px;
}

[data-theme="retro"] .col-header img {
    filter: none !important;
    height: 26px;
}

[data-theme="retro"] #prismaColPais .col-header {
    border-bottom-color: var(--analysis);
}

[data-theme="retro"] #prismaColMundo .col-header {
    border-bottom-color: var(--brand);
}

[data-theme="retro"] .prisma-article {
    border: none;
    border-bottom: 1px solid var(--gray-light);
    box-shadow: none;
    padding: 16px 4px;
    margin-bottom: 16px;
}

[data-theme="retro"] .prisma-article:hover {
    transform: none;
}

[data-theme="retro"] .prisma-article h4,
[data-theme="retro"] .comp-article h4 {
    font-family: var(--font-serif);
    font-weight: 700;
    line-height: 1.2;
}

[data-theme="retro"] .comp-article p {
    text-align: justify;
    font-size: 0.92rem;
    line-height: 1.72;
}

[data-theme="retro"] .comp-article-img {
    margin-bottom: 14px;
}

[data-theme="retro"] .comp-article .read-more {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.72rem;
    font-weight: 700;
    border-bottom: 2px solid var(--brand);
    padding-bottom: 2px;
    text-decoration: none;
}

/* ── Pestañas comparativa = secciones del periódico ── */
[data-theme="retro"] .comparison-tabs {
    background: var(--paper) !important;
    border-bottom: 2px solid var(--ink) !important;
}

[data-theme="retro"] .comp-tab {
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.72rem;
    font-weight: 700;
    border-bottom-width: 3px;
    color: var(--text-secondary) !important;
}

[data-theme="retro"] .comp-tab:hover {
    color: var(--text-primary) !important;
    background: var(--accent-subtle) !important;
}

[data-theme="retro"] .comp-tab.active {
    color: var(--paper-light) !important;
    background: var(--ink) !important;
    border-bottom-color: var(--ink) !important;
}

[data-theme="retro"] .comp-tab svg,
[data-theme="retro"] .comp-tab [data-lucide] {
    color: var(--text-secondary) !important;
    stroke: var(--text-secondary) !important;
    opacity: 1 !important;
}

[data-theme="retro"] .comp-tab:hover svg,
[data-theme="retro"] .comp-tab:hover [data-lucide] {
    color: var(--text-primary) !important;
    stroke: var(--text-primary) !important;
}

[data-theme="retro"] .comp-tab.active svg,
[data-theme="retro"] .comp-tab.active [data-lucide] {
    color: var(--paper-light) !important;
    stroke: var(--paper-light) !important;
}

[data-theme="retro"] .phone-screen #prismaCompTabs.comparison-tabs,
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs.comparison-tabs,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs.comparison-tabs {
    border-radius: 0 !important;
    border: 1.5px solid var(--ink) !important;
    border-bottom: 2px solid var(--ink) !important;
    background: var(--paper-light) !important;
    margin-top: 0 !important;
    box-shadow: none !important;
}

/* Anula color blanco del modo oscuro en pestañas móvil (misma especificidad que styles.css) */
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs .comp-tab,
[data-theme="retro"] .phone-screen #prismaCompTabs .comp-tab,
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs .comp-tab {
    color: var(--text-secondary) !important;
}

[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs .comp-tab svg,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs .comp-tab [data-lucide],
[data-theme="retro"] .phone-screen #prismaCompTabs .comp-tab svg,
[data-theme="retro"] .phone-screen #prismaCompTabs .comp-tab [data-lucide],
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs .comp-tab svg,
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs .comp-tab [data-lucide] {
    color: var(--text-secondary) !important;
    stroke: var(--text-secondary) !important;
}

[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs .comp-tab.active,
[data-theme="retro"] .phone-screen #prismaCompTabs .comp-tab.active,
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs .comp-tab.active {
    background: var(--ink) !important;
    color: var(--paper-light) !important;
    border-bottom-color: var(--ink) !important;
}

[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs .comp-tab.active svg,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] #prismaCompTabs .comp-tab.active [data-lucide],
[data-theme="retro"] .phone-screen #prismaCompTabs .comp-tab.active svg,
[data-theme="retro"] .phone-screen #prismaCompTabs .comp-tab.active [data-lucide],
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs .comp-tab.active svg,
[data-theme="retro"] #prismaSection:not(.desktop-mode) #prismaCompTabs .comp-tab.active [data-lucide] {
    color: var(--paper-light) !important;
    stroke: var(--paper-light) !important;
}

/* ── Sellos / badges ── */
[data-theme="retro"] .vinculo-badge {
    border-radius: 2px !important;
    border: 1px solid currentColor;
    background: transparent !important;
    letter-spacing: 0.14em;
    padding: 2px 7px;
    font-size: 0.58rem;
}

[data-theme="retro"] .vinculo-badge.vinculo-cubre {
    color: var(--analysis) !important;
    border-color: var(--analysis);
}

[data-theme="retro"] .vinculo-badge.vinculo-interpreta {
    color: #9A7B00 !important;
    border-color: #9A7B00;
    background: rgba(245, 213, 71, 0.25) !important;
}

[data-theme="retro"] .vinculo-dir {
    border-radius: 2px !important;
    border: 1px solid currentColor;
    background: transparent !important;
}

/* ── Timeline = línea de fechas ── */
[data-theme="retro"] .vertical-timeline {
    border-left: 1px solid var(--gray-light);
    margin-left: 12px;
    padding-left: 16px;
}

[data-theme="retro"] .timeline-node-content {
    border-radius: 0;
    border: 1px solid var(--gray-light);
    border-left: 4px solid var(--ink);
    background: var(--paper-light);
}

[data-theme="retro"] .timeline-node h4,
[data-theme="retro"] .timeline-node-content h4 {
    color: var(--ink) !important;
    font-family: var(--font-serif);
    font-weight: 700;
}

[data-theme="retro"] .timeline-node span,
[data-theme="retro"] .timeline-node-content span {
    color: var(--text-secondary) !important;
}

[data-theme="retro"] .timeline-node.active .timeline-node-content {
    background: var(--paper-light) !important;
    border-color: var(--gray-light) !important;
    border-left: 4px solid var(--brand) !important;
    box-shadow: var(--shadow-paper);
}

[data-theme="retro"] .timeline-node.active h4,
[data-theme="retro"] .timeline-node.active .timeline-node-content h4 {
    color: var(--ink) !important;
}

[data-theme="retro"] .timeline-node.active span,
[data-theme="retro"] .timeline-node.active .timeline-node-content span {
    color: var(--brand) !important;
}

/* Móvil Prisma — anula herencia blanca del tema oscuro */
[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node h4,
[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node-content h4,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node h4,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node-content h4 {
    color: var(--ink) !important;
}

[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node span,
[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node-content span,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node span,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node-content span {
    color: var(--text-secondary) !important;
}

[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node.active h4,
[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node.active .timeline-node-content h4,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node.active h4,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node.active .timeline-node-content h4 {
    color: var(--ink) !important;
}

[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node.active span,
[data-theme="retro"] .phone-screen .vertical-timeline .timeline-node.active .timeline-node-content span,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node.active span,
[data-theme="retro"] #prismaSection[data-prisma-layout="phone"] .vertical-timeline .timeline-node.active .timeline-node-content span {
    color: var(--brand) !important;
}

[data-theme="retro"] .rel-tl-date {
    font-family: var(--font-family);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.68rem;
    color: var(--brand);
}

[data-theme="retro"] .rel-tl-title {
    font-family: var(--font-serif);
    font-weight: 700;
}

/* ── Controles flotantes ── */
[data-theme="retro"] .prisma-mode-toggle {
    border-radius: 0;
    border: 1px solid var(--gray-light);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: none;
    background: var(--paper-light);
}

[data-theme="retro"] .mode-btn.active {
    background: var(--ink);
    color: var(--paper-light);
    border-color: var(--ink);
    box-shadow: none;
}

[data-theme="retro"] .feed-mode-btn {
    border-radius: 0;
    letter-spacing: 0.1em;
    border: 1.5px solid var(--gray-light);
}

[data-theme="retro"] .feed-mode-btn.active[data-feed-mode="liveblog"] {
    background: #9A7B00;
    border-color: #9A7B00;
    color: var(--paper-light);
}

/* ── Paneles escritorio ── */
[data-theme="retro"] .desktop-panel {
    border-right: 1px solid var(--gray-light);
}

[data-theme="retro"] .desktop-panel.focused {
    box-shadow: inset 4px 0 0 var(--ink);
}

[data-theme="retro"] .newspaper-header {
    border-bottom: 4px double var(--ink);
}

[data-theme="retro"] .newspaper-header img {
    filter: none;
}

/* ── Análisis lingüístico = capa editorial marcada ── */
[data-theme="retro"] .quality-score-chip {
    border-radius: 2px !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.62rem;
}

[data-theme="retro"] .ling-card {
    border-radius: 0;
    border: 1px solid var(--gray-light);
    border-left: 5px solid var(--ink);
}

[data-theme="retro"] .processing-box {
    border-radius: 0;
    border-left-width: 4px;
    border-left-color: var(--ink);
}

/* ── Fuentes / drawer ── */
[data-theme="retro"] .sources-drawer-handle {
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    border: 2px solid var(--ink);
}

[data-theme="retro"] details.src-medio-card summary {
    border-bottom: 1px solid var(--gray-light);
}

[data-theme="retro"] .src-medio-name {
    font-family: var(--font-serif);
    font-weight: 700;
}

/* =========================================
   DESKTOP — periódico de tres columnas
   ========================================= */

[data-theme="retro"] .desktop-panel.focused {
    background: var(--paper) !important;
    box-shadow: none !important;
}

[data-theme="retro"] .desktop-panel.left,
[data-theme="retro"] .desktop-panel.right {
    filter: saturate(0.9) brightness(0.98);
    opacity: 0.94;
    background: var(--paper) !important;
}

[data-theme="retro"] .desktop-panel:not(.focused):hover {
    background: var(--paper-light) !important;
}

[data-theme="retro"] .desktop-panel .face-header-fixed {
    border-bottom: 1px solid var(--ink) !important;
    background: var(--paper-light) !important;
    box-shadow: none !important;
}

[data-theme="retro"] .desktop-panel .face-header-fixed h2 {
    font-family: var(--font-serif);
    font-weight: 900;
    text-transform: none;
    letter-spacing: -0.02em;
    text-shadow: none;
}

[data-theme="retro"] .desktop-panel .face-tag {
    display: block !important;
    color: var(--brand) !important;
    letter-spacing: 0.22em;
    font-size: 0.68rem;
    opacity: 1;
}

/* Columna central: texto = página | globo = plano distinto */
[data-theme="retro"] .desktop-panel.panel-events.focused {
    background: var(--paper) !important;
}

[data-theme="retro"] .desktop-panel.panel-events.focused .events-scroll-container {
    background: var(--paper-light) !important;
    border-right: 1px solid var(--ink);
    box-shadow: inset -8px 0 24px rgba(26, 26, 26, 0.04);
    transform: none !important;
    padding: 24px 32px 32px !important;
}

[data-theme="retro"] .desktop-panel.panel-events.focused .mini-globe-wrapper,
[data-theme="retro"] .desktop-panel.panel-events.focused #desktopMiniGlobeContainer {
    background:
        radial-gradient(ellipse 75% 65% at 50% 42%, rgba(26, 26, 26, 0.05), transparent 68%),
        linear-gradient(165deg, var(--paper-globe) 0%, #DDD6C8 100%) !important;
    border-left: 1px solid var(--gray-light);
    transform: none !important;
}

[data-theme="retro"] .desktop-panel .mini-globe-wrapper {
    background:
        radial-gradient(ellipse 70% 60% at 50% 45%, rgba(26, 26, 26, 0.04), transparent 65%),
        var(--paper-globe) !important;
}

[data-theme="retro"] #desktopMiniGlobeContainer {
    background: var(--paper-globe) !important;
}

/* Recortes en columna de eventos (anulan transparent del base) */
[data-theme="retro"] .desktop-panel .event-card {
    background: var(--paper-light) !important;
    border: none !important;
    border-bottom: 1px solid var(--gray-light) !important;
    box-shadow: none;
    padding: 24px 4px 24px !important;
    margin: 0 0 16px !important;
    opacity: 1 !important;
    transform: none !important;
}

[data-theme="retro"] .desktop-panel .event-card.active {
    background: var(--paper-light) !important;
    border-left: 3px solid var(--brand) !important;
    padding-left: 16px !important;
    box-shadow: none;
}

[data-theme="retro"] .desktop-panel .event-card h3,
[data-theme="retro"] .desktop-panel .event-card h3 .event-card-title-btn {
    font-family: var(--font-serif) !important;
    font-weight: 900 !important;
    font-size: 1.28rem !important;
    line-height: 1.14 !important;
    letter-spacing: -0.02em !important;
    color: var(--ink) !important;
}

[data-theme="retro"] .desktop-panel .event-card h3::before {
    width: 52px;
    height: 3px;
    background: var(--brand);
    opacity: 1;
    margin-bottom: 12px;
}

[data-theme="retro"] .desktop-panel .event-card p {
    text-align: justify;
    line-height: 1.72;
    color: var(--text-secondary);
    font-size: 0.95rem;
}

[data-theme="retro"] .read-more-inline-btn {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.68rem;
    font-weight: 700;
    font-family: var(--font-family);
    border-bottom: 2px solid var(--brand);
    text-decoration: none !important;
    margin-left: 6px;
}

[data-theme="retro"] .desktop-panel .event-card-preview-img {
    border: none;
    border-radius: 0 !important;
    margin-bottom: 14px;
}

/* Timeline derecha = índice del periódico */
[data-theme="retro"] .desktop-panel .vertical-timeline {
    border-left: 1px solid var(--gray-light);
    margin-left: 20px;
    padding-left: 0;
}

[data-theme="retro"] .desktop-panel .timeline-node {
    border-left: none;
    border-bottom: 1px solid var(--gray-light);
    margin-left: 0;
    padding: 16px 20px 16px 24px;
    background: transparent;
}

[data-theme="retro"] .desktop-panel .timeline-node::before {
    background: var(--paper);
    border: 2px solid var(--ink);
    border-radius: 0;
    width: 8px;
    height: 8px;
    left: -5px;
    box-shadow: none;
}

[data-theme="retro"] .desktop-panel .timeline-node h4 {
    font-family: var(--font-serif) !important;
    font-weight: 700 !important;
    color: var(--ink) !important;
    line-height: 1.25 !important;
}

[data-theme="retro"] .desktop-panel .timeline-node span {
    color: var(--brand) !important;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 0.65rem;
    font-weight: 700;
    opacity: 1 !important;
}

[data-theme="retro"] .desktop-panel .timeline-node.active {
    background: transparent !important;
    border-left: none !important;
}

[data-theme="retro"] .desktop-panel .timeline-node.active h4 {
    color: var(--ink) !important;
}

[data-theme="retro"] .desktop-panel .timeline-node.active span {
    color: var(--brand) !important;
}

[data-theme="retro"] .desktop-panel .timeline-node.active .timeline-node-content {
    background: var(--paper-light) !important;
    border-left: 4px solid var(--brand) !important;
    box-shadow: var(--shadow-paper);
}

[data-theme="retro"] .desktop-panel .timeline-node.active::before {
    background: var(--brand);
    border-color: var(--brand);
}

[data-theme="retro"] .desktop-panel .timeline-node:hover {
    background: var(--accent-subtle) !important;
}

/* Comparativa izquierda — artículos como recortes en columna */
[data-theme="retro"] .desktop-panel .comparison-col .prisma-article {
    border-radius: 0 !important;
    border: none;
    border-bottom: 1px solid var(--gray-light);
    box-shadow: none;
    background: transparent;
}

[data-theme="retro"] .desktop-panel .comparison-col .prisma-article h4 {
    font-family: var(--font-serif);
    font-weight: 700;
}

[data-theme="retro"] .desktop-panel:not(.focused) .comparison-columns,
[data-theme="retro"] .desktop-panel:not(.focused) .events-scroll-container {
    opacity: 0.75;
    filter: none;
}
