/* Monkey D Surebrec — estilos mínimos sobre Tailwind */
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

html { -webkit-text-size-adjust: 100%; }
body { font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif; }

/* Fondo con un halo suave, sin gradientes chillones */
body.bg-app {
  background-color: #09090b;
  background-image:
    radial-gradient(60rem 40rem at 15% -10%, rgba(20, 184, 166, .10), transparent 60%),
    radial-gradient(50rem 30rem at 110% 10%, rgba(6, 182, 212, .08), transparent 55%);
  background-attachment: fixed;
}

/* Scrollbar discreto */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #27272a; border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: #3f3f46; }

/* Inputs consistentes */
.input {
  width: 100%; background: #09090b; border: 1px solid #27272a; border-radius: .75rem;
  padding: .625rem .875rem; font-size: .8125rem; color: #fff; outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.input:focus { border-color: #2dd4bf; box-shadow: 0 0 0 3px rgba(45, 212, 191, .12); }
.input::placeholder { color: #52525b; }
.input:disabled { opacity: .5; }

.label { display: block; font-size: .625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #a1a1aa; margin-bottom: .375rem; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; font-weight: 700; font-size: .75rem; border-radius: .75rem; padding: .625rem 1rem; transition: all .15s; cursor: pointer; }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn-primary { background: linear-gradient(90deg, #14b8a6, #06b6d4); color: #09090b; }
.btn-primary:hover:not(:disabled) { filter: brightness(1.1); }
.btn-ghost { background: #27272a; color: #d4d4d8; }
.btn-ghost:hover:not(:disabled) { background: #3f3f46; }
.btn-danger { background: #e11d48; color: #fff; }
.btn-danger:hover:not(:disabled) { background: #f43f5e; }

/* Nav inferior con área segura en iPhone */
.safe-bottom { padding-bottom: calc(env(safe-area-inset-bottom, 0px)); }

/* Tabla simple */
.tabla { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .75rem; }
.tabla th { text-align: left; font-size: .625rem; text-transform: uppercase; letter-spacing: .06em; color: #71717a; font-weight: 700; padding: .5rem .75rem; border-bottom: 1px solid #27272a; white-space: nowrap; }
.tabla td { padding: .625rem .75rem; border-bottom: 1px solid #1f1f23; color: #d4d4d8; vertical-align: middle; }
.tabla tr:last-child td { border-bottom: 0; }

@media print { .no-print { display: none !important; } }

/* Inputs numéricos y selects en tema oscuro */
input[type=number] { color-scheme: dark; }
select.input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2371717a' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .75rem center; padding-right: 2rem; }
input[type=file]::file-selector-button { cursor: pointer; }
