/* Login, registro y vista de cliente (reutiliza la paleta de style.css) */
body.auth { display: flex; align-items: center; justify-content: center; padding: 32px 16px; }
.auth-box { width: 100%; max-width: 400px; text-align: center; }
.auth-logo {
  width: 72px; height: 72px; margin: 0 auto 14px; border-radius: 22px; display: grid; place-items: center;
  font-weight: 800; font-size: 26px; letter-spacing: -1px; color: #fff;
  background: linear-gradient(135deg, var(--orange), #b00610); box-shadow: 0 12px 30px rgba(229, 9, 20, .35);
}
.auth-box h1 { margin: 0 0 6px; }
.auth-sub { color: var(--text-2); margin: 0 0 22px; line-height: 1.45; }
.auth-card { text-align: left; padding: 20px; }
.auth-card .field { margin-bottom: 14px; }
.auth-card .primary-btn { margin-top: 6px; }
.auth-err { background: rgba(255, 90, 95, .14); color: #ffb3b5; border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; font-size: 14px; }
.auth-foot { color: var(--text-2); margin-top: 18px; }
.auth-foot a, .auth-link { color: var(--orange); text-decoration: none; font-weight: 600; }
.auth-link-btn { display: block; text-decoration: none; text-align: center; }

/* Vista del cliente */
body.cliente main { padding-bottom: 40px; }
.contador { display: flex; align-items: center; gap: 16px; }
.contador .ring {
  --p: 0; width: 64px; height: 64px; border-radius: 50%; flex: none; display: grid; place-items: center;
  background: conic-gradient(var(--orange) calc(var(--p) * 1%), var(--card-strong) 0);
}
.contador .ring b { width: 50px; height: 50px; border-radius: 50%; background: var(--bg-2); display: grid; place-items: center; font-size: 18px; }
.contador h3 { margin: 0 0 4px; }
.contador p { margin: 0; color: var(--text-2); font-size: 14px; }
.dia-bloque { margin-bottom: 16px; }
.dia-bloque h4 { margin: 0 0 8px; font-size: 14px; color: var(--text-2); font-weight: 600; text-transform: capitalize; }
.huecos { display: flex; flex-wrap: wrap; gap: 8px; }
.hueco {
  border: 1px solid var(--line); background: var(--card); color: var(--text); border-radius: 12px;
  padding: 9px 14px; font: inherit; font-weight: 600; cursor: pointer;
}
.hueco:hover { border-color: var(--orange); }
.hueco:disabled { opacity: .35; cursor: not-allowed; }
.sin-huecos { color: var(--text-3); font-size: 14px; }
.mia { display: flex; align-items: center; gap: 12px; }
.mia .info { flex: 1; }
.mia .info b { display: block; text-transform: capitalize; }
.mia .info small { color: var(--text-2); }

/* Propietario: solicitudes de acceso */
.solicitud { border: 1px solid rgba(229, 9, 20, .45); }
.solicitud .field { margin: 10px 0 0; }
.badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: var(--orange); color: #fff; font-size: 11px; font-weight: 700; position: absolute; top: 4px; right: 50%; margin-right: -22px; }
.tabbar button { position: relative; }
.top-actions { display: flex; gap: 8px; align-items: center; }
.top-actions a.icon-btn { display: grid; place-items: center; }