/* =============================================================
   SINGLE TABLÓN — mobile first
============================================================= */

.tablon-single {
  padding-top: 3rem;
  padding-bottom: 4rem;
}

/* ── Estudio dot ─────────────────────────────────────────── */
.tablon-single__estudio {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.tablon-single__estudio .estudio-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ── Registros table — mobile first ─────────────────────── */
.tablon-registros {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 2.5rem;
}

/* Hide header on mobile */
.tablon-registros thead {
  display: none;
}

/* Each row stacks as a flex column on mobile */
.tablon-registros tbody tr {
  display: flex;
  flex-direction: column;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--color-black);
}

.tablon-registros tbody td {
  padding: 0;
  border: none;
}

/* Nombre first on mobile */
.tablon__col-nombre {
  order: -1;
}

/* Fecha second on mobile */
.tablon__col-fecha {
  order: 0;
}

/* Hide empty fecha cell */
.tablon__col-fecha:empty {
  display: none;
}

/* Link styling — always underlined on mobile */
.tablon-registros a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ── Back button ─────────────────────────────────────────── */
.tablon-single__back {
  display: flex;
  justify-content: center;
  padding: 2rem 0 1rem;
}

/* =============================================================
   TABLET  ≥ 640px
============================================================= */
@media (min-width: 640px) {
  .tablon-single {
    padding-top: 4rem;
    padding-bottom: 5rem;
  }

  /* Restore normal table layout */
  .tablon-registros thead {
    display: table-header-group;
  }

  .tablon-registros thead th {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--color-black);
    text-align: left;
    vertical-align: top;
  }

  .tablon-registros tbody tr {
    display: table-row;
    padding: 0;
    border-bottom: none;
  }

  .tablon-registros tbody tr:first-child {
    border-top: none;
  }

  .tablon-registros tbody td {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--color-black);
  }

  /* Nombre: full width */
  .tablon__col-nombre {
    order: 0;
    padding-right: 2rem;
  }

  /* Fecha: compact, left-aligned, no wrap */
  .tablon__col-fecha {
    order: 0;
    width: 130px;
    white-space: nowrap;
  }

  /* Links: no underline by default, underline on hover */
  .tablon-registros a {
    text-decoration: none;
  }

  .tablon-registros a:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
  }
}