/* ===== Cost Estimate ===== */ .cost-estimate { text-align: center; font-size: 0.8rem; padding: 4px 0; margin-top: 4px; font-weight: 500; } .cost-free { color: var(--success); } .cost-paid { color: var(--warning); } /* ===== Anlas Display (Global Header) ===== */ .anlas-display { display: flex; align-items: center; gap: 6px; font-size: 0.8rem; color: var(--text-muted); padding: 4px 10px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); white-space: nowrap; } .anlas-icon { font-size: 0.9rem; } .anlas-value { font-weight: 600; font-variant-numeric: tabular-nums; } .anlas-ok { color: var(--success); } .anlas-loading { color: var(--text-muted); } .anlas-error { color: var(--error); font-weight: 400; font-size: 0.75rem; } .btn-anlas-refresh { background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 0.85rem; padding: 0 2px; transition: color var(--transition), transform var(--transition); line-height: 1; } .btn-anlas-refresh:hover { color: var(--accent); transform: rotate(180deg); } /* Header right section */ .header-right { display: flex; align-items: center; gap: 10px; } /* ===== V5 Free Usage Progress Bar ===== */ .v5-usage-display { display: flex; align-items: center; gap: 6px; font-size: 0.75rem; color: var(--text-muted); padding: 4px 10px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); white-space: nowrap; } .v5-usage-label { font-size: 0.75rem; color: var(--text-muted); } .v5-usage-bar-wrap { width: 72px; height: 6px; background: var(--border); border-radius: 3px; overflow: hidden; } .v5-usage-bar-fill { height: 100%; width: 0%; background: var(--success); border-radius: 3px; transition: width 0.3s ease; } .v5-usage-pct { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--success); min-width: 3ch; text-align: right; }