[class*="productiveHeading02Light"] {
  display: none !important;
}
.cds--text-input-wrapper:has(#address2),
.cds--text-input-wrapper:has(#cityVillage),
.cds--text-input-wrapper:has(#stateProvince),
.cds--text-input-wrapper:has(#postalCode),
.cds--text-input-wrapper:has(#country),
div[data-testid="address2-field"],
div[data-testid="cityVillage-field"],
div[data-testid="stateProvince-field"],
div[data-testid="postalCode-field"],
div[data-testid="country-field"] {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}
div[style*="padding-bottom: 5%"] {
  padding-bottom: 0 !important;
}
div[style*="padding-bottom: 5%"] > div:not(:first-child) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}

/* Extra top spacing for fields that follow a dropdown (no built-in bottom gap) */
.cds--text-input-wrapper:has(#invoiceNumber),
div[data-testid="invoiceNumber-field"],
.cds--text-input-wrapper:has(#nationalId),
div[data-testid="nationalId-field"],
.cds--text-input-wrapper:has(#phoneNumber1),
div[data-testid="phoneNumber1-field"] {
  margin-top: 1.5rem !important;
}

/* Align the Configure button with the form field labels */
button[class*="configure"],
[class*="configureButton"],
[class*="configure-button"] {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Hide Laboratory, Wards, Billing, and Service Queues tiles and nav links */
.cds--tile:has(a[href*="laboratory"]),
.cds--tile:has(a[href*="ward"]),
.cds--tile:has(a[href*="billing"]),
/* Hide Service Queues home-page tile and left-nav item */
.cds--tile:has(a[href*="service-queues"]),
.cds--side-nav__item:has(a[href*="service-queues"]),
[data-extension-id*="laboratory"],
[data-extension-id*="ward"],
[data-extension-id*="billing"],
/* Hide Service Queues extension wrappers (nav link + dashboard tile) */
[data-extension-id*="service-queue"],
[data-extension-id="queue-patient-info-queue-entry-status"] {
  display: none !important;
}

/* ── Patient Summary: hide default Address+ContactDetails row (row 1) ─────── */
[class*="patient-banner-contact-details-module__row"]:first-child {
  display: none !important;
}

/* Hide Relationships col (first col in row 2) */
[class*="patient-banner-contact-details-module__row"]:last-child
  > [class*="patient-banner-contact-details-module__col"]:first-child {
  display: none !important;
}

/* Expand Patient Lists to fill the full row width */
[class*="patient-banner-contact-details-module__row"]:last-child
  > [class*="patient-banner-contact-details-module__col"]:last-child {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* ── Custom patient summary widget panels ──────────────────────────────────── */
#omrs-psw-root {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1rem 1rem 0.25rem;
}

.omrs-psw-panel {
  flex: 1 1 calc(33.333% - 1rem);
  min-width: 200px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-top: 3px solid #005d5d;
  padding: 0.875rem 1rem 1rem;
  box-sizing: border-box;
}

.omrs-psw-heading {
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #005d5d !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.625rem !important;
  padding: 0 !important;
  border: none !important;
}

.omrs-psw-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.omrs-psw-list li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.3rem 0;
  font-size: 0.875rem;
  border-bottom: 1px solid #f4f4f4;
  gap: 0.15rem;
}

.omrs-psw-list li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.omrs-psw-key {
  color: #525252;
  font-weight: 600;
  white-space: nowrap;
}

.omrs-psw-val {
  color: #161616;
  word-break: break-word;
}

.omrs-psw-loading {
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  color: #6f6f6f;
  font-style: italic;
}

.omrs-psw-error {
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  color: #da1e28;
}

@media (max-width: 1055px) {
  .omrs-psw-panel { flex: 1 1 calc(50% - 1rem); }
}

@media (max-width: 671px) {
  .omrs-psw-panel { flex: 1 1 100%; }
}

/* ── Encounter obs: stacked layout ──────────────────────────────────────────
   Attribute selectors match regardless of webpack hash suffix — version-stable.
   JS in custom.js also applies these as inline styles so the layout works even
   when the browser has cached an older version of this CSS file.
───────────────────────────────────────────────────────────────────────────── */
[class*="visit-detail-overview__observation"],
[class*="patient-chart__styles__observation"] {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.15rem !important;
  margin: 0.5rem 1rem 0.75rem 0 !important;
  grid-template-columns: unset !important;
  text-align: left !important;
}
/* Label span */
[class*="visit-detail-overview__observation"] > span:first-child,
[class*="patient-chart__styles__parentConcept"] {
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #525252 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  align-self: flex-start !important;
  text-align: left !important;
}
/* Value span */
[class*="visit-detail-overview__observation"] > span:last-child,
[class*="patient-chart__styles__childConcept"] {
  font-size: 0.875rem !important;
  color: #161616 !important;
  white-space: pre-wrap !important;
  word-break: break-word !important;
  max-width: 100% !important;
  padding-inline-start: 0 !important;
  align-self: flex-start !important;
  text-align: left !important;
}

/* ── Clinical obs: teal accent ──────────────────────────────────────────────── */
.omrs-obs-clinical {
  border-left: 3px solid #005d5d !important;
  padding-left: 0.5rem !important;
  background: #e5f5f5 !important;
}
.omrs-obs-clinical > span:first-child,
[class*="patient-chart__styles__parentConcept"].omrs-obs-clinical,
.omrs-obs-clinical [class*="patient-chart__styles__parentConcept"] {
  color: #005d5d !important;
}

/* ── Appointments: expanded detail panel ────────────────────────────────────
   Aligns Patient Details / Appointment Notes / Appointment History to the
   top of the row and tightens up spacing.
   Class names sourced from appointment-details.component.tsx CSS modules.
───────────────────────────────────────────────────────────────────────────── */

/* 3-column grid: align all columns to the top */
[class*="patientInfoGrid"] {
  align-items: start !important;
}

/* Section headings (gridTitle) – slightly bolder & uppercase for clarity */
[class*="gridTitle"] {
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

/* Appointment History 2×2 stat grid – tighten row gap */
[class*="historyGrid"] {
  row-gap: 0.75rem !important;
}

/* Stat count numbers – add a touch more top breathing room */
[class*="historyGridCount"],
[class*="historyGridCountRed"] {
  margin-top: 0.125rem !important;
}

/* Hide "Can't find who you're looking for? Refine search" banner */
[class*="refineSearchBanner"] {
  display: none !important;
}

/* Fix time-picker input being too narrow to show full "PM" / "AM" suffix.
   Default width (4.875rem = 78px) is insufficient for "12:00 PM" + browser
   clock icon (~97px needed). The error-state variant already uses 6.175rem,
   so matching that as a minimum is safe and consistent. */
.cds--time-picker__input-field {
  min-width: 6.25rem !important;
}

/* Hide the 3 metrics stat boxes (Scheduled appointments, Highest volume service,
   Providers booked) on the appointments dashboard. CSS-only — no JS removed. */
[class*="metrics-card__tileContainer"] {
  display: none !important;
}

/* Move Appointments calendar + Create new appointment buttons to the left.
   The container uses margin-left:auto to right-justify; override to left. */
[class*="metrics-header__metricsContent"] {
  margin-left: 0 !important;
}
