/**
 * base.css — Al-Kifayah Theme
 * Reset dan gaya dasar global.
 */

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--ak-sans);
    color: var(--ak-text);
    /* Band konten memakai warna Surface (prototype: .ak-main-section).
       Header, navbar, hero, dan footer punya background sendiri. */
    background-color: var(--ak-surface);
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
    height: auto;
}

button, input, select, textarea {
    font: inherit;
}

a {
    color: var(--ak-primary);
    text-decoration-skip-ink: auto;
}

a:hover,
a:focus {
    color: var(--ak-primary-dark);
}

/* =====================================================================
   UTILITAS AKSESIBILITAS

   .pkp_screen_reader dipakai template OJS untuk teks yang HANYA boleh
   dibaca screen reader (mis. heading "Penulis" di atas daftar penulis,
   label tombol hamburger). Tema ini tidak memuat stylesheet dasar PKP,
   jadi class tersebut harus didefinisikan di sini — tanpa itu semua teks
   tersebut tampil sebagai teks biasa di halaman.
   ===================================================================== */
.pkp_screen_reader,
.pkp_screen_reader span {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Skip link: tampil kembali saat mendapat fokus keyboard */
.pkp_screen_reader:focus,
.pkp_screen_reader:focus-within {
    position: static !important;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
    clip-path: none;
    white-space: normal;
}

/* Focus visible konsisten */
:focus-visible {
    outline: 3px solid var(--ak-gold);
    outline-offset: 2px;
}

/* Heading menggunakan warna primary */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--ak-serif);
    color: var(--ak-text);
}