/**
 * Play GOOD — Tema global dark premium (Gemini brand guide)
 * Cargar DESPUÉS de admin.css / cliente.css
 * Propiedad intelectual de Dr. Sergio Velasquez.
 */

/* ===== Design tokens (alineados a mockup Gemini) ===== */
:root {
  --pg-bg-deep: #050810;
  --pg-bg: #0a0c10;
  --pg-bg-soft: #0d1118;
  --pg-surface: #141820;
  --pg-surface-2: #1c222d;
  --pg-surface-3: #252b38;
  --pg-border: rgba(204, 255, 0, 0.14);
  --pg-border-strong: rgba(204, 255, 0, 0.35);
  --pg-accent: #ccff00;
  --pg-accent-dim: #b8e600;
  --pg-accent-soft: rgba(204, 255, 0, 0.12);
  --pg-accent-glow: rgba(204, 255, 0, 0.28);
  --pg-text: #cbd5e1;
  --pg-text-muted: #8b9cb3;
  --pg-text-dim: #5c6b80;
  --pg-on-accent: #0a1220;
  --pg-danger: #f87171;
  --pg-success: #4ade80;
  --pg-radius: 14px;
  --pg-radius-sm: 10px;
  --pg-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
  --pg-carbon: repeating-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.02) 0 2px,
    transparent 2px 6px
  );

  /* remap legacy admin vars */
  --primary-teal: var(--pg-accent);
  --dark-teal: var(--pg-bg);
  --vibrant-teal: var(--pg-accent-dim);
  --bg-light: var(--pg-bg-soft);
  --text-dark: var(--pg-text);
}

/* ===== App shell (admin / proveedor / recepcionista) ===== */
body.pg-app {
  background:
    radial-gradient(ellipse 90% 55% at 50% -15%, rgba(204, 255, 0, 0.07), transparent 55%),
    linear-gradient(165deg, var(--pg-bg-deep) 0%, var(--pg-bg) 42%, #0a1210 100%);
  color: var(--pg-text);
}

body.pg-app .sidebar {
  width: 220px;
  background:
    var(--pg-carbon),
    linear-gradient(180deg, #0f1218 0%, #141820 55%, #10141c 100%);
  border-right: 1px solid var(--pg-border);
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.35);
  padding-top: 8px;
}

body.pg-app .sidebar a {
  color: var(--pg-text-muted);
  font-weight: 500;
  border-left: 3px solid transparent;
  margin: 2px 8px;
  border-radius: var(--pg-radius-sm);
  padding: 12px 14px;
}

body.pg-app .sidebar a:hover,
body.pg-app .sidebar a.active {
  background: var(--pg-accent-soft);
  color: var(--pg-accent);
  border-left-color: var(--pg-accent);
}

body.pg-app .pg-sidebar-brand {
  border-bottom-color: var(--pg-border);
}

body.pg-app .main {
  padding: 24px;
}

body.pg-app .header .user {
  color: var(--pg-text);
  background: var(--pg-surface);
  border: 1px solid var(--pg-border);
  padding: 8px 14px;
  border-radius: 999px;
}

body.pg-app .cards .card,
body.pg-app .card,
body.pg-app .section,
body.pg-app .card-white,
body.pg-app .form-container,
body.pg-app .menu-card,
body.pg-app .super-card {
  background: var(--pg-surface);
  border: 1px solid var(--pg-border);
  box-shadow: var(--pg-shadow);
  color: var(--pg-text);
}

body.pg-app .card h3,
body.pg-app .section h2,
body.pg-app .page-title,
body.pg-app .section-title,
body.pg-app h1,
body.pg-app h2 {
  color: var(--pg-text);
}

body.pg-app .card p {
  color: var(--pg-accent);
}

body.pg-app .section h2,
body.pg-app .section-header h2 {
  color: var(--pg-accent);
}

body.pg-app table {
  color: var(--pg-text);
}

body.pg-app th {
  background: var(--pg-surface-2);
  color: var(--pg-text-muted);
  border-bottom: 1px solid var(--pg-border);
}

body.pg-app td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body.pg-app tbody tr:hover {
  background: rgba(204, 255, 0, 0.04);
}

body.pg-app .btn-add,
body.pg-app .btn-save,
body.pg-app .super-btn,
body.pg-app button.btn-add {
  background: linear-gradient(135deg, var(--pg-accent-dim), var(--pg-accent));
  color: var(--pg-on-accent);
  border: none;
  box-shadow: 0 4px 16px var(--pg-accent-glow);
  font-weight: 700;
}

body.pg-app .btn-add:hover,
body.pg-app .btn-save:hover,
body.pg-app .super-btn:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
}

body.pg-app .btn-reset,
body.pg-app .btn-outline {
  background: var(--pg-surface-2);
  color: var(--pg-text-muted);
  border: 1px solid var(--pg-border);
}

body.pg-app input,
body.pg-app select,
body.pg-app textarea,
body.pg-app .form-container input,
body.pg-app .form-container select,
body.pg-app .form-container textarea,
body.pg-app .f input,
body.pg-app .f select {
  background: var(--pg-surface-2);
  border: 1px solid var(--pg-border);
  color: var(--pg-text);
  border-radius: var(--pg-radius-sm);
}

body.pg-app input:focus,
body.pg-app select:focus,
body.pg-app textarea:focus {
  border-color: var(--pg-accent);
  outline: none;
  box-shadow: 0 0 0 3px var(--pg-accent-soft);
}

body.pg-app label,
body.pg-app .form-container label,
body.pg-app .f label {
  color: var(--pg-text-muted);
}

body.pg-app .fbar,
body.pg-app .alert,
body.pg-app .alert-ok,
body.pg-app .alert-info {
  background: var(--pg-surface-2);
  border: 1px solid var(--pg-border);
  color: var(--pg-text);
}

body.pg-app .alert-ok {
  border-color: rgba(74, 222, 128, 0.35);
  color: var(--pg-success);
}

body.pg-app .alert-info {
  border-color: rgba(204, 255, 0, 0.25);
  color: var(--pg-text-muted);
}

body.pg-app .menu-item {
  background: var(--pg-surface-2);
  border-color: var(--pg-border);
}

body.pg-app .menu-item span {
  color: var(--pg-text);
}

body.pg-app footer,
body.pg-app .pg-footer-line {
  color: var(--pg-text-dim);
}

body.pg-app .sub,
body.pg-app .intro {
  color: var(--pg-text-muted);
}

body.pg-app .pill,
body.pg-app .status-pill {
  border: 1px solid var(--pg-border);
}

body.pg-app .btn-action {
  appearance: none;
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
  font-weight: 700;
  text-decoration: none;
  font-size: 13px;
  display: inline-block;
  transition: filter .15s, transform .05s;
}

body.pg-app .btn-action:hover {
  filter: brightness(1.08);
}

body.pg-app .btn-action.edit {
  background: var(--pg-accent-soft);
  border: 1px solid var(--pg-border-strong);
  color: var(--pg-accent);
}

body.pg-app .btn-action.delete {
  background: rgba(248, 113, 113, 0.12);
  border: 1px solid rgba(248, 113, 113, 0.35);
  color: #fca5a5;
}

/* Admin data tables — evitar texto claro sobre fondo blanco local */
body.pg-app .pg-data-table {
  background: var(--pg-surface);
  border: 1px solid var(--pg-border);
}

body.pg-app .pg-data-table thead th {
  background: var(--pg-surface-3);
  color: var(--pg-text-muted);
}

body.pg-app .pg-data-table tbody td {
  color: var(--pg-text);
}

body.pg-app .pg-data-table tbody tr:hover {
  background: var(--pg-accent-soft);
}

body.pg-app .section-home h1 {
  color: var(--pg-text);
}

body.pg-app .section-home p {
  color: var(--pg-text-muted);
}

/* Highlight cards estilo mockup móvil (próxima reserva) */
body.pg-app .pg-highlight-card {
  border: 2px solid var(--pg-accent);
  box-shadow: 0 0 24px var(--pg-accent-glow);
}

/* ===== Cliente (header + main) ===== */
body.pg-app.pg-cliente {
  background:
    radial-gradient(ellipse 80% 50% at 10% -5%, rgba(204, 255, 0, 0.08), transparent 50%),
    linear-gradient(165deg, var(--pg-bg-deep) 0%, #0a1218 50%, #0a100d 100%);
}

body.pg-app.pg-cliente header {
  background: rgba(10, 12, 16, 0.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--pg-border);
}

body.pg-app.pg-cliente nav a {
  color: var(--pg-text-muted);
}

body.pg-app.pg-cliente nav a:hover {
  color: var(--pg-accent);
  text-shadow: 0 0 12px var(--pg-accent-glow);
}

body.pg-app.pg-cliente .profile-chip {
  background: var(--pg-surface);
  border: 1px solid var(--pg-border);
}

body.pg-app.pg-cliente .profile-avatar {
  background: var(--pg-accent);
  color: var(--pg-on-accent);
}

body.pg-app.pg-cliente .btn,
body.pg-app.pg-cliente button[type="submit"] {
  background: linear-gradient(135deg, var(--pg-accent-dim), var(--pg-accent));
  color: var(--pg-on-accent);
}

body.pg-app.pg-cliente main {
  color: var(--pg-text);
}

/* ===== Auth pages (register, forgot, etc.) ===== */
body.pg-auth-page {
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(204, 255, 0, 0.08), transparent),
    linear-gradient(165deg, var(--pg-bg-deep) 0%, var(--pg-bg) 45%, #0d1a12 100%);
  font-family: 'Outfit', sans-serif;
  box-sizing: border-box;
}

body.pg-auth-page *,
body.pg-auth-page *::before,
body.pg-auth-page *::after {
  box-sizing: border-box;
}

body.pg-auth-page .pg-auth-shell {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
}

body.pg-auth-page .login-box,
body.pg-auth-page .pg-auth-card,
body.pg-auth-page .register-box {
  width: 100%;
  max-width: 100%;
  background: rgba(20, 24, 32, 0.94);
  border: 1px solid var(--pg-border);
  border-radius: 20px;
  padding: 32px 28px;
  box-shadow: var(--pg-shadow);
  backdrop-filter: blur(12px);
  text-align: center;
}

body.pg-auth-page form {
  width: 100%;
  margin: 0;
}

body.pg-auth-page h1 {
  color: var(--pg-text);
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 22px;
}

body.pg-auth-page .input-group {
  position: relative;
  display: block;
  width: 100%;
  margin-bottom: 14px;
  text-align: left;
}

body.pg-auth-page .input-group input {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--pg-border);
  border-radius: var(--pg-radius-sm, 10px);
  background: rgba(255, 255, 255, 0.05);
  color: var(--pg-text);
  font-size: 16px;
  line-height: 1.35;
  font-family: inherit;
  appearance: none;
  -webkit-appearance: none;
}

body.pg-auth-page .input-group--icon input {
  padding-right: 44px;
}

body.pg-auth-page .pwd-wrap input {
  padding-right: 48px;
}

body.pg-auth-page .input-group input:focus {
  border-color: var(--pg-accent);
  outline: none;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 3px var(--pg-accent-soft);
}

body.pg-auth-page .input-group input::placeholder {
  color: var(--pg-text-dim);
}

body.pg-auth-page .input-group .field-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  pointer-events: none;
  color: var(--pg-text-dim);
  fill: currentColor;
}

body.pg-auth-page .pwd-wrap {
  position: relative;
  display: block;
  width: 100%;
}

body.pg-auth-page .pwd-toggle {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  color: var(--pg-text-dim);
}

body.pg-auth-page .pwd-toggle:hover {
  background: rgba(255, 255, 255, 0.06);
}

body.pg-auth-page .pwd-toggle svg {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}

body.pg-auth-page .pwd-toggle svg.off .slash {
  opacity: 1;
}

body.pg-auth-page .pwd-toggle svg.off .eye {
  opacity: 0.35;
}

body.pg-auth-page .btn {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 48px;
  padding: 12px 16px;
  background: linear-gradient(135deg, var(--pg-accent-dim), var(--pg-accent));
  color: var(--pg-on-accent);
  border: none;
  border-radius: var(--pg-radius-sm, 10px);
  font-weight: 700;
  font-size: 16px;
  font-family: inherit;
  cursor: pointer;
  margin-top: 8px;
}

body.pg-auth-page .btn:hover {
  filter: brightness(1.06);
}

body.pg-auth-page .btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: none;
}

body.pg-auth-page .extra-links a,
body.pg-auth-page .extra-link-prove a {
  color: var(--pg-accent);
  text-decoration: none;
  font-size: 14px;
}

body.pg-auth-page .extra-links a:hover,
body.pg-auth-page .extra-link-prove a:hover {
  text-decoration: underline;
}

body.pg-auth-page .error,
body.pg-auth-page .captcha-error {
  color: var(--pg-danger);
  font-size: 14px;
  margin-bottom: 12px;
  line-height: 1.4;
}

body.pg-auth-page .logo-container {
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}

body.pg-auth-page .captcha-wrap {
  margin: 16px 0 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow: hidden;
}

body.pg-auth-page .captcha-info {
  font-size: 13px;
  color: var(--pg-text-muted);
  margin-bottom: 12px;
  line-height: 1.4;
}

body.pg-auth-page .hp-field {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

body.pg-auth-page .extra-links {
  margin-top: 18px;
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 14px;
}

body.pg-auth-page .extra-link-prove {
  margin-top: 14px;
  font-size: 14px;
}

@media (max-width: 480px) {
  body.pg-auth-page .login-box,
  body.pg-auth-page .pg-auth-card,
  body.pg-auth-page .register-box {
    padding: 24px 18px;
    border-radius: 16px;
  }
}

/* Superadmin + menú visibilidad */
body.pg-app .super-card {
  padding: 20px;
  margin-bottom: 18px;
  border-radius: var(--pg-radius);
}

body.pg-app .super-btn {
  padding: 10px 16px;
  border-radius: var(--pg-radius-sm);
  text-decoration: none;
  display: inline-block;
}

body.pg-app .menu-card {
  padding: 18px 20px;
  margin-bottom: 18px;
  border-radius: var(--pg-radius);
}

body.pg-app .menu-card h2 {
  color: var(--pg-accent);
}

body.pg-app .menu-admin h1 {
  color: var(--pg-text);
}

body.pg-app .alert-ok,
body.pg-app .alert-info {
  padding: 12px 14px;
  border-radius: var(--pg-radius-sm);
  margin-bottom: 16px;
}

body.pg-app .btn-save,
body.pg-app .btn-reset {
  padding: 12px 20px;
  border-radius: var(--pg-radius-sm);
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}

/* Responsive sidebar mobile */
@media (max-width: 900px) {
  body.pg-app .sidebar {
    background: var(--pg-surface);
  }
}

/* ===== UI fixes v2 — sidebar, layout, cliente, forms ===== */

body.pg-app .main-inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

body.pg-app .pg-admin-section,
body.pg-app .section.pg-admin-section {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

body.pg-app .form-container,
body.pg-app .form-card,
body.pg-app .form-grid {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

body.pg-app .form-container h3,
body.pg-app .form-card h2,
body.pg-app .form-card h3 {
  color: var(--pg-text);
}

body.pg-app .form-container input,
body.pg-app .form-container select,
body.pg-app .form-container textarea,
body.pg-app .form-grid input,
body.pg-app .form-grid select,
body.pg-app .form-grid textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: var(--pg-surface-3) !important;
  border: 1px solid var(--pg-border) !important;
  color: var(--pg-text) !important;
}

body.pg-app .form-container label,
body.pg-app .form-grid label,
body.pg-app .form-label {
  color: var(--pg-text-muted) !important;
  font-weight: 600;
}

/* Sidebar: ítems especiales (sin fondo blanco permanente) */
body.pg-app .sidebar a.pg-sidebar-feature {
  font-weight: 600;
  border-left-color: transparent;
}

body.pg-app .sidebar a.pg-sidebar-feature:not(.active) {
  background: rgba(255, 255, 255, 0.04);
  color: var(--pg-text-muted);
}

body.pg-app .sidebar a.pg-sidebar-feature--playgood:not(.active) {
  border: 1px solid rgba(99, 102, 241, 0.35);
  color: #a5b4fc;
}

body.pg-app .sidebar a.pg-sidebar-feature--super:not(.active) {
  border: 1px solid rgba(14, 165, 233, 0.35);
  color: #7dd3fc;
}

/* Cerrar sesión como botón */
body.pg-app .sidebar a.pg-sidebar-logout {
  display: block;
  margin: 14px 8px 8px;
  padding: 12px 14px;
  text-align: center;
  font-weight: 700;
  border-radius: var(--pg-radius-sm);
  border: 1px solid rgba(248, 113, 113, 0.45) !important;
  border-left: 1px solid rgba(248, 113, 113, 0.45) !important;
  background: rgba(248, 113, 113, 0.12) !important;
  color: #fca5a5 !important;
}

body.pg-app .sidebar a.pg-sidebar-logout:hover {
  background: rgba(248, 113, 113, 0.22) !important;
  color: #fecaca !important;
  border-color: rgba(248, 113, 113, 0.65) !important;
}

body.pg-app .sidebar a.active {
  font-weight: 700;
}

/* Cliente nav activo + logout */
body.pg-app.pg-cliente nav a.active {
  color: var(--pg-accent);
  border-bottom: 2px solid var(--pg-accent);
  padding-bottom: 2px;
}

body.pg-app.pg-cliente .pg-nav-logout {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(248, 113, 113, 0.45);
  background: rgba(248, 113, 113, 0.12);
  color: #fca5a5 !important;
  font-weight: 700;
  font-size: 13px;
  text-decoration: none;
}

body.pg-app.pg-cliente .pg-nav-logout:hover {
  background: rgba(248, 113, 113, 0.22);
  color: #fecaca !important;
}

body.pg-app.pg-cliente .profile-avatar {
  background: var(--pg-accent) !important;
  color: var(--pg-on-accent) !important;
}

/* Cliente — buscar cancha (reservas_cancha) */
body.pg-app.pg-cliente .page-wrap .select {
  background: var(--pg-surface-2) !important;
  color: var(--pg-text) !important;
  border: 1px solid var(--pg-border) !important;
  box-shadow: none !important;
}

body.pg-app.pg-cliente .page-wrap .tab.active {
  background: var(--pg-accent-soft) !important;
  color: var(--pg-accent) !important;
  border-color: var(--pg-accent) !important;
  box-shadow: none !important;
}

body.pg-app.pg-cliente .page-wrap .right {
  background: var(--pg-surface) !important;
  color: var(--pg-text) !important;
  border: 1px solid var(--pg-border);
}

body.pg-app.pg-cliente .page-wrap .right h3,
body.pg-app.pg-cliente .page-wrap .right .empty-title {
  color: var(--pg-accent) !important;
}

body.pg-app.pg-cliente .page-wrap .spec,
body.pg-app.pg-cliente .page-wrap .empty {
  background: var(--pg-surface-2) !important;
  border-color: var(--pg-border) !important;
  color: var(--pg-text) !important;
}

body.pg-app.pg-cliente .page-wrap .spec .label {
  color: var(--pg-text-muted) !important;
}

body.pg-app.pg-cliente .page-wrap .spec .value,
body.pg-app.pg-cliente .page-wrap .empty-steps {
  color: var(--pg-text) !important;
}

body.pg-app.pg-cliente .page-wrap .chip {
  background: var(--pg-accent-soft) !important;
  color: var(--pg-accent) !important;
  box-shadow: none !important;
}

body.pg-app.pg-cliente .page-wrap .pager button {
  background: var(--pg-surface-2) !important;
  color: var(--pg-text) !important;
  border-color: var(--pg-border) !important;
}

body.pg-app.pg-cliente .page-wrap .btn-outline {
  background: transparent !important;
  color: var(--pg-accent) !important;
  border-color: var(--pg-accent) !important;
}

body.pg-app.pg-cliente .page-wrap .type-preview {
  background: var(--pg-surface-2) !important;
  border-color: var(--pg-border) !important;
}

/* Ranking cliente */
body.pg-app.pg-cliente .stats-title,
body.pg-app.pg-cliente .page-title {
  color: var(--pg-text) !important;
}

body.pg-app.pg-cliente .search-bar input {
  background: var(--pg-surface-3) !important;
  border: 1px solid var(--pg-border) !important;
  color: var(--pg-text) !important;
}

body.pg-app.pg-cliente .search-bar button {
  background: linear-gradient(135deg, var(--pg-accent-dim), var(--pg-accent)) !important;
  color: var(--pg-on-accent) !important;
}

body.pg-app.pg-cliente .search-bar a.reset {
  background: var(--pg-surface-2) !important;
  border-color: var(--pg-border) !important;
  color: var(--pg-text-muted) !important;
}

body.pg-app.pg-cliente table tbody tr:hover {
  background: rgba(204, 255, 0, 0.04) !important;
}

body.pg-app.pg-cliente .tr-me {
  background: rgba(204, 255, 0, 0.08) !important;
  outline: 1px solid rgba(204, 255, 0, 0.25);
  outline-offset: -1px;
}

body.pg-app.pg-cliente .tr-me td {
  color: var(--pg-text) !important;
}

body.pg-app.pg-cliente .badge-me {
  background: var(--pg-accent-dim) !important;
  color: var(--pg-on-accent) !important;
}

body.pg-app.pg-cliente .pagination a,
body.pg-app.pg-cliente .pagination span {
  background: var(--pg-surface-2) !important;
  border-color: var(--pg-border) !important;
  color: var(--pg-text-muted) !important;
  box-shadow: none !important;
}

body.pg-app.pg-cliente .pagination .active {
  background: var(--pg-accent-soft) !important;
  color: var(--pg-accent) !important;
  border-color: var(--pg-accent) !important;
}

body.pg-app.pg-cliente .card-white {
  background: var(--pg-surface) !important;
  border: 1px solid var(--pg-border);
  color: var(--pg-text);
}

body.pg-app.pg-cliente .card-white table td,
body.pg-app.pg-cliente .card-white table th {
  color: var(--pg-text) !important;
}

/* Mi perfil — textos legibles */
body.pg-app .form-container p,
body.pg-app .form-container .hint,
body.pg-app .form-container .sub,
body.pg-app .pg-profile-note {
  color: var(--pg-text-muted) !important;
}

body.pg-app .btn-secondary {
  background: var(--pg-surface-2);
  border: 1px solid var(--pg-border);
  color: var(--pg-text-muted);
  padding: 10px 16px;
  border-radius: var(--pg-radius-sm);
  text-decoration: none;
  font-weight: 600;
  display: inline-block;
}

body.pg-app.pg-cliente .pagination {
  display: flex;
  gap: 8px;
  margin-top: 14px;
  align-items: center;
  flex-wrap: wrap;
}

body.pg-app.pg-cliente .torneo-form label,
body.pg-app.pg-cliente .torneo-form legend,
body.pg-app.pg-cliente .section-title {
  color: var(--pg-text-muted) !important;
}

body.pg-app.pg-cliente .torneo-form input,
body.pg-app.pg-cliente .torneo-form select,
body.pg-app.pg-cliente .torneo-form textarea {
  background: var(--pg-surface-3) !important;
  border: 1px solid var(--pg-border) !important;
  color: var(--pg-text) !important;
}

body.pg-app.pg-cliente .small-muted {
  color: var(--pg-text-dim) !important;
}

body.pg-app .pg-admin-section .rank {
  background: var(--pg-surface-3);
  color: var(--pg-text-muted);
}

body.pg-app .pg-admin-section .data-table th {
  color: var(--pg-text-muted) !important;
  border-bottom: 1px solid var(--pg-border) !important;
}

body.pg-app .pg-admin-section .data-table td {
  color: var(--pg-text) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

body.pg-app .pg-users-section .fbar,
body.pg-app .pg-users-section .fbar.cols-5,
body.pg-app .pg-users-section .fbar.cols-6 {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  width: 100% !important;
  max-width: 100% !important;
}