/* Shared Back Office presentation. Use the existing palette layer so legacy
   important utility colors cannot separate button text from its background. */
@layer govtech {
  html body :is(#systemsSection, #backofficePage) .bo-logo-frame {
    width: 88px !important;
    height: 88px !important;
    max-width: 100%;
    flex-shrink: 0;
    overflow: hidden;
  }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image {
    width: calc((100% - 12px) * var(--bo-logo-scale, 1)) !important;
    height: calc((100% - 12px) * var(--bo-logo-scale, 1)) !important;
    max-width: none !important;
    padding: 0 !important;
    object-fit: contain;
    flex-shrink: 0;
  }
  /* Display the visible emblem at the same size as the Mae Suek logo.
     Original images include different amounts of blank space; preserve their files
     and aspect ratios, and let the frame hide only the excess blank canvas. */
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_326b6deed13a30c283bb37feccadada3.png"] { --bo-logo-scale: 2.105615; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_43a2514155dff60b4049e9ae38d5b0e8.png"] { --bo-logo-scale: 2.090246; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_e7de9d79bb56112f14f945d3a3cb8df0.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_1c103632c93a73e54d78efa890625830.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_c2694bbb16996b3b93bf7e76d066fa2a.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_37efe1aa03b9a3f1bba1eb6d0e9d77f8.png"] { --bo-logo-scale: 2.090246; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_1819eff39a158b649fa2c29b1ae25245.png"] { --bo-logo-scale: 1.019088; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_3c88ccf28f3df825bc2e028950d42eb9.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_584927e58fff69d4bf97a8b34e544aa8.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_51008c2e1bcda846ab30a7fa649b8850.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_16658c43dd137ac97d78541bb41a5c00.png"] { --bo-logo-scale: 2.137042; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_cddd318924399edb348b40130be93855.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_2e39a32983580f3addb8604247de59b5.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_d507df768e76900f80c6f5c1259a95c8.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_2afbb668d6da266806a515aa3909bca4.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_c2dbe98ca5d0e457aad4365861982dd1.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_f6bda756ba7d1c984d9cae8825f36722.png"] { --bo-logo-scale: 2.137042; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_3b71edf6cd6f935f07d05e04fad2d2dd.png"] { --bo-logo-scale: 1.507177; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_eadb7010558a3044dc5b6f43458f0839.png"] { --bo-logo-scale: 2.075099; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_211cbbec8965d756d54892254cf3623d.png"] { --bo-logo-scale: 0.990878; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_e3ca7b2cb42bcb872a64e235eab83351.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_3fdd500c38b7b6d1285428be0ef582b2.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_de68a0ec6f343d75f6afce5ccd814c62.png"] { --bo-logo-scale: 2.169421; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_342a7c62c2327e62cfe44d0ce3e82ddc.png"] { --bo-logo-scale: 2.105615; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_bb0805318123c78bdbb7d0598d1cf25d.png"] { --bo-logo-scale: 2.060170; }
  html body :is(#systemsSection, #backofficePage) .bo-logo-image[src*="/bo_7b88d1a30881aa2a892d6469ffb09a86.png"] { --bo-logo-scale: 2.060170; }
  @media (min-width: 640px) {
    html body :is(#systemsSection, #backofficePage) .bo-logo-frame { width: 112px !important; height: 112px !important; }
  }
  @media (min-width: 768px) {
    html body :is(#systemsSection, #backofficePage) .bo-logo-frame { width: 120px !important; height: 120px !important; }
  }

  html body :is(#systemsSection, #backofficePage) :is(.idx-system-card, .system-card) h3 {
    color: var(--site-ink, #0f172a) !important;
    -webkit-text-fill-color: currentColor !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-system-card, .system-card):is(:hover, :focus-visible) h3 {
    color: var(--site-accent, #237d38) !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-open-app, .bo-open-app, .bo-back-link, .idx-filter-btn, .sys-filter-btn) {
    background: var(--site-soft, #edf7ee) !important;
    color: var(--site-accent, #237d38) !important;
    border-color: var(--site-soft-border, #cfe5d3) !important;
    -webkit-text-fill-color: currentColor !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-filter-btn, .sys-filter-btn, .bo-back-link) {
    background: var(--site-surface, #fff) !important;
    color: var(--site-ink, #0f172a) !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-filter-btn, .sys-filter-btn):is(:hover, :focus-visible) {
    background: var(--site-soft, #edf7ee) !important;
    color: var(--site-accent, #237d38) !important;
    border-color: var(--site-accent, #237d38) !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-filter-btn, .sys-filter-btn)[aria-pressed="true"],
  html body #systemsSection .idx-view-all {
    background: var(--site-button, #237d38) !important;
    color: #fff !important;
    border-color: var(--site-button, #237d38) !important;
    -webkit-text-fill-color: currentColor !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-system-card, .system-card):is(:hover, :focus-visible, :active) :is(.idx-open-app, .bo-open-app),
  html body :is(#systemsSection, #backofficePage) :is(.idx-view-all, .bo-back-link):is(:hover, :focus-visible, :active),
  html body :is(#systemsSection, #backofficePage) :is(.idx-filter-btn, .sys-filter-btn)[aria-pressed="true"]:is(:hover, :focus-visible) {
    background: color-mix(in srgb, var(--site-button, #237d38) 80%, #000) !important;
    color: #fff !important;
    border-color: var(--site-button, #237d38) !important;
    -webkit-text-fill-color: currentColor !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-view-all, .idx-open-app, .bo-open-app, .bo-back-link) *,
  html body :is(#systemsSection, #backofficePage) :is(.idx-view-all, .idx-open-app, .bo-open-app, .bo-back-link) i::before {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
  }
  html body :is(#systemsSection, #backofficePage) :is(.idx-view-all, .idx-system-card, .system-card, .bo-back-link, .idx-filter-btn, .sys-filter-btn):focus-visible {
    outline: 3px solid var(--site-accent, #237d38) !important;
    outline-offset: 3px !important;
  }
}