/* SaraHome — Admin table + stat-card-grid cluster CSS (§R-N+26xx Wave 5.3)
   對位 framework rule §R-N+62 KISS + §R-N+146 後寫後贏 + §R-N+22xx Plan B precedent:
   必須 link 喺 style.css 之後、mobile.css 之前

   §R-N+26xx Wave 5.3 (2026-08-26) — admin-table + stat-card-grid cluster extract:
   抽 style.css L4390-L4519 (.stat-card-grid + .table-wrap + .admin-table)
   對位 §R-N+22xx Plan B 根因 precedent (single source of truth) */

/* === P87-C Admin Table + Stat Card Grid (L3/L4 後台 mobile)
   §R-N+79: template 用咗 .stat-card-grid + .admin-table 但 CSS 0 定義
   對位 §R-N+131 mobile-first + §R-N+99 a11y + 桌面 R66-R69 form pattern 守住 */
.stat-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sarahome-v3-space-4);
    margin-bottom: 1.5rem;
}

@media (min-width: 769px) {
    .stat-card-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* table wrapper (mobile scroll) + admin-table base style */
.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--sarahome-v3-border);
    border-radius: var(--sarahome-v3-radius-sm);
    margin-bottom: 1.5rem;
    background: #fff;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    background: #fff;
}

.admin-table thead {
    background: var(--sarahome-v3-surface-section-alt);
}

.admin-table th,
.admin-table td {
    padding: 0.75rem 0.875rem;
    text-align: left;
    border-bottom: 1px solid var(--sarahome-v3-border);
    vertical-align: middle;
}

.admin-table th {
    font-weight: 600;
    color: var(--sarahome-v3-color-fg);
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.admin-table tbody tr:hover {
    background: rgba(45, 125, 210, 0.03);
}

.admin-table tbody tr:last-child td {
    border-bottom: none;
}

@media (max-width: 768px) {
    .admin-table thead {
        display: none;       /* 在 mobile 隱藏 thead, 用 td 的 data-label 顯示 */
    }

    .admin-table,
    .admin-table tbody,
    .admin-table tr,
    .admin-table td {
        display: block;
        width: 100%;
    }

    .admin-table tr {
        margin-bottom: 0.75rem;
        border: 1px solid var(--sarahome-v3-border);
        border-radius: var(--sarahome-v3-radius-sm);
        padding: var(--sarahome-v3-space-2) var(--sarahome-v3-space-3);
        background: #fff;
    }

    .admin-table td {
        padding: 0.375rem 0;
        border: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: var(--sarahome-v3-space-2);
    }

    .admin-table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--sarahome-v3-color-text-secondary);
        font-size: 0.8125rem;
        flex-s: 0 0 auto;
    }

    /* 手機 hide 冗長 column (註冊時間 / 操作) 用 admin-table-mobile-hide */
    .admin-table .admin-table-mobile-hide {
        display: none !important;
    }

    /* action buttons column - stack vertical */
    .admin-table .action-buttons {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.375rem;
    }

    .admin-table .action-buttons a,
    .admin-table .action-buttons button {
        width: 100%;
        justify-content: center;
    }

    .admin-table form[onsubmit] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: var(--sarahome-v3-space-2) !important;
        width: 100%;
    }

    .admin-table form[onsubmit] input[type="text"] {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* §R-N+30xx (2026-08-27): .admin-table-no-card variant — partner data-table
   migration: mobile 保持原生 table layout (partner 自家 ≤768px
   hide table / show card list pattern, 對位 §R-N+7xx+14), 唔卡片化 */
@media (max-width: 768px) {
    .admin-table.admin-table-no-card {
        display: table;
        width: 100%;
    }
    .admin-table.admin-table-no-card thead {
        display: table-header-group;
    }
    .admin-table.admin-table-no-card tbody {
        display: table-row-group;
    }
    .admin-table.admin-table-no-card tr {
        display: table-row;
        margin: 0;
        border: none;
        border-radius: 0;
        padding: 0;
        background: transparent;
    }
    .admin-table.admin-table-no-card td {
        display: table-cell;
        padding: 0.75rem 0.875rem;
        border-bottom: 1px solid var(--sarahome-v3-border);
    }
    .admin-table.admin-table-no-card td::before {
        content: none;
    }
}