/* =========================================================
   e-Pilkades Karawang - Penyesuaian tampilan (mobile first)
   Dimuat lewat config/adminlte.php -> plugins.EpilkadesMobile
   ========================================================= */

/* ---------- Umum ---------- */
.pagination { flex-wrap: wrap; margin-bottom: 0; }
.pagination .page-link { min-width: 38px; text-align: center; }

.detail-list dt { color: #6c757d; font-weight: 500; }
.detail-list dd { font-weight: 600; margin-bottom: .75rem; }

.stat-mini { text-align: center; padding: .75rem .5rem; }
.stat-mini .stat-value { font-size: 1.5rem; font-weight: 700; line-height: 1.2; }
.stat-mini .stat-label { font-size: .8rem; color: #6c757d; }

/* ---------- Daftar versi HP (pengganti tabel) ---------- */
.mobile-list { list-style: none; margin: 0; padding: 0; }
.mobile-list .list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .85rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, .075);
}
.mobile-list .list-item:last-child { border-bottom: 0; }
.mobile-list .item-body { min-width: 0; flex: 1; }
.mobile-list .item-title {
    display: block;
    font-weight: 600;
    font-size: 1rem;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-list .item-meta { font-size: .82rem; color: #6c757d; margin-top: 2px; }
.mobile-list .item-actions { display: flex; gap: .35rem; flex-shrink: 0; }
.mobile-list .item-actions .btn { width: 38px; height: 38px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Tombol tambah melayang (hanya HP) ---------- */
.fab-add {
    position: fixed;
    right: 16px;
    bottom: 72px;              /* di atas footer fixed */
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
    z-index: 1030;
}

/* Kartu filter yang bisa dilipat */
.filter-toggle { cursor: pointer; }
.filter-toggle .fa-chevron-down { transition: transform .2s; }
.filter-toggle.collapsed .fa-chevron-down { transform: rotate(-90deg); }

/* ---------- Tampilan HP (< 768px) ---------- */
@media (max-width: 767.98px) {
    .content-header { padding: .75rem .5rem .25rem; }
    .content-header h1 { font-size: 1.25rem; }
    .content-wrapper > .content { padding: 0 .25rem 5rem; }  /* ruang untuk tombol melayang */

    .card { margin-bottom: .75rem; }
    .card-header { padding: .65rem 1rem; }
    .card-header .card-title { float: none; font-size: 1rem; }
    .card-header .card-tools { float: none; margin: .5rem 0 0; }

    /* Input 16px supaya iPhone tidak zoom otomatis, dan lebih mudah disentuh */
    input.form-control,
    select.form-control,
    input.form-control-sm,
    select.form-control-sm,
    .custom-select {
        font-size: 16px;
        height: calc(2.6rem + 2px);
    }
    textarea.form-control { font-size: 16px; }

    .btn { padding: .5rem .9rem; }
    .btn-sm, .btn-xs { padding: .4rem .7rem; font-size: .9rem; }

    /* Tombol simpan/batal penuh lebar */
    .form-actions .btn { display: block; width: 100%; margin: 0 0 .5rem 0; }

    .alert { font-size: .9rem; }
    .main-footer { font-size: .8rem; padding: .5rem; }

    .modal-dialog { margin: .5rem; }

    /* Kotak ringkasan dashboard 2 kolom */
    .small-box .inner { padding: .6rem; }
    .small-box h3 { font-size: 1.6rem; margin-bottom: .1rem; }
    .small-box p { font-size: .85rem; margin-bottom: .2rem; }
    .small-box .small-box-footer { font-size: .72rem; padding: 4px 2px; }
    .callout { font-size: .9rem; }
}

/* ---- Logo di halaman login ---- */
.login-logo a { display: block; font-size: 1.45rem; }
.login-logo img.epk-auth-logo { display: block; width: 260px; max-width: 78vw; height: auto; margin: 0 auto .4rem; }
.brand-link .brand-image { background: #fff; opacity: 1 !important; }
