.peco-admin-page {
  padding: 100px;
}
/* Contenedor general con scroll horizontal */
.peco-table-wrapper {
  overflow-x: auto;
  margin-top: 20px;
  height: 800px;
}
/* Toolbar superior */
.peco-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
  margin-bottom: 10px;
}
.peco-toolbar-left {
  display: flex;
}
.peco-toolbar-left label {
  font-family: "Libre Franklin", Sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  color: #002653;
  margin-right: 10px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.peco-toolbar-left input[type="text"] {
  font-family: "Libre Franklin", Sans-serif;
  color: #002653;
  min-width: 300px;
  padding: 10px;
  border: 1px solid #0088d1;
  border-radius: 0;
}
.peco-toolbar-left input[type="text"]:focus {
  outline: none;
  border-color: #ec6527;
}
.peco-toolbar-left input[type="text"]::placeholder {
  font-family: "Libre Franklin", Sans-serif;
  font-size: 14px;
}
/* Botón exportar */
.peco-toolbar-right .peco-export-btn {
  display: flex;
  color: #002653;
  text-decoration: underline;
  font-family: "Libre Franklin", Sans-serif;
  font-weight: 400;
  font-size: 16px;
  transition: all .3s;
}
.peco-toolbar-right .peco-export-btn:hover {
  color: #ec6527;
}
.peco-toolbar-right .peco-export-btn::after {
  content: "";
  width: 33px;
  height: 30px;
  background-image: url(/wp-content/uploads/2025/11/icons8-excel-96.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: inline-flex;
  align-items: center;
  margin-left: 10px;
}
/* Tabla */
.peco-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1200px;
  font-family: "Libre Franklin", Sans-serif;
  color: #002653;
}
/* Fila de grupos (cabecera 1) */
.peco-header-group th {
  text-align: center;
  font-weight: 700;
  font-size: 18px;
  color: #fff;
  padding: 8px 6px;
}
.peco-header-group th:not(.peco-header-group-pecomark) {
  border-right: 1px solid #fff;
}
.peco-header-group-employee,
.peco-header-group-guest,
.peco-header-group-transport,
.peco-header-group-pecomark {
  background: #002653;
}
/* Fila de cabeceras de columna (cabecera 2) */
.peco-header-cols th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #e5f3fa;
  text-align: left;
  padding: 6px 10px;
  white-space: nowrap;
  min-width: 80px;
}
td[data-col-key="emp_email"] {
  position: sticky;
  left: 0;
  z-index: 3;
}
.peco-header-cols th[data-col-key="emp_email"] {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 4;              /* por encima del resto de headers */
  background: #e5f3fa;     /* mismo fondo que el resto de header */
}
.peco-header-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.peco-header-label {
  font-size: 14px;
  font-weight: 600;
  color: #002653;
}
.peco-filter-select {
  width: 100%;
  max-width: 60px;
  min-width: 60px;
  font-size: 11px;
  padding: 3px 6px;
  color: #002653;
  border-radius: 0;
  border-color: #002653;
  background-color: #e5f3fa;;
}
/* Celdas cuerpo */
.peco-table tbody td {
  padding: 6px 10px;
  font-size: 12px;
  border-bottom: 1px solid #002653;
  white-space: nowrap;
  vertical-align: middle;
}
/* Fila colors */
.peco-table .peco-header-cols th {
  border-top: 1px solid #002653;
  border-left: none;
  border-color: #002653;
}
.peco-table tbody tr td {
  border-color: #002653;
  border-top: none;
  border-left: none;
}
.peco-table .peco-header-cols th:first-child,
.peco-table tbody tr td:first-child {
  border-left: solid 1px #002653;
}
.peco-table tbody > tr > td, table tbody > tr > th {
  background-color: #fff;
}
.peco-table tbody > tr:nth-child(2n+1) > td, table tbody > tr:nth-child(2n+1) > th {
  background-color: #f2f4f6 !important;
}
/* Fila hover */
.peco-table tbody tr:hover th,
.peco-table tbody tr:hover td {
  background: #fdefe9 !important;
}
/* Botón "Validar" en la columna Pecomark */
.peco-btn {
  font-family: "Libre Franklin", Sans-serif;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  text-decoration: none !important;
  border-radius: 0px 0px 0px 0px !important;
  padding: 5px 10px !important;
  transition: all .3s;
  color: #fff !important;
  border: none !important;
}
.peco-btn.peco-btn-validate.peco-btn-disabled,
.peco-btn.peco-btn-confirm.peco-btn-disabled-confirmed {
  pointer-events: none;
  background-color: green !important;
}
.peco-btn.peco-btn-confirm.peco-btn-disabled {
  pointer-events: none;
  background-color: gray !important;
}
.peco-btn.peco-btn-confirm.peco-btn-active,
.peco-btn.peco-btn-validate.peco-btn-active {
  background-color: #ec6527 !important;
}
.peco-btn.peco-btn-confirm.peco-btn-active:hover,
.peco-btn.peco-btn-validate.peco-btn-active:hover {
  background: #002653 !important;
}


.peco-qr-wrap {
  font-family: "Libre Franklin", Sans-serif;
  color: #002653;
}
.peco-qr-wrap p {
  margin: 0;
  text-align: center;
}
.peco-qr-scanner-box {
  margin-top: 20px;
}
.peco-qr-icon {
  width: 170px;
  margin: auto;
  padding-bottom: 20px;
}
.peco-qr-text,
.peco-qr-text-ok,
.peco-qr-text-error {
  font-size: 24px;
  line-height: normal;
}
.peco-qr-text-ok {
  color: #008000;
}
.peco-qr-text-error {
  color: #f2626b;
}
.peco-qr-data {
  width: fit-content;
  min-width: 283px;
  margin: 20px auto 0;
}
.peco-qr-data p {
  font-size: 16px;
  text-align: left;
}
.peco-qr-data .peco-qr-data-employee,
.peco-qr-data .peco-qr-data-accompanist {
  color: #0088d1;
  font-size: 16px;
}
.peco-qr-data .peco-qr-data-accompanist {
  margin-top: 10px;
}
.peco-qr-status {
  font-size: 14px;
}
.peco-qr-btn-container {
  text-align: center;
  margin: 20px 0;
  display: inline-block;
  width: 100%;
}
.peco-qr-btn {
  background-color: #ec6527 !important;
  font-family: "Libre Franklin", Sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;;
  border-radius: 0px 0px 0px 0px !important;
  padding: 18px 50px 18px 50px !important;
  transition: all .3s !important;
  color: #fff !important;
  border: none !important;
  line-height: 1 !important;
  margin: 0 !important;
  display: inline-block;
}
.peco-qr-btn:hover {
  background-color: #002653 !important;
}
@media (max-width: 767px) {
  .peco-qr-text,
  .peco-qr-text-ok,
  .peco-qr-text-error {
    font-size: 20px;
    line-height: normal;
  }
}