/*
 * Global stat-card icon layout normalization
 * Standard: icon appears above card content across SIS stat-card variants.
 */

/* Canonical stats-card pattern used across portals */
.stats-card .card-body > .d-flex.justify-content-between,
.stats-card .card-body > .d-flex.justify-content-between.align-items-center {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.45rem;
}

.stats-card > .d-flex.justify-content-between,
.stats-card > .d-flex.justify-content-between.align-items-center {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.45rem;
}

.stats-card > .d-flex.justify-content-between > i,
.stats-card > .d-flex.justify-content-between.align-items-center > i {
    order: -1;
    margin-bottom: 0.2rem;
}

.stats-card .stats-icon {
    order: -1 !important;
    margin: 0 0 0.45rem 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
}

.stats-card .stats-comparison {
    text-align: center;
}

/* Bootstrap no-gutters stat layout (icon was previously side-aligned) */
.card.stats-card .card-body > .row.no-gutters.align-items-center,
.card.stat-card .card-body > .row.no-gutters.align-items-center {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.45rem;
}

.card.stats-card .card-body > .row.no-gutters.align-items-center > .col-auto,
.card.stat-card .card-body > .row.no-gutters.align-items-center > .col-auto {
    order: -1;
    margin-bottom: 0.2rem;
}

.card.stats-card .card-body > .row.no-gutters.align-items-center > .col,
.card.stat-card .card-body > .row.no-gutters.align-items-center > .col {
    width: 100%;
    text-align: center;
    margin-right: 0 !important;
}

.card.stats-card .card-body > .row.no-gutters.align-items-center > .col .h5,
.card.stat-card .card-body > .row.no-gutters.align-items-center > .col .h5 {
    justify-content: center;
}

/* Student dashboard variant */
.stat-card-student {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center;
    text-align: center !important;
}

.stat-card-student .stat-icon-circle {
    margin: 0 0 0.55rem 0 !important;
}

.stat-card-student .card-body > .d-flex {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 0.55rem !important;
}

.stat-card-student .card-body > .d-flex > div:last-child {
    text-align: center;
}

/* Inline exam attendance variant */
.stat-card-inline {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

.stat-card-inline .stat-icon {
    margin: 0 0 0.55rem 0 !important;
}

.stat-card-inline .stat-content {
    width: 100%;
    text-align: center;
}

/* Generic stat card wrappers with icon block */
.stat-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.stat-card > .card-body {
    width: 100%;
    text-align: center;
}

.stat-card > .stat-icon {
    margin: 0 auto 0.55rem auto !important;
}

.stat-card .stat-content {
    text-align: center;
}

/* Status card already icon-first: keep centered */
.status-card a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.status-card .icon-circle {
    margin: 0 auto 0.75rem auto !important;
}

.status-card .card-content {
    text-align: center;
}

/* Summary/stat item icon helpers */
.summary-card .summary-card-icon,
.stat-item .stat-item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    margin: 0 auto 0.45rem auto;
    background: rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.95);
    font-size: 0.95rem;
}

.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

@media (max-width: 575.98px) {
    .stats-card .stats-icon,
    .summary-card .summary-card-icon,
    .stat-item .stat-item-icon {
        width: 2rem;
        height: 2rem;
        font-size: 0.85rem;
    }
}