/* --- Admin --- */
.admin-tabs {
	display: flex;
	gap: 0.5rem;
	margin: 0 0 1rem;
}

.admin-tab {
	padding: 0.35rem 0.75rem;
	font-size: 0.9rem;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
	color: var(--text-muted);
	cursor: pointer;
}

.admin-tab.active {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.admin-tab {
	text-decoration: none;
	color: inherit;
}

.admin-tab-panel.hidden {
	display: none !important;
}

.admin-toolbar {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 1rem;
}

.admin-user-result {
	margin-top: 1rem;
}

.admin-user-found {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1rem 1.25rem;
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: 8px;
}

.admin-user-found-info {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.admin-user-found-row {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.4;
	color: var(--text);
}

.admin-user-found-email {
	font-weight: 600;
	color: var(--text);
}

.admin-user-found-meta {
	font-size: 0.875rem;
	color: var(--text-muted);
}

.admin-user-goto-btn {
	align-self: flex-start;
	background: var(--surface);
	color: var(--text);
	border: 1px solid var(--border);
}

.admin-user-goto-btn:hover {
	background: var(--surface-hover);
	border-color: var(--text-muted);
	color: var(--text);
}

.admin-user-card {
	display: block;
	text-align: left;
	padding: 1rem 1.25rem;
	text-decoration: none;
	border-radius: 8px;
	transition: background 0.15s, box-shadow 0.15s;
}

.admin-user-card:hover {
	background: var(--primary-hover);
	color: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.admin-user-card:hover .admin-user-email {
	color: #fff;
}

.admin-user-card .admin-user-email {
	display: block;
	font-weight: 600;
	margin-bottom: 0.35rem;
}

.admin-user-card .admin-user-meta {
	display: block;
	font-size: 0.875rem;
	color: var(--text-muted);
	margin-top: 0.25rem;
}

.admin-user-card:hover .admin-user-meta {
	color: rgba(255, 255, 255, 0.92);
}

.admin-subscription-fields {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	font-size: 0.9rem;
}

.admin-subscription-line {
	color: var(--text);
}

.admin-user-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.admin-user-toolbar {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1rem;
}

.admin-user-toolbar-left,
.admin-user-toolbar-right {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

.admin-user-actions-card {
	margin-bottom: 1rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}

.admin-user-actions-card .admin-user-toolbar {
	margin-bottom: 0;
}

.admin-user-tab.active {
	background: var(--surface);
	color: var(--primary);
	border: 2px solid var(--primary);
	box-shadow: none;
}

.admin-user-tab.active:hover {
	background: var(--surface-hover);
	color: var(--primary);
}

/* Profile nav: одна строка, без переноса */
.profile-nav-toolbar.admin-user-toolbar {
	flex-wrap: nowrap;
}

.profile-nav-toolbar .admin-user-toolbar-left {
	flex-wrap: nowrap;
	gap: 0.25rem;
}

/* Дизайн кнопок навигации профиля: минималистичные вкладки без подчёркивания */
.profile-nav-card .profile-nav-link {
	background: transparent;
	color: var(--text-muted);
	border: none;
	border-radius: 8px;
	padding: 0.5rem 1rem;
	font-size: 0.95rem;
	font-weight: 500;
	white-space: nowrap;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}

.profile-nav-card .profile-nav-link:hover {
	background: var(--surface-hover);
	color: var(--text);
}

.profile-nav-card .profile-nav-link.active {
	background: rgba(79, 70, 229, 0.1);
	color: var(--primary);
	font-weight: 600;
}

[data-theme="dark"] .profile-nav-card .profile-nav-link.active {
	background: rgba(59, 130, 246, 0.12);
	color: #93c5fd;
}

.profile-nav-card .profile-nav-link.active:hover {
	background: rgba(79, 70, 229, 0.15);
	color: var(--primary);
}

[data-theme="dark"] .profile-nav-card .profile-nav-link.active:hover {
	background: rgba(59, 130, 246, 0.18);
	color: #93c5fd;
}

.admin-user-content-card .admin-user-view.hidden {
	display: none !important;
}

.admin-user-view-placeholder {
	margin: 0.5rem 0 0;
	color: var(--text-muted);
	font-size: 0.95rem;
}

.admin-subscription-card-wrap {
	margin-top: 0.5rem;
}

.profile-subscription-section-title {
	margin: 0 0 0.65rem;
	font-size: 1.05rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--text);
}

.profile-subscription-section-title--spaced {
	margin-top: 1.5rem;
}

.admin-subscription-card-wrap .admin-subscription-card-actions {
	margin-top: 0.75rem;
}

.admin-subscription-card {
	display: inline-block;
	min-width: 280px;
	max-width: 400px;
	padding: 1.25rem;
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: var(--radius);
	gap: 0.75rem;
}

.admin-subscription-card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-bottom: 0.25rem;
}

.admin-subscription-card-header .admin-subscription-card-name {
	margin: 0;
	flex: 1;
	min-width: 0;
}

.admin-subscription-card-header-right {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.25rem;
	flex-shrink: 0;
}

.subscription-trial-badge {
	font-size: 0.75rem;
	color: var(--text-muted, #6b7280);
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
}
.subscription-trial-badge::before {
	content: '';
	display: inline-block;
	width: 0.875rem;
	height: 0.875rem;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M20 12v10H4V12M2 7h20v5H2V7zM12 22V7M12 7H7.5a2.5 2.5 0 0 1 0-5C11 2 12 7 12 7zM12 7h4.5a2.5 2.5 0 0 0 0-5C13 2 12 7 12 7z'/%3E%3C/svg%3E") no-repeat center;
	background-size: contain;
}

.subscription-type-badge {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--text-muted, #6b7280);
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	line-height: 1.3;
	white-space: nowrap;
}

.subscription-type-badge--trial::before {
	content: '';
	display: inline-block;
	width: 0.875rem;
	height: 0.875rem;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M20 12v10H4V12M2 7h20v5H2V7zM12 22V7M12 7H7.5a2.5 2.5 0 0 1 0-5C11 2 12 7 12 7zM12 7h4.5a2.5 2.5 0 0 0 0-5C13 2 12 7 12 7z'/%3E%3C/svg%3E") no-repeat center;
	background-size: contain;
}

.subscription-type-badge--promo {
	color: var(--primary, #4f6cf6);
}

.page-profile-figma .profile-figma-badge.subscription-type-badge {
	font-size: 12px;
	font-weight: 500;
	padding: 4px 10px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--pf-primary, #4f6cf6) 12%, transparent);
	color: var(--pf-primary-light, rgb(129, 140, 248));
}

.page-profile-figma .profile-figma-badge.subscription-type-badge--trial::before {
	display: none;
}

.subscription-status {
	display: inline-block;
	padding: 0.2rem 0.5rem;
	border-radius: var(--radius);
	font-size: 0.8rem;
	font-weight: 600;
	flex-shrink: 0;
}

.subscription-status--active {
	background: rgba(34, 197, 94, 0.2);
	color: #16a34a;
}

.subscription-status--cancelled {
	background: rgba(239, 68, 68, 0.2);
	color: #dc2626;
}

.subscription-status--pending {
	background: rgba(234, 179, 8, 0.2);
	color: #ca8a04;
}

.subscription-status--expired {
	background: rgba(107, 114, 128, 0.25);
	color: #6b7280;
}

.subscription-status--payment-failed {
	background: rgba(249, 115, 22, 0.2);
	color: #ea580c;
}

.subscription-status--applied {
	background: rgba(59, 130, 246, 0.2);
	color: #2563eb;
}

.subscription-status--upgraded {
	background: rgba(59, 130, 246, 0.22);
	color: #1d4ed8;
}

.subscription-status--waiting-for-payment {
	background: rgba(234, 179, 8, 0.2);
	color: #ca8a04;
}

.subscription-status--payment-not-created {
	background: rgba(148, 163, 184, 0.25);
	color: var(--text-muted);
}

.admin-subscription-card-name {
	margin: 0 0 0.5rem;
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--text);
}

.admin-subscription-card .tariff-price-line {
	margin: 0.25rem 0 0.5rem;
}

.admin-subscription-card-meta {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	font-size: 0.9rem;
	color: var(--text);
}

.admin-subscription-meta-row {
	display: block;
	line-height: 1.4;
}

.admin-subscription-meta-label {
	color: var(--text-muted);
	margin-right: 0.35rem;
}

.admin-subscription-meta-value {
	color: var(--text);
}

.admin-subscriptions-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 1rem;
}

.admin-subscriptions-list .admin-subscription-card {
	display: block;
	max-width: none;
}

#profile-active-subscription-content > .admin-subscription-card {
	display: block;
	width: 100%;
	max-width: none;
	min-width: 0;
}

#profile-active-subscription-content.admin-subscription-card-wrap {
	max-width: none;
}

.admin-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	flex-wrap: wrap;
	margin-top: 1.5rem;
}

.admin-pagination-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.35rem;
	height: 2.35rem;
	padding: 0 0.65rem;
	border: 1px solid var(--border);
	border-radius: 0.5rem;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 0.95rem;
	cursor: pointer;
	transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.admin-pagination-btn:hover:not(:disabled) {
	border-color: color-mix(in srgb, var(--primary) 50%, var(--border));
	color: var(--primary);
}

.admin-pagination-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.admin-pagination-page--current {
	color: #fff;
	background: var(--primary);
	border-color: var(--primary);
}

.admin-pagination-page--current:disabled {
	opacity: 1;
}

.admin-pagination .admin-pagination-text {
	font-size: 0.9rem;
	color: var(--text-muted);
}

.admin-pagination-ellipsis {
	padding: 0 0.25rem;
	font-size: 0.95rem;
	color: var(--text-muted);
	user-select: none;
}

/* Payments list */
.profile-payments-list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-top: 0.5rem;
}

.payment-card {
	padding: 1.25rem;
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: var(--radius);
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.payment-card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.payment-status {
	display: inline-block;
	padding: 0.2rem 0.5rem;
	border-radius: var(--radius);
	font-size: 0.8rem;
	font-weight: 600;
}

.payment-status--pending {
	background: rgba(234, 179, 8, 0.2);
	color: #ca8a04;
}

.payment-status--partial-paid {
	background: rgba(59, 130, 246, 0.2);
	color: #2563eb;
}

.payment-status--paid {
	background: rgba(34, 197, 94, 0.2);
	color: #16a34a;
}

.payment-status--cancelled {
	background: rgba(239, 68, 68, 0.2);
	color: #dc2626;
}

.payment-card-amount {
	font-weight: 600;
	font-size: 1.1rem;
	color: var(--text);
}

.payment-card-meta {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	font-size: 0.9rem;
	color: var(--text);
}

.payment-card-meta-row {
	line-height: 1.4;
}

.payment-card-meta-label {
	color: var(--text-muted);
	margin-right: 0.35rem;
}

.payment-card-crypto {
	font-size: 0.85rem;
	color: var(--text-muted);
	padding: 0.5rem 0;
	border-top: 1px solid var(--border);
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.payment-card-crypto-label {
	word-break: break-all;
}

.payment-card-crypto-extra {
	display: block;
	font-size: 0.8rem;
	color: var(--text-muted);
	margin-top: 0.25rem;
}

.payment-card-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 1rem;
	font-size: 0.95rem;
	font-weight: 500;
	text-decoration: none;
	border-radius: var(--radius);
	transition: background 0.15s, color 0.15s;
}

.payment-card-pay-link {
	display: inline;
	align-self: flex-start;
	padding: 0;
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--primary);
	text-decoration: none;
	background: none;
	border: none;
	border-radius: 0;
	box-shadow: none;
	transition: color 0.15s;
}

.payment-card-pay-link:hover {
	color: var(--primary);
	text-decoration: underline;
	background: none;
}

.payment-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.25rem;
	align-items: flex-start;
}

.payment-card-actions .btn {
	flex: 0 0 auto;
	width: auto;
}

.plans-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 0.9rem;
	margin: 0 auto 1.5rem auto;
}

.plan-card {
	border: 1px solid var(--border);
	border-radius: 8px;
	padding: 0.75rem 0.9rem;
	background: var(--surface-hover);
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.plan-card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.plan-card-name {
	font-weight: 600;
}

.plan-card-badge {
	font-size: 0.75rem;
	padding: 0.15rem 0.5rem;
	border-radius: 999px;
	border: 1px solid var(--border);
	color: var(--text-muted);
}

.plan-card-badge.active {
	color: var(--success);
	border-color: var(--success);
}

.admin-form-wrap.hidden {
	display: none;
}

.admin-form-actions {
	display: flex;
	gap: 0.75rem;
	margin-top: 0.5rem;
}

.card-title-center {
	text-align: center;
}

.card--subscription-edit .card-title-center {
	margin-bottom: 1.5rem;
}

.admin-form-actions--center {
	justify-content: center;
}


/* Profile account header (merged security) — modern summary strip */
.view--profile .profile-account-summary {
	margin-bottom: 0;
}

.view--profile .profile-account-summary-inner {
	padding: 1.35rem 1.35rem 1.4rem;
	border-radius: 14px;
	background: linear-gradient(
		145deg,
		color-mix(in srgb, var(--surface-hover) 88%, rgba(96, 165, 250, 0.14)) 0%,
		color-mix(in srgb, var(--surface) 92%, rgba(139, 92, 246, 0.1)) 100%
	);
	border: 1px solid color-mix(in srgb, var(--border) 75%, rgba(96, 165, 250, 0.35));
	box-shadow:
		0 1px 2px rgba(0, 0, 0, 0.04),
		0 8px 24px rgba(0, 0, 0, 0.06);
}

.view--profile .profile-account-email-row {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	padding-bottom: 1.15rem;
	margin-bottom: 1.15rem;
	border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}

.view--profile .profile-account-email-icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.65rem;
	height: 2.65rem;
	border-radius: 12px;
	background: color-mix(in srgb, var(--surface) 70%, rgba(96, 165, 250, 0.15));
	color: #60a5fa;
	border: 1px solid color-mix(in srgb, var(--border) 70%, rgba(96, 165, 250, 0.25));
}

.view--profile .profile-account-email-text {
	min-width: 0;
	flex: 1;
}

.view--profile .profile-account-summary-label {
	display: block;
	margin-bottom: 0.35rem;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--text-muted);
}

.view--profile .profile-email-value {
	display: block;
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--text);
	word-break: break-all;
	line-height: 1.35;
	letter-spacing: -0.01em;
}

.view--profile .profile-meta-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
	gap: 0.85rem 1.25rem;
	margin: 0;
}

.view--profile .profile-meta-tile {
	padding: 0.85rem 1rem;
	border-radius: 12px;
	background: var(--surface);
	border: 1px solid var(--border);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	min-width: 0;
}

.view--profile .profile-meta-tile-label {
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--text-muted);
	margin-bottom: 0.45rem;
	line-height: 1.25;
}

.view--profile .profile-meta-tile-value {
	display: block;
	font-size: 0.98rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--text);
	line-height: 1.35;
}

.view--profile .profile-password-section {
	margin-top: 1.5rem;
}

.view--profile .profile-password-section .wh-filters-toggle {
	margin-top: 0;
}

.view--profile .profile-password-panel-inner {
	padding: 1rem 2rem 1.5rem;
	box-sizing: border-box;
}

.view--profile .profile-password-panel-inner .form {
	margin-top: 0;
}

/* Security page: wider than standard profile to fit 4-column session grid */
.view--security {
	max-width: 860px;
}

/* Payments: 1.5× default profile shell width (640px → 960px) */
.view--profile.view--profile-payments {
	max-width: 960px;
}

/* Profile nav-card layout — width/spacing rules used on all view--profile / view--wide pages */
.view--profile .profile-nav-card {
	width: 100%;
	padding: 1.25rem 1.5rem;
	margin-bottom: 0;
}

.view--profile .profile-nav-card .profile-nav-toolbar {
	margin-bottom: 0;
}

.view--profile .profile-nav-card + .card {
	margin-top: 0.75rem;
}

.view--wide .profile-nav-card {
	padding: 1.25rem 1.5rem;
	margin-bottom: 0;
}

.view--wide .profile-nav-card .profile-nav-toolbar {
	margin-bottom: 0;
}

.view--wide .profile-nav-card + .card {
	margin-top: 0.75rem;
}

.view--wide .profile-nav-card + .wh-subnav-card {
	margin-top: 0.75rem;
}

.view--wide .wh-subnav-card + .card {
	margin-top: 1.5rem;
}

/* Webhooks: subnav + main content as one continuous card */
.view--wide.view--webhooks .wh-subnav-card {
	margin-bottom: 0;
	border-radius: var(--radius) var(--radius) 0 0;
	border-bottom: none;
	box-shadow: none;
}

.view--wide.view--webhooks .wh-subnav-card + .card:not(.wh-webhook-subnav-card) {
	margin-top: 0;
	border-radius: 0 0 var(--radius) var(--radius);
	border-top: none;
}

.view--wide.view--api-keys .wh-subnav-card {
	margin-bottom: 0;
	border-radius: var(--radius) var(--radius) 0 0;
	border-bottom: none;
	box-shadow: none;
}

.view--wide.view--api-keys .wh-subnav-card + .card:not(.api-stats-subnav-card):not(.wh-webhook-subnav-card) {
	margin-top: 0;
	border-radius: 0 0 var(--radius) var(--radius);
	border-top: none;
}

.view--wide.view--api-keys.view--webhooks .wh-subnav-card + .wh-webhook-subnav-card {
	margin-top: 0;
	border-radius: 0;
	border-bottom: none;
	box-shadow: none;
	border-top: 1px solid var(--border);
}

.view--wide.view--api-keys.view--webhooks .wh-webhook-subnav-card {
	margin-bottom: 0;
	border-radius: 0;
	border-bottom: none;
	box-shadow: none;
}

.view--wide.view--api-keys.view--webhooks .wh-webhook-subnav-card + .card {
	margin-top: 0;
	border-radius: 0 0 var(--radius) var(--radius);
	border-top: none;
}

.view--wide.view--api-stats-suite .wh-subnav-card + .api-stats-subnav-card {
	margin-top: 0;
	border-radius: 0;
	border-bottom: none;
	box-shadow: none;
	border-top: 1px solid var(--border);
}

.view--wide.view--api-stats-suite .api-stats-subnav-card {
	margin-bottom: 0;
	border-radius: 0;
	border-bottom: none;
	box-shadow: none;
}

.view--wide.view--api-stats-suite .api-stats-subnav-card + .api-stats-card {
	margin-top: 0;
	border-radius: 0 0 var(--radius) var(--radius);
	border-top: none;
}

.api-stats-top-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.75rem 1rem;
	margin-bottom: 1rem;
}

.api-stats-period-top {
	margin: 0;
	font-size: 0.95rem;
	color: var(--text-muted);
	font-weight: 600;
	flex: 1 1 auto;
	min-width: 0;
	line-height: 1.35;
}

.api-stats-top-toolbar .api-stats-interval-wrap {
	flex: 0 0 auto;
	margin-left: auto;
}

.api-stats-interval-count-line {
	margin: 0 0 1.1rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--text);
	line-height: 1.35;
}

.wh-deliveries-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.75rem 1rem;
	margin-bottom: 1.25rem;
}

.wh-deliveries-toolbar.wh-deliveries-toolbar--deliveries-all {
	flex-wrap: nowrap;
	overflow-x: auto;
	overflow-y: visible;
	padding-bottom: 0.2rem;
	-webkit-overflow-scrolling: touch;
	scrollbar-gutter: stable;
	gap: 0.65rem 0.85rem;
}

.wh-deliveries-toolbar.wh-deliveries-toolbar--deliveries-all .wh-deliveries-field:not(.wh-deliveries-field--grow) {
	flex-shrink: 0;
}

.wh-deliveries-toolbar.wh-deliveries-toolbar--deliveries-all .wh-deliveries-field--grow {
	flex: 1 1 12rem;
	min-width: 8rem;
	max-width: none;
}

.wh-deliveries-toolbar .wh-deliveries-field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 10rem;
}

.wh-deliveries-toolbar .wh-deliveries-field--grow {
	flex: 1 1 12rem;
	min-width: 8rem;
	max-width: 22rem;
}

.wh-deliveries-toolbar .wh-deliveries-field--datetime {
	flex: 0 1 14rem;
	min-width: 12rem;
	max-width: 17rem;
}

.wh-deliveries-toolbar .wh-filter-datetime {
	width: 100%;
	min-width: 0;
}

/* Same height/visual weight as API REST «Результат» / «Эндпоинт» (api-stats-interval-select, 2.4rem) */
.wh-deliveries-toolbar .spot-input,
.api-rest-filters-toolbar .spot-input {
	box-sizing: border-box;
	min-height: 2.4rem;
	height: auto;
	padding: 0.45rem 0.65rem;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.35;
	border-radius: 10px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

.wh-deliveries-toolbar select.spot-input {
	padding-right: 1.85rem;
}

.wh-deliveries-toolbar .wh-deliveries-field .api-stats-interval-wrap {
	width: 100%;
	min-width: 0;
}

.wh-deliveries-toolbar .wh-deliveries-field .api-stats-interval-wrap select.spot-input {
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
}

.whd-payload-modal-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.75rem;
	flex-shrink: 0;
	margin-bottom: 0.75rem;
}

.whd-payload-modal-title {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.35;
	min-width: 0;
	flex: 1 1 auto;
}

.whd-payload-copy-btn {
	flex-shrink: 0;
	padding: 0.4rem 0.55rem;
	min-height: 2.25rem;
}

.whd-payload-modal .whd-payload-json-pre {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
	height: auto;
	overflow: auto;
	overflow-x: auto;
	white-space: pre;
	min-width: 0;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	margin: 0 0 1rem;
	padding: 1rem 1.1rem 1.1rem;
	border-radius: 12px;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	box-sizing: border-box;
}

.whd-payload-modal .payment-modal-actions {
	flex-shrink: 0;
	margin-top: auto;
}

.page-profile-figma .payment-modal-overlay > .modal-overlay-busy,
.page-profile-figma .payment-modal > .modal-overlay-busy,
.page-profile-figma .profile-figma-modal > .modal-overlay-busy {
	position: absolute;
	inset: 0;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: inherit;
	background: color-mix(in srgb, var(--pf-modal-bg, var(--surface)) 55%, transparent);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}

.page-profile-figma .payment-modal-overlay > .modal-overlay-busy.hidden,
.page-profile-figma .payment-modal > .modal-overlay-busy.hidden,
.page-profile-figma .profile-figma-modal > .modal-overlay-busy.hidden {
	display: none;
}

html[data-theme="light"] .page-profile-figma .payment-modal-overlay > .modal-overlay-busy,
html[data-theme="light"] .page-profile-figma .payment-modal > .modal-overlay-busy,
html[data-theme="light"] .page-profile-figma .profile-figma-modal > .modal-overlay-busy {
	background: color-mix(in srgb, var(--pf-modal-bg, #fff) 60%, transparent);
}

.page-profile-figma .payment-modal-overlay > .modal-overlay-busy .confirm-modal-loading-spinner,
.page-profile-figma .payment-modal > .modal-overlay-busy .confirm-modal-loading-spinner,
.page-profile-figma .profile-figma-modal > .modal-overlay-busy .confirm-modal-loading-spinner {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 3px solid color-mix(in srgb, var(--primary) 22%, transparent);
	border-top-color: var(--primary);
	animation: load-spin 0.72s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}

.view--webhooks .whd-list-wrap {
	margin-top: 0.75rem;
}

.view--webhooks .whd-delivery-list {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.view--webhooks .whd-delivery-card {
	border-radius: 0.75rem;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	box-shadow: none;
	padding: 1.25rem;
	transition: border-color 0.15s ease;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

html[data-theme="light"] .view--webhooks .whd-delivery-card {
	background: var(--pf-modal-bg, #ffffff);
	border-color: rgba(45, 58, 79, 0.18);
}

.view--webhooks .whd-delivery-card:hover {
	border-color: color-mix(in srgb, var(--primary) 30%, var(--border));
	box-shadow: none;
}

.view--webhooks .whd-card__line--head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem 0.75rem;
	flex-wrap: wrap;
	min-height: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.view--webhooks .whd-card__head-left {
	min-width: 0;
	flex: 1 1 auto;
}

.view--webhooks .whd-card__head-left .profile-api-rest-card__path-wrap {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 100%;
}

.view--webhooks .whd-card__head-badges {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-left: auto;
}

.view--webhooks .whd-card__line--head .whd-type-pill {
	font-size: 0.74rem;
	font-weight: 700;
	padding: 0.28rem 0.55rem;
	border-radius: 7px;
}

.view--webhooks .whd-card__line--head .whd-status {
	font-size: 0.8rem;
	font-weight: 700;
	padding: 0.24rem 0.55rem;
	border-radius: 8px;
}

.view--webhooks .whd-card__line--head .whd-http {
	font-size: 0.8rem;
	font-weight: 700;
	padding: 0.24rem 0.58rem;
	min-width: 2.75rem;
	text-align: center;
	border-radius: 8px;
}

.view--webhooks .whd-card__line--head .whd-http.whd-http--message {
	min-width: 0;
	max-width: min(16rem, 72vw);
}

.view--webhooks .whd-http.whd-http--error {
	background: rgba(248, 113, 113, 0.14);
	color: #f87171;
	border-color: rgba(248, 113, 113, 0.32);
	font-weight: 500;
}

.view--webhooks .whd-card__line--uuids {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 0.55rem 1.35rem;
}

.view--webhooks .whd-card__uuid-group {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.28rem 0.42rem;
	min-width: 0;
	flex: 0 1 auto;
	max-width: 100%;
}

.view--webhooks .whd-card__uuid-pair {
	display: inline-flex;
	align-items: center;
	gap: 0.28rem;
	min-width: 0;
	flex: 0 1 auto;
	max-width: 100%;
}

.view--webhooks .whd-card__uuid-lbl {
	font-size: 0.64rem;
	font-weight: 700;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	flex-shrink: 0;
	line-height: 1.2;
	align-self: center;
}

.view--webhooks .whd-card__uuid-txt {
	font-size: 0.76rem;
	line-height: 1.3;
	font-family: ui-monospace, 'Cascadia Code', 'Segoe UI Mono', monospace;
	font-variant-numeric: tabular-nums;
	color: var(--text);
	flex: 0 1 auto;
	max-width: min(36rem, 55vw);
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	background: none;
	border: none;
	padding: 0;
}

.view--webhooks .whd-card__uuid-pair .profile-api-rest-copy-btn,
.view--webhooks .whd-card__head-left .profile-api-rest-copy-btn,
.view--webhooks .whd-card__stat-val .profile-api-rest-copy-btn {
	flex-shrink: 0;
	width: 1.125rem;
	height: 1.125rem;
	padding: 0;
	min-height: 0;
}

/* Grid: coin + 4 date/attempt columns */
.view--webhooks .whd-card__line--stats {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	column-gap: 1.25rem;
	row-gap: 1rem;
	min-width: 0;
	overflow: visible;
	padding: 0.1rem 0 0.06rem;
}

.view--webhooks .whd-card__stat-cell {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 0;
	min-width: 0;
	flex: 0 1 auto;
}

.view--webhooks .whd-card__stat-cell--coin {
	min-width: 0;
	max-width: 100%;
}

/* По ширине текста + кнопки; без stretch — иначе .whd-card__stat-val тянется на max-width и остаётся пусто */
.view--webhooks .whd-card__stat-cell--url {
	max-width: 8.75rem;
	min-width: 0;
	align-items: flex-start;
	margin-right: 0.45rem;
}

.view--webhooks .whd-card__stat-cell--attempts {
	min-width: 0;
}

.view--webhooks .whd-card__stat-cell--dt {
	min-width: 0;
}

.view--webhooks .whd-card__stat-lbl {
	margin-bottom: 0.25rem;
	font-size: 0.75rem;
	font-weight: 400;
	color: var(--text-muted);
	text-transform: none;
	letter-spacing: normal;
	line-height: 1.2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 0;
	display: block;
	max-width: 100%;
}

.view--webhooks .whd-card__stat-val {
	font-size: 0.875rem;
	line-height: 1.3125rem;
	height: 1.3125rem;
	min-height: 1.3125rem;
	color: var(--text);
	font-variant-numeric: tabular-nums;
	min-width: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.35rem;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

.view--webhooks .whd-card__stat-url {
	min-width: 0;
	flex: 0 1 auto;
	max-width: 5.5rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 500;
}

.view--webhooks .whd-card__stat-cell--url .whd-card__stat-val {
	display: inline-flex;
	flex: 0 0 auto;
	gap: 0.3rem;
	min-width: 0;
	max-width: 100%;
	padding-right: 0.8rem;
}

.view--webhooks .whd-card__stat-cell--coin .whd-card__stat-val {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 1.68rem;
}

.view--webhooks .whd-card__line--actions {
	padding-top: 0.05rem;
	align-self: flex-start;
}

.view--webhooks .whd-card__line--actions .whd-btn-payload {
	width: auto;
	min-height: 2rem;
	padding: 0.35rem 0.75rem;
	font-weight: 600;
	font-size: 0.82rem;
}

.view--webhooks .whd-truncate {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.view--webhooks .whd-type-pill {
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 0.22rem 0.48rem;
	border-radius: 7px;
	border: 1px solid transparent;
	white-space: nowrap;
}

.view--webhooks .whd-type-pill--spot_arbitrage {
	background: rgba(59, 130, 246, 0.12);
	color: #60a5fa;
	border-color: rgba(59, 130, 246, 0.32);
}

.view--webhooks .whd-type-pill--futures_arbitrage {
	background: rgba(139, 92, 246, 0.12);
	color: #a78bfa;
	border-color: rgba(139, 92, 246, 0.32);
}

.view--webhooks .whd-type-pill--spot_futures_arbitrage {
	background: rgba(34, 197, 94, 0.12);
	color: #4ade80;
	border-color: rgba(34, 197, 94, 0.3);
}

.view--webhooks .whd-type-pill--funding_arbitrage {
	background: rgba(244, 114, 182, 0.12);
	color: #f472b6;
	border-color: rgba(244, 114, 182, 0.32);
}

.view--webhooks .whd-type-pill--unknown {
	background: var(--surface-hover);
	color: var(--text-muted);
	border-color: var(--border);
}

[data-theme="light"] .view--webhooks .whd-type-pill--spot_arbitrage {
	color: #2563eb;
}

[data-theme="light"] .view--webhooks .whd-type-pill--futures_arbitrage {
	color: #7c3aed;
}

[data-theme="light"] .view--webhooks .whd-type-pill--spot_futures_arbitrage {
	color: #16a34a;
}

.view--webhooks .whd-status {
	font-size: 0.75rem;
	font-weight: 700;
	padding: 0.24rem 0.52rem;
	border-radius: 8px;
	border: 1px solid transparent;
	white-space: nowrap;
	text-transform: lowercase;
}

.view--webhooks .whd-status--ok {
	background: rgba(34, 197, 94, 0.16);
	color: #4ade80;
	border-color: rgba(34, 197, 94, 0.35);
}

.view--webhooks .whd-status--fail {
	background: rgba(248, 113, 113, 0.14);
	color: #f87171;
	border-color: rgba(248, 113, 113, 0.32);
}

.view--webhooks .whd-status--pending {
	background: rgba(251, 191, 36, 0.14);
	color: #fbbf24;
	border-color: rgba(251, 191, 36, 0.35);
}

.view--webhooks .whd-status--neutral {
	background: var(--surface-hover);
	color: var(--text-muted);
	border-color: var(--border);
	text-transform: none;
}

.view--webhooks .whd-http {
	font-size: 0.78rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	padding: 0.28rem 0.6rem;
	border-radius: 8px;
	border: 1px solid transparent;
	min-width: 2.85rem;
	text-align: center;
	letter-spacing: 0.02em;
}

.view--webhooks .whd-http--na {
	background: var(--surface-hover);
	color: var(--text-muted);
	border-color: var(--border);
	font-weight: 600;
}

.view--webhooks .whd-http--2xx {
	background: rgba(34, 197, 94, 0.16);
	color: #4ade80;
	border-color: rgba(34, 197, 94, 0.35);
}

.view--webhooks .whd-http--3xx {
	background: rgba(56, 189, 248, 0.14);
	color: #38bdf8;
	border-color: rgba(56, 189, 248, 0.35);
}

.view--webhooks .whd-http--4xx {
	background: rgba(251, 191, 36, 0.16);
	color: #fbbf24;
	border-color: rgba(251, 191, 36, 0.38);
}

.view--webhooks .whd-http--5xx {
	background: rgba(248, 113, 113, 0.16);
	color: #f87171;
	border-color: rgba(248, 113, 113, 0.35);
}

/* --- Profile --- */
.view--profile .card h2 {
	margin-bottom: 1.25rem;
}

/* Платежи: шире стандартного профиля (×1.5 к базовой ширине 640px) */
.view--profile.view--profile-payments {
	max-width: 960px;
}

.profile-email-block {
	margin-bottom: 2rem;
}

.profile-label {
	display: block;
	font-size: 0.9rem;
	color: var(--text-muted);
	margin-bottom: 0.25rem;
}

.profile-email-value {
	font-size: 1.1rem;
	font-weight: 500;
}

.profile-section {
	margin-bottom: 2rem;
}

.profile-change-password-wrap {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--border);
}

.profile-change-password-wrap.hidden {
	display: none !important;
}

.profile-logout {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--border);
}

/* Active sessions — table header + card rows */
.profile-security-sessions-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1rem;
	flex-wrap: wrap;
}

.profile-security-sessions-header .profile-section-title {
	margin-top: 0;
	margin-bottom: 0.35rem;
	font-size: 1.05rem;
	font-weight: 600;
	letter-spacing: -0.02em;
}

.security-sessions-quota {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--text-muted);
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.02em;
	flex-shrink: 0;
	margin-bottom: 0.35rem;
	align-self: flex-start;
	padding-top: 0.12rem;
}

.profile-security-sessions {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.security-sessions-table-wrap {
	margin-top: 1rem;
}

.security-sessions-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1.15rem;
}

.security-sessions-list > li.security-sessions-list-item {
	list-style: none;
	margin: 0;
	padding: 0;
}

.security-session-card {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 0;
	box-shadow:
		0 1px 2px rgba(0, 0, 0, 0.04),
		0 4px 14px rgba(0, 0, 0, 0.05);
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.security-session-card:hover {
	border-color: color-mix(in srgb, var(--border) 50%, rgba(96, 165, 250, 0.4));
	box-shadow:
		0 1px 3px rgba(0, 0, 0, 0.06),
		0 8px 22px rgba(0, 0, 0, 0.07);
}

.security-session-card--current {
	border-color: color-mix(in srgb, var(--primary) 52%, var(--border));
	background: color-mix(in srgb, var(--primary) 8%, var(--surface));
	box-shadow:
		0 1px 2px rgba(0, 0, 0, 0.04),
		0 4px 18px color-mix(in srgb, var(--primary) 16%, transparent);
}

.security-session-card--current:hover {
	border-color: color-mix(in srgb, var(--primary) 65%, var(--border));
	box-shadow:
		0 1px 3px rgba(0, 0, 0, 0.06),
		0 8px 26px color-mix(in srgb, var(--primary) 22%, transparent);
}

.security-session-current-badge {
	display: inline-flex;
	align-items: center;
	margin: 0 0 0.42rem;
	padding: 0.28rem 0.68rem;
	border-radius: 999px;
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--primary);
	background: color-mix(in srgb, var(--primary) 15%, transparent);
	border: 1px solid color-mix(in srgb, var(--primary) 38%, transparent);
	line-height: 1.2;
}

.security-session-row {
	display: grid;
	grid-template-columns: minmax(5.5rem, 1fr) minmax(5.5rem, 1fr) minmax(8.5rem, 1.2fr) minmax(8.5rem, 1.2fr);
	gap: 0.65rem 1rem;
	align-items: start;
	padding: 1rem 1rem 1.05rem;
}

.security-session-field {
	display: flex;
	flex-direction: column;
	gap: 0.28rem;
	min-width: 0;
}

.security-session-label {
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--text-muted);
	line-height: 1.25;
}

.security-session-value {
	font-size: 0.88rem;
	color: var(--text);
	word-break: break-all;
	line-height: 1.4;
	min-width: 0;
	font-variant-numeric: tabular-nums;
}

.security-session-field:nth-child(1) .security-session-value,
.security-session-field:nth-child(2) .security-session-value {
	font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
	font-size: 0.84rem;
}

.security-sessions-empty {
	margin: 1rem 0 0;
	font-size: 0.95rem;
	color: var(--text-muted);
	padding: 0 0.15rem;
}

@media (max-width: 760px) {
	.security-session-row {
		grid-template-columns: repeat(2, 1fr);
		padding: 0.9rem 0.85rem;
	}
}

@media (max-width: 420px) {
	.security-session-row {
		grid-template-columns: 1fr;
	}
}

.profile-security-2fa {
	border-top: 1px solid var(--border);
}

.profile-panel .profile-panel-section.profile-security-2fa {
	padding-top: 1.35rem;
	padding-bottom: 1.35rem;
}

.profile-security-2fa-content {
	margin-top: 0;
}

.profile-security-2fa-row {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	flex-wrap: wrap;
	margin-bottom: 0.75rem;
}

.profile-security-2fa-status {
	display: inline-flex;
	align-items: center;
	padding: 0.3rem 0.6rem;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 600;
	border: 1px solid var(--border);
}

.profile-security-2fa-status--enabled {
	color: #86efac;
	background: rgba(34, 197, 94, 0.15);
	border-color: rgba(34, 197, 94, 0.45);
}

.profile-security-2fa-status--disabled {
	color: var(--text-muted);
	background: rgba(139, 156, 179, 0.12);
}

.profile-security-2fa-actions {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}

.profile-security-google-line {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 0.9rem 1rem;
}

.profile-security-google-left {
	display: flex;
	align-items: baseline;
	gap: 0.75rem;
	min-width: 0;
}

.profile-security-google-title {
	font-size: 1.05rem;
	font-weight: 700;
	white-space: nowrap;
	color: var(--text);
}

.profile-security-google-title--enabled {
	color: var(--text);
}

.profile-security-google-title--disabled {
	color: var(--text);
}

.profile-security-google-status {
	font-size: 0.95rem;
	font-weight: 600;
	white-space: nowrap;
}

.profile-security-google-status--enabled {
	color: #22c55e;
}

.profile-security-google-status--disabled {
	color: #ef4444;
}

.profile-security-google-actions {
	display: flex;
	gap: 0.5rem;
}

/* --- Profile: Telegram --- */
.view--profile .profile-telegram-section {
	margin-top: 2.25rem;
	padding-top: 2rem;
	border-top: 1px solid var(--border);
}

.profile-telegram-line {
	align-items: center;
	flex-wrap: wrap;
}

.profile-telegram-left {
	align-items: center;
	gap: 0.85rem;
}

.profile-telegram-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 12px;
	background: rgba(56, 174, 240, 0.12);
	color: #38aef0;
	flex-shrink: 0;
}

[data-theme='dark'] .profile-telegram-icon {
	background: rgba(56, 174, 240, 0.18);
	color: #7dd3fc;
}

.profile-telegram-text-block {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 0;
}

.profile-telegram-sub {
	font-size: 0.875rem;
	color: var(--text-muted);
	line-height: 1.4;
	max-width: 36rem;
}

.profile-telegram-linked-badge {
	color: #22c55e;
}

[data-theme='dark'] .profile-telegram-linked-badge {
	color: #86efac;
}

.profile-telegram-username-row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.35rem 0.75rem;
	margin-top: 0.15rem;
}

.profile-telegram-meta-label {
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--text-muted);
}

.profile-telegram-meta-value {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--text);
	word-break: break-all;
}

.profile-telegram-meta-value--muted {
	font-weight: 500;
	font-style: italic;
	color: var(--text-muted);
}

.profile-telegram-bot-link {
	font-weight: 600;
	margin-left: 0.25rem;
}

.profile-telegram-totp-hint,
.profile-telegram-token-intro {
	margin: 0 0 0.75rem;
	font-size: 0.9rem;
	color: var(--text-muted);
	line-height: 1.45;
}

.profile-telegram-token-steps {
	margin: 0 0 1rem;
	padding-left: 1.25rem;
	color: var(--text);
	line-height: 1.55;
	font-size: 0.92rem;
}

.profile-telegram-token-steps li {
	margin-bottom: 0.5rem;
}

.profile-telegram-token-box {
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 0.85rem 1rem;
	margin-bottom: 0.75rem;
}

.profile-telegram-token-label {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--text-muted);
	margin-bottom: 0.5rem;
}

.profile-telegram-token-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.65rem;
}

.profile-telegram-token-code {
	flex: 1;
	min-width: 0;
	display: block;
	font-size: 1rem;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	padding: 0.45rem 0.6rem;
	border-radius: 8px;
	background: var(--surface);
	border: 1px solid var(--border);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1.35;
}

.profile-telegram-token-copy {
	flex-shrink: 0;
}

.profile-telegram-token-copy--icon-only {
	min-width: 2.5rem;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.profile-telegram-token-copy--icon-only .profile-telegram-token-copy-icon {
	display: block;
}

.profile-telegram-token-footer {
	margin: 0 0 1rem;
	font-size: 0.85rem;
	color: var(--text-muted);
	line-height: 1.45;
}

.telegram-link-token-modal {
	max-width: 520px;
}

.telegram-totp-modal {
	max-width: 420px;
}

.totp-enable-modal {
	max-width: 540px;
}

.profile-security-method-title {
	margin: 0 0 0.75rem 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--text);
}

.totp-enable-qr-wrap {
	display: flex;
	justify-content: center;
	margin: 0.75rem 0;
}

.totp-enable-qr {
	width: 160px;
	height: 160px;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: #fff;
}

.totp-enable-secret-row {
	margin-bottom: 0.75rem;
}

.totp-enable-phrase-code-row {
	display: flex;
	align-items: center;
	gap: 0.65rem;
}

.totp-enable-secret {
	flex: 1;
	display: inline-flex;
	padding: 0.4rem 0.55rem;
	border-radius: 8px;
	background: var(--surface-hover);
	border: 1px solid var(--border);
	color: var(--text);
	user-select: all;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
	min-width: 0;
}

.totp-copy-secret-btn {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
	color: var(--text-muted);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.totp-copy-secret-btn:hover {
	background: var(--surface);
	color: var(--text);
	border-color: var(--text-muted);
}

.totp-email-code-field {
	position: relative;
	display: flex;
	width: 100%;
}

.totp-email-code-field input {
	width: 100%;
	padding-right: 11rem;
}

.totp-resend-overlay-btn {
	position: absolute;
	right: 0.35rem;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	background: none;
	border: none;
	padding: 0;
	font-size: 0.95rem;
}

.totp-resend-overlay-cooldown {
	position: absolute;
	right: 0.35rem;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	color: var(--text-muted);
	font-size: 0.95rem;
	white-space: nowrap;
}

.totp-enable-steps {
	margin: 0 0 0.25rem 1.25rem;
	padding: 0;
}

.totp-enable-steps li {
	margin: 0.25rem 0;
	color: var(--text-muted);
	font-size: 0.95rem;
}

.profile-security-code-row {
	display: flex;
	gap: 0.5rem;
	align-items: center;
}

.profile-security-code-row input {
	flex: 1;
}

.totp-resend-slot {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.totp-resend-cooldown {
	padding: 0.55rem 0.75rem;
	border-radius: 8px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
	color: var(--text-muted);
	min-width: 200px;
	text-align: center;
	font-size: 0.95rem;
}

/* --- API keys (profile) --- */
.view.view--wide.view--api-keys {
	max-width: 1320px;
	width: 100%;
}

.view.view--wide.view--api-keys.view--api-rest-page {
	max-width: 62rem;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

.api-stats-card .sr-only,
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.api-stats-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 0.5rem 1rem;
	margin-bottom: 0.35rem;
}

.api-stats-title {
	margin: 0;
	font-size: 1.35rem;
	font-weight: 700;
}

.api-stats-interval-row {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: 100%;
	margin-top: 1.25rem;
	margin-bottom: 1rem;
	gap: 0.5rem;
}

.api-stats-interval-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
}

.api-stats-interval-select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	box-sizing: border-box;
	min-width: 7.25rem;
	max-width: 8.85rem;
	width: 8.25rem;
	min-height: 2.4rem;
	padding: 0.45rem 1.9rem 0.45rem 0.65rem;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
	color: var(--text);
	font-weight: 600;
	font-size: 0.875rem;
	font-family: inherit;
	cursor: pointer;
	line-height: 1.35;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
	transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.api-stats-interval-select:hover:not(:disabled) {
	border-color: rgba(96, 165, 250, 0.55);
	background: var(--surface);
}

.api-stats-interval-select:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.28);
}

.api-stats-interval-select:disabled {
	opacity: 0.72;
	cursor: wait;
}

.api-stats-interval-chevron {
	position: absolute;
	right: 0.55rem;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: var(--text-muted);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.18s ease;
}

.api-stats-interval-wrap.api-stats-interval-wrap--chevron-up .api-stats-interval-chevron {
	transform: translateY(-50%) rotate(180deg);
}

.api-stats-card.api-stats-card--refreshing {
	position: relative;
}

.api-stats-card.api-stats-card--refreshing::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--overlay-scrim);
	border-radius: inherit;
	pointer-events: none;
	opacity: 0.35;
	z-index: 1;
}

.api-stats-content {
	margin-top: 0.35rem;
	position: relative;
	z-index: 0;
}

.api-stats-cu-panel .api-stats-billing-range {
	margin: 0 0 0.9rem;
	padding: 0;
	font-size: 0.93rem;
	font-weight: 600;
	color: var(--text-muted);
	line-height: 1.4;
}

.api-stats-cu-panel {
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	padding: 1rem 1.15rem 1.05rem;
	margin-bottom: 0;
}

.api-stats-cu-top {
	margin-bottom: 0.65rem;
}

.api-stats-cu-used-lbl {
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--text);
}

.api-stats-progress-track {
	height: 0.88rem;
	border-radius: 999px;
	background: var(--surface-hover);
	border: 1px solid var(--border);
	overflow: hidden;
}

.api-stats-progress-fill {
	height: 100%;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--primary), #38bdf8);
	width: 0%;
	transition: width 0.35s ease;
	min-width: 0;
	box-sizing: border-box;
}

.api-stats-cu-bottom {
	margin-top: 0.55rem;
	text-align: right;
}

.api-stats-cu-limit-lbl {
	font-weight: 700;
	font-size: 0.94rem;
	color: var(--text);
	line-height: 1.35;
}

.api-stats-interval-heading {
	margin: 0 0 1rem;
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--text);
	line-height: 1.35;
}

.api-stats-type-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: 0.75rem;
	margin-bottom: 1.65rem;
}

.api-stats-type-card {
	border: 1px solid var(--border);
	border-radius: var(--radius);
	padding: 0.85rem 1rem;
	background: var(--surface-hover);
}

.api-stats-type-card-head {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	margin-bottom: 0.5rem;
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--text);
}

.api-stats-type-metrics {
	font-size: 0.88rem;
	color: var(--text-muted);
	line-height: 1.55;
}

.api-stats-type-metrics strong {
	color: var(--text);
	font-weight: 600;
}

.api-stats-type-dot {
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 50%;
	flex-shrink: 0;
}

.api-stats-type-dot--rest {
	background: #60a5fa;
}

.api-stats-type-dot--ws {
	background: #34d399;
}

.api-stats-type-dot--wh {
	background: #c084fc;
}

.api-stats-chart-block {
	margin-top: 0.35rem;
}

.api-stats-chart-block--extra {
	margin-top: 1.85rem;
	padding-top: 1.35rem;
	border-top: 1px solid var(--border);
}

.api-stats-chart-title {
	margin: 0 0 0.6rem;
	font-size: 1.05rem;
	font-weight: 600;
}

.api-stats-chart-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem 1.35rem;
	margin-bottom: 0.65rem;
	font-size: 0.84rem;
	color: var(--text-muted);
}

.api-stats-legend-item {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}

.api-stats-chart-host {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface-hover);
	padding: 0.35rem 0.25rem 0;
	box-sizing: border-box;
}

.api-stats-chart-svg {
	display: block;
	color: var(--text-muted);
	min-width: 280px;
}

.api-stats-chart-empty {
	margin: 0.65rem 0 0;
}

.api-stats-chart-tooltip {
	position: fixed;
	z-index: 3000;
	max-width: min(22rem, calc(100vw - 24px));
	padding: 0.75rem 0.95rem;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: var(--surface);
	box-shadow: var(--shadow);
	pointer-events: none;
	font-size: 0.86rem;
	line-height: 1.45;
}

.api-stats-tooltip-title {
	font-weight: 700;
	margin-bottom: 0.45rem;
	color: var(--text);
	font-size: 0.88rem;
}

.api-stats-tooltip-row {
	display: flex;
	align-items: flex-start;
	gap: 0.4rem;
	margin-top: 0.3rem;
	color: var(--text-muted);
}

/* --- REST request history (API profile) --- */
.api-rest-filters-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 1rem 1.5rem;
	margin-bottom: 0.6rem;
}

.api-rest-filter-field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 0;
}

.api-rest-filter-field--endpoint {
	flex: 0 0 auto;
}

.profile-label--api-rest-filter {
	margin-bottom: 0;
}

.api-rest-filters-toolbar .api-stats-interval-wrap {
	vertical-align: unset;
}

.api-rest-filters-toolbar .api-stats-interval-select {
	width: auto;
	min-width: 10.5rem;
	max-width: 20rem;
}

/* Datetime range fields: same layout/input sizing as webhook deliveries toolbar */
.api-rest-filters-toolbar .wh-deliveries-field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 10rem;
}

.api-rest-filters-toolbar .wh-deliveries-field--datetime {
	flex: 0 1 14rem;
	min-width: 12rem;
	max-width: 17rem;
}

.api-rest-filters-toolbar .wh-filter-datetime {
	width: 100%;
	min-width: 0;
}

/* Custom endpoint dropdown: list opens below trigger */
.api-rest-endpoint-dd {
	position: relative;
	display: block;
	max-width: 100%;
}

.api-rest-endpoint-dd__trigger {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	box-sizing: border-box;
	width: 100%;
	min-height: 2.4rem;
	padding: 0.45rem 1.9rem 0.45rem 0.65rem;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
	color: var(--text);
	font-weight: 600;
	font-size: 0.875rem;
	font-family: inherit;
	cursor: pointer;
	line-height: 1.35;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
	transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
	display: block;
	position: relative;
	text-align: left;
}

.api-rest-endpoint-dd__trigger:hover {
	border-color: rgba(96, 165, 250, 0.55);
	background: var(--surface);
}

.api-rest-endpoint-dd__trigger:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.28);
}

.api-rest-endpoint-dd__value {
	display: block;
	width: 100%;
	box-sizing: border-box;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.api-rest-endpoint-dd__chevron {
	position: absolute;
	right: 0.55rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-muted);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	transition: transform 0.18s ease;
}

.api-rest-endpoint-dd--open .api-rest-endpoint-dd__chevron {
	transform: translateY(-50%) rotate(180deg);
}

.filter-custom-select--open .api-rest-endpoint-dd__chevron {
	transform: translateY(-50%) rotate(180deg);
}

.profile-api-rest-filters-grid .filter-custom-select--open,
.profile-api-rest-page .profile-api-rest-filters-grid .filter-custom-select--open {
	z-index: 1200;
	position: relative;
}

.profile-api-rest-filters-grid .filter-custom-select--open .api-rest-endpoint-dd__menu,
.profile-api-rest-page .profile-api-rest-filters-grid .filter-custom-select--open .api-rest-endpoint-dd__menu {
	z-index: 1201;
}

.api-rest-endpoint-dd__menu {
	position: absolute;
	left: 0;
	top: calc(100% + 0.28rem);
	z-index: 40;
	box-sizing: border-box;
	min-width: 100%;
	max-width: min(36rem, 92vw);
	max-height: 15rem;
	overflow-x: hidden;
	overflow-y: auto;
	margin: 0;
	padding: 0.3rem;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: var(--surface);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
}

.api-rest-endpoint-dd__option {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 0.42rem 0.55rem;
	border: none;
	border-radius: 8px;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 0.875rem;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
	transition: background 0.12s ease;
}

.api-rest-endpoint-dd__option:hover,
.api-rest-endpoint-dd__option:focus {
	outline: none;
	background: var(--surface-hover);
}

.api-rest-endpoint-dd__option--current {
	background: rgba(59, 130, 246, 0.12);
	color: var(--primary);
}

.api-rest-endpoint-dd__measure {
	position: absolute;
	left: -9999px;
	top: 0;
	white-space: nowrap;
	visibility: hidden;
	pointer-events: none;
	font-weight: 600;
	font-size: 0.875rem;
	font-family: inherit;
}

.api-rest-page-head {
	margin-bottom: 1.85rem;
}

.api-rest-page-head h2 {
	margin: 0;
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.02em;
}

.api-rest-list-wrap {
	margin-top: 1.1rem;
}

.api-rest-list {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.api-rest-card {
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	padding: 0.62rem 0.8rem 0.68rem;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.api-rest-card:hover {
	border-color: rgba(96, 165, 250, 0.35);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

.api-rest-card__row--primary {
	display: grid;
	grid-template-columns: auto minmax(0, 1.35fr) minmax(0, 1fr) auto;
	align-items: start;
	column-gap: 0.85rem;
	row-gap: 0;
}

.api-rest-primary-field {
	display: flex;
	flex-direction: column;
	gap: 0.22rem;
	min-width: 0;
}

.api-rest-card__lbl {
	display: block;
	font-size: 0.68rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--text-muted);
}

.api-rest-path-row {
	display: flex;
	align-items: stretch;
	gap: 0.35rem;
	min-width: 0;
	min-height: 2.05rem;
}

.api-rest-path-row .api-rest-path {
	flex: 1;
	min-width: 0;
	min-height: 2.05rem;
	display: flex;
	align-items: center;
}

.api-rest-path-copy {
	flex-shrink: 0;
	padding: 0.24rem 0.45rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	align-self: stretch;
}

.api-rest-path {
	font-size: 0.8125rem;
	font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
	word-break: break-all;
	color: var(--text);
	background: var(--surface-hover);
	padding: 0.28rem 0.42rem;
	border-radius: 8px;
	border: 1px solid var(--border);
	line-height: 1.35;
	box-sizing: border-box;
	min-height: 2.05rem;
}

.api-rest-primary-field .api-rest-endpoint-name {
	display: flex;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
	line-height: 1.35;
	min-height: 2.05rem;
}

.api-rest-method {
	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	padding: 0.28rem 0.65rem;
	line-height: 1.35;
	border-radius: 8px;
	border: 1px solid var(--border);
	text-transform: uppercase;
	box-sizing: border-box;
	min-height: 2.05rem;
	min-width: 4.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.api-rest-method--get {
	background: rgba(56, 189, 248, 0.14);
	color: #38bdf8;
	border-color: rgba(56, 189, 248, 0.35);
}

.api-rest-method--post {
	background: rgba(34, 197, 94, 0.14);
	color: #4ade80;
	border-color: rgba(34, 197, 94, 0.35);
}

.api-rest-method--put {
	background: rgba(251, 191, 36, 0.14);
	color: #fbbf24;
	border-color: rgba(251, 191, 36, 0.38);
}

.api-rest-method--patch {
	background: rgba(167, 139, 250, 0.16);
	color: #c4b5fd;
	border-color: rgba(167, 139, 250, 0.4);
}

.api-rest-method--del {
	background: rgba(248, 113, 113, 0.14);
	color: #f87171;
	border-color: rgba(248, 113, 113, 0.35);
}

.api-rest-method--head,
.api-rest-method--opt,
.api-rest-method--any {
	background: var(--surface-hover);
	color: var(--text-muted);
}

.api-rest-http {
	font-size: 0.72rem;
	font-weight: 700;
	padding: 0.28rem 0.65rem;
	line-height: 1.35;
	border-radius: 8px;
	border: 1px solid var(--border);
	flex-shrink: 0;
	box-sizing: border-box;
	min-height: 2.05rem;
	min-width: 3.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.api-rest-http--2xx {
	background: rgba(34, 197, 94, 0.16);
	color: #4ade80;
	border-color: rgba(34, 197, 94, 0.35);
}

.api-rest-http--3xx {
	background: rgba(56, 189, 248, 0.14);
	color: #38bdf8;
	border-color: rgba(56, 189, 248, 0.35);
}

.api-rest-http--4xx {
	background: rgba(251, 191, 36, 0.16);
	color: #fbbf24;
	border-color: rgba(251, 191, 36, 0.38);
}

.api-rest-http--5xx {
	background: rgba(248, 113, 113, 0.16);
	color: #f87171;
	border-color: rgba(248, 113, 113, 0.35);
}

.api-rest-http--na {
	background: var(--surface-hover);
	color: var(--text-muted);
}

.api-rest-card__divider {
	border: none;
	border-top: 1px solid var(--border);
	margin: 0.48rem 0 0.52rem;
	padding: 0;
	height: 0;
}

.api-rest-card__row--meta .api-rest-card__grid {
	margin: 0;
}

.api-rest-card__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
	gap: 0.55rem 1rem;
	margin: 0;
}

.api-rest-card__kv {
	margin: 0;
}

.api-rest-card__k {
	font-size: 0.68rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--text-muted);
	margin: 0 0 0.16rem;
}

.api-rest-card__v {
	margin: 0;
	font-size: 0.86rem;
	font-weight: 600;
	color: var(--text);
	word-break: break-word;
}

.api-rest-card__v--key {
	font-size: 0.8rem;
}

.api-rest-key-wrap {
	display: inline-flex;
	align-items: center;
	gap: 0.38rem;
	flex-wrap: wrap;
	max-width: 100%;
}

.api-rest-key-public {
	font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.api-rest-key-mask {
	color: var(--text-muted);
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	user-select: none;
	margin-left: 0.18rem;
	font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
}

.api-rest-card__error {
	margin-top: 0.52rem;
	padding-top: 0.55rem;
	border-top: 1px dashed var(--border);
}

.api-rest-card__err-lbl {
	display: block;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	color: #f87171;
	margin-bottom: 0.35rem;
}

.api-rest-card__err-txt {
	margin: 0;
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--text);
	white-space: pre-wrap;
	word-break: break-word;
	font-family: inherit;
	background: rgba(248, 113, 113, 0.08);
	padding: 0.45rem 0.55rem;
	border-radius: 8px;
	border: 1px solid rgba(248, 113, 113, 0.22);
}

@media (max-width: 720px) {
	.api-rest-card__row--primary {
		grid-template-columns: 1fr 1fr;
	}

	.api-rest-card__row--primary .api-rest-primary-field:nth-child(3),
	.api-rest-card__row--primary .api-rest-primary-field:nth-child(4) {
		grid-column: 1 / -1;
	}
}

@media (max-width: 480px) {
	.api-rest-card__row--primary {
		grid-template-columns: 1fr;
	}

	.api-rest-card__row--primary .api-rest-primary-field {
		grid-column: 1 / -1;
	}
}

.profile-api-features-card {
	margin-bottom: 0;
}

.profile-api-features-head h2 {
	margin: 0;
}

.profile-api-features-panel {
	margin-top: 1.25rem;
}

.profile-api-sub-badge {
	display: inline-flex;
	align-items: center;
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: 1rem;
}

.profile-api-sub-badge--inactive {
	background: rgba(248, 113, 113, 0.12);
	color: #f87171;
	border: 1px solid rgba(248, 113, 113, 0.35);
}

html[data-theme="light"] .profile-api-sub-badge--inactive {
	color: #dc2626;
	background: rgba(248, 113, 113, 0.1);
	border-color: rgba(220, 38, 38, 0.25);
}

.profile-api-features-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	gap: 1.5rem 2rem;
}

.profile-api-subnav {
	margin-bottom: 1rem;
	padding: 0.75rem;
	border-radius: 1rem;
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

html[data-theme="light"] .profile-api-subnav {
	background: var(--pf-modal-bg, #ffffff);
}

.profile-api-page {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.profile-api-page--main .profile-api-features-panel {
	margin-top: 0;
}

.profile-api-page--main .profile-api-panel {
	border-radius: 1rem;
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

html[data-theme="light"] .profile-api-page--main .profile-api-panel {
	background: rgba(255, 255, 255, 0.96);
}

.profile-api-page--main .profile-api-panel .profile-panel-section {
	padding: 2rem;
}

.profile-api-page--main .profile-api-panel-heading {
	margin: 0 0 1.5rem;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--text);
}

.profile-api-page--main .profile-api-features-section-title {
	margin: 0 0 0.75rem;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--text-muted);
}

.profile-api-page--main .profile-api-features-stack {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.profile-api-page--main .profile-api-features-cards {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.75rem;
}

.profile-api-page--main .profile-api-feature-card {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	padding: 0.75rem;
	border-radius: 0.75rem;
	border: 1px solid var(--border);
	background: rgba(255, 255, 255, 0.02);
	min-width: 0;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.profile-api-page--main .profile-api-feature-card--on {
	border-color: rgba(39, 195, 112, 0.2);
	background: rgba(39, 195, 112, 0.1);
}

html[data-theme="light"] .profile-api-page--main .profile-api-feature-card--on {
	border-color: rgba(39, 195, 112, 0.3);
	background: rgba(39, 195, 112, 0.06);
}

.profile-api-page--main .profile-api-feature-card--off {
	border-color: rgba(239, 68, 68, 0.2);
	background: rgba(239, 68, 68, 0.1);
}

html[data-theme="light"] .profile-api-page--main .profile-api-feature-card--off {
	border-color: rgba(239, 68, 68, 0.3);
	background: rgba(239, 68, 68, 0.06);
}

.profile-api-page--main .profile-api-feature-card-icon {
	display: inline-flex;
	flex-shrink: 0;
	margin-top: 0.125rem;
}

.profile-api-page--main .profile-api-feature-card-icon--on {
	color: #34d399;
}

.profile-api-page--main .profile-api-feature-card-icon--off {
	color: var(--text-muted);
}

.profile-api-page--main .profile-api-feature-card-label {
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.35;
	color: var(--text);
	min-width: 0;
}

.profile-api-page--main .profile-api-feature-card--off .profile-api-feature-card-label {
	color: var(--text-muted);
}

.profile-api-page--main .profile-api-limits-grid--compact {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.75rem;
}

.profile-api-page--main .profile-api-limit-card {
	padding: 0.75rem 1rem;
	border-radius: 0.75rem;
	border: 1px solid var(--border);
	background: rgba(79, 108, 246, 0.1);
	min-width: 0;
}

html[data-theme="light"] .profile-api-page--main .profile-api-limit-card {
	background: rgba(29, 78, 216, 0.05);
}

.profile-api-page--main .profile-api-limit-card-label {
	margin: 0 0 0.25rem;
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.35;
	color: var(--text-muted);
}

.profile-api-page--main .profile-api-limit-card-value {
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--primary);
	font-variant-numeric: tabular-nums;
}

.profile-api-keys-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.profile-api-keys-head .profile-panel-title {
	margin: 0;
}

.profile-api-keys-head-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.35rem;
}

.profile-api-keys-head-actions .profile-api-create-blocked-hint--warning {
	white-space: nowrap;
}

.profile-api-page--main .profile-api-btn-create {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.55rem 1.15rem 0.55rem 0.85rem;
	border-radius: 0.75rem;
	font-size: 0.9375rem;
	font-weight: 500;
	box-shadow: 0 8px 24px color-mix(in srgb, var(--primary) 28%, transparent);
}

.profile-api-page--main .profile-api-btn-create svg {
	flex-shrink: 0;
	margin-top: 0.15rem;
}

.profile-api-page--main .profile-api-status {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.profile-api-page--main .profile-api-status-dot {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 999px;
	flex-shrink: 0;
}

.profile-api-page--main .profile-api-status--active .profile-api-status-dot {
	background: #34d399;
}

.profile-api-page--main .profile-api-status--active .profile-api-status-text {
	color: #34d399;
	font-size: 0.875rem;
}

.profile-api-page--main .profile-api-status--revoked .profile-api-status-dot {
	background: #f87171;
}

.profile-api-page--main .profile-api-status--revoked .profile-api-status-text {
	color: #f87171;
	font-size: 0.875rem;
}

.profile-api-page--main .profile-api-col-created,
.profile-api-page--main .profile-api-revoked-at {
	font-size: 0.875rem;
}

.profile-api-page--main .profile-api-revoked-at {
	color: var(--text-muted);
}

.profile-api-page--main .profile-api-whitelist-multi {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem;
}

.profile-api-page--main .profile-api-whitelist-ip {
	font-size: 0.875rem;
	line-height: 1.35;
}

.profile-api-page--main .profile-api-whitelist-empty {
	color: var(--text-muted);
	font-size: 0.875rem;
}

.profile-api-page--main .profile-api-whitelist-more {
	display: inline-flex;
	align-items: center;
	padding: 0.125rem 0.5rem;
	border: none;
	border-radius: 0.25rem;
	background: color-mix(in srgb, var(--primary) 10%, transparent);
	color: var(--primary);
	font-size: 0.75rem;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.15s ease;
}

.profile-api-page--main .profile-api-whitelist-more:hover {
	background: color-mix(in srgb, var(--primary) 20%, transparent);
}

.profile-api-page--main .profile-api-btn-revoke {
	display: inline-flex;
	align-items: center;
	padding: 0.375rem 0.75rem;
	border: 1px solid rgba(239, 68, 68, 0.5);
	border-radius: 0.5rem;
	background: transparent;
	color: #ef4444;
	font: inherit;
	font-size: 0.875rem;
	line-height: 1.25;
	cursor: pointer;
	transition: background 0.15s ease;
}

.profile-api-page--main .profile-api-btn-revoke:hover {
	background: rgba(239, 68, 68, 0.08);
}

.profile-api-whitelist-modal {
	max-width: 28rem;
	width: 100%;
}

.profile-api-whitelist-modal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.profile-api-whitelist-modal-head .payment-modal-title {
	margin: 0;
}

.profile-api-whitelist-modal-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.25rem;
	border: none;
	border-radius: 0.5rem;
	background: transparent;
	color: var(--text-muted);
	cursor: pointer;
}

.profile-api-whitelist-modal-close:hover {
	background: color-mix(in srgb, var(--primary) 10%, transparent);
	color: var(--text);
}

.profile-api-whitelist-modal-list {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	max-height: 16rem;
	overflow-y: auto;
}

.profile-api-whitelist-modal-item {
	padding: 0.65rem 1rem;
	border: 1px solid var(--border);
	border-radius: 0.5rem;
	font-family: ui-monospace, monospace;
	font-size: 0.875rem;
	background: rgba(255, 255, 255, 0.02);
}

@media (max-width: 900px) {
	.profile-api-page--main .profile-api-features-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.profile-api-page--main .profile-api-limits-grid--compact {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.profile-api-page--main .profile-api-features-cards,
	.profile-api-page--main .profile-api-limits-grid--compact {
		grid-template-columns: 1fr;
	}

	.profile-api-page--main .profile-api-panel .profile-panel-section {
		padding: 1.25rem;
	}

	.profile-api-page--main .profile-api-table thead th,
	.profile-api-page--main .profile-api-table tbody td {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}
}

.profile-api-features-section-title {
	margin: 0 0 0.85rem;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text);
}

.profile-api-features-columns {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.55rem 1.25rem;
}

.profile-api-feature-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.55rem;
}

.profile-api-feature-item {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 0.55rem 0.65rem;
	padding: 0.55rem 0.7rem;
	border-radius: 0.65rem;
	border: 1px solid var(--border);
	background: rgba(255, 255, 255, 0.02);
	min-width: 0;
}

.profile-api-feature-item--on {
	border-color: rgba(74, 222, 128, 0.28);
	background: rgba(34, 197, 94, 0.06);
}

.profile-api-feature-item--off {
	opacity: 0.72;
}

.profile-api-feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.35rem;
	height: 1.35rem;
	border-radius: 999px;
	flex-shrink: 0;
}

.profile-api-feature-icon--on {
	color: #4ade80;
	background: rgba(34, 197, 94, 0.14);
}

.profile-api-feature-icon--off {
	color: #f87171;
	background: rgba(248, 113, 113, 0.12);
}

html[data-theme="light"] .profile-api-feature-icon--on {
	color: #15803d;
	background: rgba(34, 197, 94, 0.12);
}

html[data-theme="light"] .profile-api-feature-icon--off {
	color: #dc2626;
	background: rgba(248, 113, 113, 0.1);
}

.profile-api-feature-label {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--text);
	line-height: 1.35;
	min-width: 0;
}

.profile-api-feature-state {
	font-size: 0.76rem;
	font-weight: 700;
	color: var(--text-muted);
	white-space: nowrap;
}

.profile-api-limits-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
	gap: 0.75rem;
}

.profile-api-limit-item {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.75rem 0.85rem;
	border-radius: 0.75rem;
	border: 1px solid var(--border);
	background: rgba(255, 255, 255, 0.02);
	min-width: 0;
}

.profile-api-limit-label {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-muted);
	line-height: 1.35;
}

.profile-api-limit-value {
	font-size: 1.35rem;
	font-weight: 800;
	line-height: 1.2;
	color: var(--text);
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.02em;
}

.profile-api-keys-section {
	margin-top: 2.25rem;
	padding-top: 2rem;
	border-top: 1px solid var(--border);
}

.profile-api-keys-actions-row {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 1.25rem;
}

.profile-api-keys-section > .profile-api-features-section-title {
	margin-bottom: 0.85rem;
}

@media (max-width: 900px) {
	.profile-api-features-grid {
		grid-template-columns: 1fr;
	}

	.profile-api-features-columns {
		grid-template-columns: 1fr;
	}
}

.profile-api-page-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.35rem;
}

.profile-api-page-head h2 {
	margin: 0;
	flex: 1 1 auto;
	min-width: 0;
}

.profile-api-page-head-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.4rem;
	flex-shrink: 0;
	margin-left: auto;
}

.profile-api-page-head-actions .profile-api-create-blocked-hint.webhooks-create-blocked-hint {
	margin-left: -3.25rem;
	max-width: none;
	white-space: nowrap;
}

.profile-api-page--main .profile-api-table-scroll {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.profile-api-page--main .profile-api-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.875rem;
	background: transparent;
}

.profile-api-page--main .profile-api-table thead th {
	text-align: left;
	padding: 0.75rem 1rem;
	background: transparent;
	border-bottom: 1px solid var(--border);
	color: var(--text-muted);
	font-weight: 500;
	font-size: 0.875rem;
	text-transform: none;
	letter-spacing: 0;
	white-space: nowrap;
}

.profile-api-page--main .profile-api-table tbody td {
	padding: 1rem;
	border-bottom: 1px solid var(--border);
	vertical-align: middle;
	color: var(--text);
	background: transparent;
}

.profile-api-page--main .profile-api-table tbody tr.profile-api-table-row:hover td {
	background: color-mix(in srgb, var(--primary) 5%, transparent);
}

.profile-api-page--main .profile-api-cell-name {
	font-size: 1rem;
	line-height: 1.4;
}

.profile-api-page--main .profile-api-secret-with-copy {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	min-width: 0;
}

.profile-api-page--main .profile-api-secret-ellipsis {
	display: inline;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 0.875rem;
	color: var(--text-muted);
	line-height: 1.35;
	white-space: nowrap;
}

.profile-api-page--main .profile-api-copy-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 0.375rem;
	border: none;
	border-radius: 0.5rem;
	background: transparent;
	color: var(--text-muted);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.profile-api-page--main .profile-api-copy-btn:hover {
	background: color-mix(in srgb, var(--primary) 10%, transparent);
	color: var(--primary);
}

.profile-api-page--main .profile-api-copy-btn svg {
	display: block;
}

.profile-api-btn-copy-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border-radius: 8px;
	border: 1px solid var(--border);
	background: var(--surface);
	color: var(--text-muted);
	cursor: pointer;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.profile-api-btn-copy-icon:hover {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.profile-api-btn-copy-icon svg {
	display: block;
	width: 1.05rem;
	height: 1.05rem;
}

.profile-api-whitelist-ellipsis {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: ui-monospace, monospace;
	font-size: 0.78rem;
	line-height: 1.35;
	color: var(--text);
}

.api-key-status {
	display: inline-block;
	padding: 0.2rem 0.5rem;
	border-radius: var(--radius);
	font-size: 0.8rem;
	font-weight: 600;
}

.api-key-status--active {
	background: rgba(34, 197, 94, 0.2);
	color: #16a34a;
}

.api-key-status--revoked {
	background: rgba(239, 68, 68, 0.2);
	color: #dc2626;
}

.api-key-create-error {
	color: var(--pf-danger, #dc2626);
	font-size: 13px;
	margin: 12px 0 0;
}

.api-key-revoke-info {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	margin-bottom: 0.25rem;
}

.api-key-revoke-info.hidden {
	display: none;
}

.api-key-revoke-info__text {
	display: block;
}

.api-key-create-ip-block {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 4px;
}

.api-key-create-ip-label {
	font-size: 13px;
	font-weight: 500;
	color: var(--pf-text-soft, var(--text-muted));
}

.api-key-create-ip-hint {
	margin: 0;
}

.api-key-create-ips-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.api-key-create-ip-row {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 8px;
}

.api-key-create-ip-row .profile-figma-input {
	flex: 1 1 auto;
	min-width: 0;
	width: auto;
	box-sizing: border-box;
}

.api-key-create-ip-remove {
	flex: 0 0 auto;
	padding: 0.45rem 0.55rem;
	min-width: 2rem;
	line-height: 1;
}

#api-key-create-add-ip {
	align-self: flex-start;
	margin-top: 2px;
}

/* Withdrawal modal (figma) */
.withdrawal-figma-modal {
	position: relative;
}

.withdrawal-modal-loading {
	border-radius: var(--pf-radius-card, 12px);
}

.withdrawal-modal-crypto-fields {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 12px;
}

.withdrawal-figma-modal .payment-modal-method.selected,
.withdrawal-figma-modal .payment-modal-method.selected:hover {
	background: transparent;
	border-color: var(--primary);
	box-shadow: 0 0 0 1px var(--primary);
}

.withdrawal-figma-modal .field input.profile-figma-input.withdrawal-modal-address-input,
.withdrawal-figma-modal .field input.profile-figma-input.withdrawal-modal-address-input:focus {
	background: var(--pf-input-bg);
}

.withdrawal-figma-modal .field input.profile-figma-input.withdrawal-modal-address-input:-webkit-autofill,
.withdrawal-figma-modal .field input.profile-figma-input.withdrawal-modal-address-input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 1000px var(--pf-input-bg) inset;
	-webkit-text-fill-color: var(--pf-text);
	transition: background-color 5000s ease-in-out 0s;
}

.withdrawal-figma-modal .withdrawal-modal-styled-select {
	width: 100%;
}

.withdrawal-figma-modal .withdrawal-modal-styled-select .spot-select {
	width: 100%;
	box-sizing: border-box;
	padding: 0.625rem 2.25rem 0.625rem 1rem;
	font: inherit;
	font-size: 14px;
	line-height: 1.35;
	color: var(--pf-text);
	color-scheme: dark;
}

html[data-theme="light"] .withdrawal-figma-modal .withdrawal-modal-styled-select .spot-select {
	color-scheme: light;
}

.withdrawal-figma-modal .withdrawal-modal-styled-select .spot-select option {
	background: rgb(22, 26, 38);
	color: var(--pf-text);
}

html[data-theme="light"] .withdrawal-figma-modal .withdrawal-modal-styled-select .spot-select option {
	background: #fff;
	color: var(--pf-text);
}

.withdrawal-figma-modal .withdrawal-modal-styled-select .spot-select:focus {
	outline: none;
	border-color: color-mix(in srgb, var(--primary) 50%, var(--border));
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}

.withdrawal-figma-modal .withdrawal-modal-styled-select .spot-select:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.withdrawal-modal-amount-row .profile-figma-input {
	flex: 1 1 8rem;
	min-width: 0;
}

.withdrawal-modal-amount-field {
	margin-bottom: 0;
}

.payment-modal-overlay .payment-modal-buttons-row .profile-figma-btn--modal {
	flex: 0 0 auto;
}

/* Светлая тема: бейджи статусов используют синий primary */
[data-theme="light"] .subscription-status--applied {
	background: rgba(29, 78, 216, 0.14);
	color: var(--primary);
}

[data-theme="light"] .subscription-status--upgraded {
	background: rgba(29, 78, 216, 0.12);
	color: var(--primary);
}

[data-theme="light"] .payment-status--partial-paid {
	background: rgba(29, 78, 216, 0.14);
	color: var(--primary);
}

/* === Webhooks page === */
.view--webhooks {
	max-width: min(1200px, 100%);
}

.view--webhook-create {
	max-width: min(1500px, 100%);
}

.view--webhook-edit {
	max-width: min(1500px, 100%);
}

@media (min-width: 961px) {
	.view--webhook-create .wh-form-split--with-preview {
		grid-template-columns: minmax(0, 1fr) minmax(340px, min(560px, 42vw));
	}

	.view--webhook-edit .wh-form-split--with-preview {
		grid-template-columns: minmax(0, 1fr) minmax(340px, min(560px, 42vw));
	}

	.view--webhook-create .wh-spot-bool-row--pair {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.view--webhook-create .wh-spot-bool-row--chain {
		grid-template-columns: 1fr;
	}
}

/* Webhook create/edit: exchange menus above sticky JSON preview, full main-column width */
.view--webhooks .wh-form-split,
.view--webhooks #wh-form {
	overflow: visible;
}

.view--webhooks .wh-form-col--main {
	position: relative;
	z-index: 5;
	min-width: 0;
}

.view--webhooks .wh-form-col--preview {
	position: relative;
	z-index: 1;
}

.view--webhooks .wh-webhook-exchanges {
	margin: 0.5rem 0 1.1rem;
}

.view--webhooks .spot-filters-exchanges {
	grid-template-columns: 1fr;
	gap: 1.35rem;
}

.view--webhooks .spot-exchange-panel {
	padding: 1.15rem 1.25rem 1.1rem;
	border-radius: 14px;
	background: var(--surface);
	border: 1px solid var(--border);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.view--webhooks .spot-exchanges-list-wrap {
	min-height: 0;
}

/* Critical: global chips wrap uses max-height + scroll — clips absolute dropdown menus */
.view--webhooks .spot-exchanges-chips-wrap {
	max-height: none;
	overflow: visible;
	border: none;
	background: transparent;
	padding: 0;
}

.view--webhooks .spot-filters-panel,
.view--webhooks .wh-filters-block {
	overflow: visible;
}

.view--webhooks .wh-ex-dd {
	width: 100%;
}

.view--webhooks .wh-ex-dd--needs-coin .wh-ex-dd-trigger {
	border-style: dashed;
	background: var(--surface);
	color: var(--text-muted);
}

.view--webhooks .wh-ex-dd-trigger {
	min-height: 3rem;
	padding: 0.75rem 1rem;
	border-radius: 14px;
	font-size: 0.95rem;
	font-weight: 500;
	border-width: 2px;
}

.view--webhooks .wh-ex-dd--open:not(.wh-ex-dd--needs-coin) .wh-ex-dd-trigger {
	border-color: rgba(96, 165, 250, 0.55);
	box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.12);
}

.view--webhooks .wh-ex-dd-menu {
	z-index: 80;
	left: 0;
	right: 0;
	width: 100%;
	max-width: none;
	box-sizing: border-box;
	top: calc(100% + 8px);
	max-height: min(78vh, 30rem);
	padding: 0.55rem;
	border-radius: 14px;
	border: 1px solid var(--border);
	background: var(--surface);
	box-shadow:
		0 24px 48px rgba(0, 0, 0, 0.14),
		0 0 0 1px rgba(255, 255, 255, 0.04);
}

.view--webhooks .wh-ex-dd-scroll {
	max-height: min(70vh, 26rem);
	gap: 0.2rem;
	padding: 0.25rem 0.15rem;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: var(--scrollbar-thumb, rgba(128, 128, 128, 0.45)) transparent;
}

.view--webhooks .wh-ex-dd-item {
	align-items: center;
	min-height: 2.85rem;
	padding: 0.55rem 0.7rem;
	border-radius: 11px;
	font-size: 0.93rem;
}

.view--webhooks .wh-ex-dd-item-row {
	align-items: center;
}

.view--webhooks .wh-ex-dd-item--disabled .wh-ex-dd-item-name {
	color: var(--text-muted);
	font-weight: 500;
}

.view--webhooks .wh-ex-dd-item-unavail {
	font-size: 0.78rem;
	font-weight: 500;
	max-width: 14rem;
}

/* Webhook create: numeric filters in two columns; extra row spacing */
.view--webhooks .spot-filters-inputs.wh-filter-grid.wh-webhook-numeric-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 1.35rem;
	row-gap: 1.35rem;
	/* Stretch rows so paired fields share row height; inputs align to one baseline */
	align-items: stretch;
}

.view--webhooks .spot-filters-inputs.wh-filter-grid.wh-webhook-numeric-grid .wh-filter-field {
	gap: 0.58rem;
	min-height: 100%;
	align-self: stretch;
}

.view--webhooks .spot-filters-inputs.wh-filter-grid.wh-webhook-numeric-grid .wh-filter-field > :not(.spot-input) {
	flex-shrink: 0;
}

.view--webhooks .spot-filters-inputs.wh-filter-grid.wh-webhook-numeric-grid .wh-filter-field > .spot-input {
	margin-top: auto;
}

/* Spot deposit/withdraw/chain row: same baseline for selects when labels differ in height */
.view--webhooks .wh-spot-bool-row {
	align-items: stretch;
	margin-top: 1.1rem;
}

.view--webhooks .wh-spot-bool-row .spot-field {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	min-width: 0;
	gap: 0.42rem;
}

.view--webhooks .wh-spot-bool-row .spot-field > .spot-input {
	margin-top: auto;
	min-height: 2.65rem;
	box-sizing: border-box;
}

.view--webhooks .wh-spot-bool-row .spot-field--chain .spot-toggle-label {
	width: 100%;
	box-sizing: border-box;
	min-height: 2.65rem;
	margin-top: auto;
	padding: 0.62rem 0.9rem;
	font-size: 0.95rem;
	border-radius: 8px;
	justify-content: flex-start;
}

.view--webhooks .wh-spot-bool-row .spot-field--chain .spot-toggle-text {
	flex: 0 1 auto;
	min-width: 0;
	white-space: nowrap;
}

.view--webhooks .wh-spot-bool-row .spot-field-label-row {
	align-items: center;
	margin-bottom: 0;
	flex-shrink: 0;
	flex-wrap: nowrap;
	width: fit-content;
	max-width: 100%;
}

.view--webhooks .wh-spot-bool-row .spot-field-label-row .spot-field-label {
	flex: 0 1 auto;
	min-width: 0;
	white-space: normal;
	line-height: 1.25;
	margin-bottom: 0;
}

.view--webhook-create .wh-spot-bool-row--pair {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.view--webhook-create .wh-spot-bool-row--chain {
	grid-template-columns: 1fr;
	margin-top: 0.85rem;
}

.view--webhook-create .wh-spot-bool-row--chain .spot-field--chain {
	width: 100%;
}

.view--webhook-create .wh-spot-bool-row--chain .spot-field--chain .spot-toggle-label {
	width: 100%;
	max-width: 100%;
}

.view--webhooks .wh-spot-bool-row--pair {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.view--webhooks .wh-spot-bool-row--chain {
	grid-template-columns: 1fr;
	margin-top: 0.85rem;
}

.view--webhooks .wh-spot-bool-row--chain .spot-field--chain {
	width: 100%;
}

.view--webhooks .wh-spot-bool-row--chain .spot-field--chain .spot-toggle-label {
	width: 100%;
	max-width: 100%;
}

/* Label + help icon on one baseline (global filter grid used align-items: flex-start) */
.view--webhooks .spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-field-label-row {
	display: inline-flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 0.35rem;
	width: fit-content;
	max-width: 100%;
}

/* Filter help bubbles: not clipped by motion wrapper */
.view--webhooks .wh-filters-panel.wh-filters-panel--open .wh-filters-panel__motion {
	overflow: visible;
}

/*
 * Help icons share one z-index by default so later rows paint on top of earlier tooltips.
 * On hover/focus raise the whole .spot-help-icon so its bubble sits above all other icons.
 */
.view--webhooks .spot-help-icon {
	z-index: 1;
	flex-shrink: 0;
	flex-grow: 0;
	width: 20px;
	height: 20px;
	min-width: 20px;
	min-height: 20px;
	box-sizing: border-box;
}

.view--webhooks .spot-help-icon:hover,
.view--webhooks .spot-help-icon:focus-within {
	z-index: 6000;
}

/* Below and to the right of the “?” (not overlapping the icon) */
.view--webhooks .spot-help-bubble {
	top: calc(100% + 6px);
	left: calc(100% + 6px);
	right: auto;
	margin: 0;
	z-index: 2;
	max-width: min(280px, calc(100vw - 2rem));
}

.view--webhooks .spot-help-bubble.spot-help-bubble--flip-left {
	left: auto;
	right: calc(100% + 6px);
}

/* Keep “Пример webhook” beside the form on tablet widths */
@media (max-width: 960px) {
	.view--webhooks .wh-form-split:not(.wh-form-split--with-preview) {
		grid-template-columns: minmax(0, 1fr) minmax(280px, min(480px, 46vw));
		gap: 1.25rem;
		align-items: start;
	}
}

@media (max-width: 680px) {
	.view--webhooks .spot-filters-inputs.wh-filter-grid.wh-webhook-numeric-grid {
		grid-template-columns: 1fr;
	}
}

.webhooks-table-wrap {
	margin-top: 0.75rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.webhooks-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.88rem;
}

.webhooks-table th,
.webhooks-table td {
	padding: 0.55rem 0.65rem;
	text-align: left;
	vertical-align: middle;
	border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
}

.webhooks-table thead th {
	color: var(--text-muted);
	font-weight: 600;
	white-space: nowrap;
}

.webhooks-table__paused-row td {
	padding-top: 0.35rem;
	padding-bottom: 0.65rem;
	vertical-align: top;
	border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
}

.webhooks-table__paused-banner {
	padding: 0.55rem 0.65rem;
	border-radius: 8px;
	font-size: 0.82rem;
	line-height: 1.35;
	color: var(--text-muted);
	background: rgba(245, 158, 11, 0.12);
	border: 1px solid rgba(245, 158, 11, 0.28);
}

html[data-theme="light"] .webhooks-table__paused-banner {
	background: rgba(217, 119, 6, 0.1);
	border-color: rgba(217, 119, 6, 0.28);
}

.webhooks-table__actions {
	width: 1%;
	white-space: nowrap;
}

.webhooks-table__url-cell {
	max-width: 14rem;
	min-width: 8rem;
}

.webhooks-table__url-inner {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	min-width: 0;
}

.webhooks-table__url-text {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.webhooks-table__copy {
	flex-shrink: 0;
}

.webhooks-table .webhooks-table__copy--icon {
	padding: 0.28rem 0.4rem;
	min-width: 2rem;
	min-height: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

.webhooks-table__copy--icon .webhooks-icon-copy {
	display: block;
	flex-shrink: 0;
}

.webhooks-badge {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 700;
	padding: 0.2rem 0.45rem;
	border-radius: 6px;
	line-height: 1.2;
	white-space: nowrap;
}

.webhooks-badge--on {
	background: rgba(34, 197, 94, 0.18);
	color: #4ade80;
	border: 1px solid rgba(34, 197, 94, 0.35);
}

.webhooks-badge--off {
	background: var(--surface-hover);
	color: var(--text-muted);
	border: 1px solid var(--border);
}

[data-theme="light"] .webhooks-badge--on {
	color: #15803d;
	background: rgba(34, 197, 94, 0.12);
}

.wh-type-readonly-wrap {
	margin-top: 0.15rem;
}

.wh-type-readonly-bubble {
	display: inline-flex;
	align-items: stretch;
	max-width: 100%;
	border-radius: 14px;
	border: 2px solid var(--border);
	background: var(--surface-hover);
	padding: 0.65rem 1rem;
}

.wh-type-readonly-bubble .lp-sc-header {
	margin: 0;
}

.wh-type-readonly-bubble--spot {
	border-color: rgba(59, 130, 246, 0.45);
	background: rgba(59, 130, 246, 0.06);
}

.wh-type-readonly-bubble--futures {
	border-color: rgba(139, 92, 246, 0.45);
	background: rgba(139, 92, 246, 0.07);
}

.wh-type-readonly-bubble--sf {
	border-color: rgba(34, 197, 94, 0.45);
	background: rgba(34, 197, 94, 0.07);
}

.webhooks-table__actions-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem;
}

.webhooks-table .btn {
	padding: 0.3rem 0.55rem;
	font-size: 0.82rem;
}

.wh-readonly-block {
	margin-bottom: 1rem;
}

.wh-readonly-field .spot-field-label {
	display: block;
	margin-bottom: 0.35rem;
}

.wh-readonly-field--inline {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem 0.85rem;
	margin-bottom: 0.75rem;
}

.wh-readonly-field--inline.wh-readonly-field--url {
	align-items: center;
}

.wh-readonly-field--inline.wh-readonly-field--scope {
	align-items: baseline;
	gap: 0.5rem 0.65rem;
}

.wh-readonly-field--inline.wh-readonly-field--scope .spot-field-label {
	line-height: 1.35;
	padding-top: 0.05em;
}

.wh-readonly-field--inline .spot-field-label {
	display: inline-block;
	margin-bottom: 0;
	flex-shrink: 0;
	line-height: 1.35;
}

.wh-readonly-inline-value {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	min-width: 0;
	flex: 1 1 auto;
}

.wh-readonly-text {
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	box-shadow: none;
	color: var(--text);
	font-size: 0.92rem;
	line-height: 1.35;
	word-break: break-word;
}

.wh-readonly-text--url {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: min(100%, 38rem);
}

.wh-readonly-text--scope {
	font-weight: 600;
	font-size: 0.92rem;
	line-height: 1.35;
}

.wh-readonly-block--edit .wh-readonly-field--inline {
	margin-bottom: 0.65rem;
}

.wh-readonly-block--edit .wh-readonly-field--inline.wh-readonly-field--url {
	margin-bottom: 0.85rem;
}

.wh-readonly-field .wh-readonly-value {
	margin: 0.15rem 0 0.75rem;
}

.wh-readonly-value {
	margin: 0.15rem 0 0.75rem;
	padding: 0.5rem 0.65rem;
	border-radius: 8px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
	color: var(--text);
	word-break: break-word;
	font-size: 0.92rem;
}

.wh-readonly-value--url {
	word-break: break-all;
}

.wh-readonly-field--type {
	margin-bottom: 1.15rem;
}

.wh-readonly-url-box {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	width: fit-content;
	max-width: 100%;
	padding: 0.62rem 0.75rem;
	border: 1px solid var(--border);
	border-radius: 12px;
	background: var(--surface-hover);
	box-sizing: border-box;
}

.wh-readonly-url-box .wh-readonly-value--url {
	flex: 0 1 auto;
	min-width: 0;
	max-width: min(100%, 42rem);
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 0.92rem;
	line-height: 1.35;
	word-break: normal;
	box-shadow: none;
}

.wh-readonly-value--inline {
	width: fit-content;
	max-width: 100%;
	display: inline-block;
	box-sizing: border-box;
}

.view--webhooks .whe-copy-url-btn.webhooks-table__copy--icon {
	padding: 0.28rem 0.38rem;
	min-width: 1.9rem;
	min-height: 1.9rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	flex-shrink: 0;
	border-radius: 9px;
}

.wh-enabled-row {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0.5rem 0 1rem;
	font-weight: 600;
	cursor: pointer;
}

.wh-enabled-row input {
	cursor: pointer;
}

.webhooks-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: 1rem;
}

.webhook-card {
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 1.15rem 1.25rem;
}

.webhook-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin-bottom: 0.85rem;
}

.webhook-card-type {
	font-weight: 700;
	font-size: 1rem;
	color: var(--text);
}

.webhook-badge {
	font-size: 0.78rem;
	font-weight: 600;
	padding: 0.2rem 0.55rem;
	border-radius: 999px;
	border: 1px solid var(--border);
}

.webhook-badge--on {
	color: var(--success);
	border-color: rgba(34, 197, 94, 0.45);
	background: rgba(34, 197, 94, 0.12);
}

.webhook-badge--off {
	color: var(--text-muted);
	background: rgba(139, 156, 179, 0.1);
}

.webhook-card-dl {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}

.webhook-card-dl-row {
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 0.5rem 1rem;
	font-size: 0.92rem;
	align-items: start;
}

@media (max-width: 520px) {
	.webhook-card-dl-row {
		grid-template-columns: 1fr;
	}
}

.webhook-card-dl dt {
	margin: 0;
	color: var(--text-muted);
	font-weight: 600;
}

.webhook-card-dl dd {
	margin: 0;
	word-break: break-all;
}

.webhook-card-url {
	color: var(--primary);
	text-decoration: none;
}

.webhook-card-url:hover {
	text-decoration: underline;
}

.webhook-card-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 1rem;
	padding-top: 0.85rem;
	border-top: 1px solid var(--border);
}

.webhook-card-details {
	margin-top: 0.75rem;
	border: 1px solid var(--border);
	border-radius: 10px;
	background: var(--surface);
	overflow: hidden;
}

.webhook-card-summary {
	cursor: pointer;
	padding: 0.65rem 0.9rem;
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--primary);
	list-style: none;
	user-select: none;
}

.webhook-card-summary::-webkit-details-marker {
	display: none;
}

.webhook-card-details[open] .webhook-card-summary {
	border-bottom: 1px solid var(--border);
}

.webhook-filters-inner {
	padding: 0.85rem 1rem 1rem;
}

.webhook-filters-caption {
	margin: 0 0 0.65rem;
	font-size: 0.82rem;
	color: var(--text-muted);
}

.webhook-filters-dl {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.webhook-filter-row {
	display: grid;
	grid-template-columns: minmax(120px, 200px) 1fr;
	gap: 0.5rem 1rem;
	font-size: 0.88rem;
	align-items: start;
}

@media (max-width: 520px) {
	.webhook-filter-row {
		grid-template-columns: 1fr;
	}
}

.webhook-filter-row dt {
	margin: 0;
	color: var(--text-muted);
	font-weight: 600;
}

.webhook-filter-row dd {
	margin: 0;
	word-break: break-word;
}

.webhooks-page-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.webhooks-page-head-text {
	min-width: 0;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.subs-quota-panel {
	margin: 0;
	min-width: 0;
}

.subs-quota-stats {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.28rem;
}

.subs-quota-stat {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.5rem;
	padding: 0;
	border: none;
	background: transparent;
	box-shadow: none;
	min-width: 0;
}

.subs-quota-stat__label {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--text-muted);
	line-height: 1.35;
}

.subs-quota-stat__value {
	font-size: 1.35rem;
	font-weight: 800;
	line-height: 1.35;
	color: var(--text);
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.02em;
}

.subs-quota-stat--limit .subs-quota-stat__value {
	color: #60a5fa;
}

.subs-quota-stat--created .subs-quota-stat__value {
	color: var(--text);
}

.subs-quota-stat__paused {
	font-size: 0.84rem;
	font-weight: 600;
	line-height: 1.35;
	color: #f87171;
	white-space: nowrap;
}

.subs-quota-note {
	margin: 0.35rem 0 0;
	font-size: 0.82rem;
	line-height: 1.35;
	font-weight: 600;
	color: #f87171;
	max-width: 36rem;
}

html[data-theme="light"] .subs-quota-stat--limit .subs-quota-stat__value {
	color: #2563eb;
}

html[data-theme="light"] .subs-quota-stat__paused,
html[data-theme="light"] .subs-quota-note {
	color: #dc2626;
}

.webhooks-quota {
	margin: 0;
	font-size: 0.9rem;
	color: var(--text-muted);
	line-height: 1.4;
	display: flex;
	flex-direction: column;
	gap: 0.12rem;
}

.webhooks-quota-line {
	display: block;
}

.webhooks-plan-blocked {
	margin-bottom: 1rem;
	padding: 0.85rem 1rem;
	border-radius: 12px;
	border: 1px solid rgba(239, 68, 68, 0.35);
	background: rgba(239, 68, 68, 0.08);
	color: var(--text);
	font-size: 0.95rem;
	line-height: 1.45;
}

[data-theme="light"] .webhooks-plan-blocked {
	background: rgba(239, 68, 68, 0.06);
}

.wh-plan-gate {
	margin-bottom: 1rem;
	padding: 1rem 1.15rem;
	border-radius: 12px;
	border: 1px solid rgba(239, 68, 68, 0.35);
	background: rgba(239, 68, 68, 0.08);
}

.wh-plan-gate-text {
	margin: 0 0 1rem;
	font-size: 0.95rem;
	line-height: 1.5;
	font-weight: 600;
	color: #f87171;
}

html[data-theme="light"] .wh-plan-gate {
	background: rgba(220, 38, 38, 0.06);
	border-color: rgba(220, 38, 38, 0.28);
}

html[data-theme="light"] .wh-plan-gate-text {
	color: #dc2626;
}

.wh-plan-gate-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
}

.wh-type-option--disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.wh-type-option--disabled .wh-type-option-body {
	pointer-events: none;
}

.wh-type-option-lock-reason {
	margin: 0.45rem 0 0;
	font-size: 0.8rem;
	line-height: 1.35;
	color: var(--text-muted);
	font-weight: 500;
}

.wh-type-option--disabled .wh-type-option-lock-reason {
	color: #f97316;
}

[data-theme="dark"] .wh-type-option--disabled .wh-type-option-lock-reason {
	color: #fdba74;
}

.webhooks-page-title {
	margin: 0;
}

.wh-create-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.wh-create-head--edit {
	margin-bottom: 1.85rem;
}

.wh-create-head h2 {
	margin: 0;
}

.wh-form-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(340px, min(560px, 42vw));
	gap: 1.75rem;
	align-items: start;
}

.wh-form-split--with-preview {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
}

.wh-form-split--with-preview > .wh-form-left {
	display: contents;
}

.wh-form-split--with-preview .wh-form-col--main {
	order: 1;
}

.wh-form-split--with-preview .wh-form-col--preview {
	order: 2;
}

.wh-form-split--with-preview .wh-form-actions {
	order: 3;
}

@media (min-width: 961px) {
	.wh-form-split--with-preview {
		flex-direction: row;
		align-items: flex-start;
		gap: 1.75rem;
	}

	.wh-form-split--with-preview > .wh-form-left {
		display: flex;
		flex: 1 1 0;
		flex-direction: column;
		min-width: 0;
		order: 0;
	}

	.wh-form-split--with-preview > .wh-form-left > .wh-form-col--main,
	.wh-form-split--with-preview > .wh-form-left > .wh-form-actions {
		order: unset;
		width: 100%;
		box-sizing: border-box;
	}

	.wh-form-split--with-preview > .wh-form-col--preview {
		flex: 0 0 minmax(340px, min(560px, 42vw));
		min-width: 340px;
		max-width: min(560px, 42vw);
		order: 0;
	}
}

.wh-form-split--with-preview .wh-form-col--main {
	min-width: 0;
}

.wh-form-split--with-preview .wh-form-col--preview {
	min-width: 0;
}

.wh-form-split--with-preview > .wh-form-actions {
	margin-top: 0;
}

@media (max-width: 960px) {
	.wh-form-split:not(.wh-form-split--with-preview) {
		grid-template-columns: 1fr;
	}

	.wh-form-split--with-preview > .wh-form-actions {
		margin-top: 0;
	}
}

.wh-form-col--main {
	min-width: 0;
}

.wh-form-col--preview {
	min-width: 0;
}

@media (min-width: 961px) {
	.profile-webhook-create-page .wh-form-split--with-preview .wh-form-col--preview,
	.view--webhook-edit .wh-form-split--with-preview .wh-form-col--preview {
		padding-top: 1.625rem;
	}

	.wh-payload-card {
		position: sticky;
		top: 1rem;
	}
}

.wh-field--url {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.45rem;
	width: 100%;
	max-width: 100%;
	margin-bottom: 1.1rem;
}

.wh-field--url .wh-url-input {
	width: 100%;
	max-width: 100%;
}

.view--webhook-create .wh-field--url .wh-url-input {
	max-width: 100%;
}

.wh-scope-fieldset {
	border: none;
	margin: 0 0 1.15rem;
	padding: 0;
}

.wh-scope-legend {
	padding: 0;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--text);
	margin-bottom: 0.35rem;
}

.wh-scope-intro {
	margin: 0 0 0.85rem;
	font-size: 0.88rem;
	color: var(--text-muted);
	line-height: 1.45;
	max-width: 40rem;
}

.wh-scope-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
	max-width: 44rem;
}

@media (max-width: 640px) {
	.wh-scope-grid {
		grid-template-columns: 1fr;
	}
}

.wh-scope-card {
	display: block;
	margin: 0;
	cursor: pointer;
	border-radius: 14px;
	border: 2px solid var(--border);
	background: var(--surface-hover);
	transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.wh-scope-card:hover {
	border-color: rgba(96, 165, 250, 0.45);
	background: var(--surface);
}

.wh-scope-input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.wh-scope-card-body {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: 0.85rem 1rem;
	min-height: 4.5rem;
}

.wh-scope-card-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text);
	letter-spacing: -0.02em;
}

.wh-scope-card-desc {
	font-size: 0.82rem;
	color: var(--text-muted);
	line-height: 1.35;
}

.wh-scope-card--active {
	border-color: rgba(59, 130, 246, 0.55);
	background: color-mix(in srgb, var(--primary) 8%, var(--surface-hover));
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 25%, transparent);
}

.wh-coin-section {
	/* toggled .hidden in global scope */
}

.wh-type-dropdown {
	position: relative;
	display: inline-block;
	max-width: 100%;
	vertical-align: top;
}

.wh-type-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.65rem;
	padding: 0.65rem 0.95rem;
	border-radius: 14px;
	border: 2px solid var(--border);
	background: var(--surface-hover);
	cursor: pointer;
	font: inherit;
	color: inherit;
	width: auto;
	max-width: 100%;
	text-align: left;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.wh-type-trigger:hover {
	border-color: rgba(96, 165, 250, 0.35);
}

.wh-type-trigger-inner {
	display: flex;
	align-items: center;
	min-width: 0;
	flex: 1;
}

.wh-type-trigger-inner .lp-sc-header {
	margin: 0;
}

.wh-type-chevron {
	flex-shrink: 0;
	opacity: 0.65;
	transition: transform 0.2s ease;
}

.wh-type-trigger--open .wh-type-chevron {
	transform: rotate(180deg);
}

.wh-type-trigger--spot {
	border-color: rgba(59, 130, 246, 0.45);
	background: rgba(59, 130, 246, 0.06);
}

.wh-type-trigger--futures {
	border-color: rgba(139, 92, 246, 0.45);
	background: rgba(139, 92, 246, 0.07);
}

.wh-type-trigger--sf {
	border-color: rgba(34, 197, 94, 0.45);
	background: rgba(34, 197, 94, 0.07);
}

.wh-type-menu {
	position: absolute;
	z-index: 40;
	left: 0;
	top: calc(100% + 6px);
	min-width: 100%;
	width: max-content;
	max-width: min(100vw - 2rem, 520px);
	max-height: min(70vh, 22rem);
	overflow-y: auto;
	padding: 0.45rem;
	border-radius: 14px;
	border: 1px solid var(--border);
	background: var(--surface);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.wh-type-menu .wh-type-picker {
	gap: 0.5rem;
}

.wh-type-menu .wh-type-option {
	width: max-content;
	min-width: 100%;
}

.wh-ex-dd {
	position: relative;
	display: block;
	width: 100%;
	max-width: 100%;
}

.wh-ex-dd-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.65rem;
	width: 100%;
	padding: 0.55rem 0.85rem;
	border-radius: 12px;
	border: 2px solid var(--border);
	background: var(--surface-hover);
	cursor: pointer;
	font: inherit;
	color: inherit;
	text-align: left;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.wh-ex-dd-trigger:hover:not(:disabled) {
	border-color: rgba(96, 165, 250, 0.35);
}

.wh-ex-dd-trigger:disabled {
	opacity: 0.65;
	cursor: not-allowed;
}

.wh-ex-dd-trigger-text {
	min-width: 0;
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wh-ex-dd-chevron {
	flex-shrink: 0;
	opacity: 0.65;
	transition: transform 0.2s ease;
}

.wh-ex-dd-trigger--open .wh-ex-dd-chevron {
	transform: rotate(180deg);
}

.wh-ex-dd-menu {
	position: absolute;
	z-index: 35;
	left: 0;
	right: 0;
	top: calc(100% + 6px);
	max-height: min(55vh, 18rem);
	overflow: hidden;
	padding: 0.35rem;
	border-radius: 12px;
	border: 1px solid var(--border);
	background: var(--surface);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.wh-ex-dd-scroll {
	max-height: min(50vh, 16rem);
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.wh-ex-dd-item {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.35rem 0.45rem;
	border-radius: 8px;
	cursor: pointer;
	font: inherit;
	color: inherit;
	margin: 0;
}

.wh-ex-dd-item-text {
	display: flex;
	align-items: center;
	min-width: 0;
	flex: 1;
}

.wh-ex-dd-item-row {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 0.65rem;
	flex: 1;
	min-width: 0;
}

.wh-ex-dd-item-name {
	font-weight: 600;
	line-height: 1.25;
	flex-shrink: 0;
}

.wh-ex-dd-item-unavail {
	font-size: 0.76rem;
	font-weight: 500;
	color: var(--text-muted);
	margin-left: auto;
	flex-shrink: 1;
	text-align: right;
	line-height: 1.25;
	white-space: normal;
}

.wh-ex-dd-item:hover:not(.wh-ex-dd-item--disabled) {
	background: var(--surface-hover);
}

.wh-ex-dd-item--disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.wh-ex-dd-item input[type="checkbox"] {
	flex-shrink: 0;
}

.wh-ex-dd-item--disabled input[type="checkbox"] {
	pointer-events: none;
}

.wh-payload-card {
	border: 1px solid var(--border);
	border-radius: 14px;
	background: var(--surface-hover);
	overflow: visible;
}

.wh-payload-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.85rem 1rem;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.wh-payload-title {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text);
}

.wh-payload-copy {
	flex-shrink: 0;
	white-space: nowrap;
}

.wh-json-pre {
	margin: 0;
	padding: 1rem 1.1rem 1.15rem;
	max-height: none;
	overflow: visible;
	font-family: ui-monospace, 'Cascadia Code', 'Segoe UI Mono', monospace;
	font-size: 0.82rem;
	line-height: 1.45;
	background: var(--surface);
	color: var(--text);
}

.whd-payload-modal .wh-json-code {
	white-space: pre;
	word-break: normal;
	overflow-wrap: normal;
}

.wh-json-k {
	color: #c792ea;
	font-weight: 600;
}

.wh-json-str {
	color: var(--text);
}

.wh-json-num {
	color: #f9e2af;
}

.wh-json-bool {
	color: #7dcfff;
}

.wh-json-null {
	color: var(--text-muted);
	font-style: italic;
}

[data-theme="light"] .wh-json-k {
	color: #7c3aed;
}

[data-theme="light"] .wh-json-num {
	color: #0f766e;
}

[data-theme="light"] .wh-json-bool {
	color: #0369a1;
}

.wh-type-fieldset {
	border: none;
	padding: 0;
	margin: 0 0 1.25rem;
}

.wh-type-legend {
	font-weight: 600;
	margin-bottom: 0.65rem;
}

/* Webhook forms: unify “label” look (muted caps like filter labels) */
.view--webhooks .wh-type-legend {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.view--webhooks .wh-coin-section-title {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin: 1.25rem 0 0.65rem;
}

.view--webhooks .wh-filters-panel-heading,
.view--webhooks .wh-filters-block-title {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.view--webhooks .wh-payload-title {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.view--webhooks .wh-enabled-row {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.view--webhooks .wh-enabled-row input {
	margin-top: 1px;
}

.view--webhooks .wh-enabled-row.wh-enabled-row--prominent {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--text);
	text-transform: none;
	letter-spacing: normal;
}

.view--webhooks .wh-enabled-row.wh-enabled-row--prominent input {
	margin-top: 0;
}

.wh-type-picker {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.wh-type-option {
	position: relative;
	display: block;
	margin: 0;
	cursor: pointer;
	border-radius: 14px;
	border: 2px solid var(--border);
	background: var(--surface-hover);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.wh-type-option:hover {
	border-color: rgba(96, 165, 250, 0.35);
}

.wh-type-option-input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
	pointer-events: none;
}

.wh-type-option-body {
	padding: 0.85rem 1rem;
}

.wh-type-option--active {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.wh-type-option--spot.wh-type-option--active {
	border-color: rgba(59, 130, 246, 0.55);
	background: rgba(59, 130, 246, 0.06);
}

.wh-type-option--futures.wh-type-option--active {
	border-color: rgba(139, 92, 246, 0.55);
	background: rgba(139, 92, 246, 0.07);
}

.wh-type-option--sf.wh-type-option--active {
	border-color: rgba(34, 197, 94, 0.5);
	background: rgba(34, 197, 94, 0.07);
}

.view--webhooks .lp-sc-header {
	display: flex;
	align-items: center;
	gap: 0.8rem;
}

.view--webhooks .lp-sc-icon {
	width: 42px;
	height: 42px;
	border-radius: 11px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.view--webhooks .lp-sc-icon--spot {
	background: rgba(59, 130, 246, 0.14);
	color: #60a5fa;
}

.view--webhooks .lp-sc-icon--futures {
	background: rgba(139, 92, 246, 0.14);
	color: #a78bfa;
}

.view--webhooks .lp-sc-icon--sf {
	background: rgba(34, 197, 94, 0.14);
	color: #4ade80;
}

.view--webhooks .lp-sc-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text);
	margin: 0;
	line-height: 1.25;
}

[data-theme="light"] .view--webhooks .lp-sc-icon--spot {
	color: #2563eb;
}

[data-theme="light"] .view--webhooks .lp-sc-icon--futures {
	color: #7c3aed;
}

[data-theme="light"] .view--webhooks .lp-sc-icon--sf {
	color: #16a34a;
}

.wh-field-hint {
	margin: 0.25rem 0 0;
	font-size: 0.85rem;
	color: var(--text-muted);
}

.wh-coin-section-title {
	margin: 1.25rem 0 0.75rem;
	font-size: 1rem;
	font-weight: 600;
}

.wh-coin-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1rem;
	align-items: flex-end;
	margin-bottom: 1rem;
}

.wh-coin-toolbar .wh-field {
	min-width: 8rem;
}

.wh-coin-toolbar .wh-field--grow {
	flex: 1;
	min-width: 12rem;
}

.wh-coin-toolbar .spot-field-label {
	display: block;
	margin-bottom: 0.25rem;
	font-size: 0.85rem;
}

.wh-coin-combobox {
	position: relative;
	z-index: 2;
}

.wh-coin-combobox.wh-coin-combobox--open {
	z-index: 80;
}

.wh-coin-input-wrap {
	position: relative;
}

.wh-coin-dropdown {
	position: absolute;
	left: 0;
	right: 0;
	top: calc(100% + 4px);
	z-index: 100;
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
	max-height: min(320px, 55vh);
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.wh-coin-dropdown-scroll {
	overflow-y: auto;
	max-height: min(280px, 50vh);
}

.wh-coin-dropdown-list {
	padding: 0.35rem 0;
}

.wh-coin-dd-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;
	padding: 1.5rem 1rem;
	min-height: 5.5rem;
}

.wh-coin-dd-loading .load-loading-spinner {
	width: 28px;
	height: 28px;
}

.wh-coin-dd-loading .load-loading-text {
	font-size: 0.875rem;
	color: var(--text-muted);
}

.wh-coin-dd-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	width: 100%;
	padding: 0.55rem 0.85rem;
	margin: 0;
	border: none;
	background: transparent;
	color: var(--text);
	font-size: 0.9rem;
	text-align: left;
	cursor: pointer;
	border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.06));
	transition: background 0.12s ease;
}

.wh-coin-dd-item:last-child {
	border-bottom: none;
}

.wh-coin-dd-item:hover,
.wh-coin-dd-item:focus-visible {
	background: var(--surface-hover);
	outline: none;
}

.wh-coin-dd-main {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
}

.wh-coin-dd-symbol {
	font-weight: 700;
	font-size: 0.95rem;
}

.wh-coin-dd-id {
	font-size: 0.78rem;
	color: var(--text-muted);
	font-family: ui-monospace, monospace;
	word-break: break-all;
}

.wh-coin-dd-flags {
	display: flex;
	gap: 0.35rem;
	flex-shrink: 0;
}

.wh-coin-dd-flag {
	font-size: 0.68rem;
	font-weight: 600;
	padding: 0.12rem 0.35rem;
	border-radius: 6px;
	background: var(--surface-hover);
	color: var(--text-muted);
	border: 1px solid var(--border);
}

.wh-coin-dd-flag--on {
	color: var(--success, #22c55e);
	border-color: rgba(34, 197, 94, 0.35);
}

.wh-coin-dropdown-footer {
	padding: 0.5rem 0.65rem;
	border-top: 1px solid var(--border);
	background: var(--surface-hover);
}

.wh-coin-dropdown-more {
	width: 100%;
	padding: 0.55rem 0.85rem;
	font-size: 0.875rem;
	font-weight: 500;
	border-radius: 0.625rem;
	border: 1px solid rgba(79, 108, 246, 0.2);
	background: transparent;
	color: var(--text);
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.profile-webhook-create-page .wh-coin-dropdown-more:hover {
	background: rgba(79, 108, 246, 0.06);
	border-color: rgba(79, 108, 246, 0.35);
}

.wh-coin-dd-more-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.65rem 0.5rem;
	min-height: 3.25rem;
}

.wh-coin-dd-more-loading.hidden {
	display: none;
}

.wh-coin-dd-more-loading .load-loading-spinner {
	width: 22px;
	height: 22px;
}

.wh-coin-dd-more-loading .load-loading-text {
	font-size: 0.8125rem;
	color: var(--text-muted);
}

.wh-coin-dd-hint,
.wh-coin-dd-empty {
	padding: 0.75rem 0.85rem;
	font-size: 0.88rem;
	color: var(--text-muted);
	margin: 0;
}

.wh-coin-picked {
	margin: 0.75rem 0 1rem;
	padding: 0;
	border-radius: 14px;
	border: 1px solid rgba(59, 130, 246, 0.35);
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(34, 197, 94, 0.06));
	box-shadow: 0 4px 24px rgba(59, 130, 246, 0.08);
}

.wh-coin-picked-inner {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.85rem 1.1rem;
	flex-wrap: wrap;
}

.wh-coin-picked-symbol {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 3.25rem;
	padding: 0.35rem 0.65rem;
	border-radius: 10px;
	font-weight: 800;
	font-size: 1.05rem;
	letter-spacing: 0.02em;
	background: var(--surface);
	color: var(--primary);
	border: 1px solid var(--border);
}

.wh-coin-picked-meta {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	min-width: 0;
}

.wh-coin-picked-label {
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--text-muted);
}

.wh-coin-picked-id {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--text);
	background: transparent;
	padding: 0;
	border: none;
	word-break: break-all;
}

.wh-filters-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	width: 100%;
	max-width: 100%;
	margin: 0.25rem 0 0.6rem;
	padding: 0.72rem 1.05rem;
	border: 2px solid var(--border);
	border-radius: 14px;
	background: var(--surface-hover);
	color: inherit;
	font: inherit;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	text-align: left;
	transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.wh-filters-toggle:hover {
	border-color: rgba(96, 165, 250, 0.38);
	background: var(--surface);
}

.wh-filters-toggle:focus-visible {
	outline: none;
	border-color: rgba(96, 165, 250, 0.65);
	box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
}

.wh-filters-toggle--open {
	border-color: rgba(96, 165, 250, 0.48);
	background: rgba(96, 165, 250, 0.06);
	box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1);
}

.wh-filters-toggle-text {
	flex: 1;
	min-width: 0;
}

.wh-filters-toggle-chevron {
	flex-shrink: 0;
	opacity: 0.72;
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.wh-filters-toggle--open .wh-filters-toggle-chevron {
	transform: rotate(180deg);
}

.wh-filters-panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.42s cubic-bezier(0.34, 1.06, 0.35, 1);
	margin-bottom: 0.5rem;
}

.wh-filters-panel.wh-filters-panel--open {
	grid-template-rows: 1fr;
}

.wh-filters-panel__motion {
	overflow: hidden;
	min-height: 0;
	opacity: 0;
	transform: translateY(-12px);
	transition:
		opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.38s cubic-bezier(0.34, 1.06, 0.35, 1);
	pointer-events: none;
	padding-bottom: 0.15rem;
}

.wh-filters-panel.wh-filters-panel--open .wh-filters-panel__motion {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
	.wh-filters-panel,
	.wh-filters-panel__motion,
	.wh-filters-toggle-chevron {
		transition: none !important;
	}

	.wh-filters-panel__motion {
		transform: none;
	}

	.wh-filters-panel.wh-filters-panel--open .wh-filters-panel__motion {
		transform: none;
	}
}

.wh-filters-panel-heading {
	margin: 0 0 0.75rem;
	font-size: 1rem;
	font-weight: 600;
}

/* Webhook create/edit: numeric filters — readable inputs, long labels wrap (~2 lines) */
.spot-filters-inputs.wh-filter-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
	gap: 1rem 1.25rem;
	margin-top: 1rem;
	align-items: start;
}

.spot-filters-inputs.wh-filter-grid .wh-filter-field {
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
	min-width: 0;
}

.spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-field-label {
	white-space: normal;
	line-height: 1.3;
	max-width: 15rem;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-field-label-row {
	display: inline-flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 0.35rem;
	width: fit-content;
	max-width: 100%;
}

.spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-field-label-row .spot-field-label {
	margin-bottom: 0;
}

.spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-input {
	min-height: 2.65rem;
	padding: 0.62rem 0.9rem;
	font-size: 1rem;
}

@media (max-width: 520px) {
	.spot-filters-inputs.wh-filter-grid {
		grid-template-columns: 1fr;
	}

	.spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-field-label {
		max-width: none;
	}
}

.wh-filters-panel .wh-filters-block:first-of-type {
	margin-top: 0;
}

.wh-coin-table-wrap {
	overflow-x: auto;
	margin-bottom: 0.75rem;
}

.wh-coin-table-wrap table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9rem;
}

.wh-coin-table-wrap th,
.wh-coin-table-wrap td {
	padding: 0.5rem 0.65rem;
	text-align: left;
	border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
}

.wh-coin-table-wrap th {
	color: var(--text-muted);
	font-weight: 600;
}

.wh-filters-block {
	margin-top: 1.5rem;
}

.wh-filters-block-title {
	margin: 0 0 0.75rem;
	font-size: 1rem;
	font-weight: 600;
}

.wh-spot-bool-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: 0.75rem 1rem;
	margin-top: 0.75rem;
}

.wh-spot-bool-row .spot-field {
	min-width: 0;
}

.wh-spot-bool-row .spot-field-label-row {
	margin-bottom: 0.35rem;
	width: fit-content;
	max-width: 100%;
}

.wh-spot-bool-row .spot-field-label {
	display: inline;
	margin-bottom: 0;
	font-size: 0.85rem;
}

.view--webhooks .wh-spot-bool-row .spot-field-label {
	font-size: 0.75rem;
}

.wh-form-single {
	min-width: 0;
}

.wh-form-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 1.5rem;
}

.view--webhooks .wh-form-actions {
	width: 100%;
	justify-content: flex-start;
	align-items: center;
}

/* === Responsive: profile pages === */
@media (max-width: 640px) {
	.view--profile .card,
	.view--profile .profile-nav-card {
		border-radius: 10px;
	}

	.view--profile .profile-nav-card {
		padding: 0.75rem 1rem;
	}
}

@media (max-width: 480px) {
	.view--profile .card h2 {
		font-size: 1.25rem;
	}

	.admin-subscription-card {
		min-width: 0;
		max-width: 100%;
		width: 100%;
	}

	.payment-card {
		padding: 1rem;
	}
}

/* === Responsive: tariffs / pricings === */
@media (max-width: 640px) {
	.plan-pricings-row {
		flex-direction: column;
		align-items: stretch;
	}

	.plan-pricings-row .plan-card {
		width: 100%;
		max-width: 100%;
		flex: 0 0 100%;
		min-width: 0;
	}
}

/* API stats — no active billing period */
.api-stats-billing-gate-block {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin-top: 0.5rem;
	padding: 1rem 1.15rem;
	border-radius: 12px;
	border: 1px solid var(--border);
	background: var(--surface-hover);
}

.api-stats-billing-gate-text {
	margin: 0;
	flex: 1;
	min-width: 200px;
	color: var(--text-muted);
	font-weight: 500;
}

/* Subscription list cards (Telegram + Webhooks) */
.subs-list,
.tg-subs-grid {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	margin-top: 1rem;
}

.sub-list-card {
	background: var(--surface-hover);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 0.75rem 1rem;
	width: 100%;
}

.sub-list-card__paused--alert {
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	margin: 0 0 0.65rem;
	padding: 0.55rem 0.75rem;
	border-radius: 8px;
	font-size: 0.84rem;
	font-weight: 600;
	line-height: 1.4;
	color: #f87171;
	background: rgba(239, 68, 68, 0.12);
	border: 1px solid rgba(239, 68, 68, 0.35);
}

html[data-theme="light"] .sub-list-card__paused--alert {
	color: #dc2626;
	background: rgba(220, 38, 38, 0.08);
	border-color: rgba(220, 38, 38, 0.28);
}

.sub-list-card__row {
	min-width: 0;
}

.sub-list-card__row--info {
	min-width: 0;
}

.sub-list-card__fields {
	display: flex;
	width: 100%;
	min-width: 0;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: nowrap;
	gap: 1.35rem 1.75rem;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: thin;
	padding-bottom: 0.05rem;
}

.sub-list-card__status {
	flex: 0 0 auto;
	flex-shrink: 0;
	align-self: flex-start;
	display: flex;
	align-items: flex-start;
	padding-top: 0.05rem;
}

.sub-list-card__meta-item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 0.35rem;
	min-width: 0;
	flex-shrink: 0;
}

.sub-list-card__meta-label {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--text-muted);
	line-height: 1.2;
	white-space: nowrap;
}

.sub-list-card__meta-value {
	color: var(--text);
	min-width: 0;
	font-size: 0.95rem;
	line-height: 1.25;
	min-height: 2.25rem;
	display: flex;
	align-items: center;
}

.sub-list-card__meta-item--type .sub-list-card__meta-value {
	font-weight: 700;
}

.sub-list-card__meta-item--copyable .sub-list-card__meta-value {
	width: 100%;
	max-width: 100%;
}

.sub-list-card__meta-item--copyable {
	flex-shrink: 1;
	min-width: 0;
	max-width: 100%;
}

.sub-list-card__copyable-inner {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	min-width: 0;
	max-width: 100%;
	min-height: 2.25rem;
}

.sub-list-card__copyable-text {
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.sub-list-card__meta-item--url {
	flex-shrink: 1;
	min-width: 0;
	max-width: 13.5rem;
}

.sub-list-card__meta-item--url .sub-list-card__copyable-text {
	max-width: 11rem;
}

.sub-list-card__meta-item--uuid {
	flex-shrink: 1;
	min-width: 0;
	max-width: 10.5rem;
}

.sub-list-card__meta-item--uuid .sub-list-card__copyable-text {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.88rem;
	max-width: 8.5rem;
}

.sub-status-badge {
	display: inline-block;
	font-size: 0.82rem;
	font-weight: 700;
	padding: 0.28rem 0.65rem;
	border-radius: 999px;
	border: 1px solid transparent;
	white-space: nowrap;
	line-height: 1.2;
}

.sub-status-badge--on {
	color: #22c55e;
	border-color: rgba(34, 197, 94, 0.45);
	background: rgba(34, 197, 94, 0.12);
}

.sub-status-badge--off {
	color: #ef4444;
	border-color: rgba(239, 68, 68, 0.45);
	background: rgba(239, 68, 68, 0.1);
}

.sub-list-card__row--actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem;
	margin-top: 0.65rem;
	padding-top: 0.65rem;
	border-top: 1px solid var(--border);
}

.sub-list-card__meta-item--url .sub-list-card__copyable-inner {
	width: 100%;
}

.sub-list-card .webhooks-table__copy--icon {
	padding: 0.28rem 0.4rem;
	min-width: 2rem;
	min-height: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	flex-shrink: 0;
}

.sub-list-card .webhooks-table__copy--icon .webhooks-icon-copy {
	display: block;
	flex-shrink: 0;
}

.webhooks-page-head-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.4rem;
}

.webhooks-create-blocked-hint {
	margin: 0;
	max-width: 24rem;
	font-size: 0.84rem;
	line-height: 1.35;
	font-weight: 600;
	color: #f87171;
	text-align: right;
	align-self: flex-end;
	margin-left: 0;
}

html[data-theme="light"] .webhooks-create-blocked-hint {
	color: #dc2626;
}

a.btn.btn--disabled {
	opacity: 0.55;
	pointer-events: none;
	cursor: not-allowed;
}

.subs-list .lp-sc-header,
.tg-subs-grid .lp-sc-header {
	display: flex;
	align-items: center;
	gap: 0.8rem;
}

.subs-list .lp-sc-icon,
.tg-subs-grid .lp-sc-icon {
	width: 42px;
	height: 42px;
	border-radius: 11px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.subs-list .lp-sc-icon--spot,
.tg-subs-grid .lp-sc-icon--spot {
	background: rgba(59, 130, 246, 0.14);
	color: #60a5fa;
}

.subs-list .lp-sc-icon--futures,
.tg-subs-grid .lp-sc-icon--futures {
	background: rgba(139, 92, 246, 0.14);
	color: #a78bfa;
}

.subs-list .lp-sc-icon--sf,
.tg-subs-grid .lp-sc-icon--sf {
	background: rgba(34, 197, 94, 0.14);
	color: #4ade80;
}

.subs-list .lp-sc-title,
.tg-subs-grid .lp-sc-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text);
	margin: 0;
	line-height: 1.25;
}

[data-theme="light"] .subs-list .lp-sc-icon--spot,
[data-theme="light"] .tg-subs-grid .lp-sc-icon--spot {
	color: #2563eb;
}

[data-theme="light"] .subs-list .lp-sc-icon--futures,
[data-theme="light"] .tg-subs-grid .lp-sc-icon--futures {
	color: #7c3aed;
}

[data-theme="light"] .subs-list .lp-sc-icon--sf,
[data-theme="light"] .tg-subs-grid .lp-sc-icon--sf {
	color: #16a34a;
}

/* Telegram / webhook forms — filters in right column */
.wh-form-col--filters {
	min-width: 0;
}

@media (min-width: 961px) {
	.wh-form-split--webhook-edit {
		grid-template-columns: minmax(0, 1fr) minmax(340px, min(560px, 42vw));
		gap: 1.75rem;
		align-items: start;
	}

	.wh-form-split--webhook-edit .wh-form-col--main {
		display: block;
		min-width: 0;
	}

	.wh-form-split--webhook-edit .wh-form-col--filters {
		position: sticky;
		top: 1rem;
		align-self: start;
	}

	.wh-readonly-block--edit {
		margin-bottom: 1.25rem;
	}

	.wh-form-split--with-side-filters .wh-form-col-left-stack {
		grid-column: 1;
		grid-row: 2;
		display: flex;
		flex-direction: column;
		gap: 0.75rem;
		min-height: 0;
		align-self: start;
	}

	.wh-form-split--with-side-filters .wh-form-col-left-stack .wh-field--interval,
	.wh-form-split--with-side-filters .wh-form-col-left-stack .wh-form-section--exchanges,
	.wh-form-split--with-side-filters .wh-form-col-left-stack .wh-webhook-exchanges {
		margin-top: 0;
		margin-bottom: 0;
	}

	.wh-form-split--with-side-filters .wh-form-col--main > .wh-field--interval {
		grid-column: 1;
		grid-row: 2;
		align-self: start;
	}

	.wh-form-split--with-side-filters .wh-form-col--main > .wh-webhook-exchanges,
	.wh-form-split--with-side-filters .wh-form-col--main > .wh-form-section--exchanges {
		grid-column: 1;
		grid-row: 3;
		margin-top: 0;
		align-self: start;
	}

	.wh-form-split--with-side-filters .wh-form-col--filters {
		grid-column: 2;
		grid-row: 2;
		align-self: end;
		position: sticky;
		top: 1rem;
	}

	.wh-form-split--with-side-filters:not(:has(.wh-form-col-left-stack)) .wh-form-col--filters {
		grid-row: 2 / 4;
		align-self: stretch;
	}
}

.wh-form-split--with-side-filters .wh-field--interval {
	display: flex;
	flex-direction: column;
	gap: 0.58rem;
	min-width: 0;
	padding-top: 0;
	min-height: 100%;
	align-self: stretch;
}

.wh-form-split--with-side-filters .wh-field--interval .spot-field-label {
	margin-bottom: 0;
	line-height: 1.3;
	white-space: normal;
	min-height: 2.35rem;
	display: flex;
	align-items: flex-end;
	box-sizing: border-box;
}

.wh-form-split--with-side-filters .wh-field--interval .spot-input,
.wh-filters-panel--side select.spot-input {
	min-height: 2.65rem;
	height: 2.65rem;
	max-height: 2.65rem;
	padding: 0.62rem 2rem 0.62rem 0.9rem;
	font-size: 1rem;
	line-height: 1.25;
	box-sizing: border-box;
	width: 100%;
	margin-top: auto;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 12px 12px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%238b9cb3' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");
}

.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid .wh-filter-field > .spot-input {
	min-height: 2.65rem;
	height: 2.65rem;
	max-height: 2.65rem;
	box-sizing: border-box;
}

.wh-filters-panel--side .wh-filters-block {
	margin-top: 0;
}

.wh-filters-panel--side .wh-filters-panel__motion > .wh-filters-block {
	margin-top: 0;
}

.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid .wh-filter-field > .spot-field-label,
.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid .wh-filter-field > .spot-field-label-row {
	min-height: 2.35rem;
	margin-bottom: 0;
	display: flex;
	align-items: flex-end;
}

.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid .wh-filter-field > .spot-field-label-row .spot-field-label {
	margin-bottom: 0;
}

@media (min-width: 961px) {
	.wh-form-split--with-side-filters {
		grid-template-columns: minmax(0, 1fr) minmax(340px, min(560px, 42vw));
		row-gap: 1.35rem;
	}

	.wh-form-split--with-side-filters .wh-form-col--main {
		display: contents;
	}

	.wh-form-split--with-side-filters .wh-type-fieldset,
	.wh-form-split--with-side-filters .wh-readonly-field--type {
		grid-column: 1;
		grid-row: 1;
		margin-bottom: 0;
		align-self: start;
	}
}

.wh-filters-panel--side {
	display: block;
	overflow: visible;
	max-height: none;
	opacity: 1;
	margin-bottom: 0;
}

.wh-filters-panel--side .wh-filters-panel__motion {
	transform: none;
	opacity: 1;
	pointer-events: auto;
	overflow: visible;
}

.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid {
	grid-template-columns: 1fr;
	margin-top: 0;
	gap: 0.85rem 1rem;
}

.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid .wh-filter-field .spot-field-label {
	max-width: none;
}

.wh-filters-panel--side .wh-spot-bool-row--pair {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.85rem 1rem;
	margin-top: 0.85rem;
}

.wh-filters-panel--side .wh-spot-bool-row--chain {
	grid-template-columns: 1fr;
	margin-top: 0.85rem;
}

.wh-filters-panel--side .wh-spot-bool-row--chain .spot-field {
	width: 100%;
}

.wh-filters-panel--side .wh-spot-bool-row--chain .spot-field-label-row {
	width: fit-content;
	max-width: 100%;
}

.wh-filters-panel--side .spot-field--chain .spot-toggle-label {
	display: flex;
	width: 100%;
	box-sizing: border-box;
	white-space: nowrap;
	align-items: center;
	justify-content: flex-start;
}

.wh-filters-panel--side .spot-field--chain .spot-toggle-text {
	flex: 1 1 auto;
	min-width: 0;
	white-space: nowrap;
}

.wh-filters-panel--side .spot-filters-inputs.wh-filter-grid.wh-webhook-numeric-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wh-enabled-row--bottom {
	margin-top: 1rem;
	margin-bottom: 0;
}

#tge-form .wh-form-actions--with-enabled,
#whe-form .wh-form-actions--with-enabled {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.75rem;
	margin-top: 1.5rem;
	width: auto;
	max-width: 100%;
}

#tge-form .wh-form-actions--with-enabled .btn-primary,
#whe-form .wh-form-actions--with-enabled .btn-primary,
#tge-form .wh-form-actions--with-enabled .wh-enabled-row--prominent,
#whe-form .wh-form-actions--with-enabled .wh-enabled-row--prominent {
	box-sizing: border-box;
	min-height: calc(0.6rem * 2 + 1.25rem);
}

#tge-form .wh-form-actions--with-enabled .profile-api-btn-create,
#whe-form .wh-form-actions--with-enabled .profile-api-btn-create {
	padding: calc(0.6rem - 1px) calc(1.25rem - 1px);
	line-height: 1.25;
	font-size: 1rem;
	font-weight: 500;
	min-height: calc(0.6rem * 2 + 1.25rem);
	box-shadow: none;
}

#tge-form .wh-form-actions--with-enabled .wh-enabled-row--prominent,
#whe-form .wh-form-actions--with-enabled .wh-enabled-row--prominent {
	margin: 0;
	padding: calc(0.6rem - 1px) calc(1.25rem - 1px);
	font-size: 1rem;
	line-height: 1.25;
	font-weight: 500;
	border-radius: 8px;
	border-width: 1px;
	gap: 0.5rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

#tge-form .wh-form-actions--with-enabled .wh-enabled-row--prominent .spot-toggle-track,
#whe-form .wh-form-actions--with-enabled .wh-enabled-row--prominent .spot-toggle-track {
	width: 32px;
	height: 18px;
}

#tge-form .wh-form-actions--with-enabled .wh-enabled-row--prominent .spot-toggle-thumb,
#whe-form .wh-form-actions--with-enabled .wh-enabled-row--prominent .spot-toggle-thumb {
	width: 14px;
	height: 14px;
}

#tge-form .wh-form-actions--with-enabled .wh-enabled-row--prominent:has(input:checked) .spot-toggle-thumb,
#whe-form .wh-form-actions--with-enabled .wh-enabled-row--prominent:has(input:checked) .spot-toggle-thumb {
	left: 16px;
}

#tge-form .wh-form-actions--with-enabled .wh-enabled-row--prominent:has(input:checked),
#whe-form .wh-form-actions--with-enabled .wh-enabled-row--prominent:has(input:checked) {
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.1);
}

#tge-form .wh-form-actions:not(.wh-form-actions--with-enabled),
#whe-form .wh-form-actions:not(.wh-form-actions--with-enabled) {
	margin-top: 2.25rem;
}

.wh-enabled-row--prominent {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	width: fit-content;
	max-width: 100%;
	margin: 1.25rem 0 0;
	padding: 0.9rem 1.05rem;
	border: 2px solid var(--border);
	border-radius: 14px;
	background: var(--surface-hover);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--text);
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
	position: relative;
	box-sizing: border-box;
	transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.wh-enabled-row--prominent .spot-toggle-track {
	position: relative;
	width: 32px;
	height: 18px;
	background: var(--border);
	border-radius: 999px;
	flex-shrink: 0;
	transition: background 0.2s;
}

.wh-enabled-row--prominent .spot-toggle-thumb {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	background: var(--text-muted);
	border-radius: 50%;
	transition: left 0.2s, background 0.2s;
}

.wh-enabled-row--prominent input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	pointer-events: none;
}

.wh-enabled-row--prominent .wh-enabled-label {
	flex: 1 1 auto;
	min-width: 0;
}

.wh-enabled-row--prominent:has(input:checked) {
	border-color: rgba(34, 197, 94, 0.5);
	background: rgba(34, 197, 94, 0.08);
	box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.1);
}

.wh-enabled-row--prominent:has(input:checked) .spot-toggle-track {
	background: rgb(34, 197, 94);
}

.wh-enabled-row--prominent:has(input:checked) .spot-toggle-thumb {
	left: 16px;
	background: #fff;
}

.wh-enabled-row--prominent:hover {
	border-color: rgba(96, 165, 250, 0.45);
}

#tge-form .wh-enabled-row--prominent,
#whe-form .wh-enabled-row--prominent {
	margin-top: 0.65rem;
	padding: 0.48rem 0.75rem;
	gap: 0.5rem;
	font-size: 0.875rem;
	border-radius: 10px;
	border-width: 1.5px;
}

#tge-form .wh-enabled-row--prominent .spot-toggle-track,
#whe-form .wh-enabled-row--prominent .spot-toggle-track {
	width: 28px;
	height: 16px;
}

#tge-form .wh-enabled-row--prominent .spot-toggle-thumb,
#whe-form .wh-enabled-row--prominent .spot-toggle-thumb {
	width: 12px;
	height: 12px;
}

#tge-form .wh-enabled-row--prominent:has(input:checked) .spot-toggle-thumb,
#whe-form .wh-enabled-row--prominent:has(input:checked) .spot-toggle-thumb {
	left: 14px;
}

#tge-form .wh-enabled-row--prominent:has(input:checked),
#whe-form .wh-enabled-row--prominent:has(input:checked) {
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.1);
}

/* Profile page modals (centered overlay) */
.payment-modal-overlay {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	background: var(--modal-overlay);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	animation: profile-modal-overlay-in 0.2s ease-out;
}

@keyframes profile-modal-overlay-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

.payment-modal-overlay.hidden {
	display: none !important;
}

.payment-modal-overlay .payment-modal {
	position: relative;
	min-width: 320px;
	max-width: 440px;
	width: 100%;
	box-shadow: var(--shadow);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	border: 0.8px solid rgb(45, 58, 79);
	border-radius: var(--radius);
	padding: 1.25rem 1.5rem;
	animation: profile-modal-in 0.25s ease-out;
}

.payment-modal-overlay .payment-modal.whd-payload-modal,
.payment-modal-overlay .whd-payload-modal.payment-modal {
	max-width: min(calc(100vw - 1.5rem), 37rem);
	width: min(calc(100vw - 1.5rem), 37rem);
	min-width: 0;
	height: calc(100vh - 2rem);
	max-height: calc(100vh - 2rem);
	min-height: 12rem;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-sizing: border-box;
	animation: profile-modal-in 0.25s ease-out;
}

@keyframes profile-modal-in {
	from {
		opacity: 0;
		transform: scale(0.96) translateY(-8px);
	}
	to {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
}

.payment-modal-title {
	margin: 0 0 1rem;
	font-size: 1.15rem;
	font-weight: 600;
}

.payment-modal-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 1rem;
}

/* ── Profile page (Figma layout) ─────────────────────────────────── */
.view--profile.view--security {
	max-width: none;
	width: 100%;
}

.profile-page {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 0 0 2rem;
}

.profile-subnav {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	padding: 0.75rem;
	margin-bottom: 1rem;
	border-radius: 1rem;
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

html[data-theme="light"] .profile-subnav {
	background: var(--pf-modal-bg, #ffffff);
}

.profile-subnav-link {
	display: inline-flex;
	align-items: center;
	padding: 0.62rem 1.15rem;
	border: 1px solid transparent;
	border-radius: 0.75rem;
	color: var(--text);
	font-size: 1rem;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.15s, background 0.15s, border-color 0.15s, box-shadow 0.15s;
}

.profile-subnav-link:hover {
	border-color: var(--border);
	background: color-mix(in srgb, var(--primary) 5%, transparent);
}

.profile-subnav-link--active {
	color: #fff;
	background: var(--primary);
	border-color: var(--primary);
	box-shadow: 0 8px 24px color-mix(in srgb, var(--primary) 28%, transparent);
}

/* API dropdown in profile left nav */
.profile-subnav-api {
	position: relative;
}

.profile-subnav-link--dropdown-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	cursor: pointer;
	font: inherit;
	font-size: 1rem;
	font-weight: 500;
}

.profile-subnav-chevron {
	flex-shrink: 0;
	transition: transform 0.18s ease;
}

.profile-subnav-api--open > .profile-subnav-link--dropdown-toggle .profile-subnav-chevron,
.profile-subnav-dropdown-group--open > .profile-subnav-dropdown-group-toggle .profile-subnav-chevron {
	transform: rotate(180deg);
}

.profile-subnav-dropdown {
	position: absolute;
	top: calc(100% + 0.35rem);
	left: 0;
	z-index: 40;
	min-width: 13.5rem;
	padding: 0.35rem;
	border: 1px solid var(--border);
	border-radius: 0.75rem;
	background: var(--surface);
	box-shadow: var(--shadow);
}

.profile-subnav-dropdown.hidden {
	display: none;
}

.profile-subnav-dropdown-link,
.profile-subnav-dropdown-sublink,
.profile-subnav-dropdown-group-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	width: 100%;
	padding: 0.5rem 0.65rem;
	border: none;
	border-radius: 0.5rem;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 500;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.15s, color 0.15s;
}

.profile-subnav-dropdown-link:hover,
.profile-subnav-dropdown-sublink:hover,
.profile-subnav-dropdown-group-toggle:hover {
	background: color-mix(in srgb, var(--primary) 8%, transparent);
}

.profile-subnav-dropdown-link--active,
.profile-subnav-dropdown-sublink--active {
	color: var(--primary);
	background: color-mix(in srgb, var(--primary) 12%, transparent);
}

.profile-subnav-dropdown-submenu {
	padding-left: 0.5rem;
	margin-top: 0.15rem;
	margin-bottom: 0.15rem;
	border-left: 1px solid var(--border);
}

.profile-subnav-dropdown-submenu.hidden {
	display: none;
}

.profile-subnav-dropdown-sublink {
	font-size: 0.875rem;
	font-weight: 500;
}

.profile-panel {
	border-radius: 1rem;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	overflow: hidden;
	box-sizing: border-box;
}

html[data-theme="light"] .profile-panel {
	background: var(--pf-modal-bg, #ffffff);
	border-color: rgba(0, 0, 0, 0.08);
}

.profile-panel-section:first-child {
	padding-bottom: 1.25rem;
}

.profile-panel .profile-panel-section.profile-security-sessions {
	margin: 0;
	border-bottom: none;
}

.profile-panel .profile-panel-section.profile-password-section {
	padding: 0;
}

.profile-panel .profile-password-toggle {
	padding: 1.35rem 2rem;
	width: 100%;
	box-sizing: border-box;
	align-items: center;
	min-height: 0;
}

.profile-panel-section {
	padding: 2rem;
}

.profile-panel-section + .profile-panel-section {
	border-top: 1px solid var(--border);
}

.profile-panel-title {
	margin: 0 0 2rem;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.2;
}

.profile-hero {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin-bottom: 1rem;
}

.profile-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5rem;
	height: 5rem;
	border-radius: 1rem;
	background: linear-gradient(135deg, #4f6cf6 0%, #7c3aed 100%);
	box-shadow: 0 10px 30px color-mix(in srgb, #4f6cf6 35%, transparent);
	flex-shrink: 0;
}

.profile-avatar-letter {
	color: #fff;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
}

.profile-hero-info {
	min-width: 0;
}

.profile-hero-email {
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--text);
	word-break: break-all;
	line-height: 1.35;
	margin-bottom: 0.35rem;
}

.profile-hero-badges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.profile-hero-admin-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.25rem 0.75rem;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.25;
	border: 1px solid rgba(129, 140, 248, 0.25);
	background: rgba(129, 140, 248, 0.1);
	color: #818cf8;
}

.profile-hero-admin-badge svg {
	width: 0.875rem;
	height: 0.875rem;
	flex-shrink: 0;
}

[data-theme="light"] .profile-hero-admin-badge {
	border-color: rgba(79, 108, 246, 0.2);
	background: rgba(79, 108, 246, 0.1);
	color: #4f6cf6;
}

.profile-subscription-badge {
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.75rem;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 500;
	color: #7b9cff;
	background: color-mix(in srgb, var(--primary) 18%, transparent);
}

[data-theme="light"] .profile-subscription-badge {
	color: #4f6cf6;
	background: rgba(79, 108, 246, 0.12);
}

.profile-subscription-badge--empty {
	color: var(--text-muted);
	background: color-mix(in srgb, var(--text-muted) 12%, transparent);
}

[data-theme="light"] .profile-subscription-badge--empty {
	color: var(--text-muted);
	background: rgba(100, 116, 139, 0.12);
}

.profile-telegram-section {
	display: flex;
	align-items: center;
	min-height: 6.5rem;
	padding-top: 1.35rem !important;
	padding-bottom: 1.35rem !important;
}

.profile-telegram-section .profile-integration-row {
	width: 100%;
	align-items: center;
}

.profile-telegram-section .profile-integration-icon {
	width: 3rem;
	height: 3rem;
}

.profile-telegram-section .profile-integration-title {
	margin-bottom: 0.15rem;
	font-size: 1rem;
}

.profile-telegram-section .profile-integration-status {
	font-size: 1rem;
}

.profile-integration-btn--compact {
	padding: 0.5rem 1rem;
	border-radius: 0.5rem;
	font-size: 1rem;
	min-height: 0;
}

.profile-security-sessions .security-sessions-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.profile-session-item {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.profile-session-current-label {
	padding: 0 0.25rem;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--primary);
}

.profile-session-card {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem 1rem;
	border: 1px solid var(--border);
	border-radius: 0.75rem;
	background: color-mix(in srgb, var(--surface) 50%, transparent);
	min-width: 0;
}

[data-theme="light"] .profile-session-card {
	background: rgba(0, 0, 0, 0.02);
}

.profile-session-card--current {
	background: color-mix(in srgb, var(--primary) 8%, transparent);
	border-color: color-mix(in srgb, var(--primary) 22%, var(--border));
}

[data-theme="light"] .profile-session-card--current {
	background: rgba(79, 108, 246, 0.06);
}

.profile-session-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--text-muted);
}

.profile-session-card--current .profile-session-icon {
	color: var(--primary);
}

.profile-session-ip {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	flex: 1 1 auto;
	min-width: 0;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 1rem;
}

.profile-session-ip-value {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.profile-session-ip-value--muted {
	color: var(--text-muted);
}

.profile-session-ip-arrow {
	display: flex;
	align-items: center;
	color: var(--text-muted);
	flex-shrink: 0;
}

.profile-session-dates {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 1rem 1.5rem;
	flex-shrink: 0;
}

.profile-session-date-block {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
}

.profile-session-date-caption {
	font-size: 0.75rem;
	color: var(--text-muted);
	line-height: 1.2;
}

.profile-session-date-value {
	font-size: 0.875rem;
	color: var(--text);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.profile-session-action-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	min-width: 6.5rem;
	padding: 0.375rem 0.75rem;
	border: 1px solid var(--border);
	border-radius: 0.5rem;
	background: transparent;
	color: var(--text-muted);
	font: inherit;
	font-size: 0.875rem;
	cursor: pointer;
	transition: color 0.15s, border-color 0.15s, background 0.15s;
	box-sizing: border-box;
}

.profile-session-action-btn:hover {
	border-color: color-mix(in srgb, #ef4444 50%, var(--border));
	color: #ef4444;
	background: rgba(239, 68, 68, 0.08);
}

.profile-session-action-btn--logout {
	border-color: color-mix(in srgb, #ef4444 50%, transparent);
	color: #ef4444;
}

.profile-session-action-btn--logout:hover {
	background: rgba(239, 68, 68, 0.08);
}

.profile-session-time {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	font-size: 0.875rem;
	color: var(--text-muted);
}

.profile-password-form .profile-password-field label {
	display: block;
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
	color: var(--text-muted);
}

.profile-password-form .profile-password-field input {
	width: 100%;
	padding: 0.75rem 2.75rem 0.75rem 1rem;
	border: 1px solid var(--border);
	border-radius: 0.75rem;
	background: var(--input-bg, var(--surface));
	font-size: 1rem;
}

.profile-password-form .profile-password-field input:focus {
	outline: none;
	border-color: var(--primary);
}

.profile-password-submit {
	margin-top: 0.5rem;
	padding: 0.75rem 1.5rem;
	border-radius: 0.75rem;
	width: auto;
	align-self: flex-start;
	box-sizing: border-box;
}

.profile-password-toggle:hover {
	background: color-mix(in srgb, var(--primary) 5%, transparent);
}

.profile-password-toggle .profile-integration-icon {
	width: 3rem;
	height: 3rem;
}

.profile-password-section .profile-password-panel.profile-password-panel--collapsed {
	pointer-events: none;
}

.profile-security-2fa .profile-integration-status {
	font-size: 0.875rem;
}

.profile-logout-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.75rem 1.5rem;
	border: 1px solid rgba(239, 68, 68, 0.4);
	border-radius: 0.75rem;
	background: transparent;
	color: #ef4444;
	font: inherit;
	font-size: 1rem;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.profile-logout-btn:hover {
	background: rgba(239, 68, 68, 0.08);
	border-color: rgba(239, 68, 68, 0.55);
	color: #ef4444;
}

.profile-logout-btn svg {
	flex-shrink: 0;
}

.profile-panel > .profile-panel-section:first-child {
	padding-bottom: 1.25rem;
}

.profile-stat-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.profile-stat-card {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--border);
	border-radius: 0.75rem;
	background: color-mix(in srgb, var(--primary) 6%, transparent);
	min-width: 0;
}

.profile-stat-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--primary);
	opacity: 0.7;
	flex-shrink: 0;
}

.profile-stat-text {
	min-width: 0;
}

.profile-stat-label {
	display: block;
	font-size: 0.875rem;
	color: var(--text-muted);
	margin-bottom: 0.15rem;
}

.profile-stat-value {
	display: block;
	font-size: 1rem;
	color: var(--text);
	word-break: break-all;
}

.profile-integration-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.profile-integration-left {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-width: 0;
}

.profile-integration-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: 0.75rem;
	flex-shrink: 0;
}

.profile-integration-icon--inactive {
	background: color-mix(in srgb, var(--text-muted) 12%, transparent);
	color: var(--text-muted);
}

.profile-integration-icon--active {
	background: rgba(39, 195, 112, 0.15);
	color: #27c370;
}

.profile-integration-icon--brand {
	background: color-mix(in srgb, var(--primary) 10%, transparent);
	color: var(--primary);
}

.profile-integration-title {
	font-size: 1rem;
	font-weight: 600;
	color: var(--text);
	margin-bottom: 0.25rem;
}

.profile-integration-status {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.95rem;
}

.profile-integration-status--inactive {
	color: var(--text-muted);
}

.profile-integration-status--active {
	color: #27c370;
}

.profile-integration-dot {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	flex-shrink: 0;
	background: currentColor;
}

.profile-integration-status--inactive .profile-integration-dot {
	opacity: 0.5;
}

.profile-integration-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 1rem;
	border-radius: 0.5rem;
	font-size: 1rem;
	font-weight: 500;
	cursor: pointer;
	transition: opacity 0.15s, background 0.15s, border-color 0.15s;
	border: 1px solid transparent;
	background: transparent;
	flex-shrink: 0;
}

.profile-integration-btn--primary {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.profile-integration-btn--primary:hover {
	opacity: 0.9;
}

.profile-integration-btn--danger {
	border: 1px solid rgba(239, 68, 68, 0.5);
	color: #ef4444;
	background: transparent;
}

.profile-integration-btn--danger:hover {
	background: rgba(239, 68, 68, 0.08);
	border-color: rgba(239, 68, 68, 0.55);
	color: #ef4444;
}

.profile-sessions-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}

.profile-sessions-title-row {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.profile-sessions-title-row svg {
	color: var(--text-muted);
	flex-shrink: 0;
}

.profile-sessions-title-row .profile-section-title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 600;
}

.profile-sessions-quota-wrap {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.profile-sessions-quota-bar {
	display: flex;
	align-items: stretch;
	width: 3.75rem;
	height: 0.375rem;
	border-radius: 999px;
	overflow: hidden;
	gap: 2px;
}

.profile-sessions-quota-segment {
	flex: 1;
	border-radius: 999px;
	background: color-mix(in srgb, var(--text-muted) 18%, transparent);
}

.profile-sessions-quota-segment--filled {
	background: var(--primary);
}

[data-theme="light"] .profile-sessions-quota-segment:not(.profile-sessions-quota-segment--filled) {
	background: rgba(0, 0, 0, 0.1);
}

.profile-sessions-quota-text {
	font-size: 0.75rem;
	color: var(--text-muted);
}

.profile-sessions-actions {
	margin-top: 1rem;
}

.profile-sessions-revoke-all-btn {
	width: auto;
	min-width: 6.5rem;
}

.profile-sessions-revoke-all-message {
	margin: 0 0 1rem;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--text-muted);
}

.profile-sessions-revoke-current-label {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--text);
	cursor: pointer;
}

.profile-sessions-revoke-current-label input {
	margin-top: 0.2rem;
	flex-shrink: 0;
}

.profile-password-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0;
	border: none;
	background: transparent;
	color: inherit;
	cursor: pointer;
	text-align: left;
}

.profile-password-toggle-left {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.profile-password-toggle-text {
	font-size: 1.125rem;
	font-weight: 600;
}

.profile-password-toggle-chevron {
	color: var(--text-muted);
	transition: transform 0.2s;
	flex-shrink: 0;
}

.profile-password-toggle--open .profile-password-toggle-chevron {
	transform: rotate(180deg);
}

.profile-password-panel {
	display: grid;
	grid-template-rows: 1fr;
	overflow: hidden;
	transition: grid-template-rows 0.45s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.35s ease;
	opacity: 1;
}

.profile-password-panel--collapsed {
	grid-template-rows: 0fr;
	opacity: 0;
	pointer-events: none;
}

.profile-password-panel--collapsed .profile-password-panel-inner {
	padding-top: 0;
	padding-bottom: 0;
}

.profile-password-panel-inner {
	overflow: hidden;
	min-height: 0;
	padding: 1rem 2rem 1.5rem;
	box-sizing: border-box;
	transition: padding 0.35s ease;
}

.profile-password-form {
	width: 100%;
	box-sizing: border-box;
}

.profile-password-form .profile-password-field {
	box-sizing: border-box;
	width: 100%;
}

.profile-password-form .profile-password-field input {
	width: 100%;
	box-sizing: border-box;
}

.profile-logout-section {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}

.profile-security-google-actions {
	display: flex;
	gap: 0.5rem;
	flex-shrink: 0;
}

@media (max-width: 900px) {
	.profile-stat-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {
	.profile-page {
		padding-left: 0;
		padding-right: 0;
	}

	.profile-panel-section {
		padding: 1.25rem;
	}

	.profile-hero {
		flex-direction: column;
		align-items: flex-start;
	}

	.profile-session-card {
		flex-wrap: wrap;
		align-items: flex-start;
		row-gap: 0.65rem;
	}

	.profile-session-ip {
		flex: 1 1 8rem;
		min-width: 0;
	}

	.profile-session-dates {
		flex: 0 1 auto;
		min-width: 0;
	}
}

/* Profile subscriptions page */
.profile-subscriptions-panel .profile-panel-title {
	margin-bottom: 2rem;
}

.profile-subscriptions-subtitle {
	margin: 0 0 1.25rem;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--text);
}

.profile-subscriptions-active {
	margin-bottom: 2.5rem;
}

.profile-subscriptions-active-head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
	margin-bottom: 1rem;
}

.profile-subscriptions-active-head .profile-subscriptions-subtitle {
	margin: 0;
}

.profile-subscriptions-active-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin-top: 1rem;
}

.profile-subscriptions-active-actions .profile-payment-btn {
	text-decoration: none;
}

.profile-subscriptions-history {
	margin-top: 0;
}

.profile-subscriptions-empty-state {
	margin: 0;
}

.profile-subscriptions-history-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 1rem;
}

.profile-subscription-card {
	border: 1px solid var(--border);
	border-radius: 0.75rem;
	padding: 1.25rem;
	background: color-mix(in srgb, var(--surface) 50%, transparent);
}

.profile-subscription-card--active {
	padding: 1.5rem;
	border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
	border-radius: 1rem;
	background: color-mix(in srgb, var(--primary) 8%, transparent);
}

[data-theme="light"] .profile-subscription-card--active {
	background: color-mix(in srgb, var(--primary) 6%, #fff);
}

.profile-subscription-card-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.25rem;
}

.profile-subscription-card--history .profile-subscription-card-head {
	margin-bottom: 1rem;
}

.profile-subscription-card-title-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.75rem 1rem;
	min-width: 0;
}

.profile-subscription-card--active .profile-subscription-card-title-row {
	gap: 1rem;
}

.profile-subscription-card-name {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--text);
}

.profile-subscription-card--active .profile-subscription-card-name {
	font-size: 1.25rem;
	line-height: 1.5;
}

.profile-subscription-card-price {
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--text-muted);
}

.profile-subscription-card-price--active {
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--primary);
}

.profile-subscription-card-badges {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.35rem;
	flex-shrink: 0;
}

.profile-subscription-card .subscription-status {
	padding: 0.25rem 0.75rem;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.5;
}

.profile-subscription-card .subscription-status--active {
	background: rgba(39, 195, 112, 0.15);
	color: #27c370;
}

.profile-subscription-card .subscription-status--expired {
	background: rgba(139, 156, 179, 0.12);
	color: #8b9cb3;
}

.profile-subscription-card .subscription-status--cancelled {
	background: rgba(239, 68, 68, 0.15);
	color: #ef4444;
}

.profile-subscription-card .subscription-status--upgraded {
	background: rgba(59, 130, 246, 0.18);
	color: #7b9cff;
}

.profile-subscription-meta-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 2rem;
	margin-bottom: 1.25rem;
}

.profile-subscription-meta {
	margin-bottom: 1.25rem;
}

.profile-subscription-meta-grid--history {
	gap: 2rem;
	margin-bottom: 0;
}

.profile-subscription-meta-grid--compact {
	margin-top: 0.5rem;
	margin-bottom: 0;
}

.profile-meta-line {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0.65rem 1rem;
}

.profile-meta-line--subscription {
	margin-bottom: 0;
	gap: 0.65rem 1.35rem;
}

.profile-meta-line--reason {
	margin-top: 0.65rem;
}

.profile-meta-line--payment {
	margin-bottom: 0.65rem;
	gap: 0.65rem 1.35rem;
}

.profile-meta-line--payment-crypto {
	margin-bottom: 1rem;
}

.profile-meta-grid--payment {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, max-content));
	column-gap: 1.35rem;
	row-gap: 0.75rem;
	margin-bottom: 1rem;
}

.profile-meta-item {
	min-width: 0;
}

.profile-meta-item-body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.05rem;
}

.profile-meta-item-label-row {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	max-width: 100%;
}

.profile-meta-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 15px;
	height: 15px;
	color: var(--text-muted);
}

.profile-meta-icon svg {
	display: block;
	width: 15px;
	height: 15px;
}

.profile-meta-icon--success {
	color: #27c370;
}

.profile-meta-icon--danger {
	color: #ef4444;
}

.profile-meta-item--placeholder {
	visibility: hidden;
	min-height: 1px;
	pointer-events: none;
}

.profile-meta-item--success .profile-meta-icon {
	color: #27c370;
}

.profile-meta-item--danger .profile-meta-icon {
	color: #ef4444;
}

.profile-meta-caption {
	display: block;
	font-size: 0.75rem;
	line-height: 1.25;
	color: var(--text-muted);
}

.profile-meta-value {
	display: block;
	margin-top: 0;
	padding-left: calc(15px + 0.45rem);
	font-size: 0.9rem;
	line-height: 1.25;
	color: var(--text);
}

.profile-meta-value--success {
	color: #27c370;
}

.profile-meta-value--danger {
	color: #ef4444;
}

.profile-subscription-meta-col {
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
	min-width: 0;
}

.profile-subscription-card--active .profile-subscription-meta-col {
	gap: 0.375rem;
}

.profile-subscription-meta-label {
	font-size: 0.75rem;
	line-height: 1.25;
	color: var(--text-muted);
}

.profile-subscription-meta-grid--history .profile-subscription-meta-label {
	font-size: 0.75rem;
	line-height: 1.25;
}

.profile-subscription-meta-value {
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1.25;
	color: var(--text);
}

.profile-subscription-meta-grid--history .profile-subscription-meta-value {
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1.25;
}

.profile-subscription-countdown {
	margin-top: 0;
}

.profile-subscription-countdown-label {
	margin-bottom: 1rem;
}

.profile-subscription-countdown-timer {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.profile-subscription-countdown-unit {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 2.5rem;
}

.profile-subscription-countdown-value {
	font-size: 1.75rem;
	font-weight: 600;
	line-height: 1.2;
	color: var(--primary);
}

.profile-subscription-countdown-unit-label {
	font-size: 0.75rem;
	line-height: 1.5;
	color: var(--text-muted);
}

.profile-subscription-countdown-sep {
	font-size: 1.5rem;
	line-height: 1;
	color: var(--text-muted);
	align-self: flex-start;
	margin-top: 0.15rem;
}

.profile-subscription-countdown-expired {
	font-size: 1rem;
	font-weight: 500;
	color: var(--text-muted);
}

.profile-subscription-card-actions {
	margin-top: 1rem;
}

.profile-subscriptions-panel .load-loading-block,
.profile-subscriptions-panel .load-error-block {
	margin-top: 0.5rem;
}

.profile-subscriptions-panel .admin-pagination {
	margin-top: 1rem;
}

@media (max-width: 640px) {
	.profile-subscription-card-head {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
	}

	.profile-subscription-card-title-row {
		flex: 1 1 auto;
		min-width: 0;
	}

	.profile-subscription-card-badges {
		align-items: flex-end;
		align-self: flex-start;
		margin-left: auto;
		flex: 0 1 auto;
		max-width: 100%;
	}

	.profile-subscription-card .subscription-status {
		white-space: nowrap;
	}

	.profile-subscription-meta-grid,
	.profile-subscription-meta-grid--history {
		gap: 1rem 1.5rem;
	}

	.profile-subscription-countdown-timer {
		flex-wrap: wrap;
		gap: 0.75rem;
	}
}

/* Profile payments page */
.profile-payments-panel .profile-panel-title {
	margin-bottom: 2rem;
}

.profile-payments-empty-state {
	margin: 0;
}

.profile-payments-panel .profile-payments-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin: 0;
}

.profile-payments-panel .load-loading-block,
.profile-payments-panel .load-error-block {
	margin-top: 0.5rem;
}

.profile-payments-panel .admin-pagination {
	margin-top: 1rem;
}

.profile-payment-card {
	position: relative;
	padding: 1.25rem;
	border: 1px solid var(--border);
	border-radius: 0.75rem;
	background: color-mix(in srgb, var(--surface) 50%, transparent);
}

.profile-payment-card-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.profile-payment-card-amount {
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--primary);
}

.profile-payment-card .payment-status {
	padding: 0.25rem 0.75rem;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.5;
}

.profile-payment-card .payment-status--pending {
	background: rgba(249, 115, 22, 0.16);
	color: #fb923c;
}

.profile-payment-card .payment-status--partial-paid {
	background: rgba(59, 130, 246, 0.18);
	color: #7b9cff;
}

.profile-payment-card .payment-status--paid {
	background: rgba(39, 195, 112, 0.15);
	color: #27c370;
}

.profile-payment-card .payment-status--cancelled {
	background: rgba(239, 68, 68, 0.15);
	color: #ef4444;
}

.profile-payment-card-meta-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0.65rem 1rem;
	margin-bottom: 1rem;
}

.profile-payment-card-meta {
	margin-bottom: 1rem;
}

.profile-payment-meta-col {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	min-width: 0;
}

.profile-payment-meta-label {
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--text-muted);
}

.profile-payment-meta-value {
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--text);
}

.profile-payment-card-footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--border);
}

.profile-payment-link {
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.5;
	color: var(--primary);
	text-decoration: none;
	transition: color 0.15s;
}

.profile-payment-link:hover {
	color: var(--primary);
	text-decoration: underline;
}

.profile-payment-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.375rem 0.75rem;
	border-radius: 0.5rem;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.5;
	cursor: pointer;
	transition: color 0.15s, border-color 0.15s, background 0.15s;
}

.profile-payment-btn--outline {
	border: 1px solid var(--border);
	background: transparent;
	color: var(--text-muted);
}

.profile-payment-btn--outline:hover:not(:disabled) {
	border-color: var(--primary);
	color: var(--primary);
}

.profile-payment-btn--outline-danger {
	border-color: rgba(239, 68, 68, 0.5);
	color: #ef4444;
}

.profile-payment-btn--outline-danger:hover:not(:disabled) {
	border-color: rgba(239, 68, 68, 0.65);
	color: #ef4444;
	background: rgba(239, 68, 68, 0.1);
}

.profile-payment-btn--danger {
	border: 1px solid rgba(239, 68, 68, 0.5);
	background: transparent;
	color: #ef4444;
}

.profile-payment-btn--danger:hover:not(:disabled) {
	background: rgba(239, 68, 68, 0.1);
}

.profile-payment-btn--success {
	border: 1px solid rgba(34, 197, 94, 0.5);
	background: transparent;
	color: #22c55e;
}

.profile-payment-btn--success:hover:not(:disabled) {
	background: rgba(34, 197, 94, 0.1);
}

.profile-payment-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.profile-payment-btn.btn--loading {
	position: relative;
}

@media (max-width: 640px) {
	.profile-payment-card-head {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: space-between;
	}

	.profile-payment-card-amount {
		flex: 1 1 auto;
		min-width: 0;
	}

	.profile-payment-card .payment-status {
		white-space: nowrap;
		margin-left: auto;
		flex: 0 1 auto;
	}

	.profile-meta-grid--payment {
		grid-template-columns: 1fr;
		column-gap: 0;
	}

	.profile-meta-grid--payment .profile-meta-item--placeholder {
		display: none;
	}
}

/* API main — override generic profile-panel section padding */
.profile-api-page--main .profile-api-panel .profile-panel-section,
.profile-api-page--main .profile-api-panel .profile-panel-section:first-child {
	padding: 2rem;
}

.profile-api-page--main .profile-api-keys-head {
	margin-bottom: 1.5rem;
}

.profile-api-page--main #api-whitelist-overlay .profile-api-whitelist-modal {
	border-radius: 1rem;
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	backdrop-filter: blur(4px);
}

html[data-theme="light"] .profile-api-page--main #api-whitelist-overlay .profile-api-whitelist-modal {
	background: rgba(255, 255, 255, 0.88);
}

/* API keys — warning hint (single active key) */
.profile-api-keys-head-actions .profile-api-create-blocked-hint--warning {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	color: #fbbf24;
	font-size: 0.8125rem;
	line-height: 1.3;
	text-align: right;
	max-width: none;
}

html[data-theme="light"] .profile-api-keys-head-actions .profile-api-create-blocked-hint--warning {
	color: #d97706;
}

.profile-api-create-blocked-icon {
	flex-shrink: 0;
	margin: 0;
	width: 1rem;
	height: 1rem;
	color: #f59e0b;
}

html[data-theme="light"] .profile-api-create-blocked-icon {
	color: #d97706;
}

.profile-api-create-blocked-hint-text {
	min-width: 0;
	white-space: nowrap;
}

@media (max-width: 640px) {
	.profile-api-keys-head {
		flex-direction: column;
		align-items: stretch;
	}

	.profile-api-keys-head-actions {
		align-items: stretch;
		width: 100%;
		max-width: 100%;
	}

	.profile-api-keys-head-actions .profile-api-create-blocked-hint--warning {
		white-space: normal;
		text-align: left;
		align-self: stretch;
	}

	.profile-api-create-blocked-hint-text {
		white-space: normal;
	}

	.profile-api-page--main .profile-api-btn-create {
		width: 100%;
		justify-content: center;
		box-sizing: border-box;
	}
}

/* REST request history — Figma layout */
.profile-api-rest-page {
	display: flex;
	flex-direction: column;
	gap: 0;
	overflow: visible;
}

.profile-api-rest-page .profile-api-rest-panel--unified {
	border-radius: 1rem;
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	overflow: visible;
}

html[data-theme="light"] .profile-api-rest-page .profile-api-rest-panel--unified {
	background: rgba(255, 255, 255, 0.88);
}

.profile-api-rest-page .profile-api-rest-section--filters {
	padding: 1.5rem 2rem 1.25rem;
	position: relative;
	overflow: visible;
	z-index: 3;
}

.profile-api-rest-page .profile-api-rest-filters-grid .api-rest-endpoint-dd--open,
.profile-api-rest-page .profile-api-rest-filters-grid .filter-custom-select.api-rest-endpoint-dd--open {
	z-index: 1200;
	position: relative;
}

.profile-api-rest-page .profile-api-rest-filters-grid .api-rest-endpoint-dd--open .api-rest-endpoint-dd__menu,
.profile-api-rest-page .profile-api-rest-filters-grid .filter-custom-select.api-rest-endpoint-dd--open .api-rest-endpoint-dd__menu {
	z-index: 1201;
}

.profile-api-rest-filters-loading {
	position: absolute;
	inset: 0;
	z-index: 5;
	margin: 0;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: color-mix(in srgb, var(--card-bg, #161a2b) 45%, transparent);
	backdrop-filter: blur(1.5px);
	-webkit-backdrop-filter: blur(1.5px);
	border-radius: inherit;
}

html[data-theme="light"] .profile-api-rest-filters-loading {
	background: color-mix(in srgb, var(--card-bg, #fff) 50%, transparent);
}

.profile-api-rest-page .profile-api-rest-section--history {
	padding: 1.25rem 2rem 2rem;
}

.profile-api-rest-section-divider {
	height: 0;
	border: none;
	border-top: 1px solid var(--border);
	margin: 0;
}

.profile-api-rest-filters-head {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
}

.profile-api-rest-filters-icon {
	flex-shrink: 0;
	color: var(--text-muted);
}

.profile-api-rest-filters-title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--text);
}

.profile-api-rest-filters-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.75rem;
	align-items: end;
}

.profile-api-rest-filters-grid .api-rest-filter-field {
	min-width: 0;
	max-width: 100%;
}

.profile-api-rest-filters-grid .profile-api-rest-date-wrap,
.profile-api-rest-filters-grid .api-rest-endpoint-dd {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.profile-api-rest-page .profile-api-rest-filters-grid.api-rest-filters-toolbar {
	display: grid;
	gap: 0.75rem;
	margin-bottom: 0;
}

.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-select,
.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-input,
.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-select-trigger,
.profile-api-rest-page .profile-api-rest-filters-grid .filter-custom-select .api-rest-endpoint-dd__trigger {
	padding: 0.5rem 2rem 0.5rem 0.65rem;
	font-size: 16px;
	line-height: 1.35;
	min-height: 2.75rem;
	height: 2.75rem;
	box-sizing: border-box;
	border-radius: 0.625rem;
}

.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-select {
	padding-right: 2rem;
	background-position: right 0.65rem center;
}

.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-endpoint-dd .api-rest-endpoint-dd__trigger {
	padding: 0.5rem 2rem 0.5rem 0.65rem;
	font-size: 16px;
	border-radius: 0.625rem;
	min-height: 2.75rem;
	height: 2.75rem;
	font-weight: 400;
	box-shadow: none;
}

.profile-api-rest-page .profile-api-rest-filters-grid .api-rest-filter-field--endpoint {
	min-width: 0;
}

.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-endpoint-dd,
.profile-api-rest-page .profile-api-rest-filters-grid .filter-custom-select,
.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-select-wrap {
	width: 100%;
	min-width: 0;
	max-width: 100%;
}

.admin-page--main .admin-form-field .filter-custom-select,
.admin-page--main .admin-form-field .profile-api-rest-select-wrap .filter-custom-select {
	width: 100%;
	min-width: 0;
}

.admin-page--main .admin-form-field .filter-custom-select .api-rest-endpoint-dd__trigger,
.admin-page--main .admin-form-field .profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__trigger {
	width: 100%;
	min-height: 2.75rem;
	height: 2.75rem;
	padding: 0.5rem 2rem 0.5rem 0.65rem;
	font-size: 16px;
	font-weight: 400;
	border-radius: 0.625rem;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	box-shadow: none;
}

html[data-theme="light"] .admin-page--main .admin-form-field .filter-custom-select .api-rest-endpoint-dd__trigger,
html[data-theme="light"] .admin-page--main .admin-form-field .profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__trigger {
	background: var(--pf-modal-bg, #fff);
	border-color: rgba(45, 58, 79, 0.18);
}

.admin-page--main .admin-form-field .filter-custom-select--open,
.profile-api-rest-filters-grid .filter-custom-select--open {
	z-index: 1200;
	position: relative;
}

.admin-page--main .admin-form-field .filter-custom-select--open .api-rest-endpoint-dd__menu,
.profile-api-rest-filters-grid .filter-custom-select--open .api-rest-endpoint-dd__menu {
	z-index: 1201;
}

.filter-custom-select__native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	opacity: 0 !important;
	pointer-events: none !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.filter-custom-select > select,
.filter-custom-select .filter-custom-select__native,
select.filter-custom-select__native {
	display: none !important;
	visibility: hidden !important;
	position: absolute !important;
	width: 0 !important;
	height: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.api-rest-endpoint-dd__menu[hidden] {
	display: none !important;
}

.filter-custom-select.api-rest-endpoint-dd {
	position: relative;
	display: block;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__trigger,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__trigger,
.profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__trigger {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	box-sizing: border-box;
	width: 100%;
	min-height: 2.75rem;
	height: 2.75rem;
	padding: 0.5rem 2rem 0.5rem 0.65rem;
	border-radius: 0.625rem;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	color: var(--text);
	font: inherit;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.35;
	cursor: pointer;
	text-align: left;
	box-shadow: none;
	display: block;
	position: relative;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__value,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__value,
.profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__value {
	display: block;
	width: 100%;
	box-sizing: border-box;
	min-width: 0;
	padding-right: 0.25rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__chevron,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__chevron,
.profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__chevron {
	position: absolute;
	right: 0.65rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-muted);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	transition: transform 0.18s ease;
}

.filter-custom-select.api-rest-endpoint-dd--open .api-rest-endpoint-dd__chevron,
.filter-custom-select--open .api-rest-endpoint-dd__chevron {
	transform: translateY(-50%) rotate(180deg);
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__menu,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__menu,
.profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__menu {
	position: absolute;
	left: 0;
	right: 0;
	top: calc(100% + 0.28rem);
	z-index: 1201;
	box-sizing: border-box;
	min-width: 100%;
	max-width: min(36rem, 92vw);
	max-height: 15rem;
	overflow-x: hidden;
	overflow-y: auto;
	margin: 0;
	padding: 0.3rem;
	border-radius: 10px;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__option,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__option {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 0.5rem 0.65rem;
	border: none;
	border-radius: 8px;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 16px;
	line-height: 1.35;
	text-align: left;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

html[data-theme="light"] .page-profile-figma .filter-custom-select .api-rest-endpoint-dd__trigger,
html[data-theme="light"] .admin-page--main .filter-custom-select .api-rest-endpoint-dd__trigger,
html[data-theme="light"] .profile-api-rest-select-wrap .filter-custom-select .api-rest-endpoint-dd__trigger {
	background: var(--pf-modal-bg, #fff);
	border-color: rgba(45, 58, 79, 0.18);
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__trigger:hover,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__trigger:hover {
	border-color: color-mix(in srgb, var(--primary) 45%, rgb(45, 58, 79));
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__trigger:focus,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__trigger:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.28);
}

html[data-theme="light"] .page-profile-figma .filter-custom-select .api-rest-endpoint-dd__menu,
html[data-theme="light"] .admin-page--main .filter-custom-select .api-rest-endpoint-dd__menu {
	background: var(--pf-modal-bg, #fff);
	border-color: rgba(45, 58, 79, 0.18);
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__option:hover,
.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__option:focus,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__option:hover,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__option:focus {
	background: var(--surface-hover);
	outline: none;
}

.page-profile-figma .filter-custom-select .api-rest-endpoint-dd__option--current,
.admin-page--main .filter-custom-select .api-rest-endpoint-dd__option--current {
	background: color-mix(in srgb, var(--primary) 14%, transparent);
}

.page-profile-figma .filter-custom-select.api-rest-endpoint-dd--open,
.admin-page--main .filter-custom-select.api-rest-endpoint-dd--open {
	z-index: 1200;
	position: relative;
}

.page-profile-figma .arb-styled-select:has(.filter-custom-select) .arb-styled-select__native,
.page-profile-figma .arb-styled-select:has(.filter-custom-select) select,
.page-profile-figma .withdrawal-modal-styled-select:has(.filter-custom-select) select {
	display: none !important;
}

.page-profile-figma .arb-styled-select:has(.filter-custom-select) .arb-styled-select__chevron {
	display: none;
}

.profile-webhook-create-page .filter-custom-select > select.spot-input,
.profile-webhook-create-page select.filter-custom-select__native {
	display: none !important;
}

.page-profile-figma .arb-filters-footer,
.page-profile-figma .arb-filters-footer .arb-field,
.page-profile-figma .spot-filters-inputs,
.page-profile-figma .spot-filters-inputs .arb-field,
.page-profile-figma .wh-filters-block,
.page-profile-figma .wh-filter-grid .spot-field,
.page-profile-figma .wh-form-field {
	overflow: visible;
}

.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-date-wrap .profile-api-rest-datetime {
	padding-right: 2rem;
}

.profile-api-rest-filter-label-row {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	margin-bottom: 0.35rem;
	min-height: 0.875rem;
}

.profile-api-rest-filter-label-icon {
	display: block;
	flex-shrink: 0;
	width: 0.875rem;
	height: 0.875rem;
	color: var(--text-muted);
	transform: translateY(0.5px);
}

.profile-api-rest-filter-label {
	display: block;
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
	color: var(--text-muted);
}

.profile-api-rest-filter-label-row .profile-api-rest-filter-label {
	display: block;
	margin-bottom: 0;
	padding: 0;
	font-size: 0.8125rem;
	line-height: 0.875rem;
}

.profile-api-rest-select,
.profile-api-rest-page .profile-api-rest-select-trigger,
.profile-api-rest-input {
	width: 100%;
	box-sizing: border-box;
	padding: 0.625rem 1rem;
	border-radius: 8px;
	border: 0.8px solid rgb(45, 58, 79);
	background-color: var(--pf-modal-bg, rgb(17, 22, 35));
	color: var(--text);
	font: inherit;
	font-size: 1rem;
	line-height: 1.35;
	transition: border-color 0.15s ease;
}

.profile-api-rest-select:focus,
.profile-api-rest-page .profile-api-rest-select-trigger:focus,
.profile-api-rest-input:focus {
	outline: none;
	border-color: var(--primary);
}

.profile-api-rest-select {
	appearance: none;
	cursor: pointer;
	padding-right: 2.25rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
}

.profile-api-rest-page .profile-api-rest-endpoint-dd .api-rest-endpoint-dd__trigger {
	min-height: auto;
	padding: 0.625rem 2.25rem 0.625rem 1rem;
	border-radius: 8px;
	font-size: 1rem;
	font-weight: 400;
	box-shadow: none;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
}

.profile-api-rest-date-wrap {
	position: relative;
	display: flex;
	align-items: stretch;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	box-sizing: border-box;
}

.profile-api-rest-date-wrap .profile-api-rest-datetime,
.profile-api-rest-date-wrap input[type="datetime-local"] {
	padding-right: 2.5rem;
	flex: 1 1 0;
	width: 0;
	min-width: 0;
	max-width: 100%;
	text-align: left;
	-webkit-min-logical-width: 0;
}

.profile-api-rest-date-wrap input[type="datetime-local"]::-webkit-datetime-edit,
.profile-api-rest-date-wrap input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper,
.profile-api-rest-date-wrap input[type="datetime-local"]::-webkit-date-and-time-value {
	text-align: left;
}

.profile-api-rest-date-wrap input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper {
	display: flex;
	justify-content: flex-start;
	padding: 0;
	margin: 0;
}
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-fields-wrapper,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-text,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-month-field,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-day-field,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-year-field,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-hour-field,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-minute-field,
.profile-api-rest-date-wrap input[type="datetime-local"].is-empty::-webkit-datetime-edit-second-field {
	opacity: 0;
	color: transparent;
}

.profile-api-rest-date-wrap input[type="datetime-local"]:not(.is-empty)::-webkit-datetime-edit,
.profile-api-rest-date-wrap input[type="datetime-local"]:not(.is-empty)::-webkit-datetime-edit-fields-wrapper {
	opacity: 1;
}

.profile-api-rest-date-wrap .profile-api-rest-datetime.is-empty::-webkit-calendar-picker-indicator {
	opacity: 0.85;
}

.profile-api-rest-date-hint {
	display: none !important;
}

.profile-api-rest-date-icon {
	position: absolute;
	right: 0.75rem;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: var(--text-muted);
}

.profile-api-rest-history-heading {
	margin: 0 0 1.5rem;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--text);
}

.profile-api-rest-history-count {
	margin-left: 0.75rem;
	font-size: 1rem;
	font-weight: 400;
	color: var(--text-muted);
}

.profile-api-rest-page .api-rest-list-wrap {
	margin-top: 0;
}

.profile-api-rest-page .api-rest-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.profile-api-rest-page .profile-api-rest-card {
	padding: 1.25rem;
	border-radius: 0.75rem;
	border: 0.8px solid rgb(45, 58, 79);
	background: var(--pf-modal-bg, rgb(17, 22, 35));
	box-shadow: none;
	transition: border-color 0.15s ease;
}

html[data-theme="light"] .profile-api-rest-page .profile-api-rest-card {
	background: var(--pf-modal-bg, #ffffff);
	border-color: rgba(45, 58, 79, 0.18);
}

.profile-api-rest-page .profile-api-rest-card:hover {
	border-color: color-mix(in srgb, var(--primary) 30%, var(--border));
	box-shadow: none;
}

.profile-api-rest-card__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.profile-api-rest-card__header-left {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex: 1;
	min-width: 0;
}

.profile-api-rest-page .profile-api-rest-method {
	border: none;
	min-width: auto;
	min-height: auto;
	padding: 0.25rem 0.75rem;
	border-radius: 0.5rem;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: uppercase;
}

.profile-api-rest-page .api-rest-method--get {
	background: rgba(59, 130, 246, 0.2);
	color: #60a5fa;
}

html[data-theme="light"] .profile-api-rest-page .api-rest-method--get {
	background: rgba(59, 130, 246, 0.15);
	color: #3b82f6;
}

.profile-api-rest-page .api-rest-method--post {
	background: rgba(34, 197, 94, 0.2);
	color: #4ade80;
}

html[data-theme="light"] .profile-api-rest-page .api-rest-method--post {
	background: rgba(34, 197, 94, 0.15);
	color: #16a34a;
}

.profile-api-rest-page .api-rest-method--put {
	background: rgba(251, 146, 60, 0.2);
	color: #fb923c;
}

.profile-api-rest-page .api-rest-method--patch {
	background: rgba(168, 85, 247, 0.2);
	color: #c084fc;
}

.profile-api-rest-page .api-rest-method--del {
	background: rgba(239, 68, 68, 0.2);
	color: #f87171;
}

.profile-api-rest-card__path-wrap {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
}

.profile-api-rest-card__path {
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 0.875rem;
	color: var(--text);
	background: transparent;
	border: none;
	padding: 0;
}

.profile-api-rest-copy-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 0.375rem;
	border: none;
	border-radius: 0.5rem;
	background: transparent;
	color: var(--text-muted);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.profile-api-rest-copy-btn:hover {
	background: color-mix(in srgb, var(--primary) 10%, transparent);
	color: var(--primary);
}

.profile-api-rest-card__http {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
}

.profile-api-rest-card__http-label {
	font-size: 0.75rem;
	color: var(--text-muted);
}

.profile-api-rest-card__http-code {
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.2;
}

.profile-api-rest-http--ok {
	color: #34d399;
}

.profile-api-rest-http--warn {
	color: #facc15;
}

.profile-api-rest-http--err {
	color: #f87171;
}

.profile-api-rest-http--muted {
	color: var(--text-muted);
}

.profile-api-rest-card__details {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}

.profile-api-rest-card__detail-label {
	margin-bottom: 0.25rem;
	font-size: 0.75rem;
	color: var(--text-muted);
}

.profile-api-rest-card__detail-value {
	font-size: 0.875rem;
	color: var(--text);
}

.profile-api-rest-card__detail-value--mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.profile-api-rest-card__detail-value--muted {
	color: var(--text-muted);
}

.profile-api-rest-card__cu-value {
	font-weight: 600;
	color: var(--primary);
}

.profile-api-rest-card__footer {
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--border);
}

.profile-api-rest-card__footer-text {
	font-size: 0.75rem;
	color: var(--text-muted);
}

.profile-api-rest-card__footer-date {
	color: var(--text);
}

.profile-api-rest-card__error {
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px dashed var(--border);
}

.profile-api-rest-card__err-lbl {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	color: #f87171;
	margin-bottom: 0.35rem;
}

.profile-api-rest-card__err-txt {
	margin: 0;
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--text);
	white-space: pre-wrap;
	word-break: break-word;
	background: rgba(248, 113, 113, 0.08);
	padding: 0.5rem 0.65rem;
	border-radius: 0.5rem;
	border: 1px solid rgba(248, 113, 113, 0.22);
}

.profile-api-rest-empty {
	margin-top: 0.5rem;
}

@media (max-width: 1024px) {
	.profile-api-rest-filters-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.profile-api-rest-card__details {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.profile-api-rest-filters-grid {
		grid-template-columns: 1fr;
	}

	.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-endpoint-dd,
	.profile-api-rest-page .profile-api-rest-filters-grid .api-rest-endpoint-dd,
	.profile-api-rest-page .profile-api-rest-filters-grid .profile-api-rest-select-wrap {
		width: 100%;
		max-width: 100%;
		flex: 1 1 100%;
	}

	.profile-api-rest-page .profile-api-rest-filters-grid .api-rest-endpoint-dd__trigger {
		width: 100% !important;
		max-width: 100%;
	}

	.profile-api-rest-page .profile-api-rest-section--filters {
		padding: 1.25rem 1.25rem 1rem;
	}

	.profile-api-rest-page .profile-api-rest-section--history {
		padding: 1rem 1.25rem 1.25rem;
	}

	.profile-api-rest-card__header {
		flex-direction: column;
		align-items: stretch;
	}

	.profile-api-rest-card__http {
		justify-content: flex-start;
	}

	.profile-api-rest-card__details {
		grid-template-columns: 1fr;
	}
}