/* Billing history page (merchant dashboard shell). Extracted from templates/billing/subscription_history.html. */

/* ── Current plan card ── */
.cp-card {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    background: var(--ink-2);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    padding: 20px 24px;
    margin-bottom: 20px;
}
@media(max-width:600px){ .cp-card { grid-template-columns:1fr; } }
.cp-label  { font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-bottom:4px; }
.cp-name   { font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:700;color:var(--text-1);margin-bottom:4px; }
.cp-meta   { font-size:.78rem;color:var(--text-2); }
.cp-badge  { display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:100px;font-size:.7rem;font-weight:700; }
.badge-active    { background:rgba(0,230,118,.1);border:1px solid rgba(0,230,118,.2);color:var(--g); }
.badge-cancelled { background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.15);color:#f87171; }
.badge-paused    { background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.18);color:#fbbf24; }
.badge-trial     { background:rgba(96,165,250,.08);border:1px solid rgba(96,165,250,.18);color:#60a5fa; }
.no-plan-box {
    display:flex;flex-direction:column;align-items:center;gap:14px;
    text-align:center;padding:48px 24px;
    background:var(--ink-2);border:1px solid var(--border);border-radius:var(--r-lg);margin-bottom:20px;
}
.no-plan-icon { width:56px;height:56px;border-radius:50%;background:rgba(0,230,118,.06);border:1.5px solid rgba(0,230,118,.14);display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:var(--g); }

/* ── Toolbar ── */
.hist-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.hist-search-wrap { position:relative;flex:1;min-width:160px;max-width:280px; }
.hist-search-wrap i { position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:.75rem;color:var(--text-3);pointer-events:none; }
.hist-search {
    width:100%;padding:8px 10px 8px 30px;
    background:var(--ink-3);border:1px solid var(--border);border-radius:var(--r-sm);
    color:var(--text-1);font-size:.8rem;outline:none;
    transition:border-color .15s;
}
.hist-search:focus { border-color:rgba(0,230,118,.4); }
.hist-search::placeholder { color:var(--text-3); }

.filter-pills { display:flex;gap:6px;flex-wrap:wrap; }
.fp {
    padding:6px 12px;border-radius:100px;font-size:.74rem;font-weight:600;
    background:transparent;border:1px solid var(--border);color:var(--text-2);
    cursor:pointer;transition:all .15s;
}
.fp:hover  { border-color:rgba(0,230,118,.3);color:var(--text-1); }
.fp.on     { background:rgba(0,230,118,.1);border-color:rgba(0,230,118,.25);color:var(--g); }

/* ── Table ── */
.hist-table-wrap { overflow-x:auto; }
.hist-table {
    width:100%;border-collapse:collapse;font-size:.8rem;
}
.hist-table th {
    padding:9px 14px;text-align:left;font-size:.67rem;font-weight:600;
    letter-spacing:.07em;text-transform:uppercase;color:var(--text-3);
    border-bottom:1px solid var(--border);white-space:nowrap;
}
.hist-table td {
    padding:12px 14px;border-bottom:1px solid var(--border);color:var(--text-2);
    vertical-align:middle;
}
.hist-table tbody tr:last-child td { border-bottom:none; }
.hist-table tbody tr:hover td { background:rgba(255,255,255,.018); }
.td-plan { font-weight:600;color:var(--text-1); }
.td-cycle { font-size:.73rem;color:var(--text-3); }
.td-promo {
    font-size:.72rem;font-family:'Space Grotesk',sans-serif;letter-spacing:.04em;
    background:rgba(0,230,118,.07);border:1px solid rgba(0,230,118,.15);
    border-radius:5px;padding:2px 7px;color:var(--g);white-space:nowrap;
    display:inline-block;
}
.td-empty { text-align:center;padding:48px 14px;color:var(--text-3);font-size:.82rem; }

/* ── Pagination ── */
.hist-pager {
    display:flex;align-items:center;justify-content:space-between;
    margin-top:14px;flex-wrap:wrap;gap:10px;
}
.pg-info { font-size:.76rem;color:var(--text-3); }
.pg-btns { display:flex;gap:4px; }
.pg-btn {
    width:30px;height:30px;display:flex;align-items:center;justify-content:center;
    border-radius:var(--r-sm);border:1px solid var(--border);background:transparent;
    color:var(--text-2);font-size:.75rem;cursor:pointer;transition:all .15s;
}
.pg-btn:hover:not(:disabled) { border-color:rgba(0,230,118,.3);color:var(--g); }
.pg-btn.pg-on  { background:rgba(0,230,118,.1);border-color:rgba(0,230,118,.2);color:var(--g);font-weight:700; }
.pg-btn:disabled { opacity:.3;cursor:not-allowed; }

/* ── States ── */
.sk-row td { animation:sk-pulse 1.4s ease-in-out infinite; }
@keyframes sk-pulse { 0%,100%{opacity:.4}50%{opacity:.9} }
.sk-cell { background:var(--ink-3);border-radius:4px;height:14px;display:inline-block; }