/* ======================================================================
   Portal light theme — off-white base, dark text (body.page-portal only)
   Load after portal-app.css
   ====================================================================== */

body.page-portal {
  --primary: #4a4db2;
  --primary-light: #5c60c9;
  --primary-dark: #3a3d8f;
  --black: #0f1012;
  --gray: #3d4048;
  --muted: #5a5d65;
  --bg: #f4f3ef;
  --white: #ffffff;
  --text: #14151a;
  --text-light: #3a3d45;
  --card: #ffffff;
  --card-hover: #fafaf8;
  --border: rgba(0, 0, 0, 0.1);
  --border-hover: rgba(74, 77, 178, 0.35);
  --green: #3d7a2e;
  --green-light: #4f9a3c;
  --shadow: rgba(0, 0, 0, 0.06);
  --shadow-hover: rgba(74, 77, 178, 0.14);
  color: var(--text);
  background:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(0, 0, 0, 0.02) 2px,
      rgba(0, 0, 0, 0.02) 4px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 2px,
      rgba(0, 0, 0, 0.02) 2px,
      rgba(0, 0, 0, 0.02) 4px
    ),
    var(--bg);
  background-size: 20px 20px, 20px 20px, 100% 100%;
}

body.page-portal::before {
  background:
    repeating-linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.012) 0px,
      transparent 1px,
      transparent 2px,
      rgba(0, 0, 0, 0.012) 3px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.012) 0px,
      transparent 1px,
      transparent 2px,
      rgba(0, 0, 0, 0.012) 3px
    );
  opacity: 0.65;
}

body.page-portal #vanta-bg {
  display: none !important;
}

body.page-portal .bg-overlay {
  background: none;
  opacity: 0;
  pointer-events: none;
}

/* Header: same frosted dark bar as main.css; body text is dark so reset inheritance */
body.page-portal #site-header {
  color: rgba(238, 240, 255, 0.92);
}

/* Toolbar & footer */
.page-portal .portal-dash-toolbar .meta {
  color: rgba(40, 42,50, 0.8);
}

.page-portal .portal-dash-toolbar a {
  color: #3d4199;
  border-bottom-color: rgba(0, 0, 0, 0.12);
}

.page-portal .portal-dash-toolbar a:hover {
  color: #2a2d70;
}

body.page-portal footer.portal-app-footer {
  border-top-color: rgba(0, 0, 0, 0.08);
}

body.page-portal footer.portal-app-footer .portal-app-footer__inner {
  color: rgba(55, 58, 68, 0.82);
}

body.page-portal footer.portal-app-footer .portal-app-footer__legal-link {
  color: #3d4199;
  border-bottom-color: rgba(0, 0, 0, 0.15);
}

body.page-portal footer.portal-app-footer .portal-app-footer__legal-link:hover {
  color: #2a2d70;
  border-bottom-color: rgba(0, 0, 0, 0.28);
}

/* Buttons */
body.page-portal .btn-primary {
  color: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

body.page-portal .btn-primary:hover {
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

body.page-portal .btn-secondary {
  background: #ffffff;
  color: var(--text);
  border: 1px solid var(--border);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

body.page-portal .btn-secondary:hover {
  background: #f0efea;
  border-color: rgba(0, 0, 0, 0.14);
  color: var(--text);
}

body.page-portal .btn-ghost {
  color: var(--text);
  border-color: var(--border);
}

body.page-portal .btn-ghost:hover {
  background: rgba(0, 0, 0, 0.04);
  border-color: var(--primary);
  color: var(--primary-dark);
}

/* Auth & admin panels */
body.page-portal .portal-auth-panel {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

body.page-portal .portal-auth-panel h1,
body.page-portal .portal-auth-panel h2 {
  color: var(--text);
}

body.page-portal .portal-auth-panel .sub {
  color: rgba(40, 42, 50, 0.75);
}

body.page-portal .portal-field label {
  color: rgba(35, 37, 45, 0.88);
}

body.page-portal .portal-field input[type="text"],
body.page-portal .portal-field input[type="email"],
body.page-portal .portal-field input[type="tel"],
body.page-portal .portal-field input[type="password"],
body.page-portal .portal-field input[type="number"],
body.page-portal .portal-field select {
  border-color: rgba(0, 0, 0, 0.12);
  background: #fafaf8;
  color: var(--text);
}

body.page-portal .portal-sub-label {
  color: rgba(35, 37, 45, 0.88);
}

body.page-portal .portal-check {
  color: rgba(40, 42, 50, 0.88);
}

body.page-portal .portal-msg--err {
  background: rgba(220, 38, 38, 0.08);
  border-color: rgba(220, 38, 38, 0.22);
  color: #991b1b;
}

body.page-portal .portal-msg--ok {
  background: rgba(22, 163, 74, 0.08);
  border-color: rgba(22, 163, 74, 0.22);
  color: #166534;
}

body.page-portal .admin-table-wrap {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.1);
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.05);
}

body.page-portal .admin-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

body.page-portal .admin-table-wrap::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.32);
}

body.page-portal .portal-auth-panel .setup-org-note {
  margin: 0 0 18px;
  font-size: 0.92rem;
  color: rgba(45, 48, 58, 0.82);
}

body.page-portal .admin-table th {
  color: rgba(55, 58, 68, 0.65);
}

body.page-portal .admin-table td {
  color: var(--text);
  border-bottom-color: rgba(0, 0, 0, 0.06);
}

body.page-portal .admin-section h2 {
  color: var(--text);
}

/* Dashboard: submissions block headings inline in dashboard template */
body.page-portal main .portal-auth-panel h3 {
  color: rgba(45, 48, 58, 0.88);
}

/* Portal cards — base */
body.page-portal .portal-card-desc {
  color: rgba(35, 37, 45, 0.72) !important;
}

/* No access: neutral grey, clearly disabled (overrides per-portal tints) */
body.page-portal .portal-login-card--locked[data-portal] {
  background: #cfcfcd !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  box-shadow: none !important;
  filter: grayscale(1) brightness(0.88) contrast(1.06);
  opacity: 0.62;
  cursor: pointer;
}

body.page-portal .portal-login-card--locked:focus-visible {
  outline-color: rgba(61, 65, 120, 0.55) !important;
}

body.page-portal .portal-login-card--locked .portal-card-title {
  color: rgba(72, 74, 82, 0.48) !important;
}

body.page-portal .portal-login-card--locked .portal-card-desc {
  color: rgba(88, 90, 100, 0.44) !important;
}

body.page-portal .portal-login-card--locked .portal-card-icon {
  background: rgba(0, 0, 0, 0.08) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

body.page-portal .portal-login-card--locked .portal-card-icon svg {
  color: rgba(78, 80, 88, 0.38) !important;
}

body.page-portal .portal-login-card {
  background: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.09) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
}

body.page-portal .portal-login-card:hover {
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.08);
}

/* DCIM */
body.page-portal .portal-login-card[data-portal="dcim"] {
  background: #f4fbfb !important;
  border-color: rgba(13, 148, 136, 0.2) !important;
}
body.page-portal .portal-login-card[data-portal="dcim"]:hover {
  background: #ecfafa !important;
  border-color: rgba(13, 148, 136, 0.35) !important;
  box-shadow: 0 10px 28px rgba(13, 148, 136, 0.12);
}
body.page-portal .portal-login-card[data-portal="dcim"] .portal-card-icon {
  background: rgba(13, 148, 136, 0.1);
  border-color: rgba(13, 148, 136, 0.25);
}
body.page-portal .portal-login-card[data-portal="dcim"] .portal-card-icon svg {
  color: #0f766e;
}
body.page-portal .portal-login-card[data-portal="dcim"] .portal-card-cta {
  background: rgba(13, 148, 136, 0.12);
  border-color: rgba(13, 148, 136, 0.35);
  color: #0f766e;
}
body.page-portal .portal-login-card[data-portal="dcim"] .portal-card-cta:hover {
  background: rgba(13, 148, 136, 0.2);
  color: #0d5c56;
}

/* Pricing */
body.page-portal .portal-login-card[data-portal="pricing"] {
  background: #fdf2f8 !important;
  border-color: rgba(219, 39, 119, 0.22) !important;
}
body.page-portal .portal-login-card[data-portal="pricing"]:hover {
  background: #fce7f3 !important;
  border-color: rgba(219, 39, 119, 0.35) !important;
  box-shadow: 0 10px 28px rgba(219, 39, 119, 0.12);
}
body.page-portal .portal-login-card[data-portal="pricing"] .portal-card-icon {
  background: rgba(219, 39, 119, 0.1);
  border-color: rgba(219, 39, 119, 0.28);
}
body.page-portal .portal-login-card[data-portal="pricing"] .portal-card-icon svg {
  color: #be185d;
}
body.page-portal .portal-login-card[data-portal="pricing"] .portal-card-cta {
  background: rgba(219, 39, 119, 0.12);
  border-color: rgba(219, 39, 119, 0.35);
  color: #be185d;
}
body.page-portal .portal-login-card[data-portal="pricing"] .portal-card-cta:hover {
  background: rgba(219, 39, 119, 0.2);
  color: #9d174d;
}

/* Client */
body.page-portal .portal-login-card[data-portal="client"] {
  background: #f5f8ff !important;
  border-color: rgba(37, 99, 235, 0.2) !important;
}
body.page-portal .portal-login-card[data-portal="client"]:hover {
  background: #eef4ff !important;
  border-color: rgba(37, 99, 235, 0.35) !important;
  box-shadow: 0 10px 28px rgba(37, 99, 235, 0.12);
}
body.page-portal .portal-login-card[data-portal="client"] .portal-card-icon {
  background: rgba(37, 99, 235, 0.1);
  border-color: rgba(37, 99, 235, 0.25);
}
body.page-portal .portal-login-card[data-portal="client"] .portal-card-icon svg {
  color: #1d4ed8;
}
body.page-portal .portal-login-card[data-portal="client"] .portal-card-cta {
  background: rgba(37, 99, 235, 0.12);
  border-color: rgba(37, 99, 235, 0.35);
  color: #1d4ed8;
}
body.page-portal .portal-login-card[data-portal="client"] .portal-card-cta:hover {
  background: rgba(37, 99, 235, 0.2);
  color: #1e3a8a;
}

/* Tech */
body.page-portal .portal-login-card[data-portal="tech"] {
  background: #f6f5fc !important;
  border-color: rgba(74, 77, 178, 0.22) !important;
}
body.page-portal .portal-login-card[data-portal="tech"]:hover {
  background: #f0effa !important;
  border-color: rgba(74, 77, 178, 0.38) !important;
  box-shadow: 0 10px 28px rgba(74, 77, 178, 0.12);
}
body.page-portal .portal-login-card[data-portal="tech"] .portal-card-icon {
  background: rgba(74, 77, 178, 0.1);
  border-color: rgba(74, 77, 178, 0.28);
}
body.page-portal .portal-login-card[data-portal="tech"] .portal-card-icon svg {
  color: #4a4db2;
}
body.page-portal .portal-login-card[data-portal="tech"] .portal-card-cta {
  background: rgba(74, 77, 178, 0.12);
  border-color: rgba(74, 77, 178, 0.35);
  color: #3d4199;
}
body.page-portal .portal-login-card[data-portal="tech"] .portal-card-cta:hover {
  background: rgba(74, 77, 178, 0.2);
  color: #2f3277;
}

/* Sales / CRM */
body.page-portal .portal-login-card[data-portal="sales"] {
  background: #f4faf4 !important;
  border-color: rgba(61, 122, 46, 0.22) !important;
}
body.page-portal .portal-login-card[data-portal="sales"]:hover {
  background: #edf5ed !important;
  border-color: rgba(61, 122, 46, 0.35) !important;
  box-shadow: 0 10px 28px rgba(61, 122, 46, 0.1);
}
body.page-portal .portal-login-card[data-portal="sales"] .portal-card-icon {
  background: rgba(61, 122, 46, 0.1);
  border-color: rgba(61, 122, 46, 0.28);
}
body.page-portal .portal-login-card[data-portal="sales"] .portal-card-icon svg {
  color: #3d7a2e;
}
body.page-portal .portal-login-card[data-portal="sales"] .portal-card-cta {
  background: rgba(61, 122, 46, 0.12);
  border-color: rgba(61, 122, 46, 0.35);
  color: #356929;
}
body.page-portal .portal-login-card[data-portal="sales"] .portal-card-cta:hover {
  background: rgba(61, 122, 46, 0.2);
  color: #264d1f;
}

/* Partner */
body.page-portal .portal-login-card[data-portal="partner"] {
  background: #fffaf3 !important;
  border-color: rgba(217, 119, 6, 0.25) !important;
}
body.page-portal .portal-login-card[data-portal="partner"]:hover {
  background: #fff5e6 !important;
  border-color: rgba(217, 119, 6, 0.4) !important;
  box-shadow: 0 10px 28px rgba(217, 119, 6, 0.1);
}
body.page-portal .portal-login-card[data-portal="partner"] .portal-card-icon {
  background: rgba(217, 119, 6, 0.1);
  border-color: rgba(217, 119, 6, 0.3);
}
body.page-portal .portal-login-card[data-portal="partner"] .portal-card-icon svg {
  color: #b45309;
}
body.page-portal .portal-login-card[data-portal="partner"] .portal-card-cta {
  background: rgba(217, 119, 6, 0.12);
  border-color: rgba(217, 119, 6, 0.35);
  color: #b45309;
}
body.page-portal .portal-login-card[data-portal="partner"] .portal-card-cta:hover {
  background: rgba(217, 119, 6, 0.2);
  color: #92400e;
}

/* Open CTA on cards: solid primary for readability */
body.page-portal a.portal-login-card .portal-card-cta.btn-primary {
  background: var(--primary);
  border: 1px solid transparent;
  color: #ffffff !important;
}
body.page-portal a.portal-login-card .portal-card-cta.btn-primary:hover {
  background: var(--primary-light);
  color: #ffffff !important;
}

body.page-portal .portal-login-card--locked .portal-card-cta {
  background: rgba(0, 0, 0, 0.1) !important;
  border: 1px solid rgba(0, 0, 0, 0.16) !important;
  color: rgba(88, 90, 98, 0.68) !important;
  box-shadow: none !important;
}

body.page-portal .portal-login-card--locked .portal-card-access-hint {
  margin: 0.65rem 0 0 !important;
  max-width: 22rem;
  font-size: clamp(0.72rem, 0.45vw + 0.68rem, 0.82rem);
  line-height: 1.45;
  color: rgba(72, 74, 84, 0.52) !important;
  font-weight: 400;
}

body.page-portal .portal-card--help {
  background: #ebeae6 !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}
body.page-portal .portal-card--help .portal-card-help-text {
  color: rgba(45, 48, 58, 0.82);
}
body.page-portal .portal-card--help .portal-card-help-text a {
  color: #3d4199;
  border-bottom-color: rgba(0, 0, 0, 0.18);
}
body.page-portal .portal-card--help .portal-card-help-text a:hover {
  color: #2a2d70;
}

/* Access warning / loading */
body.page-portal .portal-access-spinner {
  border-color: rgba(0, 0, 0, 0.08);
  border-top-color: var(--primary);
}

body.page-portal .portal-access-bar-track {
  background: rgba(0, 0, 0, 0.06);
}

body.page-portal .portal-access-warning-card {
  background: #ffffff;
  border-color: rgba(220, 38, 38, 0.3);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.06);
}

body.page-portal .portal-access-warning-message {
  color: rgba(50, 52, 62, 0.88);
}

/* List text on dashboard */
body.page-portal #sub-list {
  color: rgba(45, 48, 58, 0.85) !important;
}

/* Left nav — light shell */
body.page-portal .portal-sidebar__panel {
  background: #ffffff;
  border-right-color: rgba(0, 0, 0, 0.1);
  box-shadow: 4px 0 20px rgba(0, 0, 0, 0.04);
}

body.page-portal .portal-sidebar__link {
  color: rgba(40, 42, 50, 0.92);
}

body.page-portal .portal-sidebar__link:hover {
  background: rgba(74, 77, 178, 0.08);
  color: var(--text);
}

body.page-portal .portal-sidebar__icon {
  color: rgba(74, 77, 178, 0.85);
}

body.page-portal .portal-sidebar__mobile-bar {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

body.page-portal .portal-sidebar__mobile-title {
  color: var(--text);
}

body.page-portal .portal-sidebar__close {
  background: rgba(0, 0, 0, 0.05);
  color: var(--text);
}

body.page-portal .portal-sidebar__footer {
  border-top-color: rgba(0, 0, 0, 0.08);
}

body.page-portal .portal-sidebar__collapse {
  background: #fafaf8;
  border-color: rgba(0, 0, 0, 0.12);
  color: rgba(40, 42, 50, 0.9);
}

body.page-portal .portal-sidebar__collapse:hover {
  color: rgba(25, 28, 38, 0.98);
}

body.page-portal .portal-sidebar__user {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

body.page-portal .portal-sidebar__user-icon {
  color: rgba(74, 77, 178, 0.85);
}

body.page-portal .portal-sidebar__session {
  color: rgba(40, 42, 50, 0.72);
}

body.page-portal .portal-sidebar__session-kicker {
  color: rgba(40, 42, 50, 0.45);
}

body.page-portal .portal-sidebar__session-email {
  color: rgba(40, 42, 50, 0.95);
}

body.page-portal .portal-sidebar__session-org {
  color: rgba(40, 42, 50, 0.55);
}

body.page-portal button.portal-sidebar__logout:hover {
  background: rgba(0, 0, 0, 0.06) !important;
}