/* =========================================================
   BUMIL KU — SHARED PUBLIC DESKTOP FOOTER
   Version: V1 INDEX-SAFE — Public / Pre-login
   =========================================================

   ARSITEKTUR:
   - Footer publik berdiri sendiri.
   - Tidak menggunakan CSS/footer pasien.
   - Tidak memiliki sidebar safe-area 216px.
   - Dapat dipakai pada index, login, dan halaman publik lain.

   VISUAL:
   - Karakter footer desktop index dipertahankan:
     teal raised surface, RSAB + PSE, divider formal.
   - Menu/submenu disamakan dengan footer pasien.
   - Link menu regular / tidak bold.
   - Hover underline putih tumbuh dari kiri ke kanan.
   - Vertical rhythm mengikuti patient footer V8:
     desktop gap 8px; compact laptop gap 5px.

   RESPONSIVE SAFETY:
   - Hanya tampil >=980px.
   - <=979px tidak menyentuh footer mobile/tablet existing.
   ========================================================= */

.publicDesktopFooter{
  display:none;
}

.publicDesktopFooter,
.publicDesktopFooter *,
.publicDesktopFooter *::before,
.publicDesktopFooter *::after{
  box-sizing:border-box;
}

@media (min-width:980px){

  /* =======================================================
     ROOT FOOTER
     -------------------------------------------------------
     Pada index, footer berada sebagai child dari desktop
     .phoneScreen grid dan mengambil seluruh kolom row footer.
     Pada halaman publik lain, grid placement ini harmless.
     ======================================================= */
  .publicDesktopFooter{
    position:relative !important;
    z-index:2 !important;
    isolation:isolate !important;

    grid-column:1 / -1 !important;
    grid-row:4 !important;

    display:block !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:58px clamp(34px,5vw,88px) 34px !important;

    overflow:hidden !important;

    border:1px solid rgba(208,255,249,.18) !important;
    border-left:0 !important;
    border-right:0 !important;
    border-radius:0 !important;

    background:
      radial-gradient(
        ellipse at 48% -12%,
        rgba(255,255,255,.125) 0%,
        rgba(255,255,255,.042) 35%,
        rgba(255,255,255,0) 64%
      ),
      linear-gradient(
        180deg,
        #1aa69e 0%,
        #129a93 30%,
        #0b8b85 62%,
        #087b76 100%
      ) !important;

    box-shadow:
      0 5px 8px rgba(2,69,65,.22),
      0 17px 26px rgba(2,72,68,.31),
      0 38px 58px rgba(2,68,64,.20),
      inset 0 3px 0 rgba(190,255,247,.42),
      inset 0 8px 18px rgba(255,255,255,.055),
      inset 0 -8px 0 rgba(0,73,68,.07),
      inset 0 -24px 34px rgba(0,57,53,.16),
      inset 1px 0 0 rgba(255,255,255,.045),
      inset -1px 0 0 rgba(0,65,61,.08) !important;

    transform:translate3d(0,0,0) !important;
  }

  .publicDesktopFooter::before{
    content:"" !important;

    position:absolute !important;
    z-index:0 !important;

    top:0 !important;
    right:0 !important;
    left:0 !important;

    height:5px !important;

    pointer-events:none !important;

    background:linear-gradient(
      180deg,
      rgba(184,255,247,.62) 0%,
      rgba(128,235,225,.34) 42%,
      rgba(255,255,255,0) 100%
    ) !important;

    box-shadow:
      0 1px 0 rgba(255,255,255,.16),
      0 5px 10px rgba(0,77,72,.09) !important;
  }

  .publicDesktopFooter::after{
    content:"" !important;

    position:absolute !important;
    z-index:0 !important;

    right:0 !important;
    bottom:0 !important;
    left:0 !important;

    height:18px !important;

    pointer-events:none !important;

    background:linear-gradient(
      180deg,
      rgba(0,74,69,0) 0%,
      rgba(0,68,63,.05) 34%,
      rgba(0,58,54,.18) 100%
    ) !important;

    box-shadow:
      inset 0 -1px 0 rgba(0,47,44,.13) !important;
  }

  .publicDesktopFooter > *{
    position:relative !important;
    z-index:2 !important;
  }

  /* =======================================================
     CONTENT LAYOUT — PUBLIC, TANPA SIDEBAR OFFSET
     ======================================================= */
  .publicDesktopFooterMain{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;

    display:grid !important;

    grid-template-columns:
      minmax(360px,1.55fr)
      repeat(4,minmax(155px,.82fr)) !important;

    gap:0 !important;

    align-items:stretch !important;
  }

  /* =======================================================
     BRAND
     ======================================================= */
  .publicDesktopFooterBrand{
    min-width:0 !important;
    padding:0 34px 0 0 !important;
  }

  .publicDesktopFooterBrandLockup{
    display:flex !important;
    align-items:center !important;

    gap:16px !important;
  }

  .publicDesktopFooterLogoShadow{
    width:70px !important;
    min-width:70px !important;
    height:70px !important;

    display:grid !important;
    place-items:center !important;

    filter:
      drop-shadow(0 4px 5px rgba(0,65,61,.17))
      drop-shadow(0 11px 17px rgba(0,57,54,.11)) !important;
  }

  .publicDesktopFooterLogoShadow img{
    width:66px !important;
    height:66px !important;

    display:block !important;

    object-fit:contain !important;
  }

  .publicDesktopFooterBrandLockup > span:last-child{
    display:flex !important;
    flex-direction:column !important;
  }

  .publicDesktopFooterBrandLockup strong{
    color:#ffffff !important;

    background:none !important;

    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    -webkit-text-fill-color:#ffffff !important;

    font-size:34px !important;
    line-height:1 !important;
    font-weight:800 !important;

    letter-spacing:-.038em !important;

    text-shadow:
      0 2px 3px rgba(0,61,57,.14) !important;
  }

  .publicDesktopFooterBrandLockup small{
    margin-top:7px !important;

    color:rgba(255,255,255,.91) !important;

    font-size:16px !important;
    line-height:1.22 !important;
    font-weight:650 !important;
  }

  .publicDesktopFooterBrand > p{
    max-width:390px !important;

    margin:27px 0 0 !important;

    color:rgba(255,255,255,.91) !important;

    font-size:15.5px !important;
    line-height:1.62 !important;
    font-weight:500 !important;
  }

  /* =======================================================
     MENU COLUMNS
     ======================================================= */
  .publicDesktopFooterColumn{
    position:relative !important;

    min-width:0 !important;

    padding:0 24px 0 30px !important;

    display:flex !important;
    flex-direction:column !important;

    gap:8px !important;
  }

  .publicDesktopFooterColumn::before{
    content:"" !important;

    position:absolute !important;

    top:0 !important;
    bottom:0 !important;
    left:0 !important;

    width:1px !important;

    background:linear-gradient(
      180deg,
      rgba(255,255,255,.08) 0%,
      rgba(255,255,255,.24) 16%,
      rgba(255,255,255,.24) 84%,
      rgba(255,255,255,.08) 100%
    ) !important;

    pointer-events:none !important;
  }

  .publicDesktopFooterColumn > strong{
    margin:0 0 6px !important;

    color:#ffffff !important;

    font-size:17px !important;
    line-height:1.2 !important;
    font-weight:800 !important;

    letter-spacing:-.015em !important;

    text-shadow:
      0 1px 2px rgba(0,61,57,.13) !important;
  }

  /* =======================================================
     MENU LINKS — MATCH PATIENT FOOTER V8
     ======================================================= */
  .publicDesktopFooterColumn a{
    position:relative !important;

    width:fit-content !important;

    color:rgba(255,255,255,.92) !important;

    font-size:15.5px !important;
    line-height:1.34 !important;
    font-weight:400 !important;

    text-decoration:none !important;
  }

  .publicDesktopFooterColumn a::after{
    content:"" !important;

    position:absolute !important;

    left:0 !important;
    right:auto !important;
    bottom:-4px !important;

    width:0 !important;
    height:1.5px !important;

    background:#ffffff !important;

    border-radius:999px !important;

    pointer-events:none !important;

    transition:
      width .28s cubic-bezier(.22,.72,.26,1) !important;
  }

  .publicDesktopFooterColumn a:hover{
    color:#ffffff !important;
    transform:none !important;
  }

  .publicDesktopFooterColumn a:hover::after,
  .publicDesktopFooterColumn a:focus-visible::after{
    width:100% !important;
  }

  .publicDesktopFooterColumn a:focus-visible{
    outline:2px solid rgba(255,255,255,.90) !important;
    outline-offset:4px !important;

    border-radius:4px !important;
  }

  /* =======================================================
     RSAB + PSE
     ======================================================= */
  .publicDesktopFooterInstitution{
    width:fit-content !important;
    max-width:100% !important;

    margin-top:26px !important;

    display:flex !important;

    align-items:flex-end !important;
    justify-content:flex-start !important;

    gap:15px !important;
  }

  .publicDesktopFooterInstitutionIdentity{
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;

    align-items:flex-start !important;
    justify-content:center !important;

    gap:10px !important;

    flex:0 0 auto !important;
  }

  .publicDesktopFooterInstitutionLabel{
    display:block !important;

    margin:0 !important;

    color:#ffffff !important;

    font-size:15px !important;
    line-height:1 !important;
    font-weight:800 !important;

    letter-spacing:0 !important;

    white-space:nowrap !important;

    text-shadow:
      0 1px 2px rgba(0,60,56,.14) !important;
  }

  .publicDesktopFooterInstitutionLogo{
    display:block !important;

    width:auto !important;
    height:50px !important;

    max-width:196px !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:contain !important;
    object-position:left center !important;

    filter:
      drop-shadow(0 3px 5px rgba(0,59,55,.13)) !important;

    flex:0 0 auto !important;
  }

  .publicDesktopFooterInstitutionDivider{
    width:1px !important;
    min-width:1px !important;
    height:58px !important;

    display:block !important;

    background:rgba(255,255,255,.27) !important;

    border-radius:999px !important;

    flex:0 0 1px !important;
  }

  .publicDesktopFooterPseSurface{
    min-width:0 !important;
    height:60px !important;

    padding:5px 10px !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    background:rgba(255,255,255,.98) !important;

    border:1px solid rgba(255,255,255,.92) !important;
    border-radius:12px !important;

    box-shadow:
      0 8px 17px rgba(0,66,62,.13),
      inset 0 1px 0 rgba(255,255,255,1) !important;

    overflow:hidden !important;

    flex:0 1 auto !important;
  }

  .publicDesktopFooterPseLogo{
    display:block !important;

    width:auto !important;
    height:46px !important;

    max-width:180px !important;

    object-fit:contain !important;
    object-position:center !important;
  }

  /* =======================================================
     TRUST BADGE
     ======================================================= */
  .publicDesktopFooterStatus{
    width:fit-content !important;

    min-height:52px !important;

    margin-top:20px !important;
    margin-bottom:0 !important;

    padding:0 20px !important;

    display:inline-flex !important;

    flex-direction:row !important;

    align-items:center !important;
    justify-content:center !important;

    gap:10px !important;

    color:#087f78 !important;
    background:#ffffff !important;

    border:1px solid rgba(255,255,255,.94) !important;
    border-radius:999px !important;

    box-shadow:
      0 8px 14px rgba(0,61,57,.13),
      0 14px 23px rgba(0,61,57,.08),
      inset 0 1px 0 rgba(255,255,255,1) !important;

    font-size:14px !important;
    line-height:1 !important;
    font-weight:800 !important;

    white-space:nowrap !important;
  }

  .publicDesktopFooterStatus i{
    color:#0e9382 !important;
    font-size:16px !important;
  }

  .publicDesktopFooterStatus > span{
    display:inline !important;
  }

  /* =======================================================
     BOTTOM ROW
     ======================================================= */
  .publicDesktopFooterBottom{
    width:100% !important;
    max-width:none !important;

    margin:38px 0 0 !important;

    padding:26px 0 0 !important;

    display:flex !important;

    align-items:center !important;
    justify-content:space-between !important;

    gap:24px !important;

    color:rgba(255,255,255,.93) !important;

    border-top:1px solid rgba(255,255,255,.23) !important;

    font-size:15px !important;
    line-height:1.30 !important;
    font-weight:520 !important;
  }

  .publicDesktopFooterSupport{
    display:inline-flex !important;

    align-items:center !important;

    gap:11px !important;

    color:rgba(255,255,255,.94) !important;

    font-size:15px !important;
    line-height:1.30 !important;
    font-weight:520 !important;
  }

  .publicDesktopFooterSupport i{
    color:#ffffff !important;
    font-size:18px !important;
  }

  /* =======================================================
     DARK MODE
     ======================================================= */
  html[data-theme="dark"] .publicDesktopFooter{
    background:
      radial-gradient(
        ellipse at 48% -12%,
        rgba(255,255,255,.04),
        transparent 58%
      ),
      linear-gradient(
        180deg,
        #08746e 0%,
        #076862 42%,
        #05534f 100%
      ) !important;

    border-color:rgba(255,255,255,.075) !important;

    box-shadow:
      0 5px 8px rgba(0,0,0,.24),
      0 17px 26px rgba(0,0,0,.33),
      0 38px 58px rgba(0,0,0,.24),
      inset 0 3px 0 rgba(255,255,255,.07),
      inset 0 -24px 34px rgba(0,0,0,.22) !important;
  }

  html[data-theme="dark"] .publicDesktopFooter::before{
    background:linear-gradient(
      180deg,
      rgba(255,255,255,.10) 0%,
      rgba(255,255,255,.035) 42%,
      rgba(255,255,255,0) 100%
    ) !important;
  }

  html[data-theme="dark"]
  .publicDesktopFooterColumn::before{
    background:linear-gradient(
      180deg,
      rgba(255,255,255,.025) 0%,
      rgba(255,255,255,.12) 16%,
      rgba(255,255,255,.12) 84%,
      rgba(255,255,255,.025) 100%
    ) !important;
  }

  html[data-theme="dark"]
  .publicDesktopFooterBrandLockup strong,
  html[data-theme="dark"]
  .publicDesktopFooterColumn > strong,
  html[data-theme="dark"]
  .publicDesktopFooterInstitutionLabel{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
  }

  html[data-theme="dark"]
  .publicDesktopFooterBrandLockup small,
  html[data-theme="dark"]
  .publicDesktopFooterBrand > p,
  html[data-theme="dark"]
  .publicDesktopFooterColumn a,
  html[data-theme="dark"]
  .publicDesktopFooterBottom,
  html[data-theme="dark"]
  .publicDesktopFooterSupport{
    color:rgba(255,255,255,.84) !important;
  }

  html[data-theme="dark"]
  .publicDesktopFooterStatus{
    color:#087f78 !important;

    background:#ffffff !important;

    border-color:rgba(255,255,255,.90) !important;
  }
}

/* =========================================================
   COMPACT LAPTOP 980–1159
   ---------------------------------------------------------
   Public index mempunyai lebar penuh tanpa sidebar.
   Grid dibuat 3-column flow agar empat kolom menu tidak
   tertekan pada laptop sempit.
   ========================================================= */
@media (min-width:980px) and (max-width:1159px){

  .publicDesktopFooter{
    padding:42px 24px 26px !important;
  }

  .publicDesktopFooterMain{
    grid-template-columns:
      minmax(250px,1.25fr)
      repeat(2,minmax(150px,.82fr)) !important;

    gap:24px 0 !important;
  }

  .publicDesktopFooterBrand{
    padding-right:22px !important;
  }

  .publicDesktopFooterColumn{
    padding-left:22px !important;
    padding-right:14px !important;

    gap:5px !important;
  }

  .publicDesktopFooterColumn:nth-of-type(4),
  .publicDesktopFooterColumn:nth-of-type(5){
    margin-top:8px !important;
  }

  .publicDesktopFooterLogoShadow{
    width:56px !important;
    min-width:56px !important;
    height:56px !important;
  }

  .publicDesktopFooterLogoShadow img{
    width:52px !important;
    height:52px !important;
  }

  .publicDesktopFooterBrandLockup strong{
    font-size:27px !important;
  }

  .publicDesktopFooterBrandLockup small{
    font-size:12.5px !important;
  }

  .publicDesktopFooterBrand > p{
    max-width:320px !important;

    margin-top:18px !important;

    font-size:12px !important;
  }

  .publicDesktopFooterColumn > strong{
    margin-bottom:4px !important;

    font-size:13.5px !important;
  }

  .publicDesktopFooterColumn a{
    font-size:12px !important;
  }

  .publicDesktopFooterInstitution{
    margin-top:18px !important;

    gap:10px !important;
  }

  .publicDesktopFooterInstitutionLabel{
    font-size:11.5px !important;
  }

  .publicDesktopFooterInstitutionLogo{
    height:40px !important;

    max-width:155px !important;
  }

  .publicDesktopFooterInstitutionDivider{
    height:46px !important;
  }

  .publicDesktopFooterPseSurface{
    height:49px !important;

    padding:4px 7px !important;

    border-radius:10px !important;
  }

  .publicDesktopFooterPseLogo{
    height:37px !important;

    max-width:138px !important;
  }

  .publicDesktopFooterStatus{
    min-height:42px !important;

    margin-top:8px !important;

    padding:0 15px !important;

    font-size:11px !important;
  }

  .publicDesktopFooterStatus i{
    font-size:13px !important;
  }

  .publicDesktopFooterBottom,
  .publicDesktopFooterSupport{
    font-size:11.5px !important;
  }

  .publicDesktopFooterBottom{
    margin-top:27px !important;

    padding-top:18px !important;
  }
}

/* =========================================================
   <=979px HARD LOCK
   Footer mobile/tablet existing tetap sepenuhnya dimiliki
   masing-masing halaman publik.
   ========================================================= */
@media (max-width:979px){
  .publicDesktopFooter{
    display:none !important;

    visibility:hidden !important;
    opacity:0 !important;

    pointer-events:none !important;

    width:0 !important;
    height:0 !important;

    min-height:0 !important;
    max-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    box-shadow:none !important;

    overflow:hidden !important;
  }
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  .publicDesktopFooterColumn a::after{
    transition:none !important;
  }
}