.neogrow-reminders {
  --ng-navy: #0b1d27;
  --ng-navy-2: #102b37;
  --ng-gold: #d9ad4a;
  --ng-cream: #fffaf0;
  --ng-ink: #13242c;
  --ng-muted: #52646b;
  --ng-green: #157347;
  max-width: 780px;
  margin: 32px auto;
  padding: clamp(22px, 4vw, 42px);
  color: var(--ng-ink);
  background: #fff;
  border: 1px solid #d9e1e5;
  border-radius: 24px;
  box-shadow: 0 18px 54px rgba(11, 29, 39, .12);
}
.neogrow-reminders h1,
.neogrow-reminders h2,
.neogrow-reminders h3,
.neogrow-reminders label,
.neogrow-reminders legend,
.neogrow-reminders strong { color: var(--ng-navy) !important; line-height: 1.15; }
.neogrow-reminders p { color: var(--ng-muted) !important; font-size: 17px; line-height: 1.65; }
.ng-reminder-step { padding: 22px 0; border-top: 1px solid #e3e9ec; }
.ng-history { scroll-margin-top: 24px; }
.ng-medicine-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.ng-medicine-card { overflow: hidden; display: grid; grid-template-columns: 116px minmax(0, 1fr); min-height: 160px; background: #f5f8f9; border: 1px solid #d5dfe3; border-radius: 18px; }
.ng-medicine-image { display: flex; align-items: center; justify-content: center; min-height: 160px; background: #fff; }
.ng-medicine-image img { width: 100%; height: 100%; object-fit: cover; }
.ng-medicine-content { padding: 16px; }
.ng-medicine-content h3 { margin: 0 0 8px; color: var(--ng-navy); font-size: 18px; line-height: 1.3; }
.ng-medicine-content p { margin: 0 0 14px; color: var(--ng-muted); font-size: 15px; line-height: 1.45; }
.ng-button--small { display: inline-block; padding: 9px 14px; font-size: 14px; line-height: 1.2; text-decoration: none; }
.ng-shop-link { margin: 18px 0 0; }
.ng-reminder-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ng-button {
  appearance: none;
  border: 2px solid var(--ng-navy);
  border-radius: 999px;
  padding: 12px 20px;
  background: var(--ng-navy);
  color: #fff;
  font-weight: 750;
  cursor: pointer;
}
.ng-button:hover, .ng-button:focus-visible { background: var(--ng-navy-2); color: #fff; }
.ng-button--gold { border-color: var(--ng-gold); background: var(--ng-gold); color: #111; }
.ng-button--secondary { background: #fff; color: var(--ng-navy); }
.neogrow-reminders[data-push-enabled="true"] [data-enable-push],
.neogrow-reminders[data-push-enabled="false"] [data-disable-push],
.neogrow-dashboard[data-push-enabled="true"] [data-enable-push],
.neogrow-dashboard[data-push-enabled="false"] [data-disable-push],
.neogrow-reminders [hidden],
.neogrow-dashboard [hidden] { display: none !important; }
.ng-time-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ng-time-grid label { color: var(--ng-navy); font-weight: 700; }
.ng-time-grid input {
  display: block;
  width: 100%;
  margin-top: 7px;
  padding: 12px;
  color: var(--ng-ink);
  background: #fff;
  border: 1px solid #aebdc4;
  border-radius: 12px;
}
.ng-consent { display: flex; gap: 10px; align-items: flex-start; margin: 18px 0; color: var(--ng-ink) !important; }
.ng-consent input { margin-top: 5px; }
.ng-status { min-height: 28px; margin-top: 16px; font-weight: 700; }
.ng-status[data-type="success"] { color: var(--ng-green); }
.ng-status[data-type="error"] { color: #a12622; }
.ng-safety-note,
.ng-safety-note p { color: var(--ng-ink) !important; }
.ng-safety-note { padding: 14px 16px; background: var(--ng-cream); border-left: 4px solid var(--ng-gold); border-radius: 8px; }
@media (max-width: 640px) {
  .neogrow-reminders { margin: 18px 12px; border-radius: 18px; }
  .ng-time-grid { grid-template-columns: 1fr; }
  .ng-medicine-grid { grid-template-columns: 1fr; }
  .ng-medicine-card { grid-template-columns: 96px minmax(0, 1fr); }
}

/* Private Hair Dr Vikram dashboard */
.neogrow-dashboard {
  --ng-navy: #0b1d27;
  --ng-navy-2: #102b37;
  --ng-gold: #d9ad4a;
  --ng-cream: #fffaf0;
  --ng-ink: #13242c;
  --ng-muted: #52646b;
  --ng-border: #d9e1e5;
  width: min(1120px, 92%);
  margin: 32px auto;
  color: var(--ng-ink);
}
.neogrow-dashboard *, .neogrow-dashboard *::before, .neogrow-dashboard *::after { box-sizing: border-box; }
.neogrow-dashboard h1, .neogrow-dashboard h2, .neogrow-dashboard h3, .neogrow-dashboard strong { color: var(--ng-ink) !important; }
.neogrow-dashboard p, .neogrow-dashboard small { color: var(--ng-muted) !important; }
.ng-dashboard-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: clamp(26px, 5vw, 52px);
  color: #f8f4ea;
  background: linear-gradient(125deg, #071117, #0b2632);
  border-radius: 24px;
  box-shadow: 0 20px 55px rgba(11, 29, 39, .2);
}
.ng-dashboard-hero h1 { margin: 6px 0 10px; color: #fffaf0 !important; font-size: clamp(34px, 5vw, 58px); line-height: 1.05; }
.ng-dashboard-hero p { margin: 0; color: #d6e1e5 !important; font-size: 17px; }
.ng-eyebrow { color: #f0ca66 !important; font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ng-profile-chip { display: flex; align-items: center; gap: 12px; min-width: 250px; padding: 14px 16px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); border-radius: 16px; }
.ng-profile-chip > span { display: grid; place-items: center; width: 46px; height: 46px; flex: 0 0 auto; color: #111; background: var(--ng-gold); border-radius: 50%; font-weight: 900; }
.ng-profile-chip strong, .ng-profile-chip small { display: block; color: #fffaf0 !important; }
.ng-profile-chip small { margin-top: 3px; color: #d6e1e5 !important; }
.ng-dashboard-nav { position: sticky; top: 12px; z-index: 5; display: flex; gap: 8px; padding: 10px; margin: 16px 0; overflow-x: auto; background: rgba(255,255,255,.95); border: 1px solid var(--ng-border); border-radius: 999px; box-shadow: 0 10px 30px rgba(11,29,39,.09); }
.ng-dashboard-nav a { flex: 1 0 auto; padding: 9px 14px; color: var(--ng-navy); text-align: center; text-decoration: none; border-radius: 999px; font-weight: 800; }
.ng-dashboard-nav a:hover, .ng-dashboard-nav a:focus-visible { color: #111; background: var(--ng-gold); }
.ng-summary-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin: 18px 0; }
.ng-summary-grid article { padding: 22px; background: #fff; border: 1px solid var(--ng-border); border-radius: 18px; }
.ng-summary-grid span, .ng-summary-grid strong, .ng-summary-grid small { display: block; }
.ng-summary-grid span { color: #765b14 !important; font-size: 13px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.ng-summary-grid strong { margin: 7px 0; font-size: 24px; }
.ng-dashboard-panel { scroll-margin-top: 92px; margin: 18px 0; padding: clamp(22px,4vw,36px); color: var(--ng-ink); background: #fff; border: 1px solid var(--ng-border); border-radius: 22px; box-shadow: 0 12px 38px rgba(11,29,39,.07); }
.ng-panel-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.ng-panel-head h2 { margin: 5px 0 0; font-size: clamp(28px,4vw,40px); }
.ng-panel-head > a { color: #6d5110 !important; font-weight: 800; }
.ng-empty { padding: 22px; background: #f5f8f9; border-radius: 15px; }
.ng-empty h3 { margin-top: 0; }
.ng-dose-list, .ng-plan-list { display: grid; gap: 14px; }
.ng-dose { display: grid; grid-template-columns: 100px minmax(0,1fr) auto; align-items: center; gap: 18px; padding: 18px; background: #f5f8f9; border: 1px solid #d5dfe3; border-radius: 16px; }
.ng-dose time { color: var(--ng-navy); font-size: 18px; font-weight: 900; }
.ng-dose h3, .ng-dose p { margin: 0; }
.ng-dose p { margin-top: 4px; font-size: 14px; }
.ng-dose-actions { display: flex; gap: 8px; }
.ng-dose-actions button { padding: 9px 13px; color: var(--ng-navy); background: #fff; border: 1px solid #9dafb7; border-radius: 999px; font-weight: 800; cursor: pointer; }
.ng-dose-actions button[data-dose-action="taken"] { color: #fff; background: #157347; border-color: #157347; }
.ng-dose[data-dose-status="taken"] { border-color: #68ad88; background: #eef8f2; }
.ng-dose[data-dose-status="skipped"] { border-color: #c6a465; background: #fffaf0; }
.ng-plan-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px; padding: 24px; background: #f5f8f9; border: 1px solid #d5dfe3; border-radius: 16px; }
.ng-plan-card h3 { margin: 8px 0; font-size: 23px; }
.ng-plan-status { display: inline-block; padding: 5px 9px; color: #0f5d38 !important; background: #dff4e7; border-radius: 999px; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.ng-clinician-note { margin-top: 16px; padding: 15px; background: #fffaf0; border-left: 4px solid var(--ng-gold); border-radius: 9px; }
.ng-clinician-note p { margin: 5px 0 0; }
.ng-notification-panel { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; background: var(--ng-navy); }
.ng-notification-panel h2, .ng-notification-panel p { color: #fffaf0 !important; }
.ng-notification-panel .ng-button--secondary { color: #fffaf0; background: transparent; border-color: #fffaf0; }
.ng-login-card { max-width: 720px; padding: clamp(28px,5vw,50px); text-align: center; background: #fff; border: 1px solid var(--ng-border); border-radius: 24px; }
.ng-login-card h1 { font-size: clamp(34px,5vw,54px); }

@media (max-width: 760px) {
  .ng-dashboard-hero, .ng-panel-head, .ng-notification-panel { display: grid; align-items: start; }
  .ng-profile-chip { min-width: 0; width: 100%; }
  .ng-summary-grid { grid-template-columns: 1fr; }
  .ng-dose { grid-template-columns: 1fr; }
  .ng-dose-actions { flex-wrap: wrap; }
  .ng-plan-card { grid-template-columns: 1fr; }
}

/* Contrast guardrails: keep the private app readable inside the global dark theme. */
html body .neogrow-dashboard .ng-dashboard-nav,
html body .neogrow-dashboard .ng-summary-grid article,
html body .neogrow-dashboard .ng-dashboard-panel,
html body .neogrow-dashboard .ng-empty,
html body .neogrow-dashboard .ng-dose,
html body .neogrow-dashboard .ng-plan-card,
html body .neogrow-dashboard .ng-medicine-card,
html body .neogrow-dashboard .ng-medicine-content,
html body .neogrow-dashboard .ng-login-card {
  color: var(--ng-ink) !important;
  background: #fff !important;
}

html body .neogrow-dashboard .ng-empty,
html body .neogrow-dashboard .ng-dose,
html body .neogrow-dashboard .ng-plan-card,
html body .neogrow-dashboard .ng-medicine-card,
html body .neogrow-dashboard .ng-medicine-content {
  background: #f5f8f9 !important;
}

html body .neogrow-dashboard .ng-dashboard-nav a,
html body .neogrow-dashboard .ng-dashboard-panel h1,
html body .neogrow-dashboard .ng-dashboard-panel h2,
html body .neogrow-dashboard .ng-dashboard-panel h3,
html body .neogrow-dashboard .ng-dashboard-panel strong,
html body .neogrow-dashboard .ng-summary-grid strong,
html body .neogrow-dashboard .ng-medicine-content h3 {
  color: var(--ng-ink) !important;
}

html body .neogrow-dashboard .ng-dashboard-panel p,
html body .neogrow-dashboard .ng-dashboard-panel small,
html body .neogrow-dashboard .ng-summary-grid small,
html body .neogrow-dashboard .ng-medicine-content p {
  color: var(--ng-muted) !important;
}

html body .neogrow-dashboard .ng-dashboard-panel .ng-eyebrow {
  color: #6d5110 !important;
}

html body .neogrow-dashboard .ng-dashboard-hero,
html body .neogrow-dashboard .ng-notification-panel {
  color: #fffaf0 !important;
  background: #0b1d27 !important;
}

html body .neogrow-dashboard .ng-dashboard-hero .ng-eyebrow,
html body .neogrow-dashboard .ng-notification-panel .ng-eyebrow {
  color: #f0ca66 !important;
}

html body .neogrow-dashboard .ng-button,
html body .neogrow-reminders .ng-button {
  color: #fff !important;
  background: #0b1d27 !important;
  border-color: #0b1d27 !important;
}

html body .neogrow-dashboard .ng-button--gold,
html body .neogrow-reminders .ng-button--gold {
  color: #111 !important;
  background: #d9ad4a !important;
  border-color: #d9ad4a !important;
}

html body .neogrow-dashboard .ng-button--secondary,
html body .neogrow-reminders .ng-button--secondary {
  color: #0b1d27 !important;
  background: #fff !important;
  border-color: #0b1d27 !important;
}

html body .neogrow-dashboard .ng-notification-panel .ng-button--secondary {
  color: #fffaf0 !important;
  background: transparent !important;
  border-color: #fffaf0 !important;
}
