/* Configuration Manager Specific Styles */
.level-indicator-dot {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    border: 1px solid rgba(255,255,255,0.1);
}

.level-indicator-dot.active {
    background: var(--primary);
    color: white;
    box-shadow: 0 0 10px var(--primary);
    border-color: transparent;
}

.level-indicator-dot.inactive {
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.2);
    border-color: rgba(255,255,255,0.05);
}

.level-indicator-dot:hover {
    transform: scale(1.1);
    background: rgba(255,255,255,0.1);
}

.switch-inline {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    margin-bottom: 8px;
    user-select: none;
}

.switch-inline input { opacity: 0; width: 0; height: 0; position: absolute; }

.slider-sm {
    width: 30px;
    height: 16px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    transition: .3s;
    border-radius: 20px;
    position: relative;
    flex-shrink: 0;
}

.slider-sm:before {
    position: absolute;
    content: "";
    height: 10px;
    width: 10px;
    left: 2px;
    bottom: 2px;
    background: rgba(255,255,255,0.2);
    transition: .3s;
    border-radius: 50%;
}

.switch-inline input:checked + .slider-sm {
    background: var(--primary);
    border-color: transparent;
}

.switch-inline input:checked + .slider-sm:before {
    transform: translateX(14px);
    background: white;
    box-shadow: 0 0 5px var(--primary);
}

.switch-inline .lbl { font-size: 0.75rem; color: var(--text-dim); transition: .2s; }
.switch-inline input:checked ~ .lbl { color: white; }
.hierarchy-item-premium { margin-bottom: 5px; }

.asset-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 15px;
}

@media (max-width: 1400px) {
    .asset-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 1100px) {
    .asset-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .asset-grid { grid-template-columns: 1fr; }
}

.asset-badge-new {
    position: absolute;
    top: -10px;
    right: 15px;
    background: #238636;
    color: white;
    font-size: 0.6rem;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: 4px;
    z-index: 2;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.asset-badge-lost {
    position: absolute;
    top: -10px;
    right: 15px;
    background: #f85149;
    color: white;
    font-size: 0.6rem;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: 4px;
    z-index: 2;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.page-config-card.is-new { border-color: rgba(35, 134, 54, 0.4) !important; background: rgba(35, 134, 54, 0.05) !important; }
.page-config-card.lost-access { border-color: rgba(248, 81, 73, 0.3) !important; background: rgba(248, 81, 73, 0.05) !important; }
.page-config-card.synced { border-color: var(--primary) !important; }

.cron-status-indicator { font-size: 0.65rem; padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 4px; font-weight: 700; }
.cron-status-indicator.synced { background: rgba(35, 134, 54, 0.1); color: #3fb950; }
.cron-status-indicator.pending { background: rgba(210, 153, 34, 0.1); color: #d29922; }

.cron-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.cron-dot.synced { background: #3fb950; box-shadow: 0 0 5px #3fb950; }
.cron-dot.pending { background: #d29922; box-shadow: 0 0 5px #d29922; }

.cron-explanation { font-size: 0.65rem; color: var(--text-dim); line-height: 1.2; }
.cron-warning-box { background: rgba(210, 153, 34, 0.05); border: 1px solid rgba(210, 153, 34, 0.2); color: #d29922; font-size: 0.65rem; padding: 4px 8px; border-radius: 6px; display: flex; align-items: center; gap: 6px; font-weight: 700; }

/* Utilities */
.config-header-btns { margin-left:auto; display:flex; gap:10px; }
.config-token-badges { display:flex; gap:10px; }
.config-badge-inline { font-size:0.65rem; padding:4px 10px; border-radius:10px; background:rgba(255,255,255,0.02); border:1px solid var(--border); display:none; }
.config-cron-hour-input { width:100%; border-radius:6px; background:rgba(255,255,255,0.03); border:1px solid var(--border); color:white; padding:4px 8px; font-size:0.8rem; }
.config-cron-mini-input { width:55px; border-radius:6px; background:rgba(255,255,255,0.03); border:1px solid var(--border); color:white; padding:4px 8px; font-size:0.8rem; }
.config-filter-icon-input { background: rgba(255,255,255,0.03); border-radius:10px; border:1px solid var(--border); padding: 0 12px; display:flex; align-items:center; }
.config-filter-raw-input { border:none; background:transparent; padding:8px 0; width:100%; color:white; font-family:var(--font-mono); font-size:0.75rem; }