/**
 * La Rose — Portal Mayorista: design tokens + base portal styles.
 *
 * Tokens borrowed from the brand's own palette already validated on
 * the B2C site (tone5.css: --c-rose #B8605B, --c-pearl #F7F5F3, etc.)
 * but re-declared here under a `--lr-*` namespace so this plugin stays
 * fully self-contained and desactivable without depending on
 * tone5-site being active (see ADR-001).
 */

:root {
	--lr-primary: #B8605B;
	--lr-primary-dark: #8C4640;
	--lr-secondary: #111111;
	--lr-accent: #D9A5A0;
	--lr-background: #FFFFFF;
	--lr-surface: #F7F5F3;
	--lr-text-primary: #111111;
	--lr-text-secondary: rgba(17, 17, 17, 0.62);
	--lr-border: rgba(17, 17, 17, 0.12);
	--lr-success: #2F6F4E;
	--lr-success-bg: #EAF4EE;
	--lr-warning: #9A6B10;
	--lr-warning-bg: #FBF2E0;
	--lr-danger: #A83B3B;
	--lr-danger-bg: #FBEAEA;

	--lr-radius-sm: 6px;
	--lr-radius-md: 10px;
	--lr-radius-lg: 16px;

	--lr-shadow-sm: 0 1px 2px rgba(17, 17, 17, 0.06);
	--lr-shadow-md: 0 4px 16px rgba(17, 17, 17, 0.08);

	--lr-space-xs: 4px;
	--lr-space-sm: 8px;
	--lr-space-md: 16px;
	--lr-space-lg: 24px;
	--lr-space-xl: 40px;

	--lr-font: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* -------------------------------------------------------------- */
/* Registration form                                               */
/* -------------------------------------------------------------- */

.lr-b2b-form-wrap {
	font-family: var(--lr-font);
	color: var(--lr-text-primary);
	max-width: 720px;
	margin: 0 auto;
}

.lr-b2b-alert {
	border-radius: var(--lr-radius-md);
	padding: var(--lr-space-md) var(--lr-space-lg);
	margin-bottom: var(--lr-space-lg);
}

.lr-b2b-alert--success {
	background: var(--lr-success-bg);
	color: var(--lr-success);
	border: 1px solid currentColor;
}

.lr-b2b-alert--error {
	background: var(--lr-danger-bg);
	color: var(--lr-danger);
	border: 1px solid currentColor;
}

.lr-b2b-alert--info {
	background: var(--lr-surface);
	color: var(--lr-text-primary);
	border: 1px solid var(--lr-border);
}

.lr-b2b-alert ul {
	margin: var(--lr-space-sm) 0 0;
	padding-left: 1.2em;
}

.lr-b2b-form__section {
	border: none;
	border-top: 1px solid var(--lr-border);
	padding: var(--lr-space-lg) 0;
	margin: 0;
}

.lr-b2b-form__section:first-of-type {
	border-top: none;
	padding-top: 0;
}

.lr-b2b-form__section-title {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--lr-primary);
	padding: 0 0 var(--lr-space-md);
}

.lr-b2b-field {
	display: flex;
	flex-direction: column;
	gap: var(--lr-space-xs);
	margin-bottom: var(--lr-space-md);
}

.lr-b2b-field label {
	font-size: 13px;
	font-weight: 600;
	color: var(--lr-text-secondary);
}

.lr-b2b-field input[type="text"],
.lr-b2b-field input[type="email"],
.lr-b2b-field input[type="tel"],
.lr-b2b-field input[type="url"],
.lr-b2b-field input[type="number"],
.lr-b2b-field input[type="password"],
.lr-b2b-field input[type="file"],
.lr-b2b-field select,
.lr-b2b-field textarea {
	font-family: inherit;
	font-size: 15px;
	padding: 10px 14px;
	border: 1px solid var(--lr-border);
	border-radius: var(--lr-radius-sm);
	background: var(--lr-background);
	color: var(--lr-text-primary);
	width: 100%;
	max-width: 100%;
}

.lr-b2b-field input[type="file"] {
	/* A native file input's intrinsic width follows its button + "no
	   file chosen" label text, which can exceed the container on
	   narrow viewports even with width:100% — padding shrinks it back
	   to fit, and overflow hides the browser's own label text runoff. */
	padding: 8px;
	overflow: hidden;
}

.lr-b2b-field input:focus,
.lr-b2b-field select:focus,
.lr-b2b-field textarea:focus {
	outline: 2px solid var(--lr-primary);
	outline-offset: 1px;
}

.lr-b2b-field--checkbox .lr-b2b-field__checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: var(--lr-space-sm);
	font-weight: 400;
	color: var(--lr-text-primary);
}

.lr-b2b-field__hint {
	font-size: 12px;
	color: var(--lr-text-secondary);
	margin: 0;
}

.lr-b2b-btn {
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	border: none;
	border-radius: var(--lr-radius-sm);
	padding: 14px 28px;
	cursor: pointer;
}

.lr-b2b-btn--primary {
	background: var(--lr-secondary);
	color: #fff;
}

.lr-b2b-btn--primary:hover {
	background: var(--lr-primary-dark);
}

.lr-b2b-btn:focus-visible {
	outline: 2px solid var(--lr-primary);
	outline-offset: 2px;
}

@media (max-width: 600px) {
	.lr-b2b-form-wrap {
		padding: 0 var(--lr-space-md);
	}
}

/* -------------------------------------------------------------- */
/* Page base (shell-start.php body)                                */
/* -------------------------------------------------------------- */

.lr-b2b-page {
	font-family: var(--lr-font);
	color: var(--lr-text-primary);
	background: var(--lr-background);
	margin: 0;
}

.lr-b2b-page * {
	box-sizing: border-box;
}

.lr-b2b-btn {
	display: inline-block;
	text-decoration: none;
	text-align: center;
}

.lr-b2b-btn--secondary {
	background: transparent;
	color: var(--lr-secondary);
	border: 1px solid var(--lr-border);
}

.lr-b2b-btn--secondary:hover {
	border-color: var(--lr-secondary);
}

.lr-b2b-btn--block {
	display: block;
	width: 100%;
}

/* -------------------------------------------------------------- */
/* Landing (public /mayoristas/)                                   */
/* -------------------------------------------------------------- */

.lr-b2b-landing__logo {
	display: block;
	width: 148px;
	height: auto;
	margin: 0 auto var(--lr-space-lg);
}

.lr-b2b-landing__hero {
	max-width: 640px;
	margin: 0 auto;
	padding: 56px var(--lr-space-md) 0;
	text-align: center;
}

.lr-b2b-landing__eyebrow {
	color: var(--lr-primary);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 12px;
	margin: 0 0 18px;
}

.lr-b2b-landing__title {
	font-size: 42px;
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -0.01em;
	max-width: 520px;
	margin: 0 auto var(--lr-space-md);
}

.lr-b2b-landing__body {
	color: var(--lr-text-secondary);
	font-size: 16px;
	line-height: 1.65;
	max-width: 440px;
	margin: 0 auto var(--lr-space-lg);
}

.lr-b2b-landing__ctas {
	display: flex;
	gap: var(--lr-space-sm);
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 88px;
}

.lr-b2b-landing__benefits {
	list-style: none;
	margin: 0 auto;
	padding: var(--lr-space-xl) var(--lr-space-md) 96px;
	max-width: 960px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: var(--lr-space-lg);
	border-top: 1px solid var(--lr-border);
}

.lr-b2b-landing__benefits li {
	display: flex;
	flex-direction: column;
	gap: var(--lr-space-xs);
}

.lr-b2b-landing__benefit-mark {
	width: 24px;
	height: 2px;
	background: var(--lr-primary);
	margin-bottom: var(--lr-space-xs);
}

.lr-b2b-landing__benefits strong {
	color: var(--lr-primary-dark);
	font-size: 15px;
}

.lr-b2b-landing__benefits span {
	color: var(--lr-text-secondary);
	font-size: 13.5px;
	line-height: 1.55;
}

/* -------------------------------------------------------------- */
/* Auth (login / registro)                                         */
/* -------------------------------------------------------------- */

.lr-b2b-auth {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--lr-surface);
	padding: var(--lr-space-md);
}

.lr-b2b-auth__card {
	background: var(--lr-background);
	border-radius: var(--lr-radius-lg);
	box-shadow: var(--lr-shadow-md);
	padding: var(--lr-space-xl) var(--lr-space-lg);
	max-width: 400px;
	width: 100%;
}

.lr-b2b-auth__logo {
	margin: 0 auto var(--lr-space-lg);
}

.lr-b2b-auth__title {
	font-size: 22px;
	text-align: center;
	margin: 0 0 var(--lr-space-sm);
}

.lr-b2b-auth__subtitle {
	text-align: center;
	color: var(--lr-text-secondary);
	font-size: 14px;
	margin: 0 0 var(--lr-space-lg);
}

.lr-b2b-auth__remember {
	display: flex;
	align-items: center;
	gap: var(--lr-space-xs);
	font-size: 13px;
	color: var(--lr-text-secondary);
	margin: 0 0 var(--lr-space-md);
}

.lr-b2b-auth__link {
	text-align: center;
	font-size: 13px;
	margin: var(--lr-space-md) 0 0;
}

.lr-b2b-auth__footer {
	text-align: center;
	font-size: 13px;
	color: var(--lr-text-secondary);
	margin-top: var(--lr-space-lg);
	padding-top: var(--lr-space-lg);
	border-top: 1px solid var(--lr-border);
}

.lr-b2b-registro {
	max-width: 720px;
	margin: 0 auto;
	padding: var(--lr-space-xl) var(--lr-space-md);
}

.lr-b2b-registro__header {
	text-align: center;
	margin-bottom: var(--lr-space-lg);
}

/* -------------------------------------------------------------- */
/* Dashboard shell (private /mayoristas/*)                         */
/* -------------------------------------------------------------- */

.lr-b2b-dash {
	display: flex;
	min-height: 100vh;
	background: var(--lr-surface);
}

.lr-b2b-dash__burger {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	padding: var(--lr-space-sm);
}

.lr-b2b-dash__burger span {
	display: block;
	width: 22px;
	height: 2px;
	background: var(--lr-text-primary);
	margin: 4px 0;
}

.lr-b2b-dash__nav {
	width: 240px;
	flex-shrink: 0;
	background: var(--lr-background);
	border-right: 1px solid var(--lr-border);
	display: flex;
	flex-direction: column;
	padding: var(--lr-space-lg) var(--lr-space-md);
}

.lr-b2b-dash__nav-logo {
	display: block;
	width: 140px;
	height: auto;
	margin-bottom: var(--lr-space-lg);
}

.lr-b2b-dash__nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
	flex: 1;
}

.lr-b2b-dash__nav-list li {
	margin-bottom: var(--lr-space-xs);
}

.lr-b2b-dash__nav-list a {
	display: block;
	padding: 10px var(--lr-space-sm);
	border-radius: var(--lr-radius-sm);
	color: var(--lr-text-primary);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
}

.lr-b2b-dash__nav-list a:hover {
	background: var(--lr-surface);
}

.lr-b2b-dash__nav-list a.is-active {
	background: var(--lr-primary);
	color: #fff;
}

.lr-b2b-dash__nav-disabled {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--lr-space-sm);
	padding: 10px var(--lr-space-sm);
	font-size: 14px;
	font-weight: 600;
	color: var(--lr-text-secondary);
	opacity: 0.55;
	cursor: default;
}

.lr-b2b-dash__nav-disabled em {
	font-style: normal;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: var(--lr-surface);
	border-radius: var(--lr-radius-sm);
	padding: 2px 6px;
	white-space: nowrap;
}

.lr-b2b-dash__nav-footer {
	border-top: 1px solid var(--lr-border);
	padding-top: var(--lr-space-md);
	display: flex;
	flex-direction: column;
	gap: var(--lr-space-sm);
}

.lr-b2b-dash__nav-footer a {
	font-size: 13px;
	color: var(--lr-text-secondary);
	text-decoration: none;
}

.lr-b2b-dash__nav-logout {
	background: none;
	border: none;
	padding: 0;
	font-family: inherit;
	font-size: 13px;
	color: var(--lr-danger);
	cursor: pointer;
	text-align: left;
}

.lr-b2b-dash__main {
	flex: 1;
	padding: var(--lr-space-xl) var(--lr-space-lg);
	max-width: 960px;
}

.lr-b2b-dash__header h1 {
	font-size: 26px;
	margin: 0 0 4px;
}

.lr-b2b-dash__company {
	color: var(--lr-text-secondary);
	margin: 0 0 var(--lr-space-xs, 4px);
}

.lr-b2b-dash__role-badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--lr-primary-dark);
	background: var(--lr-accent);
	border-radius: 999px;
	padding: 4px 12px;
	margin-bottom: var(--lr-space-lg);
}

.lr-b2b-dash__cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: var(--lr-space-md);
	margin-bottom: var(--lr-space-lg);
}

.lr-b2b-card {
	background: var(--lr-background);
	border-radius: var(--lr-radius-md);
	box-shadow: var(--lr-shadow-sm);
	padding: var(--lr-space-md);
	display: flex;
	flex-direction: column;
	gap: var(--lr-space-xs);
}

.lr-b2b-card__label {
	font-size: 12px;
	color: var(--lr-text-secondary);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.lr-b2b-card__value {
	font-size: 22px;
	font-weight: 700;
}

.lr-b2b-dash__quick-actions {
	display: flex;
	gap: var(--lr-space-sm);
	flex-wrap: wrap;
	margin-bottom: var(--lr-space-xl);
}

.lr-b2b-dash__quick-actions .lr-b2b-dash__nav-disabled {
	background: var(--lr-background);
	border-radius: var(--lr-radius-md);
	box-shadow: var(--lr-shadow-sm);
	opacity: 1;
	color: var(--lr-text-primary);
}

.lr-b2b-dash__section {
	background: var(--lr-background);
	border-radius: var(--lr-radius-md);
	box-shadow: var(--lr-shadow-sm);
	padding: var(--lr-space-lg);
	margin-bottom: var(--lr-space-lg);
}

.lr-b2b-dash__section h2 {
	font-size: 15px;
	margin: 0 0 var(--lr-space-md);
}

.lr-b2b-dash__order-row {
	display: flex;
	gap: var(--lr-space-md);
	flex-wrap: wrap;
	font-size: 14px;
}

a.lr-b2b-dash__order-row {
	text-decoration: none;
	color: var(--lr-text-primary);
	padding: var(--lr-space-sm);
	margin: calc(var(--lr-space-sm) * -1);
	border-radius: var(--lr-radius-sm);
}

a.lr-b2b-dash__order-row:hover {
	background: var(--lr-surface);
}

.lr-b2b-dash__empty {
	text-align: center;
	color: var(--lr-text-secondary);
	padding: var(--lr-space-md) 0;
}

.lr-b2b-dash__empty p {
	margin: 0 0 var(--lr-space-md);
}

@media (max-width: 820px) {
	.lr-b2b-dash__burger {
		display: block;
		position: fixed;
		top: var(--lr-space-sm);
		left: var(--lr-space-sm);
		z-index: 20;
		background: var(--lr-background);
		border-radius: var(--lr-radius-sm);
		box-shadow: var(--lr-shadow-sm);
	}

	.lr-b2b-dash__nav {
		position: fixed;
		inset: 0 25% 0 0;
		z-index: 10;
		transform: translateX(-100%);
		transition: transform 0.2s ease;
		box-shadow: var(--lr-shadow-md);
	}

	.lr-b2b-dash__nav.is-open {
		transform: translateX(0);
	}

	.lr-b2b-dash__main {
		padding: var(--lr-space-xl) var(--lr-space-md) var(--lr-space-md);
		max-width: 100%;
	}
}

/* -------------------------------------------------------------- */
/* Mis pedidos (list + detail)                                     */
/* -------------------------------------------------------------- */

.lr-b2b-orders__list {
	display: flex;
	flex-direction: column;
	gap: var(--lr-space-xs);
}

.lr-b2b-orders__row {
	display: grid;
	grid-template-columns: 80px 1fr 1fr auto;
	gap: var(--lr-space-md);
	align-items: center;
	padding: var(--lr-space-sm) var(--lr-space-md);
	border-radius: var(--lr-radius-sm);
	text-decoration: none;
	color: var(--lr-text-primary);
	font-size: 14px;
}

.lr-b2b-orders__row:hover {
	background: var(--lr-surface);
}

/* Admin/manager rows (clientes.php list, pedidos.php) add an empresa
   column, and pedidos.php's row isn't a plain link (it embeds an
   approve-action <form>), so it's a div with the same look. */
.lr-b2b-orders__row--admin,
.lr-b2b-orders__row--clients {
	grid-template-columns: 1.4fr 70px 90px 110px 100px auto;
}

.lr-b2b-orders__row--clients {
	grid-template-columns: 1.4fr 1fr 1fr 1.4fr;
}

.lr-b2b-orders__row-company {
	font-weight: 700;
}

.lr-b2b-orders__row-actions {
	display: flex;
	gap: var(--lr-space-xs);
	justify-self: end;
}

.lr-b2b-qo__actions-row {
	display: flex;
	gap: var(--lr-space-sm);
	flex-wrap: wrap;
	margin-top: var(--lr-space-md);
}

.lr-b2b-btn--small {
	padding: 6px 14px;
	font-size: 13px;
}

.lr-b2b-orders__item-row {
	display: grid;
	grid-template-columns: 2fr 1fr auto;
	gap: var(--lr-space-md);
	padding: var(--lr-space-sm) 0;
	border-bottom: 1px solid var(--lr-border);
	font-size: 14px;
}

.lr-b2b-orders__total {
	text-align: right;
	margin: var(--lr-space-md) 0;
}

.lr-b2b-orders__totals-box {
	max-width: 320px;
	margin: var(--lr-space-md) 0 var(--lr-space-md) auto;
	padding: var(--lr-space-md);
	background: var(--lr-surface);
	border-radius: var(--lr-radius-sm);
}

.lr-b2b-orders__totals-row {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	color: var(--lr-text-secondary);
	padding: 4px 0;
}

.lr-b2b-orders__totals-row--final {
	margin-top: var(--lr-space-xs);
	padding-top: var(--lr-space-sm);
	border-top: 1px solid var(--lr-border);
	font-size: 16px;
	font-weight: 700;
	color: var(--lr-text-primary);
}

.lr-b2b-orders__totals-note {
	margin: var(--lr-space-xs) 0 0;
	font-size: 11px;
	font-style: italic;
	color: var(--lr-text-secondary);
}

.lr-b2b-orders__notes {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--lr-space-sm);
}

.lr-b2b-orders__notes li {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 14px;
	padding-bottom: var(--lr-space-sm);
	border-bottom: 1px solid var(--lr-border);
}

.lr-b2b-orders__note-date {
	font-size: 12px;
	color: var(--lr-text-secondary);
}

.lr-b2b-orders__price-changed {
	font-size: 11px;
	color: var(--lr-warning);
	font-weight: 700;
}

.lr-b2b-pagination {
	display: flex;
	gap: var(--lr-space-xs);
	margin-top: var(--lr-space-md);
}

.lr-b2b-pagination a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: var(--lr-radius-sm);
	text-decoration: none;
	color: var(--lr-text-primary);
	font-size: 13px;
	border: 1px solid var(--lr-border);
}

.lr-b2b-pagination a.is-active {
	background: var(--lr-primary);
	border-color: var(--lr-primary);
	color: #fff;
}

@media (max-width: 600px) {
	.lr-b2b-orders__row {
		grid-template-columns: 1fr 1fr;
		row-gap: 4px;
	}
}