/* ========================================================================
   css/digital-locker.css
   PART 3 — Digital Locker (Member Dashboard)
   File terpisah, tidak menyentuh css/member-dashboard.css.
   ======================================================================== */

.dl-pill {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 10.5px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase;
    padding: 4px 10px; border-radius: 999px;
}
.dl-pill-pending  { color: #facc15; background: rgba(250, 204, 21, .14); }
.dl-pill-active   { color: #4ade80; background: rgba(34, 197, 94, .14); }
.dl-pill-expired  { color: #f87171; background: rgba(239, 68, 68, .14); }
.dl-pill-rejected { color: #f87171; background: rgba(239, 68, 68, .14); }

.dl-countdown {
    display: flex; align-items: center; gap: 7px;
    font-size: 12px; font-weight: 700; color: #fff;
    background: rgba(34, 197, 94, .1); border: 1px solid rgba(34, 197, 94, .3);
    border-radius: 8px; padding: 8px 10px; margin-top: 2px;
}
.dl-countdown i { color: #4ade80; }
.dl-countdown.dl-countdown-expired {
    background: rgba(239, 68, 68, .1); border-color: rgba(239, 68, 68, .3);
}
.dl-countdown.dl-countdown-expired i { color: #f87171; }

.dl-card .md-asset-body { gap: 10px; }
.dl-card .dl-download-btn[disabled] { cursor: not-allowed; }

@media (max-width: 480px) {
    .dl-countdown { font-size: 11.5px; }
}

/* ============================================================
   PART 6 — Strict User-Bound OTP Gate box (Digital Locker)
   ============================================================ */
.dl-otp-box {
    margin: 8px 0 4px;
    padding: 10px;
    border: 1px dashed rgba(124, 58, 237, .45);
    border-radius: 10px;
    background: rgba(124, 58, 237, .08);
}
.dl-otp-label {
    display: block;
    font-size: 11.5px;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--text, #e5e7eb);
}
.dl-otp-row { display: flex; gap: 6px; }
.dl-otp-input {
    flex: 1;
    min-width: 0;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(0,0,0,.25);
    color: #fff;
    font-size: 13px;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.dl-otp-input:disabled { opacity: .5; }
.dl-verify-otp-btn { white-space: nowrap; padding: 8px 14px; }
.dl-otp-hint { font-size: 10.5px; opacity: .75; margin-top: 6px; }
.dl-otp-hint-error { color: #f87171; opacity: 1; }