/* ═══════════════════════════════════════════════════════════
   2 DEGREE WEBAPP — pages.css
   Page-specific styles only.
   ═══════════════════════════════════════════════════════════ */

/* ── Login screen ────────────────────────────────────────── */
#login-screen {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--ck-green);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
}
.login-box {
  background: #fff; border-radius: 20px;
  width: 100%; max-width: 380px;
  padding: 32px 24px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  animation: fadeIn .3s ease;
}
.login-logo {
  width: 56px; height: 56px; border-radius: 16px;
  background: var(--ck-green-pale);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; font-weight: 700; color: var(--ck-green);
  margin: 0 auto 20px;
}
.login-box h1 { text-align: center; font-size: 20px; font-weight: 700; margin-bottom: 4px }
.login-box .sub { text-align: center; font-size: 13px; color: var(--text-2); margin-bottom: 24px }
.login-submit-btn {
  width: 100%; padding: 14px;
  background: var(--ck-green); color: #fff; border: none;
  border-radius: var(--r); font-size: 15px; font-weight: 600;
  font-family: 'DM Sans', sans-serif; cursor: pointer; margin-top: 8px;
  transition: background .15s;
}
.login-submit-btn:active { background: #054d44 }
.login-submit-btn:disabled { background: #ccc; cursor: default }
#login-error {
  background: var(--ck-red-bg); color: var(--ck-red-text);
  border: 1px solid #FECACA; border-radius: var(--r-sm);
  padding: 10px 12px; font-size: 13px; margin-top: 10px;
  display: none;
}
.pw-wrap { position: relative }
.pw-wrap .pw-toggle {
  position: absolute; right: 12px; top: 50%;
  transform: translateY(-50%);
  background: none; border: none; cursor: pointer;
  color: var(--text-3); padding: 0; display: flex; align-items: center;
}
/* demo-section removed — production build */

/* ── Order page ──────────────────────────────────────────── */
.items-grid { margin-bottom: 0 }
.outlet-fields-grid {}

/* ── Desktop order header badge ──────────────────────────── */
#desktop-cart-badge {
  background: var(--ck-green-pale); color: var(--ck-green);
  border: 1px solid #A7F3D0; border-radius: 20px;
  font-size: 12px; font-weight: 600; padding: 4px 12px;
  font-family: 'DM Mono', monospace; display: none; white-space: nowrap;
}