/* ===================================================================
   Penyegaran tampilan portal publik nahmus (tpl/newkci) -- 30 Sep 2026, sesi 4E.
   Dimuat PALING AKHIR di semua kerangka publik, sesudah CSS tema & modul.
   Permintaan pemilik: percantik semua halaman & modul portal publik, hijau tetap
   dominan (boleh hijau lain yang lebih bagus). Tidak mengubah susunan halaman.
   Hijau utama: teal #009C87 -> zamrud #0E8A5F (senada hijau logo sekolah);
   aksen emas #D9960B (dari kuning logo) menggantikan oranye.
   =================================================================== */
:root {
  --primary-color: #0e8a5f;
  --hijau-tua: #0a6a49;
  --hijau-muda: #e8f4ee;
  --secondary-color: #3aa874;
  --section-bg-color: #f3f8f5;
  --custom-btn-bg-color: #0e8a5f;
  --custom-btn-bg-hover-color: #0a6a49;
  --link-hover-color: #d9960b;
  --orange-color: #d9960b;
  --border-color: #e2ebe6;
  --emas: #d9960b;
  --bayang-lembut: 0 6px 20px rgba(10, 70, 48, .08);
  --bayang-angkat: 0 12px 28px rgba(10, 70, 48, .14);
}

body { color: #2c3a34; }
p { line-height: 1.7; }
a { transition: color .2s ease; }
::selection { background: var(--primary-color); color: #fff; }

/* ---------- bar atas, navbar ---------- */
.site-header { background: var(--hijau-tua); }
.navbar-nav .nav-link { font-weight: 500; letter-spacing: .01em; }
.navbar-nav .nav-link::after {
  content: ""; position: absolute; left: 50%; right: 50%; bottom: 8px; height: 2px;
  background: var(--emas); transition: left .2s ease, right .2s ease;
}
.navbar-nav .nav-link:hover::after, .navbar-nav .nav-link.active::after { left: 12px; right: 12px; }
.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover { color: #fff; }
.navbar.sticky-wrapper, .is-sticky .navbar, .navbar.fixed-top { background: var(--hijau-tua); }
.dropdown-menu { border: 0; border-radius: 12px; box-shadow: var(--bayang-angkat); padding: 8px; }
.dropdown-item { border-radius: 8px; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--hijau-muda); color: var(--hijau-tua); }

/* ---------- banner beranda & kepala halaman dalam ---------- */
.section-overlay {
  background: linear-gradient(180deg, rgba(10, 106, 73, .55) 0%, rgba(14, 138, 95, .35) 55%, rgba(10, 106, 73, .7) 100%);
  opacity: 1;
}
.banner-section h1 { text-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
.breadcrumb { font-size: 14px; }
.breadcrumb-item.active, .breadcrumb-item a:hover { color: var(--emas); }

/* ---------- profil sekolah ---------- */
.intro-section { padding-top: 28px; padding-bottom: 12px; }
.intro-section h2 { color: var(--hijau-tua); }
.custom-block { border-radius: 16px; background: linear-gradient(135deg, var(--primary-color), var(--hijau-tua)); box-shadow: var(--bayang-lembut); }

/* ---------- kartu & blok modul ---------- */
.custom-block-module, .shadow-sm.custom-block-module {
  border-radius: 16px; box-shadow: var(--bayang-lembut) !important; border: 1px solid var(--border-color);
}
.services-section .shadow-sm, .box-md-mod, .mini-blok-image, .med-block-image, .sm-blok-image { border-radius: 12px; }
.custom-block-module img, .box-md-mod img { border-radius: 12px; }
a .custom-block-module { transition: transform .25s ease, box-shadow .25s ease; }
a:hover .custom-block-module { transform: translateY(-4px); box-shadow: var(--bayang-angkat) !important; }
.services-image-hover { transition: transform .25s ease; }
a:hover .services-image-hover, .services-image-hover:hover { transform: translateY(-4px) scale(1.03); }

/* judul-judul bagian */
.services-section h2, .section-padding h2, main h2 { color: #1f2d27; }
.service-judul-orange, .text-tanggal { color: var(--emas) !important; }
.services-judul, .text-judul { color: var(--hijau-tua); }
a:hover .services-judul { color: var(--primary-color); }

/* ---------- tombol ---------- */
.custom-btn, .btn-primary, .btn-success, .btn-info {
  background: var(--primary-color); border-color: var(--primary-color); color: #fff;
  border-radius: 999px; font-weight: 500; transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.custom-btn:hover, .btn-primary:hover, .btn-success:hover, .btn-info:hover,
.btn-primary:focus, .btn-success:focus, .btn-info:focus {
  background: var(--hijau-tua); border-color: var(--hijau-tua); color: #fff;
  box-shadow: 0 6px 16px rgba(10, 106, 73, .25);
}
.btn-sm { padding: .35rem .95rem; }
.button-39 {
  border-radius: 999px; border: 1.5px solid var(--primary-color); color: var(--primary-color);
  font-family: inherit; background: #fff; padding: .35rem 1.1rem; transition: all .2s ease;
}
.button-39:hover { background: var(--primary-color); color: #fff; }

/* ---------- paging carousel (titik) -> pil ---------- */
.carousel-indicators [data-bs-target] {
  width: 10px; height: 10px; border-radius: 999px; border: 0; margin: 0 4px;
  background-color: var(--primary-color); opacity: .3; transition: width .25s ease, opacity .25s ease;
}
.carousel-indicators .active { width: 28px; opacity: 1; }

/* ---------- agenda: blok tanggal (gaya inline #525252) ---------- */
[style*="background: #525252"], [style*="background:#525252"] {
  background: linear-gradient(160deg, var(--primary-color), var(--hijau-tua)) !important;
  border-radius: 14px; min-width: 88px;
}

/* hijau inline lama (mis. tanggal Jadwal UTBK: style="color: green") -> hijau tema */
[style*="color: green"], [style*="color:green"] { color: var(--primary-color) !important; }

/* ---------- daftar, borang ---------- */
.list-group-item { border-color: var(--border-color); }
.list-group-item-action:hover, .list-group-item-action:focus { background: var(--hijau-muda); color: var(--hijau-tua); }
.form-control, .form-select { border-radius: 10px; border-color: #d6e2dc; }
.form-control:focus, .form-select:focus {
  border-color: var(--primary-color); box-shadow: 0 0 0 .2rem rgba(14, 138, 95, .15);
}
.card { border-radius: 16px; border-color: var(--border-color); }
.rounded-10 { border-radius: 16px !important; }

/* tabel (hasil kelulusan, jadwal, dsb.) */
.table thead th, .table > thead > tr > th { background: var(--hijau-muda); color: var(--hijau-tua); border-bottom-color: var(--border-color); }

/* ---------- footer ---------- */
.site-footer { background: linear-gradient(180deg, var(--primary-color), var(--hijau-tua)); }
.site-footer a:hover { color: #ffe08a; }

/* ---------- gerak dikurangi bila pengguna meminta ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
