.hcgpt-user-limits {
	color: var( --hcgpt-type-structural-soft );
}

.hcgpt-user-limits__content {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.hcgpt-user-limits .hcgpt-settings-card {
	background: var( --hcgpt-color-surface, #fff );
	border: 1px solid var( --hcgpt-color-border, #e5e7eb );
	border-radius: var( --hcgpt-radius-md, 12px );
}

.hcgpt-user-limits .hcgpt-settings-card--structured {
	overflow: hidden;
	padding: 0;
}

.hcgpt-user-limits .hcgpt-settings-card__header,
.hcgpt-user-limits .hcgpt-settings-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px;
	background: var( --hcgpt-color-surface-2, #f4f4f5 );
}

.hcgpt-user-limits .hcgpt-settings-card__body {
	padding: 20px;
}

.hcgpt-user-limits .hcgpt-settings-card__heading {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

.hcgpt-user-limits .hcgpt-settings-icon {
	display: inline-flex;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border: 1px solid var( --hcgpt-color-border, #e5e7eb );
	border-radius: 14px;
	background: var( --hcgpt-color-surface-2, #f4f4f5 );
	color: var( --hcgpt-color-accent, #6d4aff );
}

.hcgpt-user-limits .hcgpt-settings-card__eyebrow,
.hcgpt-user-limits .hcgpt-settings-stat__label {
	margin: 0 0 6px;
	font-family: var( --hcgpt-font-mono, "Roboto Mono", monospace );
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

.hcgpt-user-limits .hcgpt-settings-card__title {
	margin: 0;
	color: var( --hcgpt-color-text, #101828 );
}

.hcgpt-user-limits .hcgpt-settings-card__description {
	margin: 6px 0 0;
	color: var( --hcgpt-color-text-muted, #667085 );
	font-size: 13px;
	line-height: 1.5;
}

.hcgpt-user-limits .hcgpt-settings-stat-grid,
.hcgpt-user-limits__grid {
	display: grid;
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	gap: 18px;
}

.hcgpt-user-limits .hcgpt-settings-stat {
	padding: 14px 16px;
	border-radius: 16px;
	background: var( --hcgpt-color-surface-2, #f4f4f5 );
}

.hcgpt-user-limits .hcgpt-settings-stat__number {
	display: block;
	margin: 0 0 4px;
	color: var( --hcgpt-color-text, #101828 );
	font-size: 26px;
	font-weight: 800;
	line-height: 1;
}

/* Settings shell Usage tab. The V4 contract owns global page width, titles,
   icon tiles and base card grammar; this file composes the Usage-specific
   plan summary, allowance stats and daily-limit meters. */
#hcgpt-app-view-settings .hcgpt-user-limits__content {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan,
#hcgpt-app-view-settings .hcgpt-user-limit-card {
	background: var( --hcgpt-settings-surface-1, var( --hcgpt-color-surface, #fff ) );
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan .hcgpt-settings-card__header,
#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__header {
	background: var( --hcgpt-settings-surface-2, var( --hcgpt-color-surface-2, #f4f4f5 ) );
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan .hcgpt-settings-card__footer,
#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__footer {
	align-items: flex-start;
	background: var( --hcgpt-settings-surface-3, var( --hcgpt-color-surface-2, #e8e8eb ) );
	color: var( --hcgpt-color-text-muted, #667085 );
	font-size: 12px;
	line-height: 1.45;
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan .hcgpt-settings-card__footer strong {
	color: var( --hcgpt-color-text, #101828 );
	font-family: var( --hcgpt-font-mono, "Roboto Mono", monospace );
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan-stats {
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan-stats .hcgpt-settings-stat {
	background: var( --hcgpt-settings-surface-2, var( --hcgpt-color-surface-2, #f4f4f5 ) );
}

#hcgpt-app-view-settings .hcgpt-user-limits__plan-stats .hcgpt-settings-stat__number {
	background: var( --hcgpt-mb-brand-gradient );
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	display: inline-block;
}

#hcgpt-app-view-settings .hcgpt-user-limits__grid {
	display: grid;
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	gap: 18px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__header {
	align-items: flex-start;
	min-height: 96px;
	padding: 18px 24px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card {
	display: flex;
	height: 100%;
	flex-direction: column;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__cap {
	flex: 0 0 auto;
	max-width: 92px;
	justify-content: center;
	white-space: nowrap;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__heading {
	flex: 1 1 auto;
	min-width: 0;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__heading-text {
	min-width: 0;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__title {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__body {
	display: flex;
	min-height: 186px;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: space-between;
	padding: 24px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__description {
	min-height: 40px;
	margin: 0 0 16px;
	color: var( --hcgpt-color-text-muted, #667085 );
	font-size: 13px;
	line-height: 1.5;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__meter {
	display: grid;
	grid-template-columns: minmax( 0, 1fr ) minmax( 0, 1fr );
	gap: 12px;
	margin: 0 0 16px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__meter > div {
	display: flex;
	min-width: 0;
	min-height: 82px;
	flex-direction: column;
	justify-content: center;
	padding: 12px 14px;
	border-radius: 14px;
	background: var( --hcgpt-settings-surface-2, var( --hcgpt-color-surface-2, #f4f4f5 ) );
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__meter-label {
	display: block;
	margin: 0 0 6px;
	color: var( --hcgpt-color-text-muted, #667085 );
	font-family: var( --hcgpt-font-mono, "Roboto Mono", monospace );
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__used,
#hcgpt-app-view-settings .hcgpt-user-limit-card__remaining {
	display: block;
	color: var( --hcgpt-color-text, #101828 );
	font-family: var( --hcgpt-font-sans, "Open Sans", system-ui, sans-serif );
	font-size: 17px;
	font-weight: 800;
	line-height: 1.2;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__progress {
	appearance: none;
	border: 0;
	display: block;
	height: 9px;
	margin: 0;
	width: 100%;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__progress::-webkit-progress-bar {
	background: var( --hcgpt-settings-surface-3, var( --hcgpt-color-surface-2, #e8e8eb ) );
	border-radius: 999px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__progress::-webkit-progress-value {
	background: var( --hcgpt-mb-brand-gradient );
	border-radius: 999px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__progress::-moz-progress-bar {
	background: var( --hcgpt-mb-brand-gradient );
	border-radius: 999px;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card__status {
	display: block;
	overflow: hidden;
	color: var( --hcgpt-color-text-muted, #667085 );
	font-size: 12px;
	line-height: 1.45;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__footer {
	min-height: 54px;
	align-items: center;
	margin-top: auto;
	padding: 0 24px;
}

@media ( max-width: 960px ) {
	#hcgpt-app-view-settings .hcgpt-user-limits__grid {
		grid-template-columns: 1fr;
	}
}

@media ( max-width: 720px ) {
	#hcgpt-app-view-settings .hcgpt-user-limits__plan-stats,
	#hcgpt-app-view-settings .hcgpt-user-limit-card__meter {
		grid-template-columns: 1fr;
	}

	#hcgpt-app-view-settings .hcgpt-user-limit-card .hcgpt-settings-card__header {
		align-items: flex-start;
		flex-direction: column;
	}
}