/**
 * Split Woo Max — Estilos do painel de vendedor (frontend, Dark SaaS)
 */

/* ==========================================================================
   Nota sobre conflito de CSS do SDK do Mercado Pago: o sdk.mercadopago.com/js/v2
   pode injetar CSS global na página. A tentativa anterior de "resetar" a
   largura dos campos de billing/shipping do checkout causou um problema pior
   (campos ficando estreitos, presos a um container de largura reduzida),
   porque o reset de largura conflitou com a estrutura de colunas do tema.
   Removido — abordagem atual não força width/display em nada do WooCommerce,
   apenas isola estritamente o container do Payment Brick.
   ========================================================================== */

.smax-panel {
	--smax-bg: #0b0f19;
	--smax-surface: #131a2b;
	--smax-surface-alt: #1a2338;
	--smax-border: #232b3d;
	--smax-text: #e5e7eb;
	--smax-text-muted: #9ca3af;
	--smax-accent: #6366f1;
	--smax-accent-hover: #4f46e5;
	--smax-success: #22c55e;
	--smax-warning: #f59e0b;
	--smax-danger: #ef4444;

	font-family: 'Inter', sans-serif;
	background: var(--smax-bg);
	color: var(--smax-text);
	border: 1px solid var(--smax-border);
	border-radius: 16px;
	padding: 28px;
	max-width: 900px;
	margin: 0 auto;
}

.smax-panel-locked {
	text-align: center;
	padding: 40px;
}

.smax-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 20px;
}

.smax-panel-header h2 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	margin: 0;
	color: #f9fafb;
}

.smax-panel-badge {
	padding: 5px 14px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.smax-panel-badge-connected,
.smax-panel-badge-approved {
	background: rgba(34, 197, 94, 0.15);
	color: var(--smax-success);
}

.smax-panel-badge-pending {
	background: rgba(245, 158, 11, 0.15);
	color: var(--smax-warning);
}

.smax-panel-badge-expired,
.smax-panel-badge-revoked,
.smax-panel-badge-rejected {
	background: rgba(239, 68, 68, 0.15);
	color: var(--smax-danger);
}

.smax-panel-badge-refunded {
	background: rgba(56, 189, 248, 0.15);
	color: #38bdf8;
}

.smax-panel-alert {
	background: rgba(245, 158, 11, 0.1);
	border: 1px solid rgba(245, 158, 11, 0.35);
	color: var(--smax-warning);
	padding: 12px 16px;
	border-radius: 10px;
	font-size: 13px;
	margin-bottom: 16px;
}

.smax-panel-alert-danger {
	background: rgba(239, 68, 68, 0.1);
	border-color: rgba(239, 68, 68, 0.35);
	color: var(--smax-danger);
}

.smax-panel-connect {
	background: var(--smax-surface);
	border: 1px solid var(--smax-border);
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 20px;
}

.smax-btn {
	display: inline-block;
	padding: 10px 20px;
	border-radius: 8px;
	font-weight: 600;
	font-size: 14px;
	border: none;
	cursor: pointer;
	text-decoration: none;
}

.smax-btn-primary {
	background: var(--smax-accent);
	color: #fff;
}

.smax-btn-primary:hover {
	background: var(--smax-accent-hover);
	color: #fff;
}

.smax-btn-secondary {
	background: var(--smax-surface-alt);
	color: var(--smax-text);
	border: 1px solid var(--smax-border);
}

.smax-btn-sm {
	padding: 6px 12px;
	font-size: 12px;
}

.smax-panel-summary {
	display: flex;
	gap: 16px;
	margin-bottom: 24px;
}

.smax-summary-card {
	background: var(--smax-surface);
	border: 1px solid var(--smax-border);
	border-radius: 12px;
	padding: 18px 24px;
	flex: 1;
}

.smax-summary-label {
	display: block;
	font-size: 12px;
	color: var(--smax-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin-bottom: 6px;
}

.smax-summary-value {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 26px;
	font-weight: 700;
	color: #f9fafb;
}

.smax-panel-history h3 {
	font-family: 'Space Grotesk', sans-serif;
	color: #f9fafb;
	font-size: 16px;
}

.smax-history-filters {
	display: flex;
	gap: 8px;
	margin-bottom: 16px;
	flex-wrap: wrap;
}

.smax-history-filters input[type="date"] {
	background: var(--smax-surface);
	border: 1px solid var(--smax-border);
	color: var(--smax-text);
	border-radius: 8px;
	padding: 8px 10px;
	font-size: 13px;
}

.smax-panel-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.smax-panel-table thead th {
	text-align: left;
	color: var(--smax-text-muted);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 10px 8px;
	border-bottom: 1px solid var(--smax-border);
}

.smax-panel-table tbody td {
	padding: 12px 8px;
	border-bottom: 1px solid var(--smax-border);
}

.smax-panel-footnote {
	margin-top: 20px;
	font-size: 12px;
	color: var(--smax-text-muted);
	font-style: italic;
}

.smax-muted {
	color: var(--smax-text-muted);
	font-size: 13px;
}

/* Payment Brick container no checkout — isolado do restante do formulário de
   checkout para não herdar nem vazar estilos de flex/grid do tema, o que pode
   comprimir os campos do Brick ou os campos vizinhos do checkout. */
#smax-payment-brick-container {
	margin-top: 16px;
	width: 100%;
	min-width: 280px;
	max-width: 100%;
	display: block;
}

#smax-payment-brick-container * {
	box-sizing: border-box;
}

#smax-cart-total,
#smax-payer-email {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}

.smax-checkout-status {
	font-size: 13px;
	margin-top: 10px;
	padding: 10px 14px;
	border-radius: 8px;
}

.smax-checkout-status.smax-status-processing {
	background: rgba(99, 102, 241, 0.1);
	color: #6366f1;
}

.smax-checkout-status.smax-status-error {
	background: rgba(239, 68, 68, 0.1);
	color: #ef4444;
}