/* Identitas Nusantara Software Development */
.brand-mark { background: #0d315c url('../images/digitech.png') center / cover no-repeat; color: transparent; box-shadow: 0 7px 16px rgba(23, 105, 255, .28); }
.brand > span:last-child { font-size: 0; line-height: 1.15; max-width: 225px; }
.brand > span:last-child::before { content: 'NUSANTARA'; display: block; font-size: 14px; font-weight: 800; letter-spacing: .45px; }
.brand > span:last-child::after { content: 'SOFTWARE DEVELOPMENT'; display: block; color: #71819a; font-size: 8px; font-weight: 800; letter-spacing: .85px; margin-top: 3px; }
.brand > span:last-child b, .brand > span:last-child small { display: none; }
.sidebar .brand > span:last-child::before { color: #fff; }
.sidebar .brand > span:last-child::after, .auth-panel .brand > span:last-child::after { color: #b8cee7; }
.download-restricted { margin: 22px 0 0; padding: 11px; border-radius: 8px; background: #fff7e7; color: #93621e; font-size: 11px; line-height: 1.55; }

/* Daftar update software */
.update-finder { position: relative; overflow: hidden; margin-bottom: 24px; padding: 25px; border: 1px solid #d9e7ff; border-radius: 18px; background: linear-gradient(120deg, #f7faff 0%, #edf5ff 58%, #effcff 100%); box-shadow: 0 15px 45px rgba(23, 105, 255, .08); }
.update-finder::after { content: ''; position: absolute; right: -70px; top: -90px; width: 230px; height: 230px; border-radius: 50%; background: radial-gradient(circle, rgba(23,105,255,.16), rgba(23,105,255,0) 68%); pointer-events: none; }
.update-finder-copy { position: relative; z-index: 1; display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.update-finder-copy b { display: block; color: var(--ink); font-size: 15px; letter-spacing: -.25px; }
.update-finder-copy small { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.update-finder-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #1769ff, #14b8d4); box-shadow: 0 9px 20px rgba(23,105,255,.25); font-size: 23px; font-weight: 800; }
.update-toolbar { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; }
.update-search { position: relative; display: block; flex: 1; }
.update-search svg { position: absolute; z-index: 1; left: 17px; top: 50%; width: 19px; height: 19px; fill: none; stroke: #1769ff; stroke-width: 2; stroke-linecap: round; transform: translateY(-50%); pointer-events: none; }
.update-search input { width: 100%; height: 52px; border: 1px solid #cbdcf7; border-radius: 13px; padding: 0 88px 0 48px; color: var(--ink); background: rgba(255,255,255,.96); box-shadow: 0 8px 22px rgba(16,39,68,.06); font: 600 12px 'Plus Jakarta Sans'; outline: none; transition: border-color .2s, box-shadow .2s, transform .2s; }
.update-search input::placeholder { color: #91a0b5; font-weight: 500; }
.update-search input:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(23,105,255,.10), 0 10px 25px rgba(16,39,68,.08); transform: translateY(-1px); }
.update-search kbd { position: absolute; right: 13px; top: 50%; padding: 5px 7px; border: 1px solid #d7e0ed; border-bottom-width: 2px; border-radius: 6px; color: #8492a6; background: #f7f9fc; font: 700 8px 'Plus Jakarta Sans'; letter-spacing: .5px; transform: translateY(-50%); }
.update-result-count { min-width: 118px; height: 52px; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0 15px; border: 1px solid rgba(23,105,255,.12); border-radius: 13px; color: var(--muted); background: rgba(255,255,255,.76); font-size: 10px; white-space: nowrap; }
.update-result-count b { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: var(--blue); font-size: 12px; box-shadow: 0 5px 12px rgba(23,105,255,.22); }
.update-list { display: grid; gap: 10px; }
.update-item { display: grid; grid-template-columns: 54px minmax(0, 1fr) 135px 150px; gap: 18px; align-items: center; padding: 17px 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.update-item:hover { border-color: #c9dafa; box-shadow: 0 8px 24px rgba(16, 39, 68, .06); }
.update-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 11px; background: #eaf2ff; color: var(--blue); font-size: 20px; font-weight: 800; }
.update-main { min-width: 0; }
.update-main h2 { margin: 5px 0 5px; font-size: 14px; letter-spacing: -.25px; }
.update-main p { overflow: hidden; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; text-overflow: ellipsis; white-space: nowrap; }
.update-version { color: var(--ink); font-size: 12px; font-weight: 700; }
.update-version small { display: block; margin-top: 5px; color: var(--muted); font-size: 9px; font-weight: 500; }
.update-action .button { width: 100%; padding: 11px 13px; font-size: 11px; box-shadow: none; }
.update-unavailable { display: block; color: var(--muted); font-size: 10px; text-align: center; }
.update-empty { min-height: 180px; display: flex; align-items: center; justify-content: center; gap: 17px; padding: 40px 24px; border: 1px dashed #bfd2ee; border-radius: 16px; color: var(--muted); background: linear-gradient(180deg,#fff,#f9fbfe); text-align: left; }
.update-empty[hidden] { display: none; }
.update-empty-icon { width: 54px; height: 54px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 16px; color: var(--blue); background: #eaf2ff; font-size: 27px; font-weight: 800; }
.update-empty b { display: block; margin-bottom: 7px; color: var(--ink); font-size: 14px; }
.update-empty span:not(.update-empty-icon) { font-size: 11px; }
@media (max-width: 800px) { .update-toolbar { align-items: stretch; flex-direction: column; } .update-result-count { align-self: flex-start; } .update-item { grid-template-columns: 46px minmax(0, 1fr) 120px; } .update-version { display: none; } }
@media (max-width: 520px) { .update-item { grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 14px; } .update-action { grid-column: 1 / -1; } .update-main p { white-space: normal; } }

/* Manajemen user dan foto profil */
.user-create-card { max-width: 1000px; margin-bottom: 24px; }
.user-create-card .table-title p { margin: 6px 0 0; color: var(--muted); font-size: 11px; }
.avatar-upload { display: flex !important; align-items: center; gap: 14px; margin-top: 22px !important; padding: 14px; border: 1px dashed #b9ceef; border-radius: 12px; background: #f8fbff; cursor: pointer; }
.avatar-upload > span:last-child { display: grid; gap: 4px; }
.avatar-upload small { color: var(--muted); font-size: 9px; font-weight: 500; }
.avatar-upload input { margin: 6px 0 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.avatar-preview,.user-avatar,.edit-avatar { width: 44px; height: 44px; display: grid; flex: 0 0 auto; place-items: center; overflow: hidden; border-radius: 13px; object-fit: cover; }
.avatar-placeholder,.user-initial { color: #fff; background: linear-gradient(135deg,#1769ff,#13b8cf); font-size: 20px; font-weight: 800; }
.user-table-card { padding-bottom: 12px; }
.user-cell { display: flex; align-items: center; gap: 11px; min-width: 175px; }
.user-cell small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 20px; font-size: 10px; font-weight: 700; }
.status-pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-pill.active { color: #078467; background: #e9fbf5; }
.status-pill.inactive { color: #a04444; background: #fff0f0; }
.user-actions { display: flex; align-items: center; gap: 7px; }
.inline-form { margin: 0; }
.edit-action,.toggle-action { border: 0; border-radius: 7px; padding: 7px 10px; font: 700 10px 'Plus Jakarta Sans'; cursor: pointer; }
.edit-action { color: var(--blue); background: #edf4ff; }
.toggle-action { color: #087b5d; background: #e8fcf5; }
.toggle-action.danger { color: #b13f3f; background: #fff0f0; }
.edit-profile-head { display: flex; align-items: center; gap: 17px; margin-bottom: 22px; padding: 17px; border-radius: 12px; background: #f6f9fd; }
.edit-avatar { width: 68px; height: 68px; border-radius: 18px; font-size: 25px; }
.edit-profile-head p { margin: 5px 0 10px; color: var(--muted); font-size: 10px; }
.edit-profile-head input { font-size: 10px; }
.account-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 170px; }
.account-chip img,.account-chip > span { width: 30px; height: 30px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 9px; object-fit: cover; }
.account-chip > span { color: #fff; background: linear-gradient(135deg,#1769ff,#13b8cf); font-size: 11px; font-weight: 800; }
.account-chip b { overflow: hidden; color: var(--ink); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
@media(max-width:800px){.account-chip{display:none}}

/* Upload bertahap untuk berkas besar */
.chunk-uploader { margin: 14px 0 18px; padding: 18px; border: 1px solid #c9dcfa; border-radius: 12px; background: linear-gradient(135deg,#f7faff,#eef6ff); }
.chunk-uploader-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.chunk-uploader-head b { display: block; font-size: 12px; }
.chunk-uploader-head small { display: block; margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.chunk-upload-button { flex: 0 0 auto; border: 0; border-radius: 8px; padding: 10px 14px; color: #fff; background: #1769ff; font: 700 10px 'Plus Jakarta Sans'; cursor: pointer; }
.chunk-upload-button:disabled { cursor: not-allowed; opacity: .5; }
.chunk-progress { overflow: hidden; height: 8px; margin-top: 15px; border-radius: 10px; background: #dce8fa; }
.chunk-progress span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#1769ff,#14b8d4); transition: width .2s; }
.chunk-status { display: block; margin-top: 8px; color: #52647d; font-size: 9px; }
.chunk-status.success { color: #078467; font-weight: 700; }
.chunk-status.error { color: #bd3131; font-weight: 700; }
@media(max-width:600px){.chunk-uploader-head{align-items:stretch;flex-direction:column}.chunk-upload-button{width:100%}}