/* GPANSOR public header polish patch.
   File ini sengaja dipisah dari app.css agar tidak mengganggu scroll halaman admin. */

body.public-body{
  --public-header-offset:136px;
  min-height:100vh !important;
  height:auto !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  background:linear-gradient(180deg,#f3f7f5 0%,#eef4f0 100%) !important;
}

.public-shell{
  width:100% !important;
  max-width:1180px !important;
  margin:0 auto !important;
  overflow:visible !important;
}

.public-header-clean{
  box-sizing:border-box !important;
}

.public-header-clean .public-brand-wrap,
.public-header-clean .public-title-copy,
.public-header-clean .public-header-actions{
  min-width:0 !important;
}

.public-header-clean .public-header-actions .btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.public-header-clean .public-brand{
  color:#0b3c2d !important;
}

.public-header-clean .public-sub{
  color:#0f6a4b !important;
}

.public-header-clean .public-desc{
  color:#64748b !important;
}

@media (min-width:901px){
  .public-shell{
    padding:18px 22px 32px !important;
  }
  .public-header-clean{
    position:sticky !important;
    top:0 !important;
    z-index:90 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
    margin:0 0 18px !important;
    padding:14px 16px !important;
    border-radius:24px !important;
    background:rgba(244,250,247,.94) !important;
    border:1px solid rgba(15,106,75,.10) !important;
    box-shadow:0 12px 30px rgba(8,42,32,.08) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
  }
  .public-header-clean .public-brand-wrap{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
  }
  .public-header-clean .brand-mark.large{
    width:52px !important;
    height:52px !important;
    border-radius:18px !important;
    flex:0 0 auto !important;
  }
  .public-header-clean .public-brand{
    font-size:28px !important;
    line-height:1.05 !important;
    letter-spacing:-.03em !important;
  }
  .public-header-clean .public-sub{
    font-size:16px !important;
    line-height:1.1 !important;
  }
  .public-header-clean .public-desc{
    font-size:14px !important;
    line-height:1.2 !important;
    max-width:520px !important;
  }
  .public-header-clean .public-header-actions{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    flex-wrap:nowrap !important;
    gap:8px !important;
    flex:0 0 auto !important;
  }
  .public-header-clean .public-header-actions .btn{
    min-height:42px !important;
    padding:10px 14px !important;
    border-radius:15px !important;
    font-size:14px !important;
    max-width:132px !important;
  }
}

@media (max-width:900px){
  /* Ruang atas sesuai tinggi header fixed. Tidak menambah ruang kosong di bawah halaman public. */
  .public-shell{
    max-width:100vw !important;
    padding:calc(var(--public-header-offset,136px) + env(safe-area-inset-top,0px)) 12px 24px !important;
  }

  .public-header-clean{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    z-index:220 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
    margin:0 !important;
    padding:calc(9px + env(safe-area-inset-top,0px)) 12px 10px !important;
    min-height:calc(104px + env(safe-area-inset-top,0px)) !important;
    background:rgba(244,250,247,.97) !important;
    border-radius:0 0 22px 22px !important;
    border-bottom:1px solid rgba(15,106,75,.10) !important;
    box-shadow:0 12px 28px rgba(8,42,32,.10) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
    overflow:hidden !important;
  }

  .public-header-clean .public-brand-wrap{
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    width:100% !important;
  }

  .public-header-clean .brand-mark.large{
    width:44px !important;
    height:44px !important;
    border-radius:16px !important;
    font-size:18px !important;
    flex:0 0 auto !important;
  }

  .public-header-clean .public-brand{
    font-size:22px !important;
    line-height:1.02 !important;
    letter-spacing:-.03em !important;
    margin:0 !important;
  }

  .public-header-clean .public-sub{
    font-size:14px !important;
    line-height:1.08 !important;
    margin:1px 0 0 !important;
  }

  .public-header-clean .public-desc{
    display:none !important;
  }

  .public-header-clean .public-header-actions{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:7px !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
  }

  .public-header-clean .public-header-actions .btn{
    width:100% !important;
    min-width:0 !important;
    min-height:36px !important;
    height:36px !important;
    padding:0 8px !important;
    border-radius:13px !important;
    font-size:12px !important;
    font-weight:800 !important;
    letter-spacing:-.01em !important;
    box-shadow:none !important;
  }

  .public-header-clean .public-header-actions .btn.light{
    background:#eaf7ef !important;
    color:#0b3c2d !important;
    border:1px solid rgba(15,106,75,.08) !important;
  }

  .public-header-clean .public-header-actions .btn.primary{
    background:#0f6a4b !important;
    color:#fff !important;
    border:1px solid #0f6a4b !important;
  }

  .public-main{
    display:grid !important;
    gap:16px !important;
    min-height:0 !important;
    height:auto !important;
    overflow:visible !important;
    padding-top:4px !important;
    padding-right:0 !important;
    padding-bottom:0 !important;
    padding-left:0 !important;
  }

  .public-hero{
    scroll-margin-top:calc(var(--public-header-offset,136px) + 18px) !important;
    margin-top:0 !important;
    border-radius:26px !important;
    max-width:100% !important;
    overflow:hidden !important;
  }

  .public-hero h1{
    font-size:clamp(30px,9vw,44px) !important;
    line-height:1.08 !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
  }

  .public-hero-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
    width:100% !important;
  }

  .public-hero-actions .btn{
    width:100% !important;
    min-width:0 !important;
    text-align:center !important;
  }

  .public-info-grid,
  .public-data-grid,
  .public-cards{
    grid-template-columns:1fr !important;
    max-width:100% !important;
  }
}

@media (max-width:380px){
  .public-shell{
    padding-top:calc(var(--public-header-offset,136px) + env(safe-area-inset-top,0px)) !important;
  }
  .public-header-clean{
    min-height:calc(102px + env(safe-area-inset-top,0px)) !important;
  }
  .public-header-clean .public-header-actions .btn{
    font-size:11px !important;
    padding:0 6px !important;
  }
  .public-header-clean .public-brand{font-size:20px !important;}
  .public-header-clean .public-sub{font-size:13px !important;}
}
