*, *::before, *::after {
	box-sizing: border-box;
}

body.e33lj-body {
	margin: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 15px;
	color: #1a1a1a;
	background: #f4f4f4;
	line-height: 1.5;
}

.e33lj-wrap {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* Header */
.e33lj-header {
	background: #1a1a1a;
	color: #fff;
	padding: 0 24px;
}

.e33lj-header-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	gap: 16px;
	height: 60px;
}

.e33lj-logo {
	color: #c9a84c;
	text-decoration: none;
	font-weight: 700;
	font-size: 17px;
	white-space: nowrap;
}

.e33lj-header-title {
	flex: 1;
	color: #aaa;
	font-size: 13px;
	letter-spacing: .5px;
	text-transform: uppercase;
}

.e33lj-user-info {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	color: #ccc;
	white-space: nowrap;
}

.e33lj-logout {
	color: #c9a84c;
	text-decoration: none;
}

.e33lj-logout:hover {
	text-decoration: underline;
}

/* Main */
.e33lj-main {
	flex: 1;
	max-width: 1200px;
	margin: 0 auto;
	padding: 32px 24px;
	width: 100%;
}

/* Footer */
.e33lj-footer {
	background: #1a1a1a;
	color: #666;
	text-align: center;
	padding: 16px;
	font-size: 12px;
	margin-top: auto;
}

/* Login */
.e33lj-login-wrap {
	display: flex;
	justify-content: center;
	padding: 48px 16px;
}

.e33lj-login-box {
	background: #fff;
	border-radius: 8px;
	padding: 40px;
	width: 100%;
	max-width: 400px;
	box-shadow: 0 2px 12px rgba(0,0,0,.08);
}

.e33lj-login-box h2 {
	margin: 0 0 8px;
	font-size: 22px;
}

.e33lj-login-box p {
	color: #555;
	margin: 0 0 24px;
}

.e33lj-login-box .login-username,
.e33lj-login-box .login-password,
.e33lj-login-box .login-remember {
	margin-bottom: 16px;
}

.e33lj-login-box label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 4px;
}

.e33lj-login-box input[type="text"],
.e33lj-login-box input[type="password"] {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 14px;
}

.e33lj-login-box input[type="submit"],
.e33lj-login-box .button-primary {
	width: 100%;
	padding: 12px;
	background: #c9a84c;
	color: #fff;
	border: none;
	border-radius: 5px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

.e33lj-login-help {
	text-align: center;
	margin-top: 16px;
	font-size: 13px;
}

.e33lj-login-help a {
	color: #0073aa;
}

/* Restricted */
.e33lj-restricted {
	text-align: center;
	padding: 64px 16px;
}

.e33lj-restricted h2 {
	font-size: 24px;
	margin-bottom: 12px;
}

/* Layout */
.e33lj-layout {
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 24px;
	align-items: start;
}

@media (max-width: 768px) {
	.e33lj-layout {
		grid-template-columns: 1fr;
	}
}

/* Catalog */
.e33lj-catalog-greeting {
	margin-bottom: 20px;
	color: #555;
}

.e33lj-catalog-main h2 {
	font-size: 20px;
	margin: 0 0 16px;
}

/* Table */
.e33lj-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(0,0,0,.06);
	font-size: 14px;
}

.e33lj-table th {
	background: #f8f8f8;
	padding: 10px 14px;
	text-align: left;
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .4px;
	color: #555;
	border-bottom: 2px solid #eee;
}

.e33lj-table td {
	padding: 10px 14px;
	border-bottom: 1px solid #f0f0f0;
	vertical-align: middle;
}

.e33lj-table tbody tr:last-child td {
	border-bottom: none;
}

.e33lj-table tbody tr:hover {
	background: #fafafa;
}

.e33lj-cell-product {
	display: flex;
	align-items: center;
	gap: 10px;
}

.e33lj-cell-product img {
	border-radius: 4px;
	flex-shrink: 0;
	object-fit: cover;
}

.e33lj-cell-price {
	font-weight: 600;
	color: #1a1a1a;
	white-space: nowrap;
}

.e33lj-cell-subtotal {
	font-weight: 600;
	color: #0073aa;
	white-space: nowrap;
}

.e33lj-qty {
	width: 72px;
	padding: 6px 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
	text-align: center;
}

.e33lj-qty:focus {
	outline: none;
	border-color: #0073aa;
	box-shadow: 0 0 0 2px rgba(0,115,170,.15);
}

/* Sidebar cards */
.e33lj-sidebar {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.e33lj-summary-card,
.e33lj-freight-card,
.e33lj-actions-card {
	background: #fff;
	border-radius: 6px;
	padding: 20px;
	box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

.e33lj-summary-card h3,
.e33lj-freight-card h3 {
	margin: 0 0 16px;
	font-size: 15px;
	font-weight: 700;
}

.e33lj-summary-row {
	display: flex;
	justify-content: space-between;
	font-size: 13px;
	padding: 4px 0;
	color: #444;
}

.e33lj-grand-row {
	border-top: 2px solid #eee;
	margin-top: 8px;
	padding-top: 10px;
	font-size: 16px;
}

/* Freight options */
.e33lj-freight-option {
	display: block;
	padding: 10px 12px;
	margin-bottom: 8px;
	border: 1px solid #ddd;
	border-radius: 5px;
	cursor: pointer;
	font-size: 13px;
	transition: border-color .15s;
}

.e33lj-freight-option:hover {
	border-color: #0073aa;
}

.e33lj-freight-option input[type="radio"] {
	margin-right: 8px;
}

.e33lj-freight-option input[type="radio"]:checked + span {
	font-weight: 600;
}

/* Buttons */
.e33lj-btn {
	display: block;
	width: 100%;
	padding: 12px 16px;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	border: 2px solid transparent;
	transition: background .15s, color .15s;
	margin-bottom: 8px;
}

.e33lj-btn:last-child {
	margin-bottom: 0;
}

.e33lj-btn-primary {
	background: #c9a84c;
	color: #fff;
	border-color: #c9a84c;
}

.e33lj-btn-primary:hover:not(:disabled) {
	background: #b8962e;
	border-color: #b8962e;
}

.e33lj-btn-primary:disabled {
	background: #ddd;
	border-color: #ddd;
	color: #999;
	cursor: not-allowed;
}

.e33lj-btn-secondary {
	background: #0073aa;
	color: #fff;
	border-color: #0073aa;
}

.e33lj-btn-secondary:hover:not(:disabled) {
	background: #005d8c;
}

.e33lj-btn-secondary:disabled {
	opacity: .6;
	cursor: not-allowed;
}

.e33lj-btn-outline {
	background: transparent;
	color: #0073aa;
	border-color: #0073aa;
}

.e33lj-btn-outline:hover:not(:disabled) {
	background: #f0f8ff;
}

.e33lj-btn-outline:disabled {
	color: #aaa;
	border-color: #ccc;
	cursor: not-allowed;
}

.e33lj-btn-small {
	display: inline-block;
	width: auto;
	padding: 6px 12px;
	font-size: 12px;
}

/* Feedback */
.e33lj-warning {
	color: #856404;
	background: #fff3cd;
	border: 1px solid #ffd56e;
	border-radius: 4px;
	padding: 8px 12px;
	font-size: 13px;
	margin: 8px 0 0;
}

.e33lj-error {
	color: #842029;
	background: #f8d7da;
	border: 1px solid #f5c2c7;
	border-radius: 4px;
	padding: 8px 12px;
	font-size: 13px;
	margin: 8px 0 0;
}

.e33lj-success {
	background: #d1e7dd;
	border: 1px solid #a3cfbb;
	border-radius: 6px;
	padding: 16px;
	color: #0a3622;
	font-size: 14px;
}

/* My orders */
.e33lj-my-orders {
	margin-top: 48px;
}

.e33lj-my-orders h2 {
	font-size: 20px;
	margin-bottom: 16px;
}

.e33lj-empty {
	color: #777;
}

.e33lj-orders-table {
	font-size: 13px;
}

.e33lj-status {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 3px;
	font-size: 11px;
	font-weight: 600;
	background: #eee;
	color: #555;
}

.e33lj-status-processing {
	background: #d1e7dd;
	color: #0a3622;
}

.e33lj-status-completed {
	background: #cfe2ff;
	color: #084298;
}

.e33lj-status-pending {
	background: #fff3cd;
	color: #664d03;
}

.e33lj-status-on-hold {
	background: #e2d9f3;
	color: #432874;
}

.e33lj-label-muted {
	color: #888;
	font-size: 12px;
}

/* ---------- Cadastro de lojista (aprovação) ---------- */
.e33lj-register-box { max-width: 640px; }
.e33lj-register-form h3 {
	font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase;
	color: #933C1F; margin: 22px 0 10px; padding-bottom: 8px;
	border-bottom: 1px dashed #F0E2C8;
}
.e33lj-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.e33lj-form-grid label { display: block; font-size: 12px; font-weight: 700; color: #933C1F; }
.e33lj-form-grid input {
	width: 100%; margin-top: 4px;
	background: #fff; border: 1px solid #F0E2C8; border-radius: 8px;
	padding: 11px 12px; font-size: 15px; color: #412100; font-family: inherit;
}
.e33lj-form-grid input:focus { outline: none; border-color: #FFB600; box-shadow: 0 0 0 3px rgba(255,182,0,0.18); }
.e33lj-col-full { grid-column: 1 / -1; }
.e33lj-register-form .e33lj-btn-block { width: 100%; margin-top: 20px; }
.e33lj-btn-block { display: block; width: 100%; text-align: center; }
.e33lj-error {
	background: #FDF0EE; border-left: 3px solid #C0392B; color: #C0392B;
	border-radius: 6px; padding: 10px 14px; font-size: 14px;
}
.e33lj-register-cta { margin-top: 18px; padding-top: 16px; border-top: 1px dashed #F0E2C8; text-align: center; }
.e33lj-register-cta p { margin: 0 0 10px; color: #8a7a63; font-size: 14px; }
@media (max-width: 560px) {
	.e33lj-form-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   Identidade Engenho 33 — sobrepõe o visual base do portal
   (madeira, creme, marrons e âmbar — mesmo padrão do site)
   ============================================================ */
@font-face {
	font-family: 'Playfair Display';
	src: url('../../../../themes/engenho33/assets/fonts/playfair-var.woff2') format('woff2');
	font-weight: 400 900; font-display: swap;
}
@font-face {
	font-family: 'Raleway';
	src: url('../../../../themes/engenho33/assets/fonts/raleway-var.woff2') format('woff2');
	font-weight: 100 900; font-display: swap;
}

body.e33lj-body {
	background: #E9CA9F;
	font-family: 'Raleway', system-ui, sans-serif;
	color: #4a3a26;
}
body.e33lj-body::before {
	content: '';
	position: fixed; inset: 0; z-index: -1;
	background: url('../../../../uploads/2025/11/Slice-1_1x.webp') center / cover no-repeat;
}
.e33lj-header {
	background: rgba(255, 251, 242, 0.94) !important;
	border-bottom: 1px solid rgba(147, 60, 31, 0.22);
	box-shadow: 0 2px 14px rgba(65, 33, 0, 0.08);
	backdrop-filter: blur(12px);
}
.e33lj-logo img { display: block; width: 120px; height: auto; }
.e33lj-header-title {
	color: #933C1F !important;
	font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; font-size: 12px;
}
.e33lj-user-info span { color: #412100 !important; font-weight: 600; }
.e33lj-logout { color: #933C1F !important; text-decoration: underline; text-underline-offset: 3px; }

h1, h2, h3, .e33lj-login-box h2, .e33lj-register-box h2 {
	font-family: 'Playfair Display', Georgia, serif;
	color: #412100;
}
a { color: #933C1F; }

.e33lj-login-box, .e33lj-register-box, .e33lj-restricted,
.e33lj-catalog-main, .e33lj-sidebar, .e33lj-my-orders,
.e33lj-freight-card, .e33lj-actions-card {
	background: #FFFBF2 !important;
	border: 1px solid #F0E2C8 !important;
	border-radius: 14px !important;
	box-shadow: 0 6px 18px rgba(65, 33, 0, 0.12) !important;
}
.e33lj-main input, .e33lj-main select {
	background: #fff; border: 1px solid #F0E2C8; border-radius: 10px;
	color: #412100; font-family: inherit;
}
.e33lj-main input:focus, .e33lj-main select:focus {
	outline: none; border-color: #FFB600; box-shadow: 0 0 0 3px rgba(255, 182, 0, 0.18);
}
.e33lj-btn, .e33lj-btn-primary, button.e33lj-btn, #e33lj_login_submit {
	background: linear-gradient(135deg, #FFB600, #FFDB83) !important;
	color: #412100 !important;
	border: 0 !important;
	border-radius: 999px !important;
	font-weight: 800 !important;
	letter-spacing: 0.06em; text-transform: uppercase; font-size: 13px;
	box-shadow: 0 6px 16px rgba(255, 182, 0, 0.35);
	transition: transform 0.15s, box-shadow 0.2s;
	cursor: pointer;
}
.e33lj-btn:hover, #e33lj_login_submit:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(255, 182, 0, 0.45); }
.e33lj-btn-outline {
	background: transparent !important;
	color: #933C1F !important;
	border: 1px solid #933C1F !important;
	box-shadow: none;
}
.e33lj-btn-outline:hover { background: #933C1F !important; color: #fff !important; }
.e33lj-btn-secondary { background: #FBF6EE !important; color: #412100 !important; border: 1px solid #F0E2C8 !important; box-shadow: none; }

.e33lj-orders-table th, table th {
	background: #FBF6EE; color: #933C1F;
	text-transform: uppercase; letter-spacing: 0.08em; font-size: 12px;
}
.e33lj-orders-table td, table td { border-color: #F0E2C8; }
.e33lj-grand-row { color: #62220D; }
.e33lj-status { background: #FFF3D6; color: #93690a; border-radius: 999px; padding: 3px 12px; font-weight: 700; font-size: 12px; }
.e33lj-footer { background: transparent !important; color: #7d6244 !important; border: 0 !important; }
.e33lj-footer p { color: #7d6244 !important; }
.e33lj-error { background: #FDF0EE; border-left: 3px solid #C0392B; color: #C0392B; }
.e33lj-register-form h3 { font-family: 'Raleway', sans-serif; color: #933C1F; }

/* Logo idêntico ao header do site (108px, margens 12/18) */
.e33lj-logo { display: inline-flex; margin: 12px 18px 12px 0; }
.e33lj-logo img { width: 108px !important; height: auto; }
.e33lj-header-inner { min-height: 74px; display: flex; align-items: center; gap: 26px; }
.e33lj-user-info { margin-left: auto; }
@media (max-width: 640px) {
	.e33lj-logo { margin: 10px 8px; }
	.e33lj-logo img { width: 92px !important; }
}

/* Respiro do título e do miolo da Grade de Reposição */
.e33lj-catalog-main { padding: 28px 30px !important; }
.e33lj-catalog-main h2, .e33lj-my-orders h2 {
	margin: 0 0 20px !important;
	padding-bottom: 14px;
	border-bottom: 1px dashed #F0E2C8;
	color: #62220D;
	font-size: 1.35rem;
}
.e33lj-my-orders { padding: 28px 30px !important; }
.e33lj-catalog-greeting { margin: 26px 0 18px !important; color: #503c22; }

/* Stepper de quantidade (+/-) */
.e33lj-stepper { display: inline-flex; align-items: stretch; }
.e33lj-stepper .e33lj-qty {
	width: 54px !important; text-align: center;
	border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important;
	-moz-appearance: textfield;
}
.e33lj-stepper .e33lj-qty::-webkit-outer-spin-button,
.e33lj-stepper .e33lj-qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.e33lj-step {
	width: 34px;
	background: #FBF6EE; color: #933C1F;
	border: 1px solid #F0E2C8;
	font-size: 16px; font-weight: 700; cursor: pointer;
	transition: background 0.15s;
}
.e33lj-step:hover { background: #FFF3D6; }
.e33lj-step:first-child { border-radius: 8px 0 0 8px; }
.e33lj-step:last-child { border-radius: 0 8px 8px 0; }
#e33lj-btn-card { margin-top: 8px; }
