/*
 * EA_LAB_AI_CREDIT_FRACTION_VISUAL_V2
 * Isolated presentation only.
 * Does not change wallet value or billing calculation.
 */

#quotaUsed .ea-credit-amount__main{
  font-size:1em;
  font-weight:inherit;
  line-height:1;
}

#quotaUsed .ea-credit-amount__fraction{
  display:inline-block;
  margin-left:1px;
  font-size:0.50em !important;
  font-weight:700 !important;
  line-height:1;
  opacity:0.78;
  vertical-align:0.32em;
  letter-spacing:0;
}

#quotaUsed .ea-credit-amount__suffix{
  display:inline-block;
  margin-left:3px;
  color:#f2c76a;
  font-size:.52em;
  font-weight:850;
  line-height:1;
  vertical-align:.30em;
  letter-spacing:.04em;
}

html[data-theme="light"] #quotaUsed .ea-credit-amount__suffix{
  color:#9a6500;
}

@media (max-width:768px){
  #quotaUsed .ea-credit-amount__fraction{
    font-size:0.54em !important;
    vertical-align:0.26em;
  }
  #quotaUsed .ea-credit-amount__suffix{
    margin-left:2px;
    font-size:.56em;
    vertical-align:.24em;
  }
}
/* Daily AI allowance is intentionally separated from the durable main balance. */
.ai-credit-buckets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:13px 0 2px}
.ai-credit-bucket{min-width:0;padding:10px 11px;border:1px solid rgba(157,177,199,.24);border-radius:13px;background:rgba(6,24,42,.46)}
.ai-credit-bucket span,.ai-credit-bucket small{display:block;overflow-wrap:anywhere}
.ai-credit-bucket span{color:#9eb1c5;font-size:9px;font-weight:850}
.ai-credit-bucket strong{display:block;max-width:100%;margin:4px 0 2px;color:#f7d16e;font:850 13px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-.015em}
.ai-credit-bucket strong.is-credit-long{font-size:11px;letter-spacing:-.035em}
.ai-credit-bucket strong.is-credit-very-long{font-size:9px;letter-spacing:-.05em}
.ai-credit-bucket small{color:#7f95aa;font-size:8px;line-height:1.35}
.ai-credit-bucket.is-daily{border-color:rgba(67,207,163,.34);background:rgba(28,132,103,.08)}
.ai-credit-bucket.is-daily strong{color:#54dfae}
html[data-theme="light"] .ai-credit-bucket,body.light-mode .ai-credit-bucket{border-color:#d8c99e;background:#fffaf0}
html[data-theme="light"] .ai-credit-bucket.is-daily,body.light-mode .ai-credit-bucket.is-daily{border-color:#9cdac5;background:#f1fcf8}
html[data-theme="light"] .ai-credit-bucket span,body.light-mode .ai-credit-bucket span{color:#52677b}
html[data-theme="light"] .ai-credit-bucket small,body.light-mode .ai-credit-bucket small{color:#6f8192}
html[data-theme="light"] .ai-credit-bucket strong,body.light-mode .ai-credit-bucket strong{color:#956500}
html[data-theme="light"] .ai-credit-bucket.is-daily strong,body.light-mode .ai-credit-bucket.is-daily strong{color:#087b58}
.account-credit-flow{min-width:0}
.account-credit-flow .flow-step{min-width:0;max-width:100%;padding:5px 8px;line-height:1.25;white-space:normal;overflow-wrap:anywhere;text-align:center;font-variant-numeric:tabular-nums}
@media(max-width:420px){.ai-credit-buckets{grid-template-columns:1fr}.ai-credit-bucket{padding:9px 10px}}
