/* Portal UI v54.16 — presentational only. No changes to inputs, rules, or requests. */
/* Use each form's inherited description font, not a newly loaded font. */
body.portal-service-form .form-aside h1,
body.portal-service-form .permit-selector h1,
body.portal-simple-form .hero > h1,
body.portal-calendar #calendarSubmissionForm .submission-form-head h2 {
  font-family:inherit !important;
  text-transform:uppercase !important;
  font-weight:800 !important;
  font-size:clamp(26px,2.3vw,32px) !important;
  line-height:1.22 !important;
  letter-spacing:.015em !important;
  text-align:left !important;
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}
/* Keep the prior justified instructions and leave all input values alone. */

/* Dashboard copyright occupies new space below the existing announcement. */
body.portal-dashboard-desktop #app.canvas {height:977px !important;}
body.portal-dashboard-desktop #app > .shell {height:936px !important;}
body.portal-dashboard-desktop #app .announcement {bottom:50px !important;}
.portal-copyright {color:var(--muted,#536a65);font-family:inherit;font-size:12.5px;line-height:1.6;text-align:center;}
.portal-copyright p {margin:0;}
body.portal-dashboard-desktop #app .portal-copyright {
  position:absolute;left:42px;right:42px;bottom:8px;
  min-height:26px;display:grid;align-items:center;z-index:2;
}

/* Reuse the existing Area Hijau notice in dashboard aliases as well. */
body.portal-dashboard-desktop .monitor-link-notice,
body.portal-dashboard-mobile .monitor-link-notice {
  max-width:420px;width:calc(100% - 32px);padding:24px;border:1px solid rgba(255,255,255,.75);
  border-radius:23px;background:rgba(245,251,248,.94);color:var(--ink,#12322e);
  box-shadow:0 22px 60px rgba(20,51,45,.2);backdrop-filter:blur(18px);font:inherit;
}
body.portal-dashboard-desktop .monitor-link-notice::backdrop,
body.portal-dashboard-mobile .monitor-link-notice::backdrop {background:rgba(18,50,46,.22);backdrop-filter:blur(3px);}
body.portal-dashboard-desktop .monitor-link-notice h2,
body.portal-dashboard-mobile .monitor-link-notice h2 {margin:0 0 12px;font-family:inherit;font-size:23px;}
body.portal-dashboard-desktop .monitor-link-notice p,
body.portal-dashboard-mobile .monitor-link-notice p {margin:0 0 20px;line-height:1.6;font-size:14px;color:var(--muted,#536a65);}
body.portal-dashboard-desktop .monitor-link-notice button,
body.portal-dashboard-mobile .monitor-link-notice button {min-height:42px;border:0;border-radius:12px;background:var(--green,#3d8b72);color:white;padding:0 20px;font:inherit;font-weight:700;cursor:pointer;}
/* Removing the text also removes its reserved width beside the logo. */
body.portal-dashboard-desktop #app .topbar .brand {width:212px;flex:0 0 212px;gap:0;}
body.portal-dashboard-desktop #app .topbar .brand img {width:178px;max-width:100%;height:auto;}
body.portal-dashboard-desktop #app .topbar .nav {min-width:0;}

/* The same card component as the Layanan menu, shared by all three menus. */
body.portal-dashboard-desktop #app .dropdown.service-menu {
  width:340px;min-width:340px;padding:10px;gap:8px;
  border:1px solid rgba(255,255,255,.68);
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  box-shadow:0 24px 54px rgba(18,50,46,.17);
  max-height:710px;overflow-y:auto;overscroll-behavior:contain;
}
body.portal-dashboard-desktop #app .dropdown.service-menu a.service-menu-item,
body.portal-dashboard-mobile #mobileMenuSheet .mobile-menu-section a.service-menu-item {
  display:grid;grid-template-columns:44px minmax(0,1fr) 18px;
  align-items:center;gap:12px;min-height:72px;padding:11px 12px;
  border:1px solid rgba(22,55,49,.08);border-radius:15px;
  background:rgba(255,255,255,.62);color:var(--ink,#12322e);text-decoration:none;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
body.portal-dashboard-desktop #app .dropdown.service-menu a.service-menu-item:hover,
body.portal-dashboard-mobile #mobileMenuSheet .mobile-menu-section a.service-menu-item:hover {
  transform:translateY(-1px);background:rgba(245,251,248,.92);
  border-color:rgba(47,143,117,.18);box-shadow:0 10px 22px rgba(18,50,46,.08);
}
body.portal-dashboard-desktop #app .dropdown.service-menu a.service-menu-item:focus-visible,
body.portal-dashboard-mobile #mobileMenuSheet a.service-menu-item:focus-visible,
body.portal-dashboard-desktop #app .nav-item:focus-visible {
  outline:3px solid rgba(47,143,117,.55);outline-offset:2px;
}
body.portal-dashboard-desktop .service-menu-icon,
body.portal-dashboard-mobile .service-menu-icon {
  width:44px;height:44px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(145deg,#dcefea,#f7fbf9);color:#2f806e;
  box-shadow:inset 0 0 0 1px rgba(47,128,110,.10);
}
body.portal-dashboard-desktop .service-menu-icon.lost-icon,
body.portal-dashboard-mobile .service-menu-icon.lost-icon {
  background:linear-gradient(145deg,#fff1cf,#fffaf0);color:#a77725;
  box-shadow:inset 0 0 0 1px rgba(167,119,37,.10);
}
body.portal-dashboard-desktop .service-menu-icon svg,
body.portal-dashboard-mobile .service-menu-icon svg {
  width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
}
body.portal-dashboard-desktop .service-menu-copy,
body.portal-dashboard-mobile .service-menu-copy {display:block;min-width:0;}
body.portal-dashboard-desktop .service-menu-copy strong,
body.portal-dashboard-mobile .service-menu-copy strong {display:block;font-size:13.5px;line-height:1.2;}
body.portal-dashboard-desktop .service-menu-copy small,
body.portal-dashboard-mobile .service-menu-copy small {display:block;margin-top:5px;color:#647770;font-size:11px;line-height:1.35;font-weight:650;}
body.portal-dashboard-desktop .service-menu-arrow,
body.portal-dashboard-mobile .service-menu-arrow {font-size:23px;line-height:1;color:#5d7e73;justify-self:end;}
body.portal-dashboard-mobile #mobileMenuSheet .service-menu-item::after {display:none;}
body.portal-dashboard-mobile #mobileMenuSheet .service-menu-item + .service-menu-item {margin-top:8px;}
body.portal-dashboard-mobile .topbar .logo {margin-right:auto;}
body.portal-dashboard-mobile .portal-copyright {
  margin-top:14px;padding:14px 4px 5px;border-top:1px solid rgba(22,55,49,.10);
  font-size:11px;line-height:1.7;text-wrap:balance;
}
@media (max-width:600px) {
  body.portal-service-form .form-aside h1,
  body.portal-service-form .permit-selector h1,
  body.portal-simple-form .hero > h1,
  body.portal-calendar #calendarSubmissionForm .submission-form-head h2 {
    font-size:26px !important;line-height:1.25 !important;letter-spacing:.01em !important;
  }
  body.portal-dashboard-mobile #mobileMenuSheet .mobile-menu-section a.service-menu-item {
    grid-template-columns:40px minmax(0,1fr) 14px;gap:10px;
  }
  body.portal-dashboard-mobile .service-menu-icon {width:40px;height:40px;border-radius:13px;}
}
@media (prefers-reduced-motion:reduce) {
  body.portal-dashboard-desktop .dropdown.service-menu a.service-menu-item,
  body.portal-dashboard-mobile #mobileMenuSheet a.service-menu-item {transition:none;}
}
