/* ═══════════════════════════════════════════════════════════════════════════════════════
   CAPA VISUAL MINIMALISTA — se carga la última (después de main.css y tailwind.build.css)
   Principios:
     1. Superficies planas: borde fino, sin sombras (las sombras quedan solo para capas flotantes).
     2. Texto tranquilo: nada por debajo de 12 px, sin mayúsculas ni interletrado en etiquetas.
     3. El rojo de marca es para acciones y estado, no para decorar iconos de títulos.
     4. Formas coherentes: botones de 10 px; solo avatares y contadores son circulares.
   Para revertir un criterio basta con borrar su bloque.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

:root {
    --surface:   #f8fafc;
    --border:    #e8ecf1;
    --shadow:    none;
    --shadow-md: 0 4px 16px rgba(18, 22, 59, .06);
    --radius:    14px;
}

body { background: var(--surface); }

/* ── 1. Superficies planas ─────────────────────────────────────────────────────────── */
.card { box-shadow: none; border-color: var(--border); padding: 22px; }
.card:hover { box-shadow: none; }
.main-container, .main-container1 { gap: 24px; }

/* La barra con los enlaces del ecosistema se oculta: esos enlaces están en el pie.
   Para mostrarla de nuevo, borrar esta regla. */
.ee-topbar { display: none; }

/* ── 2. Texto tranquilo ────────────────────────────────────────────────────────────── */
.uppercase { text-transform: none; }
.tracking-wider, .tracking-widest, .tracking-wide, .tracking-tighter { letter-spacing: 0; }
.text-\[8px\], .text-\[9px\], .text-\[10px\], .text-\[11px\] { font-size: .75rem; }

.card-title {
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--text);
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 12px;
}

/* ── 3. Acento con medida ──────────────────────────────────────────────────────────── */
/* Los iconos decorativos de títulos van en neutro; el rojo queda para acciones y estados */
:is(h1, h2, h3, .card-title) :is(i.fas, i.far, i.fab, i.fa-solid).text-accent { color: #94a3b8; }

/* Menú lateral: estado activo discreto, sin sangrado al pasar el cursor */
.side-nav a:hover { padding-left: 12px; background: #f1f5f9; color: var(--text); }
.side-nav a.active {
    background: transparent;
    color: var(--brand);
    font-weight: 600;
    box-shadow: inset 2px 0 0 var(--accent);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

/* ── 4. Formas coherentes ──────────────────────────────────────────────────────────── */
:is(a, button).rounded-full[class*="px-"],
.btn-primary, .btn-secondary, .btn-tercery, .profile-btn, .connect-btn, .connect-btn-lg, .connect-btn-lg2,
.new-publication-btn, a.publish-btn, .filter-btn, .action-btn { border-radius: 10px; }

/* Acciones secundarias de las tarjetas: sin caja (la caja solo la lleva la acción principal) */
.action-btn, .btn-guardar, .btn-citar, .btn-comentarios, .btn-adoptar-rea {
    background: transparent;
    border-color: transparent;
}
.action-btn:hover, .btn-guardar:hover, .btn-citar:hover, .btn-comentarios:hover, .btn-adoptar-rea:hover { background: #f1f5f9; }

/* ── Pie del ecosistema digital Entropía Educativa ─────────────────────────────────── */
.ee-eco-footer {
    background-color: #0e1329;
    color: #cbd5e1;
    padding: 64px 0 48px;
    border-top: 4px solid #cf3520;
    position: relative;
    overflow: hidden;
    margin-top: 48px;
    font-size: 13.5px;
    line-height: 1.6;
}
.ee-eco-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.025;
    background-image: radial-gradient(#ffffff 1px, transparent 1px);
    background-size: 24px 24px;
    pointer-events: none;
}
.ee-eco-footer-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 10;
}
.ee-eco-footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}
@media (min-width: 640px) {
    .ee-eco-footer-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .ee-eco-footer-grid { grid-template-columns: repeat(4, 1fr); gap: 48px; }
}
.ee-eco-footer-logo {
    display: inline-block;
    padding: 4px 0;
    margin-bottom: 16px;
    transition: opacity .2s;
}
.ee-eco-footer-logo:hover { opacity: 0.88; }
.ee-eco-footer-logo img {
    height: 44px;
    width: auto;
    display: block;
}
.ee-eco-footer-desc {
    color: #94a3b8;
    font-size: 13.5px;
    line-height: 1.65;
    margin: 0 0 22px;
}
.ee-eco-footer-desc a {
    color: #cbd5e1;
    font-weight: 600;
    text-decoration: none;
    transition: color .2s;
}
.ee-eco-footer-desc a:hover { color: #ffffff; }
.ee-eco-contact-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 22px;
    font-size: 13px;
    color: #94a3b8;
    font-weight: 500;
}
.ee-eco-contact-item {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #94a3b8;
    text-decoration: none;
    transition: color .2s;
}
a.ee-eco-contact-item:hover { color: #ffffff; }
a.ee-eco-contact-item--wa:hover { color: #34d399; }
.ee-eco-contact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(30, 41, 59, 0.65);
    border: 1px solid rgba(51, 65, 85, 0.45);
    color: #cf3520;
    flex-shrink: 0;
    transition: all .2s;
}
.ee-eco-contact-item--wa .ee-eco-contact-icon { color: #34d399; }
a.ee-eco-contact-item:hover .ee-eco-contact-icon {
    background: #cf3520;
    border-color: #cf3520;
    color: #ffffff;
}
a.ee-eco-contact-item--wa:hover .ee-eco-contact-icon {
    background: #10b981;
    border-color: #10b981;
    color: #ffffff;
}
.ee-eco-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.ee-eco-social-btn {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(30, 41, 59, 0.65);
    border: 1px solid rgba(51, 65, 85, 0.45);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 13px;
    text-decoration: none;
    transition: all .25s ease;
}
.ee-eco-social-btn:hover {
    color: #ffffff;
    transform: translateY(-2px);
}
.ee-eco-social-btn--x:hover,
.ee-eco-social-btn--tt:hover { background: #000000; border-color: #000000; }
.ee-eco-social-btn--fb:hover { background: #1877F2; border-color: #1877F2; }
.ee-eco-social-btn--ig:hover { background: #E1306C; border-color: #E1306C; }
.ee-eco-social-btn--in:hover { background: #0A66C2; border-color: #0A66C2; }
.ee-eco-social-btn--yt:hover { background: #FF0000; border-color: #FF0000; }
.ee-eco-social-btn--wa:hover { background: #25D366; border-color: #25D366; }

.ee-eco-col-title {
    color: #ffffff !important;
    font-family: 'Outfit', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    border-left: 2px solid #cf3520;
    padding-left: 12px;
    margin: 0 0 22px;
    line-height: 1.3;
}
.ee-eco-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.ee-eco-link {
    color: #94a3b8;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    transition: color .2s;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}
.ee-eco-link-arrow {
    color: #cf3520;
    font-weight: 700;
    transition: transform .2s;
}
.ee-eco-link:hover { color: #ffffff; }
.ee-eco-link:hover .ee-eco-link-arrow { transform: translateX(4px); }

.ee-eco-network-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.ee-eco-network-link {
    color: #ffffff;
    font-weight: 600;
    font-size: 13.5px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color .2s;
}
.ee-eco-network-link i {
    font-size: 10px;
    color: #64748b;
    transition: color .2s;
}
.ee-eco-network-link:hover { color: #ff8a6b; }
.ee-eco-network-link:hover i { color: #ff8a6b; }
.ee-eco-network-sub {
    color: #94a3b8;
    font-size: 12px;
    margin: 2px 0 0;
}
.ee-eco-subdivider {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(30, 41, 59, 0.8);
}

.ee-eco-footer-bottom {
    margin-top: 48px;
    padding-top: 28px;
    border-top: 1px solid rgba(30, 41, 59, 0.85);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    font-size: 13px;
    color: #64748b;
}
@media (min-width: 1024px) {
    .ee-eco-footer-bottom { flex-direction: row; }
}
.ee-eco-copyright {
    margin: 0;
    text-align: center;
    color: #64748b;
}
@media (min-width: 1024px) {
    .ee-eco-copyright { text-align: left; }
}
.ee-eco-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.ee-eco-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 9999px;
    border: 1px solid #1e293b;
    background: rgba(15, 23, 42, 0.65);
    color: #cbd5e1;
    font-size: 11px !important;
    font-weight: 600;
    text-decoration: none;
    transition: border-color .2s, color .2s;
}
a.ee-eco-badge:hover {
    color: #ffffff;
    border-color: #475569;
}

/* ── Tarjeta de publicación ────────────────────────────────────────────────────────── */
.pub-card { transition: border-color .15s; }
.pub-card:hover { border-color: #d5dce6; }
.pub-card h2 a:hover { color: var(--brand); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* ── Widgets laterales: listas planas de texto ─────────────────────────────────────── */
.ee-event-card, .ee-cv-card, .ee-congreso-card {
    border: 0; border-radius: 8px; background: transparent; padding: 8px 6px; margin-bottom: 2px;
}
.ee-event-card:hover, .ee-cv-card:hover, .ee-congreso-card:hover {
    transform: none; box-shadow: none; background: #f1f5f9; border-color: transparent;
}
/* Congreso: de bloque oscuro con degradado a una línea más del listado */
.ee-congreso-inner { background: transparent; padding: 0; }
.ee-congreso-inner::before { display: none; }
.ee-congreso-badge { display: none; }
.ee-congreso-title { color: var(--text); font-weight: 600; font-size: .875rem; margin-bottom: 4px; }
.ee-congreso-meta, .ee-congreso-meta i { color: var(--text-2); }
/* Fecha del evento: texto, no bloque de color */
.ee-event-date, .ee-event-date--soon { background: transparent; box-shadow: none; min-width: 34px; }
.ee-event-day { color: var(--brand); }
.ee-event-month, .ee-event-year { color: var(--text-2); }
.ee-event-title, .ee-cv-title { font-weight: 600; font-size: .875rem; color: var(--text); }
.ee-event-meta i, .ee-section-header i { color: #94a3b8; }
.ee-event-price { background: transparent; border-color: transparent; color: var(--text-2); padding: 0; }
.ee-event-price--free { background: transparent; border-color: transparent; color: #047857; }
/* Convocatorias: sin cuadro de icono ni chips de colores */
.ee-cv-icon-wrap { display: none; }
.ee-cv-urgent, .ee-cv-soon, .ee-cv-open { background: transparent; border-color: transparent; padding: 0; color: var(--text-2); }
.ee-cv-urgent { color: var(--accent-dark); font-weight: 600; }
.ee-section-header { color: var(--text-2); letter-spacing: 0; text-transform: none; font-size: .75rem; font-weight: 600; }
.ee-section-sep { display: none; }

/* ── Tarjetas de Próximos Eventos en el Hero oscuro de inicio-login ────────────────── */
.login-events-card .ee-section-header {
    color: #cbd5e1;
    margin-top: 10px;
    margin-bottom: 6px;
}
.login-events-card .ee-section-header i {
    color: #ff8a6b;
}
.login-events-card .ee-event-card,
.login-events-card .ee-congreso-card {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 8px;
    transition: background .18s ease, border-color .18s ease;
}
.login-events-card .ee-event-card:hover,
.login-events-card .ee-congreso-card:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 138, 107, 0.5);
}
.login-events-card .ee-congreso-title,
.login-events-card .ee-event-title {
    color: #ffffff;
}
.login-events-card .ee-congreso-card:hover .ee-congreso-title,
.login-events-card .ee-event-card:hover .ee-event-title {
    color: #ff8a6b;
}
.login-events-card .ee-congreso-meta,
.login-events-card .ee-event-meta {
    color: #cbd5e1;
}
.login-events-card .ee-congreso-meta i,
.login-events-card .ee-event-meta i {
    color: #ff8a6b;
}
.login-events-card .ee-event-date {
    background: rgba(255, 138, 107, 0.15);
    border: 1px solid rgba(255, 138, 107, 0.3);
    border-radius: 8px;
    padding: 4px 6px;
    min-width: 42px;
}
.login-events-card .ee-event-day {
    color: #ffffff;
}
.login-events-card .ee-event-month,
.login-events-card .ee-event-year {
    color: #ff8a6b;
}
.login-events-card .ee-event-price {
    color: #ffb4a8;
    font-weight: 600;
}
.login-events-card .ee-event-price--free {
    color: #6ee7b7;
    font-weight: 600;
}

/* ── Conectar / acciones menores: contorno discreto, el rojo solo al interactuar ───── */
.connect-btn {
    background: #fff; color: var(--text); border: 1px solid var(--border);
    font-weight: 500; font-size: .8rem; padding: 6px 12px;
}
.connect-btn:hover { background: #fff; color: var(--accent-dark); border-color: var(--accent); }
.left-sidebar i.text-accent, .right-sidebar i.text-accent { color: #94a3b8; }   /* motivos de sugerencia, etc. */

/* Ficha «Completa tu perfil»: aviso tranquilo, no un bloque de botones rojos */
.card h3 + p { color: var(--text-2); font-size: .875rem; }
.card .buttons-container .connect-btn { background: #f8fafc; }

/* Botón de acceso a la publicación: contorno (la acción roja es la de la página, no la de cada tarjeta) */
.pub-card .acceder, .pub-card .btn-solicitar-acceso {
    background: #fff; color: var(--text); border: 1px solid var(--border);
}
.pub-card .acceder:hover, .pub-card .btn-solicitar-acceso:hover { background: #f8fafc; border-color: #cbd5e1; color: var(--brand); }
.btn-sugerencia-conectar {
    background: #fff; color: var(--text); border: 1px solid var(--border); font-weight: 500;
}
.btn-sugerencia-conectar:hover { background: #fff; color: var(--accent-dark); border-color: var(--accent); }

/* ── Móvil: la cabecera no cabe con nombre + 5 iconos; se deja solo el logo (el nombre está en el pie) ── */
@media (max-width: 479px) {
    #main-navbar a[aria-label^="Entropía Socialnetwork"] > .leading-tight { display: none; }
}
