/* DjimanBo navigation progress — V21. Shared visual for Public, Client, Pro and Admin. */
.djb-nav-progress{
    position:fixed;
    inset:0;
    z-index:2147483000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:rgba(13,27,61,.24);
    -webkit-backdrop-filter:blur(4px);
    backdrop-filter:blur(4px);
    animation:djb-nav-progress-fade .14s ease-out both;
}

.djb-nav-progress__panel{
    position:relative;
    width:min(360px,calc(100vw - 32px));
    min-height:96px;
    display:grid;
    grid-template-columns:60px minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
    padding:16px 18px 18px;
    overflow:hidden;
    border:1px solid rgba(13,27,61,.10);
    border-radius:16px;
    background:#fff;
    box-shadow:0 24px 70px rgba(13,27,61,.22);
}

.djb-nav-progress__visual{position:relative;width:56px;height:56px;display:grid;place-items:center}
.djb-nav-progress__ring{
    position:absolute;inset:0;border-radius:50%;
    border:3px solid #e8f5f4;border-top-color:#00A79D;border-right-color:#0D1B3D;
    animation:djb-nav-progress-spin .85s linear infinite;
}
.djb-nav-progress__brand{
    width:40px;height:40px;display:grid;place-items:center;border-radius:11px;
    background:#0D1B3D;color:#fff;font-weight:900;font-size:13px;letter-spacing:-.25px;
    box-shadow:inset 0 -2px 0 rgba(0,167,157,.38);
}
.djb-nav-progress__copy{min-width:0;display:grid;gap:3px}
.djb-nav-progress__copy strong{margin:0;color:#0D1B3D;font-size:15px;line-height:1.15;font-weight:800;letter-spacing:-.15px}
.djb-nav-progress__copy span{color:#68788E;font-size:12px;line-height:1.35;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.djb-nav-progress__dots{display:flex;align-items:center;gap:4px;padding-left:4px}
.djb-nav-progress__dots i{width:5px;height:5px;border-radius:50%;background:#00A79D;animation:djb-nav-progress-dot 1s ease-in-out infinite}
.djb-nav-progress__dots i:nth-child(2){animation-delay:.12s}.djb-nav-progress__dots i:nth-child(3){animation-delay:.24s}
.djb-nav-progress__bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:#eaf1f4;overflow:hidden}
.djb-nav-progress__bar span{display:block;width:42%;height:100%;background:linear-gradient(90deg,#00A79D,#0D1B3D);animation:djb-nav-progress-bar 1.05s ease-in-out infinite}

@keyframes djb-nav-progress-spin{to{transform:rotate(360deg)}}
@keyframes djb-nav-progress-dot{0%,80%,100%{opacity:.28;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes djb-nav-progress-bar{0%{transform:translateX(-110%)}100%{transform:translateX(340%)}}
@keyframes djb-nav-progress-fade{from{opacity:0}to{opacity:1}}

@media(max-width:520px){
    .djb-nav-progress{padding:14px}
    .djb-nav-progress__panel{grid-template-columns:52px minmax(0,1fr);gap:11px;min-height:86px;padding:14px 15px 17px;border-radius:14px}
    .djb-nav-progress__visual{width:50px;height:50px}
    .djb-nav-progress__brand{width:36px;height:36px;border-radius:10px;font-size:12px}
    .djb-nav-progress__dots{display:none}
    .djb-nav-progress__copy strong{font-size:14px}
    .djb-nav-progress__copy span{font-size:11px}
}

@media(prefers-reduced-motion:reduce){
    .djb-nav-progress,.djb-nav-progress__ring,.djb-nav-progress__dots i,.djb-nav-progress__bar span{animation-duration:.001ms!important;animation-iteration-count:1!important}
}