:root{ --bg:#e7ecf3; --bg-1:#ffffff; --bg-2:#eef2f8; --surface:#f6f8fc; --surface-2:#eef2f8; --border:rgba(20,28,40,.12); --border-2:rgba(20,28,40,.20); --text:#16202e; --muted:rgba(22,32,46,.58); --muted-2:rgba(22,32,46,.40); --accent:#3b6ef5; --accent-hi:#2f5fe0; --accent-bg:rgba(59,110,245,.10); --accent-border:rgba(59,110,245,.30); --success:#1f9d57; --success-border:rgba(31,157,87,.38); --success-bg:rgba(31,157,87,.12); --warn:#b9770a; --warn-border:rgba(185,119,10,.38); --warn-bg:rgba(185,119,10,.13); --danger:#d23b32; --danger-border:rgba(210,59,50,.38); --danger-bg:rgba(210,59,50,.12); --shadow-md:0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.08); --shadow-lg:0 12px 40px rgba(16,24,40,.18); --r:10px; --r-lg:14px; --wrap:1160px; --font-display:"Space Grotesk","Inter",system-ui,sans-serif; --font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif; --font-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace; } *,*::before,*::after{ box-sizing:border-box; margin:0; } html{ -webkit-text-size-adjust:100%; } body{ font-family:var(--font-body); font-size:15px; line-height:1.6; color:var(--text); background:radial-gradient(1200px 600px at 80% -10%, rgba(59,110,245,.08), transparent 60%), var(--bg); -webkit-font-smoothing:antialiased; min-height:100vh; } a{ color:inherit; text-decoration:none; } img,svg{ display:block; max-width:100%; } button,input,textarea,select{ font:inherit; color:inherit; } ul{ list-style:none; padding:0; } [hidden]{ display:none !important; } h1{ font-family:var(--font-display); font-weight:700; letter-spacing:-.02em; line-height:1.1; } h2{ font-family:var(--font-display); font-weight:600; letter-spacing:-.018em; } h3{ font-family:var(--font-display); font-weight:600; letter-spacing:-.014em; font-size:1.05rem; } .muted{ color:var(--muted); } .small{ font-size:.82rem; } .eyebrow{ display:inline-flex; align-items:center; height:24px; padding:0 10px; border-radius:999px; border:1px solid var(--accent-border); background:var(--accent-bg); font-family:var(--font-mono); font-size:.62rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-hi); } .btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; height:42px; padding:0 18px; border-radius:var(--r); border:1px solid var(--accent); background:var(--accent); color:#fff; font-size:.875rem; font-weight:600; letter-spacing:-.01em; white-space:nowrap; cursor:pointer; transition:transform .12s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease; } .btn:hover{ transform:translateY(-1px); background:#5B8AFF; box-shadow:0 8px 24px rgba(79,127,255,.32); } .btn:active{ transform:translateY(0); } .btn.alt, .btn-ghost{ background:var(--surface); border-color:var(--border); color:var(--text); box-shadow:none; } .btn.alt:hover, .btn-ghost:hover{ background:var(--surface-2); border-color:var(--border-2); box-shadow:none; } .btn.ghost{ background:transparent; border-color:var(--border); color:var(--muted); box-shadow:none; } .btn.ghost:hover{ color:var(--text); border-color:var(--border-2); background:var(--surface); } .btn.danger{ background:var(--danger-bg); border-color:var(--danger-border); color:var(--danger); box-shadow:none; } .btn.danger:hover{ background:rgba(255,107,94,.2); } .btn-sm{ height:34px; padding:0 12px; font-size:.8rem; } .btn-primary{ } .btn-block{ width:100%; } .btn:disabled{ opacity:.5; cursor:not-allowed; transform:none; box-shadow:none; } .field{ margin-bottom:16px; } .field-label{ display:block; font-size:.8rem; color:var(--muted); margin-bottom:6px; } .field-label-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; } .field-input, input[type=text],input[type=email],input[type=password],input[type=tel],input[type=date],input[type=search],input[type=number],textarea,select{ width:100%; height:42px; padding:0 12px; background:var(--bg-1); border:1px solid var(--border); border-radius:var(--r); color:var(--text); transition:border-color .15s, box-shadow .15s; } textarea{ height:auto; padding:10px 12px; resize:vertical; } .field-input:focus, input:focus, textarea:focus, select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-bg); } .field-input::placeholder, input::placeholder, textarea::placeholder{ color:var(--muted-2); } .field-wrap{ position:relative; } .field-link{ font-size:.78rem; color:var(--accent-hi); } .error{ display:none; font-size:.82rem; color:var(--danger); margin:4px 0 8px; } .error.open{ display:block; } .wrap{ max-width:var(--wrap); margin:0 auto; } #toast{ position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(140%); z-index:9999; padding:12px 20px; background:var(--bg-2); border:1px solid var(--border-2); border-radius:var(--r); box-shadow:var(--shadow-lg); font-size:.875rem; color:var(--text); opacity:0; pointer-events:none; transition:transform .25s ease, opacity .25s ease; max-width:90vw; } #toast.open{ transform:translateX(-50%) translateY(0); opacity:1; } #toast.toast-ok{ border-color:var(--success-border); } #toast.toast-err{ border-color:var(--danger-border); } #toast.toast-warn{ border-color:var(--warn-border); } .ico{ display:inline-block; width:16px; height:16px; background-color:currentColor; -webkit-mask:var(--ico) center/contain no-repeat; mask:var(--ico) center/contain no-repeat; flex-shrink:0; vertical-align:middle; } .ico-sm{ width:13px; height:13px; } .ico-md{ width:18px; height:18px; } .ico-lg{ width:24px; height:24px; } .ico-xl{ width:30px; height:30px; } .ico-events { --ico:url(/ui/int/icon/events.svg); } .ico-excel { --ico:url(/ui/int/icon/excel.svg); } .ico-search { --ico:url(/ui/int/icon/search.svg); } .ico-trash { --ico:url(/ui/int/icon/trash.svg); } .ico-pencil { --ico:url(/ui/int/icon/pencil.svg); } .ico-plus { --ico:url(/ui/int/icon/plus.svg); } .ico-log-out { --ico:url(/ui/int/icon/log-out.svg); } .ico-account { --ico:url(/ui/int/icon/account.svg); } .ico-settings { --ico:url(/ui/int/icon/settings.svg); } .ico-calendar { --ico:url(/ui/int/icon/calendar.svg); } .ico-users { --ico:url(/ui/int/icon/users.svg); } .ico-whatsapp { --ico:url(/ui/int/icon/whatsapp.svg); } .ico-grid { --ico:url(/ui/int/icon/grid.svg); } .ico-key { --ico:url(/ui/int/icon/key-round.svg); } .ico-close { --ico:url(/ui/int/icon/close.svg); } .ico-chevron-left{ --ico:url(/ui/int/icon/chevron-left.svg); } .ico-chevron-right{ --ico:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 18 15 12 9 6'/></svg>"); } .ico-reload { --ico:url(/ui/int/icon/reload.svg); } .ico-qr { --ico:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><rect x='3' y='3' width='7' height='7'/><rect x='14' y='3' width='7' height='7'/><rect x='3' y='14' width='7' height='7'/><path d='M14 14h3v3h-3zM20 14v7M14 20h7'/></svg>"); } .ico-copy { --ico:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='9' y='9' width='13' height='13' rx='2'/><path d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/></svg>"); } .icon-btn{ width:34px; height:34px; border-radius:8px; border:1px solid var(--border); background:var(--bg-1); color:var(--muted); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:border-color .15s, background .15s, color .15s, transform .1s; flex-shrink:0; } .icon-btn:hover{ border-color:var(--accent-border); background:var(--bg-2); color:var(--text); } .icon-btn:active{ transform:scale(.94); } .icon-btn.danger:hover{ color:var(--danger); border-color:var(--danger-border); } .icon-btn.is-confirming{ color:#fff; background:var(--danger); border-color:var(--danger); transform:scale(1.12); animation:armedPulse 1s ease-in-out infinite; position:relative; z-index:2; } .icon-btn.is-confirming:hover{ color:#fff; background:var(--danger); } @keyframes armedPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(210,59,50,.45);} 50%{ box-shadow:0 0 0 6px rgba(210,59,50,0);} } .badge{ display:inline-flex; align-items:center; gap:5px; height:22px; padding:0 9px; border-radius:999px; font-family:var(--font-mono); font-size:.66rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; background:var(--surface); border:1px solid var(--border); color:var(--muted); } .badge[data-state=active]{ background:var(--success-bg); border-color:var(--success-border); color:var(--success); } .badge[data-state=pending]{ background:var(--warn-bg); border-color:var(--warn-border); color:var(--warn); } .badge[data-state=error]{ background:var(--danger-bg); border-color:var(--danger-border); color:var(--danger); } .mod-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:24px; flex-wrap:wrap; } .mod-title{ font-size:1.7rem; } .mod-sub{ color:var(--muted); margin-top:4px; font-size:.92rem; } .mod-head-right{ display:flex; align-items:center; gap:12px; } .mod-counter{ font-family:var(--font-mono); font-size:.78rem; color:var(--muted); } .mod-head-back{ display:flex; align-items:center; gap:14px; } .btn-back{ display:inline-flex; align-items:center; gap:6px; background:none; border:0; color:var(--muted); cursor:pointer; font-size:.85rem; } .btn-back:hover{ color:var(--text); } .panel{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; margin-bottom:18px; } .panel-title{ font-family:var(--font-display); font-weight:600; font-size:1.05rem; margin-bottom:14px; } .panel-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; } .kv{ display:flex; justify-content:space-between; padding:8px 0; border-top:1px solid var(--border); font-size:.9rem; } .kv span{ color:var(--muted); } .table-wrap{ border:1px solid var(--border); border-radius:var(--r-lg); overflow:auto; background:var(--bg-1); } table.tabla{ width:100%; border-collapse:collapse; font-size:.88rem; } table.tabla thead th{ text-align:left; font-family:var(--font-mono); font-weight:600; font-size:.64rem; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); padding:12px 14px; border-bottom:1px solid var(--border); background:var(--bg-2); white-space:nowrap; } table.tabla tbody td{ padding:4px 8px; border-bottom:1px solid var(--border); vertical-align:middle; } table.tabla tbody tr:last-child td{ border-bottom:0; } table.tabla tbody tr:hover{ background:rgba(79,127,255,.05); } .cell-edit{ width:100%; height:34px; padding:0 8px; background:transparent; border:1px solid transparent; border-radius:8px; color:inherit; } .cell-edit:hover{ border-color:var(--border); } .cell-edit:focus{ outline:none; background:var(--bg-2); border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-bg); } .col-tight{ width:1%; white-space:nowrap; } .row-actions{ display:flex; gap:6px; } .empty-state{ text-align:center; padding:48px 20px; border:1px dashed var(--border-2); border-radius:var(--r-lg); } .empty-icon{ color:var(--muted-2); margin-bottom:12px; } .empty-title{ font-family:var(--font-display); font-weight:600; font-size:1.1rem; margin-bottom:6px; } .empty-copy{ color:var(--muted); margin-bottom:18px; } .modal{ position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(20,28,40,.45); backdrop-filter:blur(4px); } .modal.open{ display:flex; } .modal-panel{ width:100%; max-width:560px; background:var(--bg-1); border:1px solid var(--border-2); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); max-height:90vh; overflow:auto; animation:modalpop .16s ease; } .modal-panel.sm{ max-width:420px; } @keyframes modalpop{ from{ transform:translateY(8px) scale(.98); opacity:0; } to{ transform:none; opacity:1; } } .modal-head{ display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid var(--border); } .modal-head h2{ font-size:1.15rem; } .modal-close{ background:none; border:0; color:var(--muted); cursor:pointer; width:30px; height:30px; } .modal-close:hover{ color:var(--text); } .modal-body{ padding:22px; } .modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:8px; } .form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } @media(max-width:760px){ .panel-row,.form-grid{ grid-template-columns:1fr; } } #login{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; } .auth-wrap{ width:100%; max-width:420px; } .auth-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:34px 30px; box-shadow:var(--shadow-md); } .auth-brand{ display:flex; align-items:center; gap:10px; margin-bottom:26px; } .auth-brand-mark{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:var(--accent); color:#fff; font-family:var(--font-display); font-weight:700; font-size:1.35rem; line-height:1; } .auth-brand-name{ font-family:var(--font-display); font-weight:600; font-size:1.25rem; } .auth-head{ margin-bottom:22px; } .auth-title{ font-size:1.7rem; margin:10px 0 6px; } .auth-sub{ color:var(--muted); font-size:.9rem; } .field-wrap .auth-toggle-pw{ position:absolute; right:8px; top:50%; transform:translateY(-50%); background:none; border:0; color:var(--muted); cursor:pointer; padding:6px; } #app{ min-height:100vh; display:flex; flex-direction:column; } #topnav{ position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:26px; background:var(--bg-1); border-bottom:1px solid var(--border); padding:0 28px; height:62px; } .brand{ display:flex; align-items:center; gap:10px; } .brand-mark{ width:32px; height:32px; border-radius:9px; display:flex; align-items:center; justify-content:center; background:var(--accent); color:#fff; font-family:var(--font-display); font-weight:700; font-size:1.15rem; line-height:1; } .brand-name{ font-family:var(--font-display); font-weight:600; font-size:1.1rem; } .brand-name em{ font-style:italic; color:var(--accent-hi); } .nav-menu{ display:flex; flex-direction:row; gap:4px; } .nav-link{ display:flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; color:var(--muted); font-size:.9rem; font-weight:500; transition:background .15s, color .15s; } .nav-link .nav-icon{ display:flex; } .nav-link:hover{ background:var(--surface); color:var(--text); } .nav-link.on{ background:var(--accent-bg); color:var(--accent-hi); } .nav-user{ margin-left:auto; display:flex; align-items:center; gap:10px; } .nav-user-avatar{ width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--accent); color:#fff; font-weight:700; font-size:.78rem; flex-shrink:0; } .nav-logout{ color:var(--muted); padding:6px; } .nav-logout:hover{ color:var(--danger); } #ctx{ padding:34px 40px 72px; max-width:var(--wrap); width:100%; margin:0 auto; flex:1; } #ctx.ctx-wide{ max-width:none; } #ctx > section{ display:none; } #ctx > section.open{ display:block; } @media(max-width:760px){ #topnav{ gap:14px; padding:0 14px; height:auto; flex-wrap:wrap; padding-top:10px; padding-bottom:10px; } .nav-menu{ order:3; width:100%; } #ctx{ padding:22px 16px 56px; } .nav-link span:not(.nav-icon){ font-size:.86rem; } } .wa-banner{ position:sticky; top:62px; z-index:25; display:flex; align-items:center; gap:10px; padding:11px 20px; cursor:pointer; font-size:.9rem; font-weight:500; background:#fee2e2; color:#991b1b; border-bottom:1px solid #fecaca; } .wa-banner:hover{ filter:brightness(.98); } .wa-banner .ico{ color:#dc2626; } @media(max-width:760px){ .wa-banner{ top:auto; position:relative; } } .eventos-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(420px,1fr)); gap:22px; } .evento-card{ position:relative; display:flex; flex-direction:column; min-height:240px; background:var(--bg-1); border:1px solid var(--border); border-radius:var(--r-lg); padding:30px 32px; transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease; cursor:pointer; overflow:hidden; } .evento-card::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--accent); opacity:0; transition:opacity .14s ease; } .evento-card:hover{ transform:translateY(-4px); border-color:var(--accent-border); box-shadow:var(--shadow-md); } .evento-card:hover::before{ opacity:1; } .evento-card-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; } .evento-card-icon{ width:60px; height:60px; border-radius:16px; display:flex; align-items:center; justify-content:center; background:var(--accent-bg); border:1px solid var(--accent-border); color:var(--accent-hi); } .evento-card-icon .ico-md{ width:28px; height:28px; } .evento-card-name{ font-size:1.65rem; font-weight:600; line-height:1.12; margin-bottom:10px; } .evento-card-meta{ display:flex; align-items:center; gap:6px; margin-bottom:12px; font-size:.95rem; color:var(--muted); } .evento-card-desc{ font-size:.92rem; color:var(--muted); line-height:1.5; margin-bottom:24px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .evento-card-foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding-top:18px; border-top:1px solid var(--border); } .evento-card-count{ display:inline-flex; align-items:center; gap:6px; font-size:.82rem; font-weight:500; background:var(--bg-2); border:1px solid var(--border); border-radius:999px; padding:6px 14px; color:var(--muted); } .evento-card-go{ display:inline-flex; align-items:center; gap:4px; font-family:var(--font-mono); font-size:.8rem; font-weight:600; color:var(--accent-hi); } .evento-card:hover .evento-card-go{ gap:8px; } @media(max-width:760px){ .eventos-grid{ grid-template-columns:1fr; } .evento-card{ padding:24px; min-height:0; } } #evento .inline-form{ display:flex; gap:8px; } #evento .inline-form input{ flex:1; } .salas-list{ display:flex; flex-direction:column; gap:0; margin-bottom:14px; } .salas-list li{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--border); font-size:.9rem; } .salas-list li:last-child{ border-bottom:0; } .search-wrap{ position:relative; display:flex; align-items:center; } .search-wrap .ico{ position:absolute; left:11px; color:var(--muted); pointer-events:none; } .search-wrap input{ padding-left:32px; min-width:240px; height:34px; } .scan-input{ font-family:var(--font-mono); text-align:center; font-size:1.05rem; height:52px; margin-bottom:8px; } .scan-result{ margin-top:14px; padding:18px; border-radius:var(--r); border:1px solid var(--border); } .scan-result.is-ok{ background:var(--success-bg); border-color:var(--success-border); } .scan-result.is-warn{ background:var(--warn-bg); border-color:var(--warn-border); } .scan-result.is-err{ background:var(--danger-bg); border-color:var(--danger-border); } .scan-result h3{ margin-bottom:6px; } .scan-result p{ margin:2px 0; } .scan-result .btn{ margin-top:12px; } .qr-box{ display:flex; justify-content:center; padding:8px; } .cred-card{ box-sizing:border-box; width:90mm; height:55mm; padding:6mm 7mm; background:#fff; color:#111; border:1px solid #c9cfd9; border-radius:3mm; font-family:Arial,Helvetica,sans-serif; display:flex; flex-direction:column; text-align:left; } .cred-top{ text-align:center; font-size:8pt; letter-spacing:.18em; text-transform:uppercase; color:#555; } .cred-name{ text-align:center; font-size:15pt; font-weight:bold; text-transform:uppercase; letter-spacing:.01em; margin-top:1.5mm; line-height:1.1; } .cred-body{ display:flex; align-items:center; gap:6mm; margin-top:auto; } .cred-qr{ width:20mm; height:20mm; flex:0 0 20mm; } .cred-qr svg, .cred-qr img{ width:100%; height:100%; display:block; } .cred-info{ text-align:left; font-size:9.5pt; line-height:1.4; color:#222; } .cred-info div{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:46mm; } .cod{ font-family:var(--font-mono); font-size:.74rem; color:var(--muted); background:var(--bg-2); padding:2px 7px; border-radius:6px; border:1px solid var(--border); white-space:nowrap; } #acr-destino{ margin-bottom:4px; } .scan-name{ font-size:1.05rem; margin:2px 0; } .scan-cod{ font-family:var(--font-mono); font-size:.74rem; color:var(--muted); margin-top:8px; word-break:break-all; } .btn-back-top{ display:inline-flex; align-items:center; gap:5px; background:none; border:0; padding:0; color:var(--muted); cursor:pointer; font-size:.78rem; margin-bottom:6px; } .btn-back-top:hover{ color:var(--accent-hi); } .evento-title{ font-size:2.2rem; line-height:1.05; } table.tabla thead th.sortable{ cursor:pointer; user-select:none; white-space:nowrap; } table.tabla thead th.sortable:hover{ color:var(--text); } table.tabla thead th.sortable::after{ content:'↕'; opacity:.3; margin-left:6px; font-size:.7em; } table.tabla thead th.sort-asc::after{ content:'↑'; opacity:.9; } table.tabla thead th.sort-desc::after{ content:'↓'; opacity:.9; } #ctx.ctx-wide{ max-width:none; } .wa-pill{ width:100%; display:flex; align-items:center; gap:10px; cursor:pointer; background:var(--bg-1); border:1px solid var(--border); border-radius:999px; padding:10px 16px; color:var(--text); font:inherit; transition:border-color .15s, background .15s; } .wa-pill:hover{ border-color:var(--accent-border); background:var(--bg-2); } .wa-dot{ width:9px; height:9px; border-radius:50%; background:var(--muted-2); flex-shrink:0; } .wa-pill[data-state=on]{ border-color:var(--success-border); background:var(--success-bg); } .wa-pill[data-state=on] .wa-dot, .wa-status[data-state=on] .wa-dot{ background:var(--success); box-shadow:0 0 0 3px var(--success-bg); } .wa-pill[data-state=off] .wa-dot, .wa-status[data-state=off] .wa-dot{ background:var(--muted-2); } .wa-pill-text{ font-weight:600; font-size:.9rem; } .wa-status{ display:flex; align-items:center; gap:9px; font-weight:600; margin-bottom:14px; } .wa-qr{ display:flex; align-items:center; justify-content:center; min-height:200px; background:var(--bg-2); border:1px dashed var(--border-2); border-radius:var(--r-lg); padding:16px; } .wa-qr svg, .wa-qr img{ width:200px; height:200px; } .wa-qr-empty{ text-align:center; } .wa-qr-empty .ico{ width:40px; height:40px; opacity:.35; margin:0 auto 8px; background:var(--muted); } .evento-head{ position:relative; margin-bottom:22px; } .evento-actions{ position:absolute; top:0; right:0; } .ev-edit{ outline:none; border-radius:8px; transition:background .12s, box-shadow .12s; } .ev-edit:hover{ background:var(--surface); } .ev-edit:focus{ background:var(--bg-1); box-shadow:0 0 0 2px var(--accent-border); } .evento-title.ev-edit{ display:inline-block; padding:2px 8px; margin:2px 0 6px -8px; min-width:120px; } .evento-meta{ display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.92rem; margin-bottom:8px; } .ev-inline{ padding:2px 8px; min-width:60px; display:inline-block; } .ev-sep{ opacity:.5; } .ev-date{ background:var(--bg-1); border:1px solid var(--border); border-radius:8px; padding:4px 8px; color:var(--text); font:inherit; font-size:.86rem; } .ev-desc{ display:block; padding:4px 8px; margin-left:-8px; color:var(--muted); max-width:760px; } [contenteditable]:empty::before{ content:attr(data-ph); color:var(--muted-2); } .stats{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); gap:14px; margin-bottom:18px; } .stat-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:16px 18px; } .stat-value{ font-size:1.7rem; font-weight:700; font-family:var(--font-display); line-height:1; } .stat-label{ font-size:.78rem; color:var(--muted); margin-top:6px; text-transform:uppercase; letter-spacing:.04em; } .stat-sub{ margin-top:4px; } .stat-wide{ grid-column:span 2; } .stat-pills{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; } .pill{ display:inline-flex; align-items:center; gap:5px; font-size:.74rem; padding:3px 9px; border-radius:999px; background:var(--bg-2); border:1px solid var(--border); color:var(--text); white-space:nowrap; } .pill b{ color:var(--accent-hi); } .pill-sala{ background:var(--accent-bg); border-color:var(--accent-border); color:var(--accent-hi); } .cell-salas{ white-space:normal; min-width:160px; } .cell-salas .pill{ margin:1px 2px; } .table-wrap{ overflow-x:auto; } table.tabla{ min-width:1060px; } @media(max-width:760px){ .stat-wide{ grid-column:span 1; } } .ev-title-row{ display:flex; align-items:center; gap:8px; } .ev-pencil{ color:var(--muted-2); opacity:0; transition:opacity .15s; } .ev-title-row:hover .ev-pencil{ opacity:1; } .evento-meta{ display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.92rem; margin:6px 0 8px; } .ev-meta-item{ display:inline-flex; align-items:center; gap:6px; } .ev-date-label{ cursor:pointer; border-radius:6px; padding:2px 6px; } .ev-date-label:hover{ background:var(--surface); color:var(--text); text-decoration:underline dotted; } .ev-date-input{ background:var(--bg-1); border:1px solid var(--accent-border); border-radius:8px; padding:3px 8px; color:var(--text); font:inherit; font-size:.86rem; } .salas-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; margin-bottom:14px; } .sala-card{ background:var(--bg-1); border:1px solid var(--border); border-radius:var(--r); padding:12px 14px; } .sala-card-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; } .sala-name{ font-weight:600; font-size:.92rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .sala-card .icon-btn{ width:28px; height:28px; } .sala-card-n{ font-size:.8rem; color:var(--muted); margin-top:8px; } .sala-card-n b{ font-size:1.25rem; color:var(--text); font-family:var(--font-display); margin-right:4px; } .panel-row-asym{ grid-template-columns:1.7fr 1fr; align-items:start; } .panel-wa{ padding:18px; } .panel-wa .panel-title{ margin-bottom:12px; } .modal-acr{ max-width:760px; } .acr-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; } .acr-destino{ width:100%; margin:6px 0 16px; } .acr-scanwrap{ background:var(--bg-2); border:1px dashed var(--border-2); border-radius:var(--r-lg); padding:20px; text-align:center; margin-bottom:16px; } .acr-scanwrap .ico-md{ color:var(--accent-hi); margin:0 auto 10px; width:30px; height:30px; } .acr-scanwrap .scan-input{ text-align:center; } .acr-captured{ margin-top:12px; font-size:.85rem; color:var(--muted); } .acr-captured strong{ font-family:var(--font-mono); color:var(--accent-hi); font-size:1.1rem; margin-left:4px; } .btn-lg{ padding:13px 18px; font-size:1rem; } .acr-right{ min-height:240px; display:flex; align-items:center; justify-content:center; } .acr-result{ width:100%; } .acr-placeholder{ text-align:center; color:var(--muted-2); } .acr-placeholder .ico-xl{ width:48px; height:48px; margin:0 auto 10px; opacity:.4; } @media(max-width:760px){ .acr-grid{ grid-template-columns:1fr; } .panel-row-asym{ grid-template-columns:1fr; } } .sala-card .sala-del{ opacity:0; transition:opacity .12s ease; } .sala-card:hover .sala-del, .sala-card .sala-del.is-confirming{ opacity:1; } .sala-name.ev-edit{ padding:1px 5px; margin-left:-5px; border-radius:6px; } .acr-person{ text-align:left; } .acr-person .scan-name{ font-size:1.05rem; margin-bottom:2px; } .acr-person-meta{ display:flex; align-items:center; gap:10px; margin:10px 0; } .acr-person-salas{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; } .scan-result.is-preview{ border-color:var(--border); background:var(--bg-1); } .scan-result.is-preview h3{ display:none; } .evento-head{ position:relative; background:var(--bg-1); border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:var(--r-lg); padding:24px 28px; margin-bottom:24px; } .evento-actions{ position:absolute; top:20px; right:24px; } .evento-head-main{ display:flex; align-items:flex-start; gap:18px; } .evento-head-icon{ flex-shrink:0; width:56px; height:56px; border-radius:15px; display:flex; align-items:center; justify-content:center; background:var(--accent-bg); border:1px solid var(--accent-border); color:var(--accent-hi); margin-top:4px; } .evento-head-icon .ico-md{ width:26px; height:26px; } .evento-head-text{ min-width:0; flex:1; padding-right:130px; } .ev-title-row{ display:flex; align-items:center; gap:8px; } .evento-title{ font-size:2.1rem; line-height:1.08; } .evento-title.ev-edit{ display:inline-block; padding:2px 8px; margin:0 0 6px -8px; min-width:120px; } .ev-pencil{ color:var(--muted-2); opacity:0; transition:opacity .15s; } .ev-title-row:hover .ev-pencil{ opacity:1; } .evento-meta{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:var(--muted); font-size:.9rem; margin:2px 0 0; } .ev-meta-item{ display:inline-flex; align-items:center; gap:6px; background:var(--bg-2); border:1px solid var(--border); border-radius:999px; padding:4px 12px; } .ev-meta-item .ico{ color:var(--accent-hi); } .ev-inline{ min-width:50px; outline:none; display:inline-block; } .ev-date-label{ cursor:pointer; } .ev-date-label:hover{ text-decoration:underline dotted; } .ev-date-input{ background:var(--bg-1); border:1px solid var(--accent-border); border-radius:6px; padding:2px 6px; color:var(--text); font:inherit; font-size:.85rem; } .ev-desc{ display:block; margin:16px 0 0; padding:6px 10px 6px 74px; color:var(--muted); max-width:900px; line-height:1.55; } .ev-edit{ outline:none; border-radius:8px; transition:background .12s, box-shadow .12s; } .ev-edit:hover{ background:var(--surface); } .ev-edit:focus{ background:var(--surface); box-shadow:0 0 0 2px var(--accent-border); } @media(max-width:760px){ .evento-head-text{ padding-right:0; } .evento-actions{ position:static; margin-bottom:14px; } .evento-head-main{ gap:12px; } .ev-desc{ padding-left:10px; } } .evento-head{ position:relative; background:var(--bg-1); border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:var(--r-lg); padding:22px 26px; margin-bottom:24px; } .evento-actions{ position:absolute; top:18px; right:22px; display:flex; gap:8px; } .ev-title-row{ display:flex; align-items:center; gap:8px; padding-right:240px; } .evento-title{ font-size:2.1rem; line-height:1.1; } .evento-title.ev-edit{ display:inline-block; padding:2px 8px; margin:0 0 6px -8px; min-width:120px; } .evento-meta{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:2px; } .ev-desc{ display:block; margin:14px 0 0 -8px; padding:6px 8px; max-width:820px; color:var(--muted); line-height:1.55; } @media(max-width:760px){ .evento-actions{ position:static; margin-bottom:14px; } .ev-title-row{ padding-right:0; } } .evento-meta{ gap:18px; margin-top:6px; } .ev-meta-item{ background:none; border:0; border-radius:0; padding:0; gap:5px; font-size:.85rem; color:var(--muted-2); } .ev-meta-item .ico{ color:var(--muted-2); width:14px; height:14px; } .ev-date-input{ font-size:.82rem; } .acr-left .acr-scanwrap{ margin-bottom:10px; } .acr-step{ margin-top:18px; } .acr-grid{ align-items:stretch; } .acr-right{ display:flex; flex-direction:column; min-height:260px; } .acr-right .acr-captured{ flex-shrink:0; margin:0 0 12px; font-size:.9rem; color:var(--muted); } .acr-right .acr-captured strong{ color:var(--accent-hi); font-family:var(--font-mono); } .acr-right > #scan-result{ flex:1; margin-top:0; } .acr-right > #acr-placeholder{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; } .scan-result.acr-result{ display:flex; flex-direction:column; } .evento-head{ margin-bottom:14px; } .ev-title-row{ padding-right:48px; } .evento-acreditar-main{ margin-bottom:24px; } @media(max-width:760px){ .evento-head{ padding:16px 16px; } .evento-actions{ position:absolute; top:12px; right:12px; margin:0; } .ev-title-row{ padding-right:46px; } .evento-title{ font-size:1.55rem; line-height:1.15; } .evento-title.ev-edit{ margin-bottom:4px; } .evento-meta{ gap:6px 14px; margin-top:8px; } .ev-meta-item{ font-size:.82rem; } .ev-desc{ margin-top:10px; } .evento-acreditar-main{ margin-bottom:18px; } .mod-head{ flex-direction:column; align-items:stretch; gap:10px; } .mod-head-right{ flex-wrap:wrap; width:100%; gap:8px; } .search-wrap{ flex:1 1 100%; } .search-wrap input{ min-width:0; width:100%; } .mod-head-right .btn{ flex:1; justify-content:center; } .table-wrap{ -webkit-overflow-scrolling:touch; } } #whatsapp .wa-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:6px; } #whatsapp .wa-webhook{ font-family:var(--font-mono); font-size:.74rem; word-break:break-all; text-align:right; max-width:60%; } #whatsapp .wa-qr{ min-height:200px; display:flex; align-items:center; justify-content:center; } #whatsapp .wa-qr svg, #whatsapp .wa-qr img{ width:200px; height:200px; } #whatsapp .wa-qr-empty{ text-align:center; color:var(--muted-2); } #whatsapp .wa-qr-empty .ico{ width:40px; height:40px; opacity:.4; margin:0 auto 8px; } #whatsapp .wa-status[data-state=wait] .wa-dot{ background:#d97706; box-shadow:0 0 0 3px rgba(217,119,6,.18); } #whatsapp .wa-hint{ margin-top:10px; } #whatsapp .wa-status[data-state=on] #wa-status-text{ color:#15803d; } #whatsapp .wa-status[data-state=bad] .wa-dot{ background:#dc2626; box-shadow:0 0 0 3px rgba(220,38,38,.18); } #whatsapp .wa-status[data-state=bad] #wa-status-text{ color:#b91c1c; } #whatsapp .wa-log{ margin-top:10px; max-height:200px; overflow:auto; background:var(--bg-2); border:1px solid var(--border); border-radius:8px; padding:10px 12px; font-family:var(--font-mono,monospace); font-size:.74rem; line-height:1.5; color:var(--muted); white-space:pre-wrap; word-break:break-word; }