/* Tabla estilo COETIC Members */
.coetic-members-list {
  font-family: Arial, sans-serif;
  margin: 1em 0;
}

/* Tabla general */
.coetic-members-list table.coetic-members-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #ddd;
}

/* Cabecera */
.coetic-members-list table.coetic-members-table thead th {
  background: #333;
  color: #fff;
  font-weight: bold;
  padding: 0.75em 1em;
  text-align: left;
  border-bottom: 2px solid #ccc;
}

/* Celdas */
.coetic-members-list table.coetic-members-table tbody td {
  padding: 0.75em 1em;
  border-bottom: 1px solid #cdcdcd;
  text-align: left;
}

/* Zebra striping */
.coetic-members-list table.coetic-members-table tbody tr:nth-child(odd) {
  background-color: #f6f7f8;
}

/* Hover */
/* .coetic-members-list table.coetic-members-table tbody tr:hover {
  background-color: #D6EEEE;
} */

/* Formulario de búsqueda */
.coetic-members-list .members-search-form {
  margin-bottom: 1em;
}

.coetic-members-list .members-search-form input[type="text"] {
  padding: 0.3em 0.5em;
  font-size: 1em;
}

.coetic-members-list .members-search-form input[type="submit"] {
  padding: 0.3em 0.8em;
  font-size: 1em;
  background-color: #333;
  /* color: #fff; */
  border: none;
  cursor: pointer;
}

.coetic-members-list .members-search-form input[type="submit"]:hover {
  background-color: #555;
}

/* Paginación */
.coetic-members-list .members-pagination {
  margin-top: 1em;
}

.coetic-members-list .members-pagination input[type="submit"] {
  padding: 0.3em 0.8em;
  font-size: 1em;
  background-color: #333;
  /* color: #fff; */
  border: none;
  cursor: pointer;
}

.coetic-members-list .members-pagination input[type="submit"]:hover {
  background-color: #555;
}

/* Mensajes */
.coetic-members-list p {
  margin: 1em 0;
}

/* Nuevo diseño */
.coetic-members-list table.coetic-members-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #ddd;
  table-layout: fixed;   /* 👈 CLAVE */
}
/* Nom → protagonista */
.coetic-members-table th:nth-child(1),
.coetic-members-table td:nth-child(1){
  width: 40%;
}

/* Territori */
.coetic-members-table th:nth-child(2),
.coetic-members-table td:nth-child(2){
  width: 18%;
}

/* Número colegiado */
.coetic-members-table th:nth-child(3),
.coetic-members-table td:nth-child(3){
  width: 14%;
}

/* Fecha */
.coetic-members-table th:nth-child(4),
.coetic-members-table td:nth-child(4){
  width: 15%;
}

/* Titulación */
.coetic-members-table th:nth-child(5),
.coetic-members-table td:nth-child(5){
  width: 13%;
}


/* --- Responsive: convertir filas en tarjetas en móvil --- */
@media (max-width: 760px) {

  /* Ocultamos cabecera */
  .coetic-members-list table.coetic-members-table thead {
    display: none;
  }

  /* Convertimos estructura de tabla a bloques */
  .coetic-members-list table.coetic-members-table,
  .coetic-members-list table.coetic-members-table tbody,
  .coetic-members-list table.coetic-members-table tr,
  .coetic-members-list table.coetic-members-table td {
    display: block;
    width: 100%;
  }

  /* Cada fila será una tarjeta */
  .coetic-members-list table.coetic-members-table tbody tr {
    border: 1px solid #ddd;
    border-radius: 12px;
    padding: 0.2rem 0.7rem;
    margin-bottom: 0.5rem;
    background: #fff;
  }

  /* Anulamos zebra striping en móvil (queda raro en tarjetas) */
  .coetic-members-list table.coetic-members-table tbody tr:nth-child(odd) {
    background-color: #fff;
  }

  /* Cada celda: "Etiqueta" + "Valor" */
  .coetic-members-list table.coetic-members-table tbody td {
    border-bottom: 0;
    padding: 0.4rem 0;
    display: grid;
    grid-template-columns: 195px 1fr; /* 👈 más ancho */
    gap: 0.6em;
    align-items: start;
    min-width: 0;
    white-space: normal;
    word-break: break-word;
  }

  .coetic-members-list table.coetic-members-table tbody td::before {
    content: attr(data-label);
    font-weight: bold;
    opacity: 0.85;
  }

  /* Destacar el nombre (primera celda) como título de tarjeta */
  .coetic-members-list table.coetic-members-table tbody td[data-label="Nom"] {
    grid-template-columns: 1fr;
    padding-bottom: 0.6em;
    border-bottom: 1px solid #eee;
    font-weight: bold;
    font-size: 1.05em;
  }

  .coetic-members-list table.coetic-members-table tbody td[data-label="Nom"]::before {
    content: "";
    display: none;
  }

  /* Formulario: todo a ancho completo */
  .coetic-members-list .members-search-form label {
    display: block;
    margin-bottom: 0.3em;
  }

  .coetic-members-list .members-search-form input[type="text"] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 0.6em;
  }

  .coetic-members-list .members-search-form input[type="submit"],
  .coetic-members-list .members-pagination input[type="submit"] {
    width: 100%;
    box-sizing: border-box;
    padding: 0.6em 0.8em; /* un pelín más “tappable” */
  }
}