/* Detail Stats - Inline Text */
.detail-stats {
    display: flex;
    flex-direction: column;
    /* gap: 4px; */
}

.detail-item {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 12px 16px;
    /* background: var(--card-bg); */
    /* border-radius: 12px; */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    /* 3D Pop Effect (Light Mode) */
    /* box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.05),
        -4px -4px 8px rgba(255, 255, 255, 0.8); */
    /* border: 1px solid rgba(255, 255, 255, 0.4); */
}

/* [data-theme="dark"] .detail-item { */
/* background: var(--card-bg); */
/* #242424 */
/* 3D Pop Effect (Dark Mode) */
/* box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3),
        -1px -1px 3px rgba(255, 255, 255, 0.05); */
/* border: 1px solid rgba(255, 255, 255, 0.05); */
/* } */

.detail-item:hover {
    transform: translateY(-2px);
    /* box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.1),
        -6px -6px 12px rgba(255, 255, 255, 0.9); */
}

/* [data-theme="dark"] .detail-item:hover {
    background: var(--card-bg); */
/* box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.4),
        -1px -1px 3px rgba(255, 255, 255, 0.1); */
/* } */

.detail-item .material-symbols-rounded {
    font-size: 20px;
}

.detail-label {
    font-size: 0.9rem;
    color: var(--text-main);
    flex: 1;
}

.detail-item strong {
    font-size: 1.25rem;
    font-weight: 700;
    min-width: 32px;
    text-align: right;
    color: var(--text-main);
}

/* Status colors for detail items - icons only */
.detail-item.status-VC .material-symbols-rounded {
    color: var(--color-vc);
}

.detail-item.status-VD .material-symbols-rounded {
    color: var(--color-vd);
}

.detail-item.status-VR .material-symbols-rounded {
    color: var(--color-vr);
}

.detail-item.status-OC .material-symbols-rounded {
    color: var(--color-oc);
}

.detail-item.status-OD .material-symbols-rounded {
    color: var(--color-od);
}

.detail-item.status-OR .material-symbols-rounded {
    color: var(--color-or);
}