/* ==========================================================================
   Tema OPAC Perpustakaan Poltekkes Kemenkes Yogyakarta — SLiMS 9.8.0
   Warna dari logo Kemenkes Poltekkes Yogyakarta:
     Biru-tosca (dominan) : hero, navbar, Referensi Online, CTA, footer
     Kuning lime          : strip statistik, tombol utama, label
     Hijau                : kartu layanan, Pembaca Teraktif, ikon tertentu
   Warna dipakai terpisah per elemen (tidak dicampur dalam satu gradasi).
   ========================================================================== */
:root {
    --pk-blue: #128a80;       /* biru-tosca Poltekkes */
    --pk-blue-700: #0e6f68;
    --pk-blue-800: #0c5a55;
    --pk-blue-900: #0a4643;
    --pk-blue-50: #e8f5f3;
    --pk-blue-100: #cfeae6;
    --pk-cyan: #18b3c4;
    --pk-lime: #cdd650;       /* kuning lime Poltekkes (dilembutkan) */
    --pk-lime-600: #a8b12f;
    --pk-lime-50: #f8fae2;
    --pk-lime-ink: #353a0d;
    --pk-green: #8bc684;      /* hijau Poltekkes */
    --pk-green-600: #5a9f5a;
    --pk-green-50: #ecf6ea;
    --pk-green-ink: #1f4723;
    --pk-ink: #17302e;
    --pk-muted: #5f7270;
    --pk-line: #e1ebe9;
    --pk-bg: #f5f9f8;

    /* variabel tema dasar (landing.css & lp-envato.css) */
    --lp-primary: var(--pk-blue);
    --lp-primary-600: var(--pk-blue-700);
    --lp-primary-50: var(--pk-blue-50);
    --lp-primary-100: var(--pk-blue-100);
    --lp-deep: var(--pk-blue-800);
    --lp-deeper: var(--pk-blue-900);
    --lp-gold: var(--pk-lime);
    --lp-gold-600: var(--pk-lime-600);
    --lp-gold-50: var(--pk-lime-50);
    --lp-gold-ink: var(--pk-lime-ink);
    --lp-ink: var(--pk-ink);
    --lp-muted: var(--pk-muted);
    --lp-line: var(--pk-line);
    --lp-bg: var(--pk-bg);
    --lp-grad: linear-gradient(135deg, #0e6f68 0%, #128a80 100%);
    --ev-maroon: var(--pk-blue);
    --ev-maroon-700: var(--pk-blue-700);
    --ev-maroon-900: var(--pk-blue-900);
    --ev-maroon-50: var(--pk-blue-50);
    --ev-gold: var(--pk-lime);
    --ev-gold-600: var(--pk-lime-600);
    --ev-gold-50: var(--pk-lime-50);
    --ev-gold-ink: var(--pk-lime-ink);
    --ev-ink: var(--pk-ink);
    --ev-muted: var(--pk-muted);
    --ev-line: var(--pk-line);
    --ev-cream: var(--pk-bg);
    --ev-shadow: 0 2px 4px rgba(23, 48, 46, .04), 0 18px 40px -22px rgba(23, 48, 46, .28);
}
body.pk-body { background: var(--pk-bg) !important; color: var(--pk-ink); }
.pk-body a { color: var(--pk-blue-700); }

/* ---------------------------------------------------------------- navbar */
.lp-nav { background: linear-gradient(180deg, rgba(10, 70, 67, .55), rgba(10, 70, 67, 0)); }
.lp-nav.is-scrolled { background: rgba(12, 90, 85, .95) !important; }
@media (max-width: 991.98px) {
    .lp-nav { background: rgba(12, 90, 85, .97) !important; }
    .lp-nav .navbar-collapse.collapsing, .lp-nav .navbar-collapse.collapse.show { background: var(--pk-blue-900) !important; }
}
.pk-brand-logo { height: 46px !important; width: 46px !important; padding: 5px; border-radius: 12px; background: #fff; object-fit: contain; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .5); }
.lp-brand-name { font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; opacity: .85; }
.pk-brand-sub { display: block !important; font-size: 1rem !important; font-weight: 800 !important; opacity: 1 !important; letter-spacing: -.01em; white-space: nowrap; }
.lp-nav .nav-item.active > .nav-link { background: var(--pk-lime) !important; color: var(--pk-lime-ink) !important; }
.lp-dropdown .dropdown-item:hover, .lp-dropdown .dropdown-item:focus { background: var(--pk-blue-50); color: var(--pk-blue-700); }
.lp-dropdown .dropdown-item:hover .lp-dd-icon { background: var(--pk-blue); color: #fff; }
.lp-dd-icon { background: var(--pk-blue-50); color: var(--pk-blue-700); }
@media (min-width: 992px) and (max-width: 1279.98px) { .pk-brand-sub { font-size: .86rem !important; } }
@media (min-width: 992px) and (max-width: 1199.98px) { .lp-brand-text { display: none !important; } }

/* ---------------------------------------------------------------- hero */
.c-header .mask { background: linear-gradient(180deg, rgba(10, 70, 67, .86) 0%, rgba(14, 111, 104, .72) 55%, rgba(10, 70, 67, .88) 100%) !important; }
.ev-pill-dot { background: var(--pk-lime); }
.pk-hero-title { font-size: clamp(2rem, 4.4vw, 3.5rem) !important; }
.ev-hero-accent { color: #dfe67e !important; }
.ev-hero-curve { fill: var(--pk-bg); }
.lp-body .search .card { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23128a80' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") !important; }
.lp-body .advanced-wraper .btn-primary { background: var(--pk-blue); border-color: var(--pk-blue); }
.lp-body .advanced-wraper .btn-outline-primary { color: var(--pk-blue); border-color: var(--pk-blue); }

/* ---------------------------------------------------------------- tombol */
.ev-btn--maroon { background: var(--pk-blue); box-shadow: 0 14px 28px -14px rgba(18, 138, 128, .8); }
.ev-btn--maroon:hover { background: var(--pk-blue-700); }
.ev-btn--gold { background: var(--pk-lime); color: var(--pk-lime-ink) !important; }
.ev-btn--gold:hover { background: #d9e163; }
.ev-btn--line:hover { border-color: var(--pk-blue); color: var(--pk-blue) !important; }
.ev-kicker { color: var(--pk-blue); }
.ev-kicker--light { color: #dfe67e; }
.ev-checklist li svg { color: var(--pk-green-600); }

/* ---------------------------------------------------------------- layanan */
.ev-service-icon { background: var(--pk-blue-50); color: var(--pk-blue); }
.ev-service:hover .ev-service-icon { background: var(--pk-blue); }
.ev-service::after { background: var(--pk-blue); }
.ev-service-num { color: rgba(18, 138, 128, .1); }
.ev-service-more { color: var(--pk-blue-700); }
.pk-service--green { background: var(--pk-green); }
.pk-service--green .ev-service-icon { background: rgba(255, 255, 255, .92); color: var(--pk-green-600); }
.pk-service--green:hover .ev-service-icon { background: #fff; color: var(--pk-green-600); }
.pk-service--green .ev-service-title { color: var(--pk-green-ink); }
.pk-service--green .ev-service-desc { color: #2f5c33; }
.pk-service--green .ev-service-more { color: var(--pk-green-ink); }
.pk-service--green .ev-service-num { color: rgba(31, 71, 35, .14); }
.pk-service--green::after { background: var(--pk-green-ink); }

/* ---------------------------------------------------------------- tentang */
.ev-collage-sub { border-color: var(--pk-bg); }
.ev-collage-dots { background-image: radial-gradient(var(--pk-blue) 1.6px, transparent 1.7px); }
.pk-badge-accredit { background: var(--pk-lime); color: var(--pk-lime-ink); box-shadow: 0 20px 40px -20px rgba(120, 130, 20, .8); }
.pk-badge-accredit .ev-collage-badge-icon { color: var(--pk-lime-600); }
.pk-badge-accredit strong { font-size: 1.25rem; }

/* ---------------------------------------------------------------- strip statistik (kuning lime) */
.ev-counter-grid { background-color: var(--pk-lime); box-shadow: 0 30px 60px -34px rgba(120, 130, 20, .85); }
.ev-counter-icon { color: var(--pk-lime-600); }
.ev-counter-num { color: var(--pk-lime-ink); }
.ev-counter-label { color: #4c5214; }
.ev-counter-item + .ev-counter-item::before { background: rgba(53, 58, 13, .16); }

/* ---------------------------------------------------------------- referensi online: daftar bernomor */
.pk-refs { position: relative; overflow: hidden; padding: 150px 0 110px; margin-top: -60px; background: linear-gradient(160deg, #0e6f68 0%, #0a4643 100%); clip-path: polygon(0 60px, 100% 0, 100% 100%, 0 100%); }
.pk-refs > .container { position: relative; z-index: 2; }
.pk-refs-intro { position: sticky; top: 110px; }
.pk-refs-title { color: #fff; font-weight: 800; letter-spacing: -.025em; line-height: 1.15; font-size: clamp(1.8rem, 3.4vw, 2.7rem); margin: 0 0 16px; }
.pk-refs-text { color: rgba(255, 255, 255, .78); line-height: 1.75; margin-bottom: 26px; }
.pk-linklist { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255, 255, 255, .14); }
.pk-linklist li { border-bottom: 1px solid rgba(255, 255, 255, .14); }
.pk-linklist a { position: relative; display: flex; align-items: center; gap: 22px; padding: 15px 6px; color: #fff !important; text-decoration: none !important; overflow: hidden; isolation: isolate; }
.pk-linklist a::before { content: ''; position: absolute; inset: 0; background: rgba(255, 255, 255, .07); transform: scaleX(0); transform-origin: left; transition: transform .45s cubic-bezier(.22, .9, .3, 1); z-index: -1; }
.pk-linklist a:hover::before { transform: scaleX(1); }
.pk-linklist-num { font-weight: 800; color: #dfe67e; width: 32px; font-variant-numeric: tabular-nums; }
.pk-linklist-name { flex: 1; font-weight: 700; font-size: 1.04rem; transition: transform .35s cubic-bezier(.22, .9, .3, 1); }
.pk-linklist-name small { display: block; font-weight: 500; font-size: .82rem; color: rgba(255, 255, 255, .58); }
.pk-linklist a:hover .pk-linklist-name { transform: translateX(8px); }
.pk-linklist-go { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .25); display: grid; place-items: center; transition: background .25s, color .25s, transform .35s; }
.pk-linklist a:hover .pk-linklist-go { background: var(--pk-lime); color: var(--pk-lime-ink); border-color: var(--pk-lime); transform: rotate(45deg); }
.pk-logos { margin-top: 70px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.pk-logos-track { display: flex; gap: 22px; width: max-content; animation: pkMarquee 36s linear infinite; }
.pk-logo { width: 120px; height: 70px; border-radius: 16px; background: #fff; display: grid; place-items: center; padding: 10px; }
.pk-logo img { max-width: 100%; max-height: 46px; object-fit: contain; }
@keyframes pkMarquee { to { transform: translateX(-33.333%); } }
@media (max-width: 991.98px) { .pk-refs-intro { position: static; } }
@media (max-width: 575.98px) { .pk-refs { padding: 110px 0 80px; } .pk-linklist a { gap: 14px; } }

/* ---------------------------------------------------------------- koleksi */
.ev-tabs .nav-link.active { background: var(--pk-blue); }
.ev-tabs .nav-link:hover { color: var(--pk-blue); }
.lp-collection .btn-outline-secondary { color: var(--pk-blue-700); }
.lp-collection .btn-outline-secondary:hover { background: var(--pk-blue); border-color: var(--pk-blue); color: #fff; }
.pk-body .spinner-border.text-primary { color: var(--pk-blue) !important; }

/* ---------------------------------------------------------------- pembaca teraktif (hijau) */
.pk-readers { background-color: var(--pk-green) !important; background-image: radial-gradient(rgba(255, 255, 255, .22) 1.3px, transparent 1.4px); }
.pk-readers .ev-title { color: var(--pk-green-ink); }
.pk-readers .ev-kicker--dark { color: var(--pk-green-ink); }
.pk-readers .ev-kicker--dark::before { background: var(--pk-green-ink); }
.pk-readers .ev-text--gold { color: #2f5c33; }
.pk-readers .card { box-shadow: 0 18px 36px -20px rgba(31, 71, 35, .7) !important; }

/* ---------------------------------------------------------------- CTA (biru) */
.ev-cta { background: linear-gradient(160deg, #128a80 0%, #0c5a55 100%) !important; }

/* ---------------------------------------------------------------- kontak: daftar unit layanan */
.pk-contact-card { grid-template-columns: 1fr 1fr; }
.pk-units { list-style: none; padding: 0; margin: 8px 0 26px; display: grid; gap: 14px; }
.pk-units li { display: flex; gap: 14px; align-items: flex-start; font-size: .9rem; color: var(--pk-muted); line-height: 1.55; }
.pk-units strong { display: block; color: var(--pk-ink); font-size: .95rem; }
.pk-units small { display: block; color: var(--pk-blue-700); font-weight: 600; }
.pk-unit-num { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--pk-blue); color: #fff; font-weight: 800; font-size: .85rem; }
.pk-unit-num.is-green { background: var(--pk-green); color: var(--pk-green-ink); }
.ev-contact-map { min-height: 520px; background: var(--pk-blue-50); }
@media (max-width: 991.98px) { .pk-contact-card { grid-template-columns: 1fr; } .ev-contact-map { min-height: 340px; } }

/* ---------------------------------------------------------------- footer profesional */
.pk-footer { position: relative; background: var(--pk-blue-900); color: rgba(255, 255, 255, .72); padding: 0 0 26px; }
.pk-footer::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--pk-lime); }
.pk-footer-strip { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; padding: 46px 0 42px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.pk-footer-strip h3 { color: #fff; font-weight: 800; font-size: 1.45rem; letter-spacing: -.01em; margin: 0 0 4px; }
.pk-footer-strip p { margin: 0; font-size: .9rem; color: rgba(255, 255, 255, .6); }
.pk-footer-search { flex: 0 1 520px; box-sizing: border-box; max-width: 100%; display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 18px; border-radius: 999px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .15); transition: border-color .25s, background .25s; }
.pk-footer-search:focus-within { border-color: var(--pk-lime); background: rgba(255, 255, 255, .1); }
.pk-footer-search svg { color: rgba(255, 255, 255, .5); flex: 0 0 auto; }
.pk-footer-search input { flex: 1; min-width: 0; width: 1px; border: 0; outline: 0; background: transparent; color: #fff; padding: 8px 4px; }
.pk-footer-search input::placeholder { color: rgba(255, 255, 255, .45); }
.pk-footer-search button { flex: 0 0 auto; border: 0; border-radius: 999px; padding: 11px 26px; background: var(--pk-lime); color: var(--pk-lime-ink); font-weight: 800; font-size: .9rem; transition: background .25s; }
.pk-footer-search button:hover { background: #d9e163; }
.pk-footer-cols { padding: 56px 0 30px; }
.pk-footer-col { margin-bottom: 34px; }
.pk-footer-logo-card { display: inline-block; padding: 14px 18px; border-radius: 18px; background: #fff; margin-bottom: 20px; box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .6); }
.pk-footer-logo-card img { height: 54px; width: auto; display: block; }
.pk-footer-about { font-size: .9rem; line-height: 1.75; max-width: 360px; margin-bottom: 22px; }
.pk-footer-about strong { color: #fff; }
.pk-footer-social { display: flex; gap: 10px; }
.pk-footer-social a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .2); color: rgba(255, 255, 255, .85) !important; transition: all .25s; }
.pk-footer-social a:hover { background: var(--pk-lime); border-color: var(--pk-lime); color: var(--pk-lime-ink) !important; transform: translateY(-3px); }
.pk-footer-title { color: #fff; font-size: .8rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; margin: 6px 0 20px; }
.pk-footer-links { list-style: none; padding: 0; margin: 0; }
.pk-footer-links li { margin-bottom: 11px; }
.pk-footer-links a { position: relative; color: rgba(255, 255, 255, .72) !important; font-size: .9rem; text-decoration: none !important; transition: color .2s, padding .25s; }
.pk-footer-links a::before { content: ''; position: absolute; left: 0; top: 50%; width: 0; height: 1.5px; background: var(--pk-green); transition: width .25s; }
.pk-footer-links a:hover { color: #fff !important; padding-left: 16px; }
.pk-footer-links a:hover::before { width: 10px; }
.pk-footer-info { display: flex; gap: 14px; margin-bottom: 18px; font-size: .88rem; line-height: 1.65; }
.pk-footer-info strong { display: block; color: #fff; }
.pk-footer-info small { color: rgba(255, 255, 255, .5); }
.pk-footer-info a { color: #fff !important; }
.pk-footer-info-icon { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .09); color: #fff; }
.pk-footer-info-icon.is-lime { background: var(--pk-lime); color: var(--pk-lime-ink); }
.pk-footer-info-icon.is-green { background: var(--pk-green); color: var(--pk-green-ink); }
.pk-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .83rem; }
.pk-footer-bottom p { margin: 0; }
.pk-footer-legal { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.pk-footer-legal a, .pk-footer-powered a { color: rgba(255, 255, 255, .72) !important; text-decoration: none !important; }
.pk-footer-legal a:hover, .pk-footer-powered a:hover { color: #dfe67e !important; }
.pk-footer-powered { color: rgba(255, 255, 255, .5); }
@media (max-width: 767.98px) {
    .pk-footer-strip { padding: 36px 0 32px; }
    .pk-footer-search { width: 100%; flex-basis: 100%; }
    .pk-footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------------------------------------------------------------- tombol melayang */
.pk-wa { position: fixed; right: 20px; bottom: 22px; z-index: 1035; display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: #22c55e; color: #fff !important; box-shadow: 0 12px 28px -8px rgba(34, 197, 94, .7); transition: transform .2s; }
.pk-wa::before { content: ''; position: absolute; inset: 0; border-radius: 50%; background: #22c55e; animation: pkPulse 2.2s infinite; z-index: -1; }
@keyframes pkPulse { 0% { transform: scale(1); opacity: .6; } 100% { transform: scale(1.7); opacity: 0; } }
.pk-wa:hover { transform: scale(1.06); }
.pk-wa-icon { width: 28px; height: 28px; }
.pk-wa-tip { position: absolute; right: 68px; white-space: nowrap; background: #fff; color: var(--pk-ink); font-size: .82rem; font-weight: 600; padding: 8px 12px; border-radius: 10px; box-shadow: var(--ev-shadow); opacity: 0; transform: translateX(8px); pointer-events: none; transition: all .25s; }
.pk-wa:hover .pk-wa-tip { opacity: 1; transform: none; }
.lp-top { bottom: 90px !important; right: 26px; background: var(--pk-blue) !important; color: #fff !important; }
.lp-top:hover { background: var(--pk-blue-700) !important; }
body:has(#show-pchat2) .pk-wa { bottom: 84px; }
body:has(#show-pchat2) .lp-top { bottom: 152px !important; }

/* halaman dalam */
.result-search .c-header .mask, .member-area .c-header .mask { background: linear-gradient(180deg, rgba(10, 70, 67, .9), rgba(14, 111, 104, .82)) !important; }
.pk-body .btn-primary { background: var(--pk-blue); border-color: var(--pk-blue); }
.pk-body .btn-primary:hover { background: var(--pk-blue-700); border-color: var(--pk-blue-700); }
@media (prefers-reduced-motion: reduce) { .pk-logos-track, .pk-wa::before { animation: none !important; } }

/* Mobile: ringkas chip pencarian populer agar tidak menumpuk ke kotak search */
@media (max-width: 767.98px) {
    .ev-hero-terms-label { display: none !important; }
    .ev-hero-terms .ev-term:nth-of-type(n+4) { display: none; }
}

/* ==== Warna nav & banner dari contoh warna (#119288 → #108b81) ==== */
.lp-nav, .lp-nav.is-scrolled { background: linear-gradient(90deg, #119288 0%, #118f85 50%, #108b81 100%) !important; box-shadow: 0 6px 20px rgba(16, 139, 129, .18); }
@media (max-width: 991.98px) {
    .lp-nav { background: linear-gradient(90deg, #119288 0%, #108b81 100%) !important; }
    .lp-nav .navbar-collapse.collapsing, .lp-nav .navbar-collapse.collapse.show { background: #108b81 !important; }
}
.c-header .mask,
.result-search .c-header .mask, .member-area .c-header .mask { background: linear-gradient(90deg, rgba(17, 146, 136, .93) 0%, rgba(17, 143, 133, .9) 50%, rgba(16, 139, 129, .93) 100%) !important; }