/* =====================================================
   Smart Table Manager — Public / Frontend CSS
   ===================================================== */

.stm-table-wrap {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: var(--stm-font-size, 14px);
    color: var(--stm-row-text, #333);
    margin: 16px 0;
    line-height: 1.5;
}

.stm-table-desc {
    margin: 0 0 12px;
    color: #666;
    font-style: italic;
    font-size: .92em;
}

/* Responsive wrapper */
.stm-responsive .stm-scroll-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--stm-radius, 8px);
}

/* ── Table ── */
.stm-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--stm-border, #dee2e6);
    border-radius: var(--stm-radius, 8px);
    overflow: hidden;
    font-size: inherit;
}

/* ── Header ── */
.stm-table thead tr th {
    background: var(--stm-header-bg, #003087);
    color: var(--stm-header-text, #ffffff);
    font-weight: 700;
    padding: 13px 16px;
    font-size: .875em;
    text-transform: uppercase;
    letter-spacing: .5px;
    border-bottom: 2px solid rgba(0,0,0,.1);
    white-space: nowrap;
}
.stm-table thead tr th:first-child { border-radius: var(--stm-radius, 8px) 0 0 0; }
.stm-table thead tr th:last-child  { border-radius: 0 var(--stm-radius, 8px) 0 0; }

/* ── Body ── */
.stm-table tbody tr td {
    padding: 11px 16px;
    border-bottom: 1px solid var(--stm-border, #dee2e6);
    background: var(--stm-row-odd, #ffffff);
    color: var(--stm-row-text, #333);
    vertical-align: middle;
}
.stm-table tbody tr:last-child td { border-bottom: none; }
.stm-table tbody tr:last-child td:first-child { border-radius: 0 0 0 var(--stm-radius, 8px); }
.stm-table tbody tr:last-child td:last-child  { border-radius: 0 0 var(--stm-radius, 8px) 0; }

/* ── Stripe ── */
.stm-stripe tbody tr:nth-child(even) td {
    background: var(--stm-row-even, #f8f9fa);
}

/* ── Hover ── */
.stm-hover tbody tr:hover td {
    background: rgba(0,48,135,.05);
    transition: background .15s;
}

/* ── Alignment ── */
.stm-align-left   { text-align: left !important; }
.stm-align-center { text-align: center !important; }
.stm-align-right  { text-align: right !important; }

/* ── Cell Types ── */

/* Link */
.stm-link {
    color: var(--stm-link, #e85d04);
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1.5px solid transparent;
    transition: border-color .2s, color .2s;
}
.stm-link:hover {
    border-bottom-color: var(--stm-link, #e85d04);
}

/* Button */
.stm-btn {
    display: inline-block;
    background: var(--stm-btn-bg, #e85d04);
    color: var(--stm-btn-text, #ffffff) !important;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: .85em;
    font-weight: 600;
    text-decoration: none;
    transition: opacity .2s, transform .1s;
    white-space: nowrap;
}
.stm-btn:hover {
    opacity: .88;
    transform: translateY(-1px);
    color: var(--stm-btn-text, #ffffff) !important;
    text-decoration: none;
}

/* Badge */
.stm-badge {
    display: inline-block;
    background: #e85d04;
    color: #fff;
    padding: 3px 10px;
    border-radius: 50px;
    font-size: .8em;
    font-weight: 700;
    letter-spacing: .3px;
}

/* Image */
.stm-img {
    max-width: 120px;
    max-height: 80px;
    object-fit: cover;
    border-radius: 6px;
    display: block;
}

/* No data */
.stm-no-data {
    text-align: center;
    padding: 30px;
    color: #999;
    font-style: italic;
}

/* Error */
.stm-error {
    color: #dc3545;
    font-size: 13px;
    font-style: italic;
}

/* Scrollbar styling */
.stm-scroll-wrap::-webkit-scrollbar { height: 5px; }
.stm-scroll-wrap::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 3px; }
.stm-scroll-wrap::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }
.stm-scroll-wrap::-webkit-scrollbar-thumb:hover { background: #999; }