/*
 * Unified citizen service workspace
 *
 * Login, complaints, request tracking, Ask MyDasma, and document/service
 * requests share the same quiet desktop language as the citizen portal home.
 * This stylesheet intentionally owns no palette: every visible color, tint,
 * border, focus ring, and shadow is derived from BIMS organization tokens.
 */

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page) {
  --citizen-ui-surface: var(--bims-surface);
  --citizen-ui-surface-soft: var(--bims-surface-soft);
  --citizen-ui-surface-inset: var(--bims-surface-inset);
  --citizen-ui-text: var(--bims-text);
  --citizen-ui-text-strong: var(--bims-text-strong);
  --citizen-ui-muted: var(--bims-muted);
  --citizen-ui-border: var(--bims-border);
  --citizen-ui-border-strong: var(--bims-border-strong);
  --citizen-ui-primary: var(--bims-primary);
  --citizen-ui-primary-strong: var(--bims-primary-strong);
  --citizen-ui-primary-soft: var(--bims-primary-soft);
  --citizen-ui-accent: var(--bims-accent);
  --citizen-ui-accent-strong: var(--bims-accent-strong);
  --citizen-ui-accent-soft: var(--bims-accent-soft);
  min-height: 100svh;
  background:
    radial-gradient(circle at 7% 3%, color-mix(in srgb, var(--citizen-ui-primary) 12%, transparent), transparent 31rem),
    radial-gradient(circle at 95% 16%, color-mix(in srgb, var(--citizen-ui-accent) 10%, transparent), transparent 29rem),
    linear-gradient(180deg, var(--bims-canvas-tint), var(--bims-canvas)) !important;
  color: var(--citizen-ui-text) !important;
  font-family: var(--citizen-app-font, var(--ui-font-sans, system-ui, sans-serif));
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
> main.public-service-shell {
  width: min(1560px, calc(100% - 48px));
  max-width: none;
  padding: 24px 0 44px;
}

/* Shared desktop header --------------------------------------------------- */

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) {
  position: sticky;
  z-index: 50;
  top: 14px;
  min-height: 72px;
  margin-bottom: 22px;
  padding: 10px 12px 10px 16px;
  border: 1px solid var(--citizen-ui-border) !important;
  border-radius: 18px;
  background: color-mix(in srgb, var(--citizen-ui-surface) 92%, transparent) !important;
  box-shadow: 0 14px 38px var(--bims-shadow) !important;
  backdrop-filter: blur(18px) saturate(135%);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top .public-brand {
  flex: 0 1 310px;
  max-width: 310px;
  gap: 11px;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top .public-brand .brand-mark {
  width: 48px;
  height: 48px;
  border: 1px solid var(--citizen-ui-border-strong);
  border-radius: 13px;
  background: linear-gradient(145deg, var(--citizen-ui-surface), var(--citizen-ui-primary-soft)) !important;
  color: var(--citizen-ui-primary-strong) !important;
  box-shadow: 0 8px 20px var(--bims-shadow);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top .public-brand b {
  color: var(--citizen-ui-text-strong) !important;
  font-size: .94rem;
  letter-spacing: -.012em;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top .public-brand small {
  color: var(--citizen-ui-muted) !important;
  font-size: .68rem;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav {
  gap: 7px;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav :is(a, button) {
  height: auto !important;
  min-height: 40px !important;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--citizen-ui-text) !important;
  font-size: .76rem;
  font-weight: 780;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav :is(a, button):is(:hover, :focus-visible),
html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav :is(a, button).is-active {
  border-color: var(--citizen-ui-border);
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
  transform: none;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav :is(a, button) .bpw-icon {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  padding: 4px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: var(--citizen-ui-primary-soft) !important;
  box-shadow: none !important;
  color: var(--citizen-ui-primary) !important;
  --icon-ink: currentColor;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav :is(.citizen-desktop-account, .citizen-desktop-signout) {
  border-color: var(--citizen-ui-border-strong);
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-top:not(.citizen-portal-top--mobile-app) .citizen-desktop-nav
:is(.citizen-desktop-account, .citizen-desktop-signout) .bpw-icon {
  background: var(--citizen-ui-primary) !important;
  color: var(--bims-on-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-notification-toggle {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-surface) !important;
  color: var(--citizen-ui-primary) !important;
}

/* Shared interior canvas ------------------------------------------------- */

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-hero-panel, .citizen-access-hero, .citizen-ask-intro) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 22px;
  padding: clamp(34px, 4vw, 54px);
  border: 1px solid var(--citizen-ui-border) !important;
  border-radius: 26px;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--citizen-ui-surface) 96%, transparent), color-mix(in srgb, var(--citizen-ui-primary-soft) 78%, var(--citizen-ui-surface))),
    var(--citizen-ui-surface) !important;
  box-shadow: 0 22px 60px var(--bims-shadow) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-hero-panel, .citizen-access-hero, .citizen-ask-intro)::before {
  position: absolute;
  z-index: -1;
  top: -15rem;
  right: -9rem;
  width: 34rem;
  height: 34rem;
  border: 1px solid color-mix(in srgb, var(--citizen-ui-primary) 18%, transparent);
  border-radius: 50%;
  background: color-mix(in srgb, var(--citizen-ui-primary) 7%, transparent);
  content: "";
  pointer-events: none;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-hero-panel, .citizen-access-hero, .citizen-ask-intro) :is(h1, h2) {
  max-width: 980px;
  margin-top: 0;
  margin-bottom: 10px;
  color: var(--citizen-ui-text-strong) !important;
  font-size: clamp(2rem, 3.2vw, 3.45rem);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -.045em;
  text-wrap: balance;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-hero-panel, .citizen-access-hero, .citizen-ask-intro) p {
  max-width: 890px;
  margin: 0;
  color: var(--citizen-ui-muted) !important;
  font-size: clamp(.93rem, 1.25vw, 1.08rem);
  line-height: 1.62;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.eyebrow {
  color: var(--citizen-ui-primary-strong) !important;
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-hero-actions {
  align-items: center;
  gap: 10px;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-service-card, .citizen-action-card, .tracking-order-card, .request-history-group,
    .citizen-ask-assistant, .citizen-access-card, .citizen-access-aside) {
  border: 1px solid var(--citizen-ui-border) !important;
  border-radius: 20px;
  background: var(--citizen-ui-surface) !important;
  box-shadow: 0 16px 40px var(--bims-shadow) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-service-card, .citizen-action-card, .tracking-order-card, .citizen-ask-assistant,
    .citizen-access-card) :is(h2, h3, h4, strong, b, dt) {
  color: var(--citizen-ui-text-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-service-card, .citizen-action-card, .tracking-order-card, .citizen-ask-assistant,
    .citizen-access-card) :is(p, small, dd, .muted, .form-help-text) {
  color: var(--citizen-ui-muted) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.dashboard-panel-header {
  align-items: center;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--citizen-ui-border);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.dashboard-panel-header :is(h2, h3) {
  color: var(--citizen-ui-text-strong) !important;
  letter-spacing: -.02em;
}

/* Controls and actions --------------------------------------------------- */

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  min-height: 48px;
  border: 1px solid var(--citizen-ui-border-strong) !important;
  border-radius: 12px !important;
  background: var(--citizen-ui-surface-soft) !important;
  box-shadow: none !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
textarea {
  min-height: 132px;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(input, select, textarea)::placeholder {
  color: color-mix(in srgb, var(--citizen-ui-muted) 78%, transparent) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(input, select, textarea):focus {
  border-color: var(--citizen-ui-primary) !important;
  outline: 3px solid color-mix(in srgb, var(--bims-focus) 28%, transparent) !important;
  outline-offset: 1px;
  background: var(--citizen-ui-surface) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.field-title {
  color: var(--citizen-ui-text-strong) !important;
  font-size: .76rem;
  font-weight: 780;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.field-title .bpw-icon {
  color: var(--citizen-ui-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.btn.primary, .btn-primary, .btn.btn-primary) {
  border-color: var(--citizen-ui-primary) !important;
  background: linear-gradient(135deg, var(--citizen-ui-primary), var(--citizen-ui-primary-strong)) !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--citizen-ui-primary) 20%, transparent) !important;
  color: var(--bims-on-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.btn.primary, .btn-primary, .btn.btn-primary):is(:hover, :focus-visible) {
  background: linear-gradient(135deg, var(--bims-primary-hover), var(--citizen-ui-primary-strong)) !important;
  color: var(--bims-on-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.btn-light, .btn.ghost, .btn.secondary, .btn:not(.primary):not(.btn-primary):not(.danger):not(.btn-danger)) {
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-surface-soft) !important;
  box-shadow: none !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.btn-light, .btn.ghost, .btn.secondary, .btn:not(.primary):not(.btn-primary):not(.danger):not(.btn-danger)):is(:hover, :focus-visible) {
  border-color: var(--citizen-ui-primary) !important;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.alert, .alert-warning) {
  border-color: color-mix(in srgb, var(--citizen-ui-accent) 34%, var(--citizen-ui-border)) !important;
  border-radius: 14px;
  background: color-mix(in srgb, var(--citizen-ui-accent-soft) 68%, var(--citizen-ui-surface)) !important;
  color: var(--citizen-ui-text) !important;
  box-shadow: 0 10px 24px var(--bims-shadow);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.alert-danger {
  border-color: color-mix(in srgb, var(--ui-danger) 40%, var(--citizen-ui-border)) !important;
  background: color-mix(in srgb, var(--ui-danger-soft) 72%, var(--citizen-ui-surface)) !important;
  color: var(--ui-danger) !important;
}

/* Login and registration ------------------------------------------------ */

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-hero {
  min-height: 230px;
  align-items: center;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-hero-mark {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 1px solid var(--citizen-ui-border-strong);
  border-radius: 18px;
  background: var(--citizen-ui-surface) !important;
  color: var(--citizen-ui-primary) !important;
  box-shadow: 0 14px 32px var(--bims-shadow);
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-layout {
  grid-template-columns: minmax(300px, .68fr) minmax(0, 1.52fr);
  align-items: stretch;
  gap: 18px;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-aside,
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-card {
  padding: clamp(26px, 3vw, 40px);
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-aside {
  background: linear-gradient(150deg, var(--citizen-ui-surface), var(--citizen-ui-primary-soft)) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-aside-icon,
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-card-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 13px;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-aside :is(h2, p, li),
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-overline,
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-step,
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-section-title {
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-aside h2,
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-card h2 {
  color: var(--citizen-ui-text-strong) !important;
  letter-spacing: -.03em;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-aside > p:not(.citizen-access-overline),
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-card-head p,
html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-field small {
  color: var(--citizen-ui-muted) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-benefits li {
  border-top-color: var(--citizen-ui-border) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-benefits .bpw-icon {
  color: var(--citizen-ui-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-form-section {
  padding: 20px;
  border: 1px solid var(--citizen-ui-border);
  border-radius: 15px;
  background: var(--citizen-ui-surface-soft);
}

html[data-bims-theme][data-citizen-theme]
body.citizen-access-body .citizen-access-form-actions {
  gap: 9px;
}

/* Complaint and service/document workflows ------------------------------ */

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-flow-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 22px;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-flow-strip article {
  min-height: 142px;
  padding: 18px;
  border: 1px solid var(--citizen-ui-border) !important;
  border-radius: 16px;
  background: var(--citizen-ui-surface) !important;
  box-shadow: 0 12px 30px var(--bims-shadow) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-flow-strip article > span:first-child {
  border-color: var(--citizen-ui-border-strong) !important;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-flow-strip article :is(b, h2, h3) {
  color: var(--citizen-ui-text-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-flow-strip article :is(p, small) {
  color: var(--citizen-ui-muted) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-service-grid-single > .public-service-card,
html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.public-complaint-form > .public-service-card {
  padding: clamp(24px, 3vw, 38px);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-location-panel, .public-combo-panel) {
  border: 1px solid var(--citizen-ui-border) !important;
  border-radius: 12px;
  background: var(--citizen-ui-surface) !important;
  box-shadow: 0 16px 34px var(--bims-shadow) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-location-panel, .public-combo-panel) button {
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-surface) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-location-panel, .public-combo-panel) button:is(:hover, :focus-visible, .active) {
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.dc-wizard-progress, .dc-service-summary, .dc-step-heading, .dc-session-grid > *,
    .dc-payment-grid .dc-choice, .dc-review-grid > *, .citizen-service-status-grid > *) {
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-surface-soft) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.dc-wizard-progress .is-active,
html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.dc-choice:has(input:checked) {
  border-color: var(--citizen-ui-primary) !important;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.dc-wizard-actions {
  position: sticky;
  z-index: 12;
  bottom: 14px;
  gap: 10px;
  padding: 13px;
  border: 1px solid var(--citizen-ui-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--citizen-ui-surface) 94%, transparent);
  box-shadow: 0 16px 38px var(--bims-shadow);
  backdrop-filter: blur(16px);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.public-consent, .checkbox-row) {
  border-color: var(--citizen-ui-border) !important;
  border-radius: 14px;
  background: var(--citizen-ui-surface-soft) !important;
  color: var(--citizen-ui-text) !important;
}

/* My Requests ------------------------------------------------------------ */

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.request-history-group {
  padding: 22px;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.request-history-group-head {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--citizen-ui-border);
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.request-history-group-head > span,
html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-action-icon {
  border: 0 !important;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.request-history-group-head > b,
html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.tracking-status-stack, .status-badge, .badge) {
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.citizen-mobile-request-section, .citizen-request-detail-copy, .citizen-service-next-action,
    .tracking-latest-note, .tracking-update-history article) {
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-surface-soft) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.citizen-mobile-request-section, .citizen-request-detail-copy, .citizen-service-next-action,
    .tracking-latest-note, .tracking-update-history article) :is(p, small) {
  color: var(--citizen-ui-muted) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.tracking-progress-meter, .citizen-progress) {
  background: var(--citizen-ui-surface-inset) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.tracking-progress-meter, .citizen-progress) > span {
  background: linear-gradient(90deg, var(--citizen-ui-primary), var(--citizen-ui-accent)) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
.citizen-portal-empty {
  min-height: 150px;
  border: 1px dashed var(--citizen-ui-border-strong) !important;
  border-radius: 16px;
  background: var(--citizen-ui-surface-soft) !important;
  color: var(--citizen-ui-muted) !important;
}

html[data-bims-theme][data-citizen-theme]
body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
:is(.citizen-request-detail-modal, .citizen-info-modal, .citizen-feature-detail-modal) {
  border-color: var(--citizen-ui-border) !important;
  background: var(--citizen-ui-surface) !important;
  color: var(--citizen-ui-text) !important;
}

/* Ask MyDasma ------------------------------------------------------------ */

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-shell {
  width: min(1320px, calc(100% - 48px));
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-intro {
  min-height: 220px;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-intro-icon,
html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-head-icon,
html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-message-icon {
  border: 0 !important;
  background: var(--citizen-ui-primary-soft) !important;
  color: var(--citizen-ui-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-status,
html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-online {
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-assistant {
  max-width: 1080px;
  margin-inline: auto;
  padding: clamp(24px, 3vw, 38px);
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-message {
  border: 1px solid var(--citizen-ui-border) !important;
  border-radius: 15px;
  background: var(--citizen-ui-surface-soft) !important;
  color: var(--citizen-ui-text) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-message :is(p, small) {
  color: var(--citizen-ui-muted) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page [data-citizen-ask-suggestion] {
  border-color: var(--citizen-ui-border) !important;
  border-radius: 12px;
  background: var(--citizen-ui-surface-soft) !important;
  color: var(--citizen-ui-primary-strong) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page [data-citizen-ask-suggestion]:is(:hover, :focus-visible) {
  border-color: var(--citizen-ui-primary) !important;
  background: var(--citizen-ui-primary-soft) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-composer {
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid var(--citizen-ui-border);
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-send {
  border-color: var(--citizen-ui-primary) !important;
  background: linear-gradient(135deg, var(--citizen-ui-primary), var(--citizen-ui-primary-strong)) !important;
  color: var(--bims-on-primary) !important;
}

html[data-bims-theme][data-citizen-theme]
body.citizen-ask-page .citizen-ask-disclaimer {
  color: var(--citizen-ui-muted) !important;
}

/* Desktop adaptation. The server/client mobile guard still owns the APK
   redirect; these rules only keep intermediate and zoomed desktop layouts
   orderly while that navigation is taking place. */

@media (max-width: 1240px) {
  html[data-bims-theme][data-citizen-theme]
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
  > main.public-service-shell {
    width: min(100% - 32px, 1180px);
  }

  html[data-bims-theme][data-citizen-theme]
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
  .citizen-portal-top .public-brand {
    flex-basis: 245px;
    max-width: 245px;
  }

  html[data-bims-theme][data-citizen-theme]
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
  .public-flow-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html[data-bims-theme][data-citizen-theme]
  body.citizen-access-body .citizen-access-layout {
    grid-template-columns: minmax(260px, .62fr) minmax(0, 1.38fr);
  }
}

@media (max-width: 1024px) {
  html[data-bims-theme][data-citizen-theme]
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
  > main.public-service-shell {
    width: min(100% - 24px, 940px);
    padding-top: 12px;
  }

  html[data-bims-theme][data-citizen-theme]
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
  :is(.public-hero-panel, .citizen-access-hero, .citizen-ask-intro) {
    padding: 28px;
  }

  html[data-bims-theme][data-citizen-theme]
  body.citizen-access-body .citizen-access-layout {
    grid-template-columns: 1fr;
  }

  html[data-bims-theme][data-citizen-theme]
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page)
  .public-flow-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page) *,
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page) *::before,
  body.public-service-body:not(.mydasma-body):not(.citizen-portal-home-page) *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}