/* TechTrap Work Packages — front-end */

.ttwp-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
    font-family: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Forzar Archivo también en los elementos que el tema suele estilar por su cuenta
   (encabezados, botones y enlaces). Se excluye el contenido de shortcodes embebidos. */
.ttwp-wrap .ttwp-section-title,
.ttwp-wrap .ttwp-panel-title,
.ttwp-wrap .ttwp-result-title,
.ttwp-wrap .ttwp-card,
.ttwp-wrap .ttwp-task-title,
.ttwp-wrap .ttwp-download {
    font-family: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.ttwp-section-title {
    font-size: 30px;
    font-weight: 700;
    color: #0E1517;
    margin: 0 0 22px;
}

/* ── Grilla de tarjetas ── */
.ttwp-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-bottom: 28px;
}

.ttwp-card {
    display: flex;
    align-items: stretch;
    text-align: left;
    border: none;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
    padding: 0;
    min-height: 78px;
    background: var(--ttwp-card-bg, #8a8d8f);
    color: var(--ttwp-card-text, #fff);
    transition: transform .15s, box-shadow .15s;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}

.ttwp-card:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0, 0, 0, .18); }

.ttwp-card-code {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38%;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: .5px;
    background: rgba(0, 0, 0, .12);
    padding: 14px 8px;
}

.ttwp-card-text {
    display: flex;
    align-items: center;
    flex: 1;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 400;
}

/* Tarjeta activa (azul como en el mockup) */
.ttwp-card.is-active {
    background: var(--ttwp-card-active, #2ca6e0);
}
.ttwp-card.is-active .ttwp-card-code {
    background: rgba(0, 0, 0, .10);
}

/* ── Paneles desplegables ── */
.ttwp-panel { display: none; }
.ttwp-panel.is-open { display: block; }

.ttwp-panel-title {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    color: #0E1517;
    padding: 0;
    margin: 0 0 18px;
}

.ttwp-panel-desc {
    color: #333;
    font-size: 16px;
    line-height: 1.55;
    margin-bottom: 18px;
}

/* Tareas (vista Proyectos) */
.ttwp-tasks {
    list-style: none;
    margin: 0 0 22px;
    padding: 0;
}
.ttwp-task-item { margin-bottom: 14px; }
.ttwp-task-title {
    display: block;
    font-weight: 400;
    color: #7a1f2b;
    font-size: 15px;
}
.ttwp-task-desc { color: #444; font-size: 15px; line-height: 1.5; margin-top: 4px; }

/* Video */
.ttwp-video-wrap { margin-top: 10px; }
.ttwp-video,
.ttwp-video-embed { width: 100%; max-width: 760px; }
.ttwp-video-embed { position: relative; aspect-ratio: 16 / 9; }
.ttwp-video-embed iframe,
.ttwp-video-embed video { width: 100% !important; height: 100% !important; }

/* Resultados (vista Resultados) */
.ttwp-result {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid #e4e4e4;
    padding: 6px 0 18px;
    margin-bottom: 18px;
}
.ttwp-result-main { flex: 1; min-width: 0; }
.ttwp-result-actions { flex-shrink: 0; }

/* Que el contenido enriquecido (texto largo o shortcodes anidados) no se desborde */
.ttwp-result-desc,
.ttwp-task-desc { overflow-wrap: anywhere; }
.ttwp-result-desc > *:first-child,
.ttwp-task-desc > *:first-child { margin-top: 0; }

/* ── Shortcodes de "sección completa" embebidos dentro de una tarea ──
   (p.ej. [tt_results_overview] del plugin techtrap-results): se los adapta
   al ancho del contenedor en vez de dejar que se desborden. */
.ttwp-panel .tt-results-overview {
    padding: 24px 16px;
    background: transparent;
}
.ttwp-panel .tt-main-title { font-size: 28px; }
.ttwp-panel .tt-universities-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 18px;
}
.ttwp-panel .tt-uni-btn { width: auto; }
.ttwp-result-title {
    font-size: 16px;
    font-weight: 400;
    color: #2f4b6b;
    margin: 0 0 8px;
}
.ttwp-result-desc { color: #2f4b6b; font-size: 15px; line-height: 1.55; }

.ttwp-download {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    background: #f7941e;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 18px;
    border-radius: 4px;
}
.ttwp-download:hover { background: #e07f0a; }
.ttwp-download-tag {
    background: rgba(0, 0, 0, .18);
    border-radius: 3px;
    padding: 1px 6px;
    font-size: 11px;
}

.ttwp-no-results { color: #777; font-style: italic; }

/* ── Responsive ── */
@media (max-width: 900px) {
    .ttwp-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .ttwp-grid { grid-template-columns: 1fr; }
    .ttwp-result { flex-direction: column; gap: 10px; }
}