/* MiladReg Compact UI
   Membuat halaman admin dan publik lebih kecil, rapi, dan muat di layar tanpa mengubah alur/fungsi. */
@media screen {
    html { font-size: 14px; }
    body { font-size: 0.92rem; }

    /* Admin layout */
    .admin-sidebar.md\:w-72 { width: 15.5rem !important; }
    main.md\:ml-72 { margin-left: 15.5rem !important; }
    .brand-area,
    .topbar { height: 52px !important; }
    .brand-area { padding-left: 1rem !important; padding-right: 1rem !important; }
    .brand-mark { width: 34px !important; height: 23px !important; border-width: 3px !important; }
    .brand-area .text-xl { font-size: 1rem !important; line-height: 1.1 !important; }
    .navlink { padding: .58rem .78rem !important; gap: .6rem !important; font-size: .78rem !important; }
    .navlink .nav-icon { width: 20px !important; }
    .top-icon { width: 30px !important; height: 30px !important; }
    .page-head { padding: .75rem 1rem !important; }
    .page-head h1 { font-size: 1.35rem !important; }
    .mobile-pad { padding: 1rem !important; max-width: 1360px !important; }

    /* Cards, panels, forms */
    .page-section,
    .panel-body { padding: .9rem !important; }
    .panel-head { padding: .75rem .9rem !important; }
    main .p-4 { padding: .75rem !important; }
    main .p-5, main .p-6, main .p-7, main .p-8 { padding: .9rem !important; }
    main .px-6 { padding-left: 1rem !important; padding-right: 1rem !important; }
    main .py-6 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
    main .gap-6 { gap: 1rem !important; }
    main .gap-5 { gap: .85rem !important; }
    main .mb-6 { margin-bottom: 1rem !important; }
    main .mt-6 { margin-top: 1rem !important; }
    .btn,
    main a[class*="bg-"],
    main button[class*="bg-"] { padding: .5rem .75rem !important; font-size: .78rem !important; border-radius: .32rem !important; }
    .form-input,
    .form-select,
    .form-textarea,
    main input:not([type="checkbox"]):not([type="radio"]),
    main select,
    main textarea { min-height: 36px !important; padding: .55rem .7rem !important; font-size: .86rem !important; }
    table.final-table th,
    main table:not(.final-table) th { padding: .62rem .75rem !important; font-size: .70rem !important; }
    table.final-table td,
    main table:not(.final-table) td { padding: .65rem .75rem !important; }
    .badge { padding: .18rem .5rem !important; font-size: .68rem !important; }
    .metric-card { min-height: 96px !important; padding: .95rem !important; }
    .metric-card .metric-icon { font-size: 2.4rem !important; right: .9rem !important; top: 1rem !important; }

    /* Standalone public pages */
    body.min-h-screen { padding: .75rem !important; }
    .max-w-xl { max-width: 30rem !important; }
    .max-w-2xl { max-width: 38rem !important; }
    .max-w-3xl { max-width: 46rem !important; }
    .max-w-4xl { max-width: 58rem !important; }
    .max-w-5xl { max-width: 66rem !important; }
    .max-w-6xl, .max-w-7xl { max-width: 76rem !important; }
    .rounded-\[2rem\] { border-radius: 1.35rem !important; }
    .rounded-\[2\.5rem\] { border-radius: 1.55rem !important; }
    .rounded-3xl { border-radius: 1.1rem !important; }
    .rounded-2xl { border-radius: .9rem !important; }
    .shadow-2xl { box-shadow: 0 14px 36px rgba(15,23,42,.14) !important; }

    .p-7 { padding: 1.05rem !important; }
    .p-6 { padding: 1rem !important; }
    .p-5 { padding: .9rem !important; }
    .p-4 { padding: .75rem !important; }
    .px-7 { padding-left: 1.1rem !important; padding-right: 1.1rem !important; }
    .py-7 { padding-top: 1.1rem !important; padding-bottom: 1.1rem !important; }
    .mt-7, .my-7 { margin-top: 1rem !important; }
    .mb-7, .my-7 { margin-bottom: 1rem !important; }
    .mt-6, .my-6 { margin-top: .9rem !important; }
    .mb-6, .my-6 { margin-bottom: .9rem !important; }
    .mt-5 { margin-top: .8rem !important; }
    .gap-5 { gap: .75rem !important; }
    .gap-4 { gap: .65rem !important; }

    .text-5xl { font-size: 2.25rem !important; line-height: 1.05 !important; }
    .text-4xl { font-size: 1.95rem !important; line-height: 1.08 !important; }
    .text-3xl { font-size: 1.55rem !important; line-height: 1.15 !important; }
    .text-2xl { font-size: 1.25rem !important; line-height: 1.2 !important; }
    .text-xl { font-size: 1.05rem !important; line-height: 1.25 !important; }
    .text-lg { font-size: .98rem !important; }
    .text-sm { font-size: .80rem !important; }
    .text-xs { font-size: .70rem !important; }

    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea { min-height: 36px !important; padding: .55rem .7rem !important; font-size: .86rem !important; }
    button,
    a.inline-flex,
    .public-btn { padding: .55rem .85rem !important; font-size: .86rem !important; }

    /* QR pada kartu publik dibuat cukup besar untuk discan, tetapi tidak terlalu memakan layar */
    .qr-download-area svg,
    .qr-download-area img,
    .qr-box svg,
    .qr-box img { width: 180px !important; height: 180px !important; max-width: 42vw !important; max-height: 42vw !important; }

    /* QR kecil pada tabel/list */
    table svg, table img[src*="qr"], .table-wrap svg { max-width: 96px !important; height: auto !important; }
}

@media screen and (max-width: 768px) {
    html { font-size: 13px; }
    .admin-sidebar.md\:w-72 { width: 100% !important; }
    main.md\:ml-72 { margin-left: 0 !important; }
    .topbar .text-3xl { font-size: 1.25rem !important; }
    .topbar .font-black.text-lg { font-size: .95rem !important; }
    .page-head h1 { font-size: 1.15rem !important; }
    .mobile-pad { padding: .75rem !important; }
    body.min-h-screen { padding: .5rem !important; align-items: flex-start !important; }
    .max-w-xl { max-width: 100% !important; }
    .qr-download-area svg,
    .qr-download-area img,
    .qr-box svg,
    .qr-box img { width: 165px !important; height: 165px !important; max-width: 60vw !important; max-height: 60vw !important; }
}