/* ── Catalog Login Styles ── */
body.catalog-login {
  background: linear-gradient(135deg, var(--brand-teal) 0%, #066666 100%);
  min-height: 100vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; padding: 20px;
}

.catalog-login .card {
  background: #fff; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,0.25);
  width: 100%; max-width: 440px; overflow: hidden;
}

.catalog-login .card-top {
  background: #f8fefe; border-bottom: 1px solid #e0f5f5;
  padding: 40px 40px 32px; text-align: center;
}

.catalog-login .logo-row {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; flex-wrap: wrap; margin-bottom: 20px;
}
.catalog-login .logo-row .logo-omnispace { height: 64px; width: auto; max-width: 260px; object-fit: contain; }
.catalog-login .logo-row .logo-event { height: 72px; width: auto; max-width: 280px; object-fit: contain; }

.catalog-login .event-name { font-size: 13px; font-weight: 600; color: #6E6E6E; letter-spacing: 0.3px; margin-bottom: 4px; }
.catalog-login .event-dates { font-size: 12px; color: #9ca3af; }

.catalog-login .card-body { padding: 32px 40px 36px; }
.catalog-login .lock-icon { font-size: 28px; text-align: center; margin-bottom: 10px; }
.catalog-login .card-body h2 { font-size: 17px; font-weight: 700; color: #1a1a1a; text-align: center; margin-bottom: 6px; }
.catalog-login .card-body p { font-size: 13px; color: #6E6E6E; text-align: center; margin-bottom: 28px; line-height: 1.5; }

.catalog-login label {
  display: block; font-size: 11px; font-weight: 700; color: #555;
  text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px;
}
.catalog-login .input-wrap { position: relative; margin-bottom: 20px; }
.catalog-login .input-wrap input {
  width: 100%; padding: 13px 16px 13px 44px; border: 1.5px solid #ddd;
  border-radius: 8px; font-size: 15px; font-family: inherit; color: #333;
  transition: border-color 0.2s, box-shadow 0.2s; background: #fff;
}
.catalog-login .input-wrap input:focus { outline: none; border-color: var(--brand-teal); box-shadow: 0 0 0 3px rgba(10,150,150,0.12); }
.catalog-login .input-wrap .icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  font-size: 16px; color: #aaa; pointer-events: none;
}
.catalog-login .toggle-pw {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  font-size: 14px; color: #aaa; cursor: pointer; user-select: none;
}
.catalog-login .toggle-pw:hover { color: var(--brand-teal); }

.catalog-login .error-box {
  background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px;
  padding: 11px 14px; font-size: 12px; color: #dc2626; margin-bottom: 18px;
  display: flex; align-items: center; gap: 8px;
}

.catalog-login .btn {
  width: 100%; padding: 14px; background: linear-gradient(135deg, var(--brand-teal), var(--brand-teal-dark));
  color: #fff; border: none; border-radius: 8px; font-size: 14px; font-weight: 700;
  font-family: inherit; cursor: pointer; letter-spacing: 0.3px; transition: opacity 0.2s, transform 0.1s;
}
.catalog-login .btn:hover { opacity: 0.92; transform: translateY(-1px); }
.catalog-login .btn:active { transform: translateY(0); }

.catalog-login .help-text { text-align: center; font-size: 11px; color: #9ca3af; margin-top: 18px; line-height: 1.5; }
.catalog-login .help-text a { color: var(--brand-teal); text-decoration: none; }
.catalog-login .help-text a:hover { text-decoration: underline; }

.catalog-login .footer { margin-top: 28px; text-align: center; }
.catalog-login .footer img { height: 28px; opacity: 0.85; filter: brightness(0) invert(1); }
.catalog-login .footer p { font-size: 11px; color: rgba(255,255,255,0.65); margin-top: 6px; }