/* OPAC (katalogbuku) skin - reuses :root variables already defined in
   ../css/umid-modern-portal.css (loaded just before this file). */
body{ font-family:'Inter','Segoe UI',Arial,sans-serif; background:var(--umid-bg,#f4f7fb); }
h1,h2,h3,h4,.carousel-caption h2{ font-family:'Plus Jakarta Sans','Segoe UI',Arial,sans-serif; }

/* navbar re-skin - keeps Bootstrap's own markup/JS (collapse, dropdown),
   just repaints it so it matches the new navy/orange brand. */
.navbar.navbar-default{
  background: linear-gradient(90deg, var(--umid-navy-dark) 0%, var(--umid-navy) 55%, var(--umid-navy-mid) 100%) !important;
  border:none !important; box-shadow:0 4px 20px rgba(0,30,70,.18);
}
.navbar-default .navbar-brand{ color:#fff !important; font-weight:800; display:flex; align-items:center; height:auto; padding-top:10px; }
.navbar-default .navbar-brand img{ height:54px; margin-right:12px; }
.navbar-default .navbar-nav > li > a{ color:#e3edf9 !important; font-weight:600; font-size:13.5px; }
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > .active > a{ background:rgba(255,255,255,.14) !important; color:#fff !important; border-radius:30px; }
.navbar-default .navbar-nav .dropdown-menu{ border:none; border-radius:12px; box-shadow:0 16px 36px rgba(0,20,60,.22); padding:8px; }
.navbar-default .navbar-nav .dropdown-menu > li > a{ border-radius:8px; font-size:13px; font-weight:600; color:var(--umid-navy-dark,#00306b) !important; }
.navbar-default .navbar-nav .dropdown-menu > li > a:hover{ background:#f0f5fb !important; }
.navbar-default .navbar-toggle .icon-bar{ background:#fff; }
.navbar-default .navbar-toggle{ border-color:rgba(255,255,255,.3); }

/* hero (replaces the stock-photo carousel) */
.umid-opac-hero{
  position:relative; overflow:hidden; text-align:center;
  background: linear-gradient(155deg, var(--umid-navy-dark) 0%, var(--umid-navy) 55%, var(--umid-navy-mid) 100%);
  padding:110px 20px 70px; margin:-20px -15px 0;
}
.umid-opac-hero .hero-blob-1{ position:absolute; top:-90px; left:-60px; width:300px; height:300px; border-radius:50%; background:var(--umid-orange,#ff8c01); opacity:.18; filter:blur(70px); pointer-events:none; }
.umid-opac-hero .hero-blob-2{ position:absolute; bottom:-90px; right:-60px; width:320px; height:320px; border-radius:50%; background:#4dc4ff; opacity:.16; filter:blur(80px); pointer-events:none; }
.umid-opac-hero .hero-pattern{ position:absolute; inset:0; opacity:.1; background-image:radial-gradient(circle,#fff 1.5px,transparent 1.5px); background-size:26px 26px; pointer-events:none; }
.umid-opac-hero h2{ position:relative; z-index:1; color:#fff; font-weight:800; font-size:30px; margin:0; text-shadow:0 2px 12px rgba(0,0,0,.15); }
.umid-opac-hero-sub{ position:relative; z-index:1; color:#ffd9ad; font-weight:600; font-size:14.5px; max-width:640px; margin:10px auto 0; }

.umid-opac-search{
  position:relative; z-index:2; max-width:760px; margin:24px auto 30px; background:#fff;
  border-radius:20px; box-shadow:0 16px 40px rgba(0,30,80,.18); padding:24px 28px 10px;
}
.umid-opac-search .form-group{ margin-bottom:14px; }
.umid-opac-search label{ font-weight:700; color:var(--umid-navy-dark,#00306b); font-size:12.5px; text-transform:uppercase; letter-spacing:.4px; }
.umid-opac-search .form-control{ border-radius:10px; border:1px solid #e3eaf3; padding:10px 14px; height:auto; }
.umid-opac-search .btn-primary{
  background: linear-gradient(120deg,var(--umid-navy,#0055b1),var(--umid-orange,#ff8c01)); border:none; border-radius:30px;
  padding:10px 24px; font-weight:700;
}
.umid-opac-search .btn-default{ border-radius:30px; font-weight:700; padding:10px 20px; }

footer.footer{ background:var(--umid-navy-dark,#00306b) !important; color:#dbe8f8; }
footer.footer p{ margin:4px 0; color:#dbe8f8; }
footer.py-4.bg-grey-darkest{ background: linear-gradient(120deg, var(--umid-navy-dark,#00306b), var(--umid-navy,#0055b1)) !important; }
footer.py-4.bg-grey-darkest h3,
footer.py-4.bg-grey-darkest h4{ color:#fff !important; }
footer.py-4.bg-grey-darkest p,
footer.py-4.bg-grey-darkest li,
footer.py-4.bg-grey-darkest b{ color:#dbe8f8 !important; }
footer.py-4.bg-grey-darkest a,
footer.py-4.bg-grey-darkest a.text-light{ color:#ffd9ad !important; text-decoration:none; }
footer.py-4.bg-grey-darkest a:hover{ color:#fff !important; text-decoration:underline; }
footer.py-4.bg-grey-darkest hr{ border-color:rgba(255,255,255,.25) !important; }
footer .btn-outline-success{ border-color:rgba(255,255,255,.5) !important; color:#fff !important; }
footer .btn-outline-success:hover{ background:var(--umid-orange,#ff8c01) !important; border-color:var(--umid-orange,#ff8c01) !important; color:#fff !important; }

@media (max-width:600px){
  .umid-opac-hero{ padding:90px 16px 60px; }
  .umid-opac-hero h2{ font-size:22px; }
  .umid-opac-search{ margin-top:-24px; padding:16px; }
}

/* ---- language switcher (Google Website Translator - the same engine
   umindonesia.ac.id's GTranslate plugin wraps) ---- */
.umid-lang-switch{ padding-top:14px; }
.umid-lang-switch .goog-te-gadget{ font-size:0 !important; }
.umid-lang-switch .goog-te-gadget .goog-te-combo{
  font-size:12.5px !important; font-weight:600; border-radius:20px; border:1px solid rgba(255,255,255,.4) !important;
  background:rgba(255,255,255,.1) !important; color:#fff !important; padding:5px 10px !important;
}
.umid-lang-switch .goog-te-gadget .goog-te-combo option{ color:#1c2733; }
.goog-te-banner-frame{ display:none !important; }
body{ top:0 !important; }
