/* =========================
   BOOKMARK PAGE
========================= */

.km-simpan-page{

    display:flex;

    flex-direction:column;

    gap:14px;

}

/* =========================
   HEADER
========================= */

.km-simpan-head{

    padding:18px;

}

.km-simpan-title{

    font-size:18px;

    font-weight:800;

    color:#1e293b;

}

.km-simpan-sub{

    margin-top:4px;

    font-size:12px;

    color:#64748b;

}

/* =========================
   LIST
========================= */

.km-simpan-list{

    display:flex;

    flex-direction:column;

    gap:12px;

}

/* ITEM */

.km-simpan-item{

    padding:16px;

    transition:.2s;

}

.km-simpan-item:active{

    transform:scale(.98);

}

/* TITLE */

.km-simpan-judul{

    display:block;

    font-size:14px;

    font-weight:700;

    color:#1e293b;

    text-decoration:none;

    line-height:1.5;

}

/* META */

.km-simpan-meta{

    display:flex;

    flex-wrap:wrap;

    align-items:center;

    gap:6px;

    margin-top:8px;

    font-size:11px;

    color:#94a3b8;

}

/* TAG */

.km-simpan-tag{

    background:#f1f5f9;

    padding:3px 8px;

    border-radius:999px;

    font-weight:700;

    color:#475569;

}

/* ACTION */

.km-simpan-actions{

    display:flex;

    gap:8px;

    margin-top:14px;

}

/* BACA */

.km-btn-baca{

    flex:1;

    background:#1a73e8;

    color:white;

    text-decoration:none;

    text-align:center;

    padding:10px;

    border-radius:12px;

    font-size:13px;

    font-weight:700;

}

/* HAPUS */

.km-btn-hapus{

    width:44px;

    border:none;

    background:#fee2e2;

    color:#ef4444;

    border-radius:12px;

    cursor:pointer;

    font-size:16px;

}

/* =========================
   EMPTY
========================= */

.km-empty-state{

    padding:40px 20px;

    text-align:center;

    color:#94a3b8;

}

/* =========================
   PAGINATION
========================= */

.km-pagination{

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:8px;

    margin-top:8px;

}

/* BTN */

.km-page-btn{

    min-width:40px;

    height:40px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:12px;

    text-decoration:none;

    background:white;

    border:1px solid #e2e8f0;

    color:#1e293b;

    font-size:13px;

    font-weight:700;

}

/* ACTIVE */

.km-page-btn.active{

    background:#1a73e8;

    border-color:#1a73e8;

    color:white;

}