.quota-history-trigger { min-height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0 11px; border: 1px solid #9b70d1; border-radius: 8px; background: #f5efff; color: #6034a2; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; white-space: nowrap; }
.quota-history-trigger:hover { border-color: #7842bd; background: #eadcff; color: #4d2589; }
.quota-history-dialog { width: min(760px,calc(100vw - 28px)); max-height: min(760px,calc(100dvh - 28px)); padding: 0; overflow: hidden; border: 1px solid #d9d3dc; border-radius: 20px; background: #f7f5f8; color: #28232a; box-shadow: 0 28px 90px #0007; }
.quota-history-dialog:not([open]) { display: none; }
.quota-history-dialog::backdrop { background: rgba(18,14,20,.72); backdrop-filter: blur(5px); }
.quota-history-shell { display: grid; grid-template-rows: auto minmax(120px,1fr) auto; max-height: min(760px,calc(100dvh - 28px)); }
.quota-history-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 23px 23px 18px; border-bottom: 1px solid #e1dce3; }
.quota-history-eyebrow { display: block; margin-bottom: 4px; color: #7028f4; font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.quota-history-header h2 { margin: 0; font-size: 25px; letter-spacing: -.025em; }
.quota-history-header p { margin: 7px 0 0; color: #716b75; font-size: 13px; line-height: 1.55; }
.quota-history-close { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; padding: 0; border: 1px solid #d8d2db; border-radius: 50%; background: #fff; color: #625c66; cursor: pointer; }
.quota-history-close svg { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.quota-history-close:hover { border-color: #b7aebe; background: #eee8f2; color: #29242b; }
.quota-history-body { min-height: 180px; display: grid; align-content: start; gap: 9px; padding: 16px 18px; overflow: auto; }
.quota-history-row { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 18px; padding: 14px 15px; border: 1px solid #e0dbe3; border-radius: 12px; background: #fff; }
.quota-history-main { min-width: 0; display: grid; gap: 5px; }
.quota-history-main strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.quota-history-main span { color: #766f79; font-size: 12px; line-height: 1.45; }
.quota-history-value { min-width: 126px; display: grid; justify-items: end; gap: 4px; }
.quota-history-value strong { color: #8f2749; font-size: 14px; font-variant-numeric: tabular-nums; }
.quota-history-value span { color: #777078; font-size: 12px; }
.quota-history-row.is-reserved .quota-history-value strong { color: #7d5a00; }
.quota-history-row.is-refunded .quota-history-value strong { color: #31796f; }
.quota-history-state { min-height: 180px; display: grid; place-items: center; align-content: center; gap: 10px; color: #716b75; text-align: center; }
.quota-history-state.is-loading > span { width: 28px; height: 28px; border: 3px solid #ded7e3; border-top-color: #7028f4; border-radius: 50%; animation: quota-history-spin .8s linear infinite; }
.quota-history-state.is-loading p { margin: 0; }
.quota-history-state.is-error { color: #a32b50; }
.quota-history-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 18px 17px; border-top: 1px solid #e1dce3; }
.quota-history-footer > p { max-width: 500px; margin: 0; color: #716b75; font-size: 12px; line-height: 1.5; }
.quota-history-pager { display: flex; align-items: center; gap: 9px; white-space: nowrap; }
.quota-history-pager button { min-height: 34px; padding: 0 10px; border: 1px solid #d8d2db; border-radius: 8px; background: #fff; color: #4d4750; cursor: pointer; }
.quota-history-pager button:hover:not(:disabled) { border-color: #9b70d1; background: #f1e9fb; color: #4d2589; }
.quota-history-pager button:disabled { opacity: .42; cursor: default; }
.quota-history-pager span { color: #716b75; font-size: 12px; font-variant-numeric: tabular-nums; }
@keyframes quota-history-spin { to { transform: rotate(360deg); } }
html[data-theme="dark"] .quota-history-trigger { border-color: #6f5291; background: #392d47; color: #d0b3fb; }
html[data-theme="dark"] .quota-history-trigger:hover { border-color: #a57ada; background: #49365a; color: #f1e4ff; }
html[data-theme="dark"] .quota-history-dialog { border-color: #49434d; background: #211e24; color: #f7f4f1; }
html[data-theme="dark"] .quota-history-header,html[data-theme="dark"] .quota-history-footer { border-color: #464049; }
html[data-theme="dark"] .quota-history-header p,html[data-theme="dark"] .quota-history-main span,html[data-theme="dark"] .quota-history-footer > p,html[data-theme="dark"] .quota-history-pager span { color: #b8b0bb; }
html[data-theme="dark"] .quota-history-close,html[data-theme="dark"] .quota-history-pager button { border-color: #4f4853; background: #302c33; color: #e2dae5; }
html[data-theme="dark"] .quota-history-close:hover,html[data-theme="dark"] .quota-history-pager button:hover:not(:disabled) { border-color: #8c68b8; background: #413050; color: #f4eaff; }
html[data-theme="dark"] .quota-history-row { border-color: #464049; background: #2a262d; }
html[data-theme="dark"] .quota-history-value span { color: #aaa2ad; }
html[data-theme="dark"] .quota-history-value strong { color: #ff9fba; }
html[data-theme="dark"] .quota-history-row.is-reserved .quota-history-value strong { color: #ffd978; }
html[data-theme="dark"] .quota-history-row.is-refunded .quota-history-value strong { color: #91dacb; }
html[data-theme="dark"] .quota-history-state { color: #b8b0bb; }
@media(max-width:600px) {
  .quota-history-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 17px; }
  .quota-history-shell { max-height: calc(100dvh - 16px); }
  .quota-history-header { padding: 18px 16px 15px; }
  .quota-history-header h2 { font-size: 22px; }
  .quota-history-body { padding: 12px; }
  .quota-history-row { grid-template-columns: minmax(0,1fr); gap: 10px; padding: 13px; }
  .quota-history-value { min-width: 0; grid-template-columns: auto 1fr; justify-items: start; align-items: baseline; gap: 8px; }
  .quota-history-footer { align-items: stretch; flex-direction: column; padding: 12px 14px 14px; }
  .quota-history-pager { justify-content: space-between; }
}
