/* ============================================================
   WDS CUSTOM - INTI (token, font, mode gelap)
   ------------------------------------------------------------
   Pecahan dari wds-custom.css. File ini hanya dimuat di
   SEMUA halaman WeddingSaaS.
   Lihat wds-custom-loader.php bagian 3 untuk aturan pemuatan.
   ============================================================ */

/* ============================================================
   WDS CUSTOM STYLE
   ------------------------------------------------------------
   Semua kustomisasi tampilan WeddingSaaS ditulis di sini.

   ATURAN EMAS (supaya tidak pernah error / bentrok):
   1. JANGAN pernah tulis kode warna langsung (#ff0000).
      Selalu pakai var(--bs-primary) dsb, supaya warna
      tetap mengikuti Pengaturan WDS.
   2. Selalu awali class buatan sendiri dengan "wdsc-".
   3. Setiap perubahan warna, cek juga versi gelap
      (lihat BAGIAN 4 - Mode Gelap).
   ============================================================ */


/* ============================================================
   BAGIAN 1 - TOKEN / PENGATURAN DASAR
   ------------------------------------------------------------
   Ubah angka di sini untuk mengubah tampilan secara global.
   Ini seperti "panel pengaturan" mini milik Anda sendiri.
   ============================================================ */

:root {
	/* ---------- FONT BRAND ANDA ----------
	   Plugin bawaan memakai "Inter".
	   Ganti nama font di bawah ini dengan font brand Anda.

	   PENTING: kalau memakai Google Fonts, aktifkan juga
	   baris @import di BAGIAN 2 di bawah.
	*/
	--wdsc-font: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;

	/* Font khusus judul (boleh sama dengan di atas) */
	--wdsc-font-heading: var(--wdsc-font);

	/* Kelengkungan sudut */
	--wdsc-radius-sm: 10px;
	--wdsc-radius: 14px;
	--wdsc-radius-lg: 20px;

	/* Bayangan */
	--wdsc-shadow-sm: 0 2px 8px rgba(18, 22, 33, .05);
	--wdsc-shadow: 0 8px 24px rgba(18, 22, 33, .07);
	--wdsc-shadow-lg: 0 24px 60px rgba(18, 22, 33, .10);

	/* Jarak antar elemen */
	--wdsc-gap: 1.25rem;

	/* Kecepatan animasi */
	--wdsc-speed: .22s;

	/* Warna teks di atas panel brand (panel kiri login) */
	--wdsc-on-brand: #ffffff;

	/* ---------- WARNA HALAMAN LOGIN ----------
	   Dipakai untuk latar kolom isian dan garis tepi kartu. */
	--wdsc-auth-surface: #f4f5fa;
	--wdsc-auth-line: rgba(20, 24, 40, .09);
	--wdsc-auth-card: rgba(255, 255, 255, .96);
}

/* Versi mode gelap dari token di atas */
[data-bs-theme="dark"] {
	--wdsc-auth-surface: #0b0c12;
	--wdsc-auth-line: rgba(255, 255, 255, .09);
	--wdsc-auth-card: rgba(20, 22, 31, .96);
	--wdsc-shadow-sm: 0 2px 8px rgba(0, 0, 0, .30);
	--wdsc-shadow: 0 8px 24px rgba(0, 0, 0, .38);
	--wdsc-shadow-lg: 0 24px 60px rgba(0, 0, 0, .50);
}


/* ============================================================
   BAGIAN 2 - IMPOR FONT BRAND (OPSIONAL)
   ------------------------------------------------------------
   Kalau font brand Anda dari Google Fonts, hapus tanda
   pembuka & penutup komentar pada baris @import di bawah,
   lalu ganti nama fontnya.

   Contoh untuk font "Plus Jakarta Sans":
   ============================================================ */

/*
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");
*/


/* ============================================================
   BAGIAN 3 - PENERAPAN FONT
   ------------------------------------------------------------
   Aktif otomatis. Font diambil dari --wdsc-font di BAGIAN 1.
   ============================================================ */

#kt_body,
#kt_body .btn,
#kt_body .form-control,
#kt_body .menu,
.wdsc-auth {
	font-family: var(--wdsc-font);
}

#kt_body h1,
#kt_body h2,
#kt_body h3,
.wdsc-auth h1,
.wdsc-auth h2 {
	font-family: var(--wdsc-font-heading);
}


/* ============================================================
   BAGIAN 4 - MODE GELAP (DARK MODE)
   ------------------------------------------------------------
   Plugin mendukung mode gelap. Setiap kali Anda menambah
   gaya baru di atas, cek apakah perlu penyesuaian di sini.
   ============================================================ */