/*
 * coop-shared.css — estilos para los autolinks y tooltips emitidos por
 * CoopShared::enrichHtml() (cliente PHP framework-agnostic) y/o por
 * sitios partner que repliquen el patrón del coop.
 *
 * Versión: 1.0  (2026-05-08)
 * Compatible con coop-shared.php >= 1.1
 *
 * USO desde HTML del partner:
 *   <link rel="stylesheet" href="https://cooperativaliberte.coop/coop-shared.css">
 *
 * REQUIERE TAMBIÉN (para tooltips Tippy):
 *   <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/tippy.css">
 *   <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/animations/shift-away.css">
 *
 * Si el partner quiere personalizar colores manteniendo paridad de estructura,
 * descargar este archivo, copiarlo local y override las variables.
 */

/* ─── Autolinks (Entities con AutoLinker del coop) ─────────────────── */

.autolink {
    /* !important porque muchos contextos editoriales tienen color inline en
       el <p> padre que pisa la specificity de .autolink (inline=1000, class=10).
       Sin !important, el verde del autolink queda opacado por el color del
       párrafo padre. */
    color: #059669 !important;
    text-decoration: underline;
    text-decoration-style: dotted;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}

.autolink:hover { color: #064e3b !important; }

/* Variaciones de hover por entity_type — sutiles, todas en familia
   greens/teal con un toque distinto para que cada tipo tenga su propio
   character. El SVG inline ya diferencia visualmente; el hover refuerza. */
.autolink-persona:hover      { color: #047857 !important; }
.autolink-organizacion:hover { color: #0e7490 !important; }
.autolink-area:hover         { color: #14532d !important; }
.autolink-hito:hover         { color: #b45309 !important; }
.autolink-external:hover     { color: #064e3b !important; }

/* ─── Glossary terms (GlossaryLinker del coop) ─────────────────────── */

/* El span de glossary lleva style inline con border-bottom:1px dotted #d97706
   — eso ya viene en el output de coop-shared.php. Estos hover refuerzan. */
.glossary-term {
    transition: color 0.15s;
}
.glossary-term:hover {
    color: #b45309;
}
.glossary-term:hover .glossary-icon {
    transform: scale(1.15);
}
.glossary-icon {
    transition: transform 0.15s;
}

/* ─── Tippy theme 'liberte' — verde cooperativa ──────────────────────── */

.tippy-box[data-theme~='liberte'] {
    background: linear-gradient(135deg, #064e3b 0%, #047857 100%);
    color: #fff;
    border-radius: 10px;
    box-shadow: 0 14px 40px -8px rgba(6,78,59,0.4);
    font-family: 'Outfit', system-ui, sans-serif;
    font-size: 0.9rem;
    line-height: 1.5;
    padding: 4px 2px;
}
.tippy-box[data-theme~='liberte'] .tippy-content {
    padding: 10px 14px;
    max-width: 360px;
    /* Safety net: si el contenido es enorme y popperOptions no puede
       flipearlo bien, scrollea adentro del tooltip. */
    max-height: 80vh;
    overflow-y: auto;
}
.tippy-box[data-theme~='liberte'][data-placement^='top'] > .tippy-arrow::before    { border-top-color: #047857; }
.tippy-box[data-theme~='liberte'][data-placement^='bottom'] > .tippy-arrow::before { border-bottom-color: #064e3b; }
.tippy-box[data-theme~='liberte'][data-placement^='left'] > .tippy-arrow::before   { border-left-color: #047857; }
.tippy-box[data-theme~='liberte'][data-placement^='right'] > .tippy-arrow::before  { border-right-color: #047857; }

/* ─── Tooltip rico de entidades autolinkeadas (renderEntityTooltip JS) ── */

.tippy-box[data-theme~='liberte'] .lt-tt-header {
    padding: 0 0 6px 8px;
    margin-bottom: 6px;
    font-size: 0.92rem;
    border-bottom: 1px solid rgba(255,255,255,0.18);
}
.tippy-box[data-theme~='liberte'] .lt-tt-bio {
    font-size: 0.84rem;
    line-height: 1.45;
    color: rgba(255,255,255,0.95);
    margin-bottom: 8px;
}
.tippy-box[data-theme~='liberte'] .lt-tt-mentions-title {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(255,255,255,0.65);
    margin: 6px 0 4px;
    font-weight: 700;
}
.tippy-box[data-theme~='liberte'] .lt-tt-mentions {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.82rem;
    line-height: 1.6;
}
.tippy-box[data-theme~='liberte'] .lt-tt-mentions li {
    padding: 1px 0;
    color: rgba(255,255,255,0.92);
}
.tippy-box[data-theme~='liberte'] .lt-tt-mentions a {
    color: #fde68a;
    text-decoration: none;
    border-bottom: 1px dotted rgba(253,230,138,0.4);
}
.tippy-box[data-theme~='liberte'] .lt-tt-mentions a:hover {
    color: #fff;
    border-bottom-color: rgba(255,255,255,0.6);
}
.tippy-box[data-theme~='liberte'] .lt-tt-more {
    font-size: 0.74rem;
    color: rgba(255,255,255,0.6);
    font-style: italic;
    padding-top: 4px !important;
}
.tippy-box[data-theme~='liberte'] .lt-tt-cta {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,0.18);
    text-align: right;
}
.tippy-box[data-theme~='liberte'] .lt-tt-cta a {
    color: #fde68a;
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.tippy-box[data-theme~='liberte'] .lt-tt-cta a:hover { color: #fff; }