/* ==========================================================
   Counter Doodle — CRUD page parts
   ========================================================== */

.crud-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-16);
    margin-bottom: var(--space-14);
}

.crud-header h2 {
    margin: 0;
    font-size: var(--font-size-xl);
}

.crud-header p {
    margin-top: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.crud-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-12);
}

.crud-filter .search-box {
    flex: 1 1 var(--search-basis);
    max-width: var(--filter-xl);
    margin: 0;
}

.filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-8);
}

.filter-row select,
.filter-row .form-control {
    width: auto !important;
    min-width: var(--filter-sm);
}

/* form filter (mis. halaman Product) tetap satu baris */
.filter-row form,
.card > div > form[method="GET"] {
    gap: var(--space-8) !important;
}

.empty-state {
    padding: var(--space-28) var(--space-16) var(--space-20);
    text-align: center;
}

.empty-icon {
    font-size: var(--font-size-3xl);
    margin-bottom: var(--space-6);
    opacity: var(--opacity-muted);
}

.empty-state h3 {
    margin: 0;
    font-size: var(--font-size-lg);
}

.empty-state p {
    margin-top: var(--space-4);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

/* header halaman biasa (non-CRUD) */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-16);
    margin-bottom: var(--space-14);
}

.page-header h2 { margin: 0; }

.page-header p {
    margin-top: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

/* form filter khusus (mis. halaman Product) */
.filter-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-14);
    width: 100%;
}

/* tombol aksi di sel tabel */
.table-actions {
    display: flex;
    justify-content: center;
    gap: var(--space-6);
}

/* halaman kosong / tidak punya akses */
.empty-page {
    padding: var(--space-48) var(--space-24);
    text-align: center;
}

.empty-page-icon {
    width: var(--icon-xl);
    height: var(--icon-xl);
    margin: 0 auto;
    stroke: var(--color-text-muted);
    stroke-width: var(--icon-stroke);
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.empty-page-text {
    margin-top: var(--space-8);
    color: var(--color-text-secondary);
}

/* pemberitahuan lembut (warna brand) */
.notice {
    padding: var(--space-16);
    border-radius: var(--radius-md);
    background: var(--color-primary-soft);
    color: var(--color-text);
}

.notice-warning {
    background: var(--color-warning-soft);
    color: var(--color-warning);
}

.notice-danger {
    background: var(--color-danger-soft);
    color: var(--color-danger);
}