*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Barlow', system-ui, sans-serif; background: #f3f1ec; color: #141413; -webkit-font-smoothing: antialiased; }
h1, h2, p { margin: 0; }
a { color: #6b5220; }
:focus-visible { outline: 3px solid #1f6fd1; outline-offset: 2px; }
.muted { color: #6b675f; }
.small { font-size: 14px; }
.nowrap { white-space: nowrap; }

label { display: flex; flex-direction: column; gap: 8px; font-size: 15px; font-weight: 600; color: #2c2a26; }
input, select { height: 50px; padding: 0 14px; font: inherit; font-size: 16px; font-weight: 400; border: 1px solid #c9c4b8; border-radius: 4px; background: #fff; color: #141413; width: 100%; }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 22px; background: #141413; color: #fff; border: 0; border-radius: 4px; font: inherit; font-weight: 700; font-size: 15px; letter-spacing: 0.03em; text-decoration: none; cursor: pointer; white-space: nowrap; }
.btn:hover { background: #2c2a26; color: #fff; }
.btn-linea { min-height: 44px; padding: 0 18px; background: transparent; border: 1px solid #3a3d42; color: #f4f2ee; font: inherit; font-size: 15px; border-radius: 4px; cursor: pointer; }
.btn-linea.oscuro { min-height: 50px; color: #141413; border-color: #c9c4b8; background: #fff; }

.alerta { padding: 12px 14px; border-radius: 4px; font-size: 15px; }
.alerta.error { background: #fbeaea; border: 1px solid #d99a9a; color: #8c1d1d; }
.alerta.ok { background: #e7f2ea; border: 1px solid #93c4a1; color: #1d5b31; }
.alerta.info { background: #eef3fb; border: 1px solid #a8c1e6; color: #1b3f73; }

/* Login */
.login { min-height: 100vh; display: grid; grid-template-columns: minmax(320px, 560px) 1fr; }
.login-marca { background: #0d0e10; color: #f4f2ee; padding: 56px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; }
.login-marca img { width: 240px; height: 64px; object-fit: contain; object-position: left center; }
.login-marca > div { display: flex; flex-direction: column; gap: 16px; }
.eyebrow { font-size: 14px; letter-spacing: 0.22em; color: #d9b46a; }
.login-marca h1 { font-family: 'Archivo', sans-serif; font-weight: 900; font-size: 46px; line-height: 1.02; }
.login-marca .muted { color: #b9b6ae; font-size: 18px; }
.login-form { display: flex; align-items: center; justify-content: center; padding: 40px 24px; }
.login-form form { width: 100%; max-width: 420px; display: flex; flex-direction: column; gap: 20px; }
.login-form h2 { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 32px; }

/* Panel */
.barra { min-height: 80px; padding: 12px 40px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; background: #0d0e10; color: #f4f2ee; }
.barra-marca { display: flex; align-items: center; gap: 18px; font-weight: 600; flex-wrap: wrap; }
.barra-marca img { width: 170px; height: 46px; object-fit: contain; }
.barra-marca .sep { width: 1px; height: 26px; background: #3a3d42; }
.barra-usuario { display: flex; align-items: center; gap: 16px; color: #b9b6ae; }
.barra-usuario form { margin: 0; }
.panel { padding: 32px 40px 56px; display: flex; flex-direction: column; gap: 22px; max-width: 1600px; margin: 0 auto; }
.stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.stat { padding: 20px 22px; background: #fff; border: 1px solid #e0dcd2; border-radius: 6px; display: flex; flex-direction: column; gap: 4px; }
.stat span { font-size: 13px; letter-spacing: 0.14em; color: #6b675f; }
.stat strong { font-family: 'Archivo', sans-serif; font-weight: 900; font-size: 40px; }
.filtros { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.filtros label { width: 300px; }
.filtros .crece { flex: 1; min-width: 240px; }
.tabla-caja { background: #fff; border: 1px solid #e0dcd2; border-radius: 6px; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 15px; }
th { background: #141413; color: #f4f2ee; text-align: left; font-weight: 600; padding: 13px 16px; white-space: nowrap; }
td { padding: 13px 16px; border-bottom: 1px solid #ece8df; vertical-align: top; }
tbody tr:hover { background: #faf8f3; }
td a { color: #141413; }
.vacio { padding: 48px; text-align: center; font-size: 17px; color: #6b675f; }

/* Setup */
.setup { max-width: 460px; margin: 64px auto; padding: 0 20px; display: flex; flex-direction: column; gap: 20px; }
.setup h1 { font-family: 'Archivo', system-ui, sans-serif; font-size: 34px; }
.setup form { display: flex; flex-direction: column; gap: 18px; }

@media (max-width: 800px) {
  .login { grid-template-columns: 1fr; }
  .login-marca { padding: 32px 24px; }
  .login-marca h1 { font-size: 34px; }
  .barra, .panel { padding-left: 20px; padding-right: 20px; }
  .stats { grid-template-columns: 1fr; }
  .filtros label { width: 100%; }
}

/* Aviso de privacidad */
.legal { max-width: 760px; line-height: 1.6; }
.legal h2 { font-size: 22px; margin-top: 8px; }

/* ---- Panel multi-evento ---- */
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.panel h1 { font-family: 'Archivo', sans-serif; font-weight: 900; font-size: 32px; }
.panel h2 { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 22px; }
.barra-nav { display: flex; gap: 6px; flex-wrap: wrap; margin-left: 12px; }
.barra-nav a { color: #cfccc4; text-decoration: none; padding: 10px 14px; border-radius: 4px; font-weight: 600; }
.barra-nav a:hover { color: #fff; background: #1c1d20; }
.barra-nav a[aria-current="page"] { color: #111; background: #d9b46a; }
.titulo-fila { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.titulo-fila form { display: flex; align-items: center; gap: 12px; margin: 0; }
.estado { display: inline-block; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; letter-spacing: 0.04em; }
.estado.abierto { background: #e3f1e7; color: #1d5b31; }
.estado.cerrado { background: #ecebe7; color: #57544d; }
.eventos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.evento-card { display: flex; flex-direction: column; gap: 8px; padding: 22px; background: #fff; border: 1px solid #e0dcd2; border-radius: 6px; color: #141413; text-decoration: none; align-items: flex-start; }
.evento-card:hover { border-color: #141413; }
.evento-nombre { font-family: 'Archivo', sans-serif; font-size: 22px; }
.evento-total { font-size: 17px; }
.evento-total b { font-family: 'Archivo', sans-serif; font-size: 34px; margin-right: 4px; }
.caja { background: #fff; border: 1px solid #e0dcd2; border-radius: 6px; padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.caja.angosta { max-width: 520px; }
.form-grid-admin { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; align-items: end; }
.form-col { display: flex; flex-direction: column; gap: 16px; }
.en-linea { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.acciones { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.btn-mini { min-height: 40px; padding: 0 14px; background: #fff; border: 1px solid #c9c4b8; border-radius: 4px; color: #141413; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.btn-mini:hover { border-color: #141413; }
.select-mini, .input-mini { height: 40px; font-size: 14px; width: auto; }
.input-mini { width: 220px; }
.confirmar { flex-direction: row; font-weight: 400; }
.confirmar input, .check-admin input { width: 20px; height: 20px; }
.check-admin { flex-direction: row; align-items: center; gap: 10px; font-weight: 500; font-size: 14px; }
.borrar-evento { padding-top: 12px; border-top: 1px solid #ece8df; }
.setup ul { margin: 8px 0; padding-left: 20px; }
a.btn-linea { display: inline-flex; align-items: center; text-decoration: none; }
.estado.portada { background: #f6ecd4; color: #6b5220; }
.acciones-evento { display: flex; gap: 20px; flex-wrap: wrap; align-items: center; }
.chips-estado { display: flex; gap: 6px; flex-wrap: wrap; }
.legal { padding-bottom: 64px; }
.legal-logo { width: 200px; height: 54px; object-fit: contain; object-position: left center; }
.legal ul { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 4px; }
.legal p, .legal li { font-size: 17px; }