/*
 * ERP CARDS COMPONENT
 * Phase C5-B Shared Component Token Standardization
 * Replaces Bootstrap 5 card component while utilizing ERP tokens.
 */

.card,
.erp-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--erp-card-bg, var(--erp-bg-surface));
    background-clip: border-box;
    border: var(--erp-card-border, 1px solid var(--erp-border-color));
    border-radius: var(--erp-card-radius, var(--erp-radius-md));
    box-shadow: var(--erp-card-shadow, var(--erp-shadow-sm));
}

.card-body,
.erp-card__body {
    flex: 1 1 auto;
    padding: var(--erp-card-body-padding, 14px);
}

.card-title,
.erp-card__title {
    margin-top: 0;
    margin-bottom: var(--erp-space-2, 8px);
    font-size: var(--erp-card-title-font-size, var(--erp-font-size-card, 14px));
    font-weight: var(--erp-card-title-font-weight, var(--erp-font-weight-semibold, 600));
    line-height: var(--erp-line-height-tight, 1.35);
    color: var(--erp-text-heading, var(--erp-text-primary, #0f172a));
}

.card-subtitle,
.erp-card__subtitle {
    margin-top: var(--erp-space-1, 4px);
    margin-bottom: var(--erp-space-2, 8px);
    font-size: var(--erp-font-size-sm, 12px);
    font-weight: var(--erp-font-weight-medium, 500);
    line-height: var(--erp-line-height-normal, 1.5);
    color: var(--erp-text-secondary, var(--erp-text-muted, #64748b));
}

.card-text:last-child,
.erp-card__text:last-child {
    margin-bottom: 0;
}

.card-text,
.erp-card__text {
    margin-top: 0;
    margin-bottom: var(--erp-space-3, 12px);
    font-size: var(--erp-font-size-base, 13px);
    line-height: var(--erp-line-height-normal, 1.5);
    color: var(--erp-text-body, var(--erp-text-primary, #0f172a));
}

.card-meta,
.erp-card__meta,
.erp-card__actions {
    font-size: var(--erp-font-size-xs, 11px);
    font-weight: var(--erp-font-weight-medium, 500);
    line-height: var(--erp-line-height-tight, 1.25);
    color: var(--erp-text-muted, #64748b);
}

.card-header,
.erp-card__header {
    padding: var(--erp-card-header-padding, 10px 14px);
    margin-bottom: 0;
    background-color: var(--erp-bg-surface-muted);
    border-bottom: var(--erp-card-border, 1px solid var(--erp-border-color));
}

.card-header:first-child,
.erp-card__header:first-child {
    border-radius: calc(var(--erp-card-radius, var(--erp-radius-md)) - 1px) calc(var(--erp-card-radius, var(--erp-radius-md)) - 1px) 0 0;
}

.card-footer,
.erp-card__footer {
    padding: var(--erp-card-footer-padding, 10px 14px);
    background-color: var(--erp-bg-surface-muted);
    border-top: var(--erp-card-border, 1px solid var(--erp-border-color));
}

.card-footer:last-child,
.erp-card__footer:last-child {
    border-radius: 0 0 calc(var(--erp-card-radius, var(--erp-radius-md)) - 1px) calc(var(--erp-card-radius, var(--erp-radius-md)) - 1px);
}

/* ==========================================================================
   SECTION CARDS (Migrated from legacy templates)
   ========================================================================== */
.section-erp-card {
    border: var(--erp-card-border, 1px solid var(--erp-border-color));
    border-radius: var(--erp-card-radius, var(--erp-radius-md));
    box-shadow: var(--erp-card-shadow, var(--erp-shadow-sm));
    margin-top: 1.25rem;
    background-color: var(--erp-card-bg, var(--erp-bg-surface));
    overflow: hidden;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.section-erp-card:hover {
    box-shadow: var(--erp-shadow-md);
    border-color: var(--erp-border-dark, #cbd5e1);
}

.section-erp-card.mt-0 .erp-card__header,
.section-erp-card.mt-0 .card-header {
    border-bottom: none !important;
}

.section-erp-card .erp-card__header,
.section-erp-card .card-header {
    padding: var(--erp-card-header-padding, 10px 14px);
    background-color: var(--erp-card-bg, var(--erp-bg-surface));
    border-bottom: var(--erp-card-border, 1px solid var(--erp-border-color));
    display: flex;
    align-items: center;
}

.section-erp-card .erp-card__header h5,
.section-erp-card .card-header h5,
.section-erp-card .erp-card__title,
.section-erp-card .card-title {
    font-size: var(--erp-card-title-font-size, var(--erp-font-size-card, 14px));
    font-weight: var(--erp-card-title-font-weight, var(--erp-font-weight-semibold, 600));
    line-height: var(--erp-line-height-tight, 1.35);
    color: var(--erp-text-heading, var(--erp-text-primary, #0f172a));
    letter-spacing: var(--erp-letter-spacing-tight, -0.015em);
    margin: 0;
}

.section-erp-card .erp-card__body,
.section-erp-card .card-body {
    background-color: var(--erp-card-bg, var(--erp-bg-surface));
    padding: var(--erp-card-body-padding, 14px);
}

/* ==========================================================================
   ERP KEY-VALUE / INFORMATION GRID
   Canonical Reusable Detail & Content Primitive
   ========================================================================== */
.erp-kv-list {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
}

.erp-kv-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    font-size: var(--erp-font-size-label-sm, 11.5px);
    line-height: var(--erp-line-height-normal, 1.5);
    border-bottom: 1px solid var(--erp-border-light, #f1f5f9);
}

.erp-kv-row:first-child {
    padding-top: 0;
}

.erp-kv-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.erp-kv-label,
dt.erp-kv-label {
    font-size: var(--erp-font-size-label-sm, 11.5px);
    color: var(--erp-text-secondary, #64748b);
    font-weight: var(--erp-font-weight-medium, 500);
    line-height: var(--erp-line-height-normal, 1.5);
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

.erp-kv-icon {
    font-size: var(--erp-font-size-sm, 12px);
    color: var(--erp-text-muted, #94a3b8);
}

.erp-kv-value,
dd.erp-kv-value {
    font-size: var(--erp-font-size-label-sm, 11.5px);
    color: var(--erp-text-primary, #0f172a);
    font-weight: var(--erp-font-weight-semibold, 600);
    line-height: var(--erp-line-height-normal, 1.5);
    text-align: right;
    margin: 0;
}

.erp-kv-value--muted,
.erp-kv-muted,
.erp-kv-supporting {
    font-size: var(--erp-font-size-xs, 11px);
    font-weight: var(--erp-font-weight-regular, 400);
    color: var(--erp-text-muted, #64748b);
}

/* Semantic DL/DT/DD Support */
dl.erp-kv-dl,
dl.erp-kv-list {
    margin-bottom: 0;
}

dl.erp-kv-dl dt,
dl.erp-kv-list dt {
    font-size: var(--erp-font-size-label-sm, 11.5px);
    font-weight: var(--erp-font-weight-medium, 500);
    color: var(--erp-text-secondary, #64748b);
    line-height: var(--erp-line-height-normal, 1.5);
}

dl.erp-kv-dl dd,
dl.erp-kv-list dd {
    font-size: var(--erp-font-size-label-sm, 11.5px);
    font-weight: var(--erp-font-weight-semibold, 600);
    color: var(--erp-text-primary, #0f172a);
    line-height: var(--erp-line-height-normal, 1.5);
    margin-bottom: var(--erp-space-2, 8px);
}