/* Institutos Confucio ALC — estilos de los shortcodes. Basado en micrositio-confucio-alc/assets/css/styles.css, scoped a .ic-root */
.ic-root{
  --ic-paper:#ffffff; --ic-surface-2:#F4F4F3; --ic-surface-3:#ECECEA;
  --ic-ink:#1a1a1a; --ic-ink-secondary:#4A4A48; --ic-ink-muted:#6D7173;
  --ic-hairline:#DEDEDA; --ic-hairline-strong:#B9B9B4;
  --ic-accent:#D84D43; --ic-accent-soft:#FBEAE8; --ic-gold:#fcbf61;
  --ic-instituto:#009758; --ic-instituto-text:#00623a;
  --ic-aula:#c9911f; --ic-aula-text:#8a5a12;
  --ic-shadow:0 1px 2px rgba(26,26,26,.06), 0 8px 24px -12px rgba(26,26,26,.20);
  color:var(--ic-ink); line-height:1.4; font-variant-numeric:tabular-nums;
}
.ic-root *, .ic-root *::before, .ic-root *::after{ box-sizing:border-box; }

/* ---------- KPIs ---------- */
.ic-root .ic-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.ic-root .ic-kpi{ background:#fff; border:1px solid var(--ic-hairline); border-radius:12px; border-top:3px solid var(--ic-accent); padding:16px 14px; text-align:center; box-shadow:var(--ic-shadow); }
.ic-root .ic-kpi:nth-child(2){ border-top-color:var(--ic-instituto); }
.ic-root .ic-kpi:nth-child(3){ border-top-color:var(--ic-gold); }
.ic-root .ic-kpi:nth-child(4){ border-top-color:var(--ic-ink); }
.ic-root .ic-kpi .n{ font-size:clamp(21.5px,2.4vw,28.5px); font-weight:600; letter-spacing:-.01em; }
.ic-root .ic-kpi .l{ margin-top:5px; font-size:14.5px; color:var(--ic-ink-muted); line-height:1.35; }
@media (max-width:720px){ .ic-root .ic-kpis{ grid-template-columns:repeat(2,1fr); } }

/* ---------- tabs ---------- */
.ic-root .ic-tabs{ display:flex; gap:6px; border-bottom:1px solid var(--ic-hairline); margin-bottom:22px; }
.ic-root .ic-tab{
  appearance:none; border:none; border-radius:0; background:transparent; cursor:pointer; margin:0;
  padding:9px 14px 10px; font-size:16px; font-weight:600; color:var(--ic-ink-muted);
  border-bottom:2px solid transparent; margin-bottom:-1px; font-family:inherit; line-height:1.4;
}
.ic-root .ic-tab:hover{ color:var(--ic-ink); }
.ic-root .ic-tab.active{ color:var(--ic-ink); border-bottom-color:var(--ic-gold); }
.ic-root .ic-panel{ display:none; }
.ic-root .ic-panel.active{ display:block; }

.ic-root .ic-section-head{ margin-bottom:18px; }
.ic-root .ic-section-head h2{ font-size:23.5px; font-weight:600; margin:0; padding:0; color:var(--ic-ink); }
.ic-root .ic-section-head p{ margin:6px 0 0; padding:0; color:var(--ic-ink-secondary); font-size:16px; max-width:60ch; }

/* ---------- ranking ---------- */
.ic-root .ic-card{ background:#fff; border:1px solid var(--ic-hairline); border-radius:16px; padding:22px; box-shadow:var(--ic-shadow); }
.ic-root .ic-year-nav{ margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid var(--ic-hairline); }
.ic-root .ic-year-row{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:9px; }
.ic-root .ic-year-label{ font-size:15px; font-weight:600; }
.ic-root .ic-year-value{ font-size:21.5px; font-weight:600; color:var(--ic-accent); }
.ic-root .ic-year-nav input[type="range"]{
  -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:4px; padding:0; border:0;
  background:linear-gradient(90deg, var(--ic-instituto), var(--ic-gold) 60%, var(--ic-accent));
  outline:none; cursor:pointer; display:block; margin:0;
}
.ic-root .ic-year-nav input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:18px; height:18px; border-radius:50%; background:#fff; border:3px solid var(--ic-ink); cursor:pointer; box-shadow:var(--ic-shadow); }
.ic-root .ic-year-nav input[type="range"]::-moz-range-thumb{ width:18px; height:18px; border-radius:50%; background:#fff; border:3px solid var(--ic-ink); cursor:pointer; box-shadow:var(--ic-shadow); }
.ic-root .ic-year-ticks{ display:flex; justify-content:space-between; font-size:13.5px; color:var(--ic-ink-muted); margin-top:4px; }
.ic-root .ic-year-note{ margin:10px 0 0; font-size:14px; color:var(--ic-ink-muted); line-height:1.5; }

.ic-root .ic-legend{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--ic-hairline); font-size:14.5px; color:var(--ic-ink-secondary); }
.ic-root .ic-legend .lg-title{ font-weight:600; color:var(--ic-ink); }
.ic-root .ic-legend .sw{ display:inline-flex; align-items:center; gap:5px; }
.ic-root .ic-legend .chip{ width:13px; height:13px; border-radius:3px; display:inline-block; }

.ic-root .ic-ranking{ display:flex; flex-direction:column; gap:7px; }
.ic-root .ic-rank-row{ display:grid; grid-template-columns:196px 1fr 44px; align-items:center; gap:10px; cursor:pointer; padding:4px 6px; border-radius:6px; border-left:3px solid transparent; }
.ic-root .ic-rank-row:hover{ background:var(--ic-surface-2); }
.ic-root .ic-rank-row.selected{ background:var(--ic-surface-2); border-left-color:var(--ic-accent); }
.ic-root .ic-rank-row .name{ font-size:15.5px; color:var(--ic-ink-secondary); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.ic-root .ic-rank-row .flag{ font-size:16.5px; flex:none; line-height:1; }
.ic-root .ic-rank-row.selected .name{ color:var(--ic-ink); font-weight:600; }
.ic-root .ic-rank-row .track{ background:var(--ic-surface-2); border-radius:5px; height:16px; overflow:hidden; }
.ic-root .ic-rank-row .fill{ display:flex; height:100%; border-radius:5px 0 0 5px; min-width:4px; overflow:hidden; }
.ic-root .ic-rank-row .f-seg{ display:block; height:100%; }
.ic-root .ic-rank-row .f-inst{ background:var(--ic-instituto); }
.ic-root .ic-rank-row .f-aula{ background:var(--ic-aula); }
.ic-root .ic-rank-row .val{ font-size:15px; color:var(--ic-ink-muted); }
@media (max-width:560px){ .ic-root .ic-rank-row{ grid-template-columns:130px 1fr 30px; } .ic-root .ic-rank-row .name{ font-size:13px; } .ic-root .ic-rank-row .flag{ font-size:14px; } }

/* ---------- enlaces de ubicación / web ---------- */
.ic-root .ic-loc-link{ display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:7px; color:var(--ic-accent); border:1px solid var(--ic-hairline-strong); background:#fff; flex:none; }
.ic-root .ic-loc-link:hover{ background:var(--ic-accent-soft); border-color:var(--ic-accent); }
.ic-root .ic-loc-link svg{ width:14px; height:14px; }
.ic-root .ic-loc-inline{ margin-left:6px; font-size:14px; font-weight:600; white-space:nowrap; color:var(--ic-accent); }

/* ---------- directorio ---------- */
.ic-root .ic-filters{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; align-items:center; }
.ic-root .ic-filters input[type="search"]{ flex:1 1 220px; height:auto; padding:9px 12px; border-radius:9px; border:1px solid var(--ic-hairline-strong); background:#fff; color:var(--ic-ink); font-size:16px; }
.ic-root .ic-filters select{ height:auto; padding:9px 10px; border-radius:9px; border:1px solid var(--ic-hairline-strong); background:#fff; color:var(--ic-ink); font-size:15.5px; }
.ic-root .ic-chk-group{ display:flex; gap:6px; }
.ic-root .ic-chk{ display:inline-flex; align-items:center; gap:6px; padding:8px 11px; border-radius:100px; border:1px solid var(--ic-hairline-strong); font-size:15px; cursor:pointer; user-select:none; color:var(--ic-ink-secondary); margin:0; }
.ic-root .ic-chk input{ accent-color:var(--ic-ink); margin:0; }
.ic-root .ic-chk .dot{ width:8px; height:8px; border-radius:50%; }
.ic-root .ic-result-count{ font-size:15px; color:var(--ic-ink-muted); margin-bottom:10px; }

.ic-root .ic-table-scroll{ overflow-x:auto; border:1px solid var(--ic-hairline); border-radius:14px; background:#fff; }
.ic-root table.ic-dir{ width:100%; border-collapse:collapse; font-size:15.5px; min-width:820px; margin:0; border:0; }
.ic-root table.ic-dir th{ text-align:left; font-size:13.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ic-ink-muted); font-weight:600; padding:11px 14px; border:0; border-bottom:1px solid var(--ic-hairline); background:#fff; }
.ic-root table.ic-dir td{ padding:11px 14px; border:0; border-bottom:1px solid var(--ic-hairline); color:var(--ic-ink-secondary); vertical-align:top; background:transparent; }
.ic-root table.ic-dir tr:last-child td{ border-bottom:none; }
.ic-root table.ic-dir tbody tr{ cursor:pointer; }
.ic-root table.ic-dir tbody tr:hover td{ background:var(--ic-surface-2); }
.ic-root table.ic-dir td.pais{ color:var(--ic-ink); font-weight:600; }
.ic-root table.ic-dir td.loc{ text-align:center; }

.ic-root .ic-badge{ display:inline-flex; align-items:center; gap:5px; font-size:14px; font-weight:600; padding:3px 8px 3px 6px; border-radius:100px; }
.ic-root .ic-badge .dot{ width:7px; height:7px; border-radius:50%; background:currentColor; flex:none; }
.ic-root .ic-badge.instituto{ background:color-mix(in srgb, var(--ic-instituto) 16%, #fff); color:var(--ic-instituto-text); }
.ic-root .ic-badge.aula{ background:color-mix(in srgb, var(--ic-aula) 18%, #fff); color:var(--ic-aula-text); }

/* ---------- ficha de país ---------- */
.ic-root .ic-detail{ margin-top:22px; background:#fff; border:1px solid var(--ic-hairline); border-radius:16px; box-shadow:var(--ic-shadow); overflow:hidden; }
.ic-root .detail-head{ padding:20px 22px; border-bottom:1px solid var(--ic-hairline); display:flex; justify-content:space-between; align-items:flex-start; gap:14px; background:var(--ic-surface-2); }
.ic-root .detail-head .kicker{ font-size:13.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ic-accent); margin-bottom:4px; }
.ic-root .detail-head h3{ font-size:22.5px; font-weight:600; margin:0; padding:0; color:var(--ic-ink); }
.ic-root .detail-head .stats{ display:flex; gap:16px; margin-top:8px; flex-wrap:wrap; }
.ic-root .detail-head .stats span{ font-size:15px; color:var(--ic-ink-secondary); }
.ic-root .detail-head .stats b{ color:var(--ic-ink); }
.ic-root .close-btn{ border:1px solid var(--ic-hairline-strong); background:#fff; color:var(--ic-ink-secondary); width:30px; height:30px; padding:0; border-radius:50%; cursor:pointer; font-size:17.5px; line-height:1; flex:none; }
.ic-root .close-btn:hover{ color:var(--ic-ink); }
.ic-root .detail-body{ padding:18px 22px 22px; display:grid; gap:14px; }
.ic-root .ic-inst-card{ border:1px solid var(--ic-hairline); border-radius:12px; padding:15px 16px; }
.ic-root .ic-inst-card .row1{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:8px; }
.ic-root .ic-inst-card .city{ font-weight:600; font-size:17.5px; display:inline-flex; align-items:center; gap:10px; }
.ic-root .logo-box{ width:56px; height:56px; flex:none; background:#fff; border:1px solid var(--ic-hairline); border-radius:8px; padding:4px; display:flex; align-items:center; justify-content:center; }
.ic-root .logo-box img{ width:100%; height:100%; object-fit:contain; display:block; }
.ic-root .ic-uni{ display:flex; align-items:center; gap:10px; }
.ic-root .ic-logo-sm{ width:32px; height:32px; flex:none; object-fit:contain; background:#fff; border:1px solid var(--ic-hairline); border-radius:6px; padding:2px; }
.ic-root .ic-inst-card .year{ font-size:14.5px; color:var(--ic-ink-muted); }
.ic-root .pair{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:10px; align-items:center; font-size:15.5px; margin-bottom:10px; }
.ic-root .pair .side{ display:flex; align-items:center; gap:8px; min-width:0; }
.ic-root .pair .side.china{ flex-direction:row-reverse; text-align:right; }
.ic-root .pair .u{ color:var(--ic-ink); overflow-wrap:break-word; min-width:0; }
.ic-root .pair .arrow{ color:var(--ic-ink-muted); font-size:14.5px; text-align:center; }
@media (max-width:560px){
  .ic-root .pair{ grid-template-columns:1fr; gap:8px; }
  .ic-root .pair .side.china{ flex-direction:row; text-align:left; }
  .ic-root .pair .arrow{ text-align:left; }
  .ic-root .pair .arrow br{ display:none; }
}
.ic-root .logo-ph{ width:28px; height:28px; border-radius:7px; flex:none; border:1.5px dashed var(--ic-hairline-strong); background:var(--ic-surface-2); display:flex; align-items:center; justify-content:center; color:var(--ic-ink-muted); }
.ic-root .logo-ph svg{ width:14px; height:14px; }
.ic-root .meta-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:8px 16px; font-size:15px; color:var(--ic-ink-secondary); margin:0; }
.ic-root .meta-grid dt{ color:var(--ic-ink-muted); font-size:13.5px; text-transform:uppercase; letter-spacing:.04em; margin-bottom:2px; font-weight:400; }
.ic-root .meta-grid dd{ margin:0; }
.ic-root .meta-grid a{ word-break:break-word; }
.ic-root .people{ margin-top:10px; padding-top:10px; border-top:1px dashed var(--ic-hairline); display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }
.ic-root .person b{ font-size:15px; }
.ic-root .person .role{ color:var(--ic-ink-muted); font-size:13.5px; }
.ic-root .person p{ margin:3px 0 0; padding:0; font-size:14.5px; color:var(--ic-ink-secondary); line-height:1.45; }
