/* CyberPOS platform chrome — navy/blue defaults; preserve semantic status colours. */
:root {
  --cyberpos-navy: #082B68;
  --cyberpos-blue: #0877F9;
  --cyberpos-white: #ffffff;
  --cyberpos-neutral-50: #F8FAFC;
  --cyberpos-neutral-100: #F1F5F9;
  --cyberpos-neutral-200: #E2E8F0;
  --cyberpos-neutral-600: #475569;
  --cyberpos-neutral-800: #1E293B;
}

body {
  --primary: var(--cyberpos-blue);
  --primary-base: var(--cyberpos-blue);
}

a.text-primary,
.text-primary {
  color: var(--cyberpos-blue) !important;
}

.btn-primary,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background-color: var(--cyberpos-blue) !important;
  border-color: var(--cyberpos-blue) !important;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--cyberpos-navy) !important;
  border-color: var(--cyberpos-navy) !important;
}

.bg-primary {
  background-color: var(--cyberpos-blue) !important;
}

.badge-primary {
  background-color: var(--cyberpos-blue) !important;
}

.sidebar-left,
.vertical-sidebar,
.layout-sidebar-large .sidebar-left {
  --sidebar-accent: var(--cyberpos-navy);
}

.layout-sidebar-large .sidebar-left .nav-item a.active,
.layout-sidebar-large .sidebar-left .nav-item a:hover {
  color: var(--cyberpos-blue);
}

.auth-login .auth-hero,
.auth-login-page .auth-hero {
  background: linear-gradient(160deg, var(--cyberpos-navy) 0%, #0a3a8c 55%, var(--cyberpos-blue) 100%);
}

.auth-login .auth-panel-logo,
.auth-login-page .auth-panel-logo {
  max-width: 260px;
  max-height: 72px;
}

.cyberpos-entry {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  background: linear-gradient(165deg, var(--cyberpos-neutral-50) 0%, var(--cyberpos-neutral-100) 45%, #dbeafe 100%);
  color: var(--cyberpos-neutral-800);
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}

.cyberpos-entry-card {
  width: 100%;
  max-width: 440px;
  background: var(--cyberpos-white);
  border: 1px solid var(--cyberpos-neutral-200);
  border-radius: 16px;
  padding: 2rem 1.75rem 1.5rem;
  box-shadow: 0 10px 30px rgba(8, 43, 104, 0.08);
  text-align: center;
}

.cyberpos-entry-card img {
  display: block;
  margin: 0 auto 1.25rem;
  max-width: 280px;
  max-height: 84px;
  width: auto;
  height: auto;
}

.cyberpos-entry-card h1 {
  margin: 0 0 0.5rem;
  font-size: 1.5rem;
  color: var(--cyberpos-navy);
  font-weight: 700;
}

.cyberpos-entry-card p {
  margin: 0 0 1.5rem;
  color: var(--cyberpos-neutral-600);
  line-height: 1.45;
}

.cyberpos-entry-actions {
  display: grid;
  gap: 0.75rem;
}

.cyberpos-entry-actions a {
  display: block;
  text-decoration: none;
  border-radius: 10px;
  padding: 0.85rem 1rem;
  font-weight: 600;
}

.cyberpos-entry-actions a.primary {
  background: var(--cyberpos-blue);
  color: var(--cyberpos-white);
}

.cyberpos-entry-actions a.primary:hover {
  background: var(--cyberpos-navy);
}

.cyberpos-entry-actions a.secondary {
  background: var(--cyberpos-neutral-100);
  color: var(--cyberpos-navy);
  border: 1px solid var(--cyberpos-neutral-200);
}

.cyberpos-entry-actions a.secondary:hover {
  border-color: var(--cyberpos-blue);
  color: var(--cyberpos-blue);
}

.cyberpos-entry-foot {
  margin-top: 1.25rem;
  font-size: 0.85rem;
  color: var(--cyberpos-neutral-600);
}

.cyberpos-entry-foot a {
  color: var(--cyberpos-blue);
  text-decoration: none;
  font-weight: 600;
}

@media (max-width: 480px) {
  .cyberpos-entry-card {
    padding: 1.5rem 1.15rem 1.25rem;
  }

  .cyberpos-entry-card img {
    max-width: 220px;
  }
}