.tpage-skeleton-host-active {
    position: relative;
}

.tpage-skeleton {
    --tpage-skeleton-gap: 12px;
    background: var(--fabrion-skeleton-surface, var(--fabrion-page-bg));
    color: transparent;
    pointer-events: none;
    z-index: 40;
}

.tpage-skeleton--surface {
    position: absolute;
    inset: 0;
    min-height: 100%;
    overflow: hidden;
    padding: var(--fabrion-page-padding-y) var(--fabrion-page-padding-x);
}

.tpage-skeleton--rows {
    position: absolute;
    overflow: hidden;
    padding: 0;
    background: var(--fabrion-skeleton-surface, var(--fabrion-page-bg));
}

.tpage-skeleton-placeholder {
    display: block;
    min-height: 10px;
    border-radius: 5px;
    background: var(--fabrion-skeleton-placeholder, #e9ecef);
    animation: tpage-skeleton-pulse 2s ease-in-out infinite;
}

.tpage-skeleton-header,
.tpage-skeleton-toolbar,
.tpage-skeleton-tabs,
.tpage-skeleton-actions {
    display: flex;
    align-items: center;
    gap: var(--tpage-skeleton-gap);
}

.tpage-skeleton-header {
    min-height: 34px;
    margin-bottom: 12px;
}

.tpage-skeleton-title { width: min(230px, 38%); height: 18px; }
.tpage-skeleton-actions { margin-left: auto; }
.tpage-skeleton-button { width: 96px; height: 32px; }
.tpage-skeleton-button--short { width: 72px; }
.tpage-skeleton-toolbar { margin-bottom: 12px; }
.tpage-skeleton-spacer { flex: 1 1 auto; }
.tpage-skeleton-control { height: 32px; }
.tpage-skeleton-control--select { width: 150px; }
.tpage-skeleton-control--search { width: min(260px, 30vw); }
.tpage-skeleton-control--icon { width: 32px; }
.tpage-skeleton-control--button { width: 88px; }

.tpage-skeleton-table,
.tpage-skeleton-rows {
    display: grid;
    gap: 1px;
}

.tpage-skeleton-list-row {
    display: grid;
    grid-template-columns: minmax(88px, .8fr) minmax(180px, 2.2fr) repeat(4, minmax(80px, 1fr));
    align-items: center;
    gap: 18px;
    min-height: 38px;
    padding: 7px 12px;
    border-bottom: 1px solid var(--fabrion-skeleton-border, var(--fabrion-border));
    background: var(--fabrion-skeleton-row, var(--fabrion-surface));
}

.tpage-skeleton-list-heading {
    min-height: 34px;
    background: var(--fabrion-skeleton-heading, var(--fabrion-surface-muted));
}

.tpage-skeleton-cell { width: 78%; height: 10px; }
.tpage-skeleton-cell--1 { width: 56%; }
.tpage-skeleton-cell--2 { width: 88%; }

.tpage-skeleton-tabs {
    min-height: 42px;
    border-bottom: 1px solid var(--fabrion-skeleton-border, var(--fabrion-border));
    margin-bottom: 18px;
}

.tpage-skeleton-tab { width: 82px; height: 13px; }
.tpage-skeleton-tab--short { width: 58px; }
.tpage-skeleton-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 20px;
}
.tpage-skeleton-field { display: grid; gap: 7px; }
.tpage-skeleton-field--wide { grid-column: 1 / -1; }
.tpage-skeleton-label { width: min(130px, 42%); height: 10px; }
.tpage-skeleton-input { width: 100%; height: 34px; }

.tpage-skeleton-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.tpage-skeleton-card {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 10px 12px;
    min-height: 154px;
    padding: 18px;
    border: 1px solid var(--fabrion-skeleton-border, var(--fabrion-border));
    border-radius: var(--fabrion-card-radius);
    background: var(--fabrion-skeleton-row, var(--fabrion-surface));
}
.tpage-skeleton-card-icon { grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 10px; }
.tpage-skeleton-card-title { width: 58%; height: 14px; }
.tpage-skeleton-card-copy { width: 86%; height: 10px; }
.tpage-skeleton-card-value { grid-column: 1 / -1; align-self: end; width: 34%; height: 22px; }

.tpage-skeleton-generic {
    display: grid;
    gap: 14px;
}
.tpage-skeleton-generic-hero { width: 100%; height: clamp(130px, 24vh, 240px); }
.tpage-skeleton-generic-line { width: 92%; height: 13px; }
.tpage-skeleton-generic-line--1 { width: 78%; }
.tpage-skeleton-generic-line--2 { width: 64%; }

.tpage-skeleton-source-rows {
    opacity: 0 !important;
}

@keyframes tpage-skeleton-pulse {
    0%, 100% { opacity: .52; }
    50% { opacity: 1; }
}

@media (max-width: 767.98px) {
    .tpage-skeleton--surface {
        padding: var(--fabrion-page-padding-y) 1rem;
    }
    .tpage-skeleton-toolbar { flex-wrap: wrap; }
    .tpage-skeleton-spacer { display: none; }
    .tpage-skeleton-control--select,
    .tpage-skeleton-control--search { flex: 1 1 42%; width: auto; }
    .tpage-skeleton-list-row {
        grid-template-columns: minmax(80px, .8fr) minmax(150px, 2fr) minmax(80px, 1fr);
    }
    .tpage-skeleton-list-row > :nth-child(n+4) { display: none; }
    .tpage-skeleton-form-grid,
    .tpage-skeleton-cards { grid-template-columns: 1fr; }
    .tpage-skeleton-field--wide { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .tpage-skeleton-placeholder {
        animation: none !important;
        opacity: .78;
    }
}