/* stock/owners/owners-academy.css
   OWNERS — Academy style (oct 2026). Loaded after owners.css. Light touch: cards, kickers
   and tables like the other stock tabs; the charts (and their colors) are untouched. */
:root { --ink: #16242a; --line: rgba(22, 36, 42, 0.09); --shadow-card: 0 8px 24px rgba(22, 36, 42, 0.04); }

/* tabs */
@media (min-width: 769px) {
  .paginas { background: #fff; border: 1px solid var(--line); border-radius: 999px; box-shadow: var(--shadow-card); padding: 6px 8px; gap: 4px; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .paginas .elementoNav { border-radius: 999px; padding: 9px 18px; color: rgba(22, 36, 42, 0.62); background: transparent; border-color: transparent; }
  .paginas .elementoNav h3 { font-size: 14px; font-weight: 600; }
  .paginas .elementoNav:hover { background: rgba(84, 140, 146, 0.08); border-color: transparent; color: var(--ink); transform: none; box-shadow: none; }
  .paginas .elementoNav[aria-current="page"],
  .paginas .owners { background: var(--ink) !important; border-color: var(--ink) !important; color: #fff !important; box-shadow: none !important; }
}

/* company card */
.identidad { background: #fff !important; border: 1px solid var(--line) !important; border-radius: 18px !important; box-shadow: var(--shadow-card) !important; }
.identidad .logo, .identidad .logoEmpresa, .identidad .contenedorLogoEmpresa { background: #fff; border-color: var(--line); border-radius: 14px !important; }
.identidad .nombreEmpresa, .nombreEmpresa { font-weight: 800 !important; letter-spacing: -0.02em !important; color: var(--ink) !important; }
.identidad .tickerEmpresa { background: var(--ink) !important; color: #fff !important; border-radius: 8px !important; padding: 4px 10px !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.02em !important; }

/* summary boxes: no colored top bar, calm hover */
.boxSummary { border: 1px solid var(--line) !important; border-radius: 16px !important; box-shadow: var(--shadow-card) !important; padding: 14px 16px !important; }
.boxSummary::before { display: none !important; }
.boxSummary:hover { transform: none !important; box-shadow: 0 14px 34px rgba(22, 36, 42, 0.08) !important; }
.queEsBoxSummary { font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.14em !important; color: rgba(22, 36, 42, 0.45) !important; }
.valorBoxSummary { font-size: 22px !important; color: var(--ink) !important; letter-spacing: -0.02em; }
.infoExtraBoxSummary { color: rgba(22, 36, 42, 0.45) !important; font-weight: 600 !important; }

/* chart cards */
.ownersChartCard, .contenedorInsiderTransactions { border: 1px solid var(--line) !important; border-radius: 18px !important; box-shadow: var(--shadow-card) !important; background: #fff; }
.ownersChartCard:hover { box-shadow: var(--shadow-card) !important; }
.ownersChartCard__header, .insiderHeader { border-bottom-color: var(--line) !important; }
.ownersChartCard__icon, .insiderHeader__icon { background: rgba(84, 140, 146, 0.12) !important; border-radius: 10px !important; }
.ownersChartCard__icon i, .insiderHeader__icon i, .insiderHeader__icon { color: var(--color-azul-oscuro, #285260) !important; }
.ownersChartCard .tituloGrafica, .insiderHeader__title { font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; color: var(--color-azul-medio, #548C92) !important; }
.contenedorGraficasInsiderTransaction .tituloGrafica { font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: rgba(22, 36, 42, 0.55) !important; }

/* tables: light header, thin separators */
.contenedorTablaInsider { border: 1px solid var(--line) !important; border-radius: 14px !important; box-shadow: none !important; }
.insiderTrasctionsTable th { background: #F6F9F9 !important; color: rgba(22, 36, 42, 0.55) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; }
.insiderTrasctionsTable td { color: var(--ink); font-weight: 500 !important; border: 0 !important; border-bottom: 1px solid rgba(22, 36, 42, 0.08) !important; }
.insiderTrasctionsTable tr:nth-child(even) td { background: #fff !important; }
.insiderTrasctionsTable tr:hover td { background: #F6F9F9 !important; }
.insiderTrasctionsTable td a { color: var(--color-azul-oscuro, #285260) !important; font-weight: 600 !important; }
.avragePriceTable { border: 1px solid var(--line) !important; border-radius: 14px !important; box-shadow: none !important; }
.avragePriceTable th.tituloTabla { background: #F6F9F9 !important; color: rgba(22, 36, 42, 0.55) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; }
.avragePriceTable th:not(.tituloTabla), .avragePriceTable td { background: #fff !important; border: 0 !important; border-bottom: 1px solid rgba(22, 36, 42, 0.08) !important; }
.avragePriceTable th:not(.tituloTabla) { color: rgba(22, 36, 42, 0.62) !important; font-weight: 600 !important; }
.avragePriceTable td { color: var(--ink) !important; font-weight: 800 !important; }
.avragePriceTable tr:last-child th, .avragePriceTable tr:last-child td { border-bottom: 0 !important; }

/* "?" explainer buttons */
.infoBtn { background: rgba(84, 140, 146, 0.12) !important; color: var(--color-azul-oscuro, #285260) !important; font-weight: 800 !important; }
/* Sell / Buy keep their color (set inline by owners.js) */
.insiderTrasctionsTable td[style*="217, 48, 37"], .insiderTrasctionsTable td[style*="#d93025"] { font-weight: 700 !important; }
.insiderTrasctionsTable td[style*="24, 128, 56"], .insiderTrasctionsTable td[style*="#188038"] { font-weight: 700 !important; }

/* phone: the insider table keeps real column widths and scrolls sideways; names stay pinned */
@media (max-width: 768px) {
  .contenedorTablaInsider { overflow-x: auto !important; -webkit-overflow-scrolling: touch; max-height: 360px; }
  .contenedorTablaInsider .insiderTrasctionsTable { width: auto !important; min-width: 720px !important; table-layout: auto !important; }
  .insiderTrasctionsTable th, .insiderTrasctionsTable td { white-space: nowrap !important; overflow: visible !important; text-overflow: clip !important; padding: 9px 12px !important; font-size: 12.5px !important; }
  .insiderTrasctionsTable th:first-child, .insiderTrasctionsTable td:first-child { position: sticky; left: 0; z-index: 2; background: #fff !important; max-width: 150px !important; min-width: 120px !important; overflow: hidden !important; text-overflow: ellipsis !important; box-shadow: 1px 0 0 var(--line); text-align: left; }
  .insiderTrasctionsTable th:first-child { z-index: 3; background: #F6F9F9 !important; }
}

/* phone: the content was pushed down with top:130px (visual only), so the footer overlapped the insider card; use a real margin */
@media (max-width: 768px) { main.contenido { top: 0 !important; margin-top: 130px !important; } }