/* ============================================================
   FoodRabbit Driver Portal Stylesheet
   Uses CSS custom properties from the theme's :root.
   ============================================================ */

/* ---- Reset / Base ----------------------------------------- */
.fr-driver-page {
	min-height: 100vh;
	background: var(--color-bg, #FFF8EE);
	font-family: var(--font-body, 'Open Sans', sans-serif);
	color: var(--color-text, #1F2937);
}

/* ---- Auth pages (login / register) ----------------------- */
.fr-driver-auth-wrap {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: var(--space-8, 32px) var(--container-pad-mobile, 16px);
}

.fr-driver-auth-wrap--wide .fr-driver-auth-card {
	max-width: 640px;
}

.fr-driver-auth-card {
	width: 100%;
	max-width: 440px;
	background: var(--color-white, #fff);
	border-radius: var(--radius-lg, 12px);
	box-shadow: var(--shadow-card, 0 2px 8px rgba(0,0,0,0.08));
	padding: var(--space-8, 32px);
}

.fr-driver-auth-logo {
	display: block;
	margin: 0 auto var(--space-6, 24px);
	text-align: center;
	text-decoration: none;
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 700;
	font-size: 1.5rem;
	color: var(--color-primary, #0F766E);
}

.fr-driver-auth-title {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-h3, 28px);
	font-weight: 700;
	color: var(--color-text, #1F2937);
	text-align: center;
	margin: 0 0 var(--space-2, 8px);
}

.fr-driver-auth-subtitle {
	text-align: center;
	color: var(--color-muted, #9CA3AF);
	margin: 0 0 var(--space-6, 24px);
	font-size: var(--font-size-sm, 14px);
}

.fr-driver-auth-footer {
	text-align: center;
	font-size: var(--font-size-sm, 14px);
	color: var(--color-muted, #9CA3AF);
	margin-top: var(--space-6, 24px);
}

.fr-driver-auth-footer a {
	color: var(--color-primary, #0F766E);
	font-weight: 600;
}

.fr-driver-pending-actions {
	display: grid;
	gap: var(--space-3, 12px);
	margin-top: var(--space-6, 24px);
}

.fr-driver-readonly-value {
	margin: 0;
	padding: var(--space-3, 12px) var(--space-4, 16px);
	border: 1px solid var(--color-border, #D1D5DB);
	border-radius: var(--radius-md, 8px);
	background: var(--color-light-bg, #F3F4F6);
	font-weight: 600;
	color: var(--color-text, #1F2937);
}

.fr-driver-form-group__label {
	display: block;
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-sm, 14px);
	font-weight: 700;
	color: var(--color-text, #1F2937);
	margin-bottom: var(--space-2, 8px);
}

/* ---- Forms ----------------------------------------------- */
.fr-driver-auth-form,
.fr-driver-reg-form {
	display: flex;
	flex-direction: column;
	gap: var(--space-4, 16px);
}

.fr-driver-form-fieldset {
	border: 1px solid var(--color-border, #D1D5DB);
	border-radius: var(--radius-md, 8px);
	padding: var(--space-4, 16px);
	margin: 0;
}

.fr-driver-form-fieldset legend {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 600;
	padding: 0 var(--space-2, 8px);
	color: var(--color-primary, #0F766E);
}

.fr-driver-form-fieldset__note {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
	margin: var(--space-1, 4px) 0 var(--space-3, 12px);
}

.fr-driver-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-4, 16px);
}

.fr-driver-form-group {
	display: flex;
	flex-direction: column;
	gap: var(--space-1, 4px);
}

.fr-driver-form-group label {
	font-size: var(--font-size-sm, 14px);
	font-weight: 600;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.fr-driver-form-group__link {
	font-size: var(--font-size-xs, 12px);
	font-weight: 400;
	color: var(--color-primary, #0F766E);
}

.fr-driver-form-group input,
.fr-driver-form-group select,
.fr-driver-form-group textarea {
	padding: var(--space-3, 12px) var(--space-4, 16px);
	border: 1px solid var(--color-border, #D1D5DB);
	border-radius: var(--radius-md, 8px);
	font-family: var(--font-body, 'Open Sans', sans-serif);
	font-size: var(--font-size-base, 16px);
	background: var(--color-white, #fff);
	color: var(--color-text, #1F2937);
	transition: border-color 0.15s;
}

.fr-driver-form-group input[type="file"] {
	padding: var(--space-2, 8px);
	cursor: pointer;
}

.fr-driver-form-group input:focus,
.fr-driver-form-group select:focus {
	outline: none;
	border-color: var(--color-primary, #0F766E);
	box-shadow: 0 0 0 3px rgba(15,118,110,0.1);
}

.fr-driver-form-group__hint {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
}

/* ---- Buttons --------------------------------------------- */
.fr-driver-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2, 8px);
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 600;
	cursor: pointer;
	border: none;
	border-radius: var(--radius-md, 8px);
	transition: background-color 0.15s, opacity 0.15s;
	text-decoration: none;
	white-space: nowrap;
}

.fr-driver-btn--primary {
	background: var(--color-primary, #0F766E);
	color: var(--color-white, #fff);
	padding: var(--space-3, 12px) var(--space-6, 24px);
	font-size: var(--font-size-base, 16px);
}
.fr-driver-btn--primary:hover { background: var(--color-primary-dark, #0A5C56); }

.fr-driver-btn--outline {
	background: transparent;
	border: 2px solid var(--color-primary, #0F766E);
	color: var(--color-primary, #0F766E);
	padding: var(--space-2, 8px) var(--space-4, 16px);
	font-size: var(--font-size-sm, 14px);
}
.fr-driver-btn--outline:hover { background: var(--color-light-bg, #F3F4F6); }

.fr-driver-btn--ghost {
	background: transparent;
	border: 1px solid var(--color-border, #D1D5DB);
	color: var(--color-text, #1F2937);
	padding: var(--space-1, 4px) var(--space-3, 12px);
}
.fr-driver-btn--ghost:hover { background: var(--color-light-bg, #F3F4F6); }

.fr-driver-btn--sm  { padding: var(--space-2, 8px) var(--space-4, 16px); font-size: var(--font-size-sm, 14px); }
.fr-driver-btn--xs  { padding: var(--space-1, 4px) var(--space-2, 8px); font-size: var(--font-size-xs, 12px); }
.fr-driver-btn--lg  { padding: var(--space-4, 16px) var(--space-8, 32px); font-size: 1.0625rem; }
.fr-driver-btn--full { width: 100%; }
.fr-driver-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ---- Notices --------------------------------------------- */
.fr-driver-notice {
	padding: var(--space-3, 12px) var(--space-4, 16px);
	border-radius: var(--radius-md, 8px);
	font-size: var(--font-size-sm, 14px);
}
.fr-driver-notice--success { background: #D1FAE5; color: #065F46; }
.fr-driver-notice--error   { background: #FEE2E2; color: #991B1B; }
.fr-driver-notice--info    { background: #DBEAFE; color: #1E40AF; }
.fr-driver-notice ul { margin: var(--space-2, 8px) 0 0 var(--space-4, 16px); }

/* ---- Dashboard ------------------------------------------- */
.fr-driver-dash-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-4, 16px) var(--space-6, 24px);
	background: var(--color-primary, #0F766E);
	color: var(--color-white, #fff);
}

.fr-driver-dash-header__name {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 700;
	font-size: 1.125rem;
	display: block;
}

.fr-driver-dash-header__location {
	display: flex;
	align-items: center;
	gap: var(--space-1, 4px);
	font-size: var(--font-size-sm, 14px);
	opacity: 0.9;
}

/* Online/offline toggle */
.fr-driver-toggle-wrap {
	display: flex;
	align-items: center;
	gap: var(--space-3, 12px);
}

.fr-driver-toggle-label {
	font-size: var(--font-size-sm, 14px);
	font-weight: 600;
}

.fr-driver-toggle {
	width: 52px;
	height: 28px;
	border-radius: var(--radius-full, 9999px);
	background: rgba(255,255,255,0.3);
	border: none;
	cursor: pointer;
	position: relative;
	transition: background-color 0.2s;
	padding: 0;
}

.fr-driver-toggle--on {
	background: var(--color-accent, #F59E0B);
}

.fr-driver-toggle__thumb {
	display: block;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--color-white, #fff);
	position: absolute;
	top: 3px;
	left: 3px;
	transition: transform 0.2s;
	box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

.fr-driver-toggle--on .fr-driver-toggle__thumb {
	transform: translateX(24px);
}

/* ---- Earnings summary ------------------------------------ */
.fr-driver-earnings {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-3, 12px);
	padding: var(--space-4, 16px) var(--space-6, 24px);
	background: var(--color-white, #fff);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
}

.fr-driver-earnings__card {
	display: flex;
	flex-direction: column;
	gap: var(--space-1, 4px);
	align-items: center;
	text-align: center;
}

.fr-driver-earnings__label {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-earnings__value {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-primary, #0F766E);
}

/* ---- Order feed ------------------------------------------ */
.fr-driver-offline-notice {
	text-align: center;
	padding: var(--space-12, 48px) var(--space-6, 24px);
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-offline-notice svg {
	margin: 0 auto var(--space-4, 16px);
	display: block;
}

.fr-driver-feed {
	padding: var(--space-4, 16px) var(--space-6, 24px);
}

.fr-driver-feed__header {
	display: flex;
	align-items: center;
	gap: var(--space-2, 8px);
	margin-bottom: var(--space-4, 16px);
}

.fr-driver-feed__header h2 {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-h5, 18px);
	font-weight: 600;
	margin: 0;
}

.fr-driver-feed__live-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #22C55E;
	animation: fr-pulse 1.5s ease infinite;
}

@keyframes fr-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50%       { opacity: 0.5; transform: scale(0.75); }
}

.fr-driver-feed__empty {
	text-align: center;
	padding: var(--space-12, 48px) 0;
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-feed__empty svg { margin: 0 auto var(--space-3, 12px); display: block; }

/* ---- Order cards ----------------------------------------- */
.fr-driver-order-card {
	background: var(--color-white, #fff);
	border-radius: var(--radius-lg, 12px);
	box-shadow: var(--shadow-card, 0 2px 8px rgba(0,0,0,0.08));
	padding: var(--space-4, 16px);
	margin-bottom: var(--space-3, 12px);
}

.fr-driver-order-card__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--space-2, 8px);
}

.fr-driver-order-card__number {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 700;
	color: var(--color-primary, #0F766E);
}

.fr-driver-order-card__time {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-order-card__address {
	font-size: var(--font-size-sm, 14px);
	color: var(--color-muted, #9CA3AF);
	margin-bottom: var(--space-2, 8px);
}

.fr-driver-order-card__items {
	font-size: var(--font-size-sm, 14px);
	color: var(--color-text, #1F2937);
	margin-bottom: var(--space-3, 12px);
}

.fr-driver-order-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-2, 8px);
}

.fr-driver-order-card__actions {
	display: flex;
	align-items: center;
	gap: var(--space-2, 8px);
	flex-wrap: wrap;
}

.fr-driver-order-card__total {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 700;
	font-size: 1.0625rem;
}

.fr-driver-order-card--link {
	display: block;
	color: inherit;
	text-decoration: none !important;
	border: 1px solid var(--color-border, #D1D5DB);
	transition: border-color .15s;
}
.fr-driver-order-card--link:hover {
	border-color: var(--color-primary, #0F766E);
}
.fr-driver-order-card--delivered {
	opacity: .8;
}

/* ---- Order detail ---------------------------------------- */
.fr-driver-order-header {
	display: flex;
	align-items: center;
	gap: var(--space-3, 12px);
	padding: var(--space-4, 16px) var(--space-6, 24px);
	background: var(--color-white, #fff);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
	flex-wrap: wrap;
}

.fr-driver-order-header__back {
	display: flex;
	align-items: center;
	gap: var(--space-1, 4px);
	font-size: var(--font-size-sm, 14px);
	color: var(--color-primary, #0F766E);
	text-decoration: none;
	margin-right: auto;
}

.fr-driver-order-header__title {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-h5, 18px);
	font-weight: 700;
	margin: 0;
}

.fr-driver-status-badge {
	display: inline-flex;
	align-items: center;
	padding: var(--space-1, 4px) var(--space-3, 12px);
	border-radius: var(--radius-full, 9999px);
	font-size: var(--font-size-xs, 12px);
	font-weight: 600;
	background: var(--color-light-bg, #F3F4F6);
	color: var(--color-text, #1F2937);
}

.fr-driver-status-badge--fr-accepted   { background: #D1FAE5; color: #065F46; }
.fr-driver-status-badge--fr-picked-up  { background: #DBEAFE; color: #1E40AF; }
.fr-driver-status-badge--fr-on-the-way { background: #FEF3C7; color: #92400E; }
.fr-driver-status-badge--fr-delivered  { background: #D1FAE5; color: #065F46; }
.fr-driver-status-badge--payout-pending  { background: #FEF3C7; color: #92400E; }
.fr-driver-status-badge--payout-paid     { background: #D1FAE5; color: #065F46; }
.fr-driver-status-badge--payout-rejected { background: #FEE2E2; color: #991B1B; }

/* ---- Payout requests --------------------------------------- */
.fr-driver-payout {
	padding: var(--space-4, 16px) var(--space-6, 24px);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
}

.fr-driver-payout-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4, 16px);
	background: var(--color-light-bg, #F3F4F6);
	border-radius: var(--radius-lg, 12px);
	padding: var(--space-4, 16px);
}

.fr-driver-payout-card__balance {
	display: flex;
	flex-direction: column;
	gap: var(--space-1, 4px);
}

.fr-driver-payout-card__label {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-payout-card__value {
	font-family: var(--font-display);
	font-size: var(--font-size-h4, 22px);
	font-weight: 800;
}

.fr-driver-payout-history {
	list-style: none;
	margin: var(--space-4, 16px) 0 0;
	padding: 0;
	display: grid;
	gap: var(--space-2, 8px);
}

.fr-driver-payout-history__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-3, 12px);
	font-size: var(--font-size-sm, 14px);
	padding: var(--space-2, 8px) 0;
	border-bottom: 1px solid var(--color-border, #D1D5DB);
}

@media (max-width: 480px) {
	.fr-driver-payout-card { flex-direction: column; align-items: flex-start; }
	.fr-driver-payout-card #fr-request-payout-btn { width: 100%; }
}

.fr-driver-order-section {
	padding: var(--space-4, 16px) var(--space-6, 24px);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
}

.fr-driver-order-section h2 {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-h5, 18px);
	font-weight: 600;
	margin: 0 0 var(--space-3, 12px);
}

.fr-driver-section-hint {
	margin: 0 0 var(--space-3, 12px);
	font-size: var(--font-size-sm, 14px);
	color: var(--color-primary, #0F766E);
	line-height: 1.5;
}

.fr-driver-section-hint--muted {
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-detail-card {
	background: var(--color-light-bg, #F3F4F6);
	border-radius: var(--radius-md, 8px);
	padding: var(--space-4, 16px);
}

.fr-driver-detail-card p { margin: 0 0 var(--space-2, 8px); }
.fr-driver-detail-card p:last-child { margin-bottom: 0; }

.fr-driver-item-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-3, 12px);
}

.fr-driver-item {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-2, 8px);
	font-size: var(--font-size-sm, 14px);
}

.fr-driver-item--subbed .fr-driver-item__name {
	text-decoration: line-through;
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-item__qty   { color: var(--color-muted, #9CA3AF); min-width: 28px; }
.fr-driver-item__name  { flex: 1; }
.fr-driver-item__price { font-weight: 600; }

.fr-driver-item__sub-flag {
	display: inline-flex;
	align-items: center;
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .03em;
	padding: 2px 7px;
	border-radius: 999px;
	margin-left: 6px;
	vertical-align: middle;
}
.fr-driver-item__sub-flag--ok {
	background: #dcf5e3;
	color: #15803d;
}
.fr-driver-item__sub-flag--no {
	background: #fbe1e1;
	color: #b91c1c;
}

.fr-driver-item-total {
	border-top: 1px solid var(--color-border, #D1D5DB);
	margin-top: var(--space-3, 12px);
	padding-top: var(--space-3, 12px);
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.0625rem;
}

.fr-driver-link { color: var(--color-primary, #0F766E); }

.fr-driver-order-action {
	padding: var(--space-6, 24px);
}

.fr-driver-order-action--delivered {
	text-align: center;
	color: var(--color-muted, #9CA3AF);
}

.fr-driver-order-action--delivered svg {
	display: block;
	margin: 0 auto var(--space-3, 12px);
	stroke: #22C55E;
}

/* ---- Substitute modal ------------------------------------ */
.fr-driver-modal {
	border: none;
	border-radius: var(--radius-lg, 12px);
	box-shadow: var(--shadow-modal, 0 8px 32px rgba(0,0,0,0.16));
	padding: 0;
	max-width: 480px;
	width: calc(100% - var(--space-8, 32px));
	max-height: 80vh;
	overflow: hidden;
}

.fr-driver-modal::backdrop {
	background: rgba(0,0,0,0.5);
}

.fr-driver-modal__inner {
	padding: var(--space-6, 24px);
	display: flex;
	flex-direction: column;
	gap: var(--space-4, 16px);
	max-height: 80vh;
	overflow-y: auto;
}

.fr-driver-modal__close {
	align-self: flex-end;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--color-muted, #9CA3AF);
	padding: 0;
}

.fr-driver-modal__subtitle {
	font-size: var(--font-size-sm, 14px);
	color: var(--color-muted, #9CA3AF);
	margin: 0;
}

.fr-driver-modal__search input {
	width: 100%;
	padding: var(--space-3, 12px) var(--space-4, 16px);
	border: 1px solid var(--color-border, #D1D5DB);
	border-radius: var(--radius-md, 8px);
	font-family: var(--font-body, 'Open Sans', sans-serif);
	font-size: var(--font-size-base, 16px);
	box-sizing: border-box;
}

.fr-driver-sub-results {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 240px;
	overflow-y: auto;
	border: 1px solid var(--color-border, #D1D5DB);
	border-radius: var(--radius-md, 8px);
}

.fr-driver-sub-results__empty,
.fr-driver-sub-results li {
	padding: var(--space-3, 12px) var(--space-4, 16px);
	font-size: var(--font-size-sm, 14px);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.fr-driver-sub-results li:last-child { border-bottom: none; }
.fr-driver-sub-results li:hover { background: var(--color-light-bg, #F3F4F6); }
.fr-driver-sub-results li.is-selected { background: #D1FAE5; }
.fr-driver-sub-results__empty { color: var(--color-muted, #9CA3AF); cursor: default; }

.fr-driver-sub-selected {
	padding: var(--space-3, 12px);
	background: #D1FAE5;
	border-radius: var(--radius-md, 8px);
}

.fr-driver-sub-selected__name {
	font-weight: 600;
	color: #065F46;
	margin: 0 0 var(--space-3, 12px);
	font-size: var(--font-size-sm, 14px);
}

/* ---- Responsive ------------------------------------------ */
@media (max-width: 768px) {
	.fr-driver-form-row { grid-template-columns: 1fr; }
	.fr-driver-earnings { grid-template-columns: 1fr; }
	.fr-driver-auth-card { padding: var(--space-6, 24px) var(--space-4, 16px); }
	.fr-driver-dash-header { padding: var(--space-3, 12px) var(--space-4, 16px); }
	.fr-driver-feed { padding: var(--space-4, 16px); }
	.fr-driver-order-section { padding: var(--space-4, 16px); }
	.fr-driver-order-action { padding: var(--space-4, 16px); }
}

/* FoodRabbit driver form polish */
.fr-driver-auth-card, .fr-driver-card { border: 1px solid var(--color-border); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.fr-driver-form { gap: var(--space-5, var(--space-4)); }
.fr-driver-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.fr-driver-form input[type="file"] { padding: var(--space-3); min-height: auto; background: var(--color-light-bg); }
.fr-driver-form fieldset { border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-5, var(--space-4)); margin: 0; background: var(--color-white); }
.fr-driver-form legend { font-family: var(--font-display); font-weight: 800; padding: 0 var(--space-2); }
@media (max-width: 720px) { .fr-driver-form-row { grid-template-columns: 1fr; } }

/* Driver auth page correction */
.fr-driver-page--login,
.fr-driver-page--register {
	min-height: calc(100vh - var(--header-height));
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 9%, transparent), transparent),
		var(--color-bg);
}
.fr-driver-page--login .fr-driver-auth-wrap,
.fr-driver-page--register .fr-driver-auth-wrap {
	width: 100%;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: var(--space-12) var(--container-pad-desktop) var(--space-16);
	box-sizing: border-box;
}
.fr-driver-page--login .fr-driver-auth-card {
	max-width: 520px;
	margin: 0 auto;
}
.fr-driver-page--register .fr-driver-auth-card,
.fr-driver-auth-wrap--wide .fr-driver-auth-card {
	max-width: 920px;
	margin: 0 auto;
}
.fr-driver-auth-card {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	box-shadow: var(--shadow-modal);
	padding: var(--space-8);
}
.fr-driver-auth-logo img {
	max-width: var(--logo-max-width, 180px);
	max-height: var(--logo-max-height, 54px);
	width: auto;
	height: auto;
	object-fit: contain;
}
.fr-driver-auth-title,
.fr-driver-auth-subtitle {
	text-align: center;
}
.fr-driver-auth-form,
.fr-driver-reg-form {
	display: grid !important;
	gap: var(--space-5, var(--space-4));
}
.fr-driver-reg-form {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: start;
}
.fr-driver-reg-form .fr-driver-form-fieldset {
	height: 100%;
}
.fr-driver-reg-form .fr-driver-form-fieldset:first-of-type,
.fr-driver-reg-form .fr-driver-form-fieldset:last-of-type,
.fr-driver-reg-form > button,
.fr-driver-reg-form > .fr-driver-btn {
	grid-column: 1 / -1;
}
.fr-driver-form-fieldset {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: var(--space-6);
	box-sizing: border-box;
}
.fr-driver-form-fieldset legend {
	font-family: var(--font-display);
	font-weight: 800;
	color: var(--color-primary);
	padding: 0 var(--space-2);
}
.fr-driver-form-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-4);
}
.fr-driver-form-group {
	min-width: 0;
}
.fr-driver-form-group label {
	font-family: var(--font-display);
	font-weight: 700;
	color: var(--color-text);
}
.fr-driver-form-group input,
.fr-driver-form-group select,
.fr-driver-form-group textarea {
	width: 100%;
	min-height: 50px;
	box-sizing: border-box;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-white);
	color: var(--color-text);
}
.fr-driver-form-group input[type="file"] {
	min-height: auto;
	padding: var(--space-4);
	background: var(--color-light-bg);
	border-style: dashed;
}
.fr-driver-btn--primary,
.fr-driver-btn--primary:visited {
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	text-decoration: none !important;
}
.fr-driver-btn--primary:hover,
.fr-driver-btn--primary:focus {
	background: var(--color-primary-dark) !important;
	color: var(--color-white) !important;
}
.fr-driver-auth-footer a {
	color: var(--color-primary);
	font-weight: 800;
	text-decoration: none !important;
}
@media (max-width: 900px) {
	.fr-driver-reg-form,
	.fr-driver-form-row {
		grid-template-columns: 1fr;
	}
	.fr-driver-page--login .fr-driver-auth-wrap,
	.fr-driver-page--register .fr-driver-auth-wrap {
		padding: var(--space-8) var(--container-pad-mobile) var(--space-12);
	}
	.fr-driver-auth-card {
		padding: var(--space-6);
	}
}

/* ---- Payment transparency flow ----------------------------- */
.fr-driver-pay-info {
	background: var(--color-white, #fff);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
	padding: var(--space-4, 16px) var(--space-6, 24px);
}

.fr-driver-pay-flow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-3, 12px);
	flex-wrap: wrap;
	margin-bottom: var(--space-3, 12px);
}

.fr-driver-pay-flow__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-1, 4px);
	text-align: center;
	min-width: 64px;
}

.fr-driver-pay-flow__icon {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-light-bg, #F3F4F6);
	color: var(--color-text, #1F2937);
}

.fr-driver-pay-flow__icon--customer { background: #DBEAFE; color: #1E40AF; }
.fr-driver-pay-flow__icon--fr       { background: #D1FAE5; color: var(--color-primary, #0F766E); }
.fr-driver-pay-flow__icon--marqeta  { background: #FEF3C7; color: #92400E; font-size: 1.125rem; font-weight: 800; font-family: var(--font-display, 'Poppins', sans-serif); }
.fr-driver-pay-flow__icon--you      { background: #D1FAE5; color: var(--color-primary, #0F766E); }

.fr-driver-pay-flow__name {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 700;
	font-size: var(--font-size-xs, 12px);
	color: var(--color-text, #1F2937);
}

.fr-driver-pay-flow__sub {
	font-size: 10px;
	color: var(--color-muted, #9CA3AF);
	line-height: 1.3;
}

.fr-driver-pay-flow__arrow {
	color: var(--color-muted, #9CA3AF);
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.fr-driver-pay-info__note {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
	text-align: center;
	margin: 0;
	line-height: 1.5;
}

/* ---- Earnings report --------------------------------------- */
.fr-driver-report {
	padding: var(--space-6, 24px);
	background: var(--color-light-bg, #F3F4F6);
	border-bottom: 1px solid var(--color-border, #D1D5DB);
}

.fr-driver-report__header {
	display: flex;
	align-items: center;
	gap: var(--space-3, 12px);
	margin-bottom: var(--space-4, 16px);
}

.fr-driver-report__title {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-h5, 18px);
	font-weight: 700;
	margin: 0;
	color: var(--color-text, #1F2937);
}

.fr-driver-demo-badge {
	display: inline-flex;
	align-items: center;
	padding: var(--space-1, 4px) var(--space-3, 12px);
	background: #FEF3C7;
	color: #92400E;
	border: 1px solid #FDE68A;
	border-radius: var(--radius-full, 9999px);
	font-size: var(--font-size-xs, 12px);
	font-weight: 700;
	font-family: var(--font-display, 'Poppins', sans-serif);
}

/* Key metric cards */
.fr-driver-report__stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-3, 12px);
	margin-bottom: var(--space-4, 16px);
}

.fr-driver-report__stat {
	background: var(--color-white, #fff);
	border-radius: var(--radius-lg, 12px);
	padding: var(--space-4, 16px) var(--space-3, 12px);
	display: flex;
	flex-direction: column;
	gap: var(--space-1, 4px);
	text-align: center;
	box-shadow: var(--shadow-card, 0 2px 8px rgba(0,0,0,0.08));
	border: 1px solid var(--color-border, #D1D5DB);
}

.fr-driver-report__stat--marqeta {
	border-color: #FDE68A;
	background: #FFFBEB;
}

.fr-driver-report__stat--zero {
	border-color: #D1FAE5;
	background: #ECFDF5;
}

.fr-driver-report__stat-value {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-primary, #0F766E);
	display: block;
}

.fr-driver-report__stat--zero .fr-driver-report__stat-value {
	color: #065F46;
}

.fr-driver-report__stat-label {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-1, 4px);
	flex-wrap: wrap;
}

/* Marqeta inline badge */
.fr-marqeta-badge {
	display: inline-flex;
	align-items: center;
	padding: 1px var(--space-2, 8px);
	background: #FEF3C7;
	color: #92400E;
	border-radius: var(--radius-sm, 4px);
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 700;
	font-size: 10px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* Breakdown table */
.fr-driver-report__table-wrap {
	background: var(--color-white, #fff);
	border-radius: var(--radius-lg, 12px);
	box-shadow: var(--shadow-card, 0 2px 8px rgba(0,0,0,0.08));
	overflow: hidden;
	margin-bottom: var(--space-4, 16px);
}

.fr-driver-report__table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--font-size-sm, 14px);
}

.fr-driver-report__table caption {
	caption-side: top;
}

.fr-driver-report__table thead tr {
	background: var(--color-primary, #0F766E);
	color: var(--color-white, #fff);
}

.fr-driver-report__table thead th {
	padding: var(--space-3, 12px) var(--space-4, 16px);
	text-align: left;
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-xs, 12px);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.fr-driver-report__table tbody tr {
	border-bottom: 1px solid var(--color-border, #D1D5DB);
}

.fr-driver-report__table tbody tr:last-child {
	border-bottom: none;
}

.fr-driver-report__table tbody td {
	padding: var(--space-3, 12px) var(--space-4, 16px);
	color: var(--color-text, #1F2937);
}

.fr-driver-report__table tbody td:last-child {
	text-align: right;
	font-weight: 600;
	font-family: var(--font-display, 'Poppins', sans-serif);
}

.fr-driver-report__row--zero td {
	background: #ECFDF5;
	color: #065F46;
}

.fr-driver-report__row--zero td:last-child {
	color: #065F46;
}

.fr-driver-report__zero-tag {
	font-weight: 700;
	color: #065F46;
}

.fr-driver-report__table tfoot .fr-driver-report__row--total {
	background: var(--color-primary, #0F766E);
	color: var(--color-white, #fff);
}

.fr-driver-report__table tfoot .fr-driver-report__row--total th,
.fr-driver-report__table tfoot .fr-driver-report__row--total td {
	padding: var(--space-4, 16px);
	font-size: 1.0625rem;
	color: var(--color-white, #fff);
}

.fr-driver-report__table tfoot .fr-driver-report__row--total td {
	text-align: right;
}

.fr-driver-report__note {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #9CA3AF);
	margin: 0;
	line-height: 1.6;
	text-align: center;
}

/* ---- Responsive: report + pay flow ------------------------- */
@media (max-width: 768px) {
	.fr-driver-pay-flow__arrow { display: none; }
	.fr-driver-pay-flow {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-3, 12px);
	}
	.fr-driver-report__stats {
		grid-template-columns: 1fr;
	}
	.fr-driver-report {
		padding: var(--space-4, 16px);
	}
	.fr-driver-pay-info {
		padding: var(--space-4, 16px);
	}
}

/* ---- WP Admin: Live Orders dashboard ----------------------- */
.fr-admin-live-orders__help {
	max-width: 720px;
	margin: 0 0 16px;
	color: #646970;
}

.fr-admin-location-name {
	display: block;
	font-weight: 600;
}

.fr-admin-cell-meta {
	display: block;
	margin-top: 2px;
	font-size: 12px;
	color: #646970;
}

.fr-admin-cell-hint {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	color: #b32d2e;
	max-width: 260px;
	line-height: 1.4;
}

.fr-admin-cell-muted {
	color: #646970;
}

.fr-admin-badge {
	display: inline-block;
	margin-top: 4px;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.fr-admin-badge--error {
	background: #fcf0f1;
	color: #b32d2e;
	border: 1px solid #f1aeb5;
}

.fr-admin-badge--warning {
	background: #fcf9e8;
	color: #9a6700;
	border: 1px solid #f0d58c;
}

.fr-admin-row--warning td {
	background: #fff8e5;
}

#fr-admin-orders-table td {
	vertical-align: top;
}

#fr-admin-orders-table .button + .button {
	margin-left: 4px;
}

/* ---- WP Admin: reassign modal + driver drawer ---------------- */
.fr-admin-modal {
	position: fixed;
	inset: 0;
	z-index: 100100;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.45);
}

.fr-admin-modal[hidden],
.fr-admin-drawer[hidden] {
	display: none !important;
}

.fr-admin-modal__panel {
	width: min(480px, calc(100vw - 32px));
	max-height: calc(100vh - 48px);
	overflow: auto;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
	padding: 20px 24px 24px;
}

.fr-admin-modal__head,
.fr-admin-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

.fr-admin-modal__head h2,
.fr-admin-drawer__head h2 {
	margin: 0;
	font-size: 18px;
}

.fr-admin-modal__help {
	margin: 0 0 12px;
	color: #646970;
}

.fr-admin-reassign-list {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	max-height: 280px;
	overflow: auto;
}

.fr-admin-reassign-driver {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 12px 14px;
	border-bottom: 1px solid #f0f0f1;
	cursor: pointer;
}

.fr-admin-reassign-driver:last-child {
	border-bottom: 0;
}

.fr-admin-reassign-driver:hover,
.fr-admin-reassign-driver.is-selected {
	background: #f0f6fc;
}

.fr-admin-reassign-driver span {
	font-size: 12px;
	color: #646970;
}

.fr-admin-reassign-empty {
	padding: 16px;
	color: #646970;
}

.fr-admin-modal__actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

.fr-admin-drawer {
	position: fixed;
	inset: 0;
	z-index: 100090;
	background: rgba(0, 0, 0, 0.35);
}

.fr-admin-drawer__panel {
	position: absolute;
	top: 0;
	right: 0;
	width: min(420px, 100vw);
	height: 100%;
	background: #fff;
	box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
	padding: 20px 24px;
	overflow: auto;
}

.fr-admin-profile-grid {
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: 8px 16px;
	margin: 0 0 20px;
}

.fr-admin-profile-grid dt {
	margin: 0;
	font-weight: 600;
	color: #1d2327;
}

.fr-admin-profile-grid dd {
	margin: 0;
	color: #50575e;
}

.fr-admin-doc-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.fr-admin-doc-list li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #f0f0f1;
}

.fr-admin-actions-cell .button + .button {
	margin-left: 4px;
}

.fr-admin-badge--pending {
	background: #fcf9e8;
	color: #9a6700;
	border: 1px solid #f0d58c;
}

.fr-admin-badge--approved {
	background: #edfaef;
	color: #1a7f37;
	border: 1px solid #abdfc0;
}

.fr-admin-badge--suspended {
	background: #fcf0f1;
	color: #b32d2e;
	border: 1px solid #f1aeb5;
}

/* ---- FoodRabbit Pay Card (driver dashboard) --------------- */
.fr-card-section {
	background: var(--color-white, #fff);
	border-radius: var(--radius-lg, 12px);
	box-shadow: var(--shadow-card, 0 2px 8px rgba(0,0,0,0.08));
	padding: var(--space-6, 24px);
	margin-bottom: var(--space-6, 24px);
}
.fr-card-section h2 {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-size: var(--font-size-h5, 18px);
	margin: 0 0 var(--space-4, 16px);
}
.fr-card-section__pending {
	background: var(--color-light-bg, #F3F4F6);
	border-radius: var(--radius-md, 8px);
	padding: var(--space-4, 16px);
	color: var(--color-muted, #6b7280);
	margin: 0;
}

.fr-card-widget {
	background: linear-gradient(135deg, var(--color-primary, #0F766E) 0%, #134e4a 100%);
	color: #fff;
	border-radius: var(--radius-lg, 12px);
	padding: var(--space-6, 24px);
	margin-bottom: var(--space-4, 16px);
}
.fr-card-widget__label {
	font-family: var(--font-display, 'Poppins', sans-serif);
	font-weight: 600;
	font-size: var(--font-size-sm, 14px);
	opacity: .85;
	margin-bottom: var(--space-4, 16px);
}
.fr-card-widget__number {
	font-family: monospace;
	font-size: 1.25rem;
	letter-spacing: .06em;
	margin-bottom: var(--space-4, 16px);
}
.fr-card-widget__meta {
	display: flex;
	justify-content: space-between;
	font-size: var(--font-size-sm, 14px);
	opacity: .9;
}
.fr-card-widget__status.is-active { color: #6ee7b7; opacity: 1; font-weight: 600; }

.fr-card-details {
	background: var(--color-light-bg, #F3F4F6);
	border-radius: var(--radius-md, 8px);
	padding: var(--space-4, 16px);
	margin-bottom: var(--space-4, 16px);
}
.fr-card-details__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-2, 8px) 0;
	border-bottom: 1px solid var(--color-border, #D1D5DB);
	font-size: var(--font-size-sm, 14px);
}
.fr-card-details__row:last-of-type { border-bottom: none; }
.fr-card-details__value-wrap { display: flex; align-items: center; gap: var(--space-2, 8px); }
.fr-card-copy-btn {
	background: none;
	border: none;
	cursor: pointer;
	font-size: 1rem;
	padding: var(--space-1, 4px);
	line-height: 1;
}
.fr-card-details__note {
	font-size: var(--font-size-xs, 12px);
	color: var(--color-muted, #6b7280);
	margin: var(--space-2, 8px) 0 0;
}

.fr-card-actions { margin-bottom: var(--space-4, 16px); }

.fr-wallet-buttons { display: flex; flex-direction: column; gap: var(--space-2, 8px); }
.fr-wallet-howto {
	background: var(--color-light-bg, #F3F4F6);
	border-radius: var(--radius-md, 8px);
	padding: var(--space-4, 16px);
	font-size: var(--font-size-sm, 14px);
}
.fr-wallet-howto ol { margin: var(--space-2, 8px) 0 0; padding-left: 1.25rem; }
.fr-wallet-howto li { margin-bottom: var(--space-2, 8px); }

.fr-marqeta-badge {
	display: inline-block;
	background: #eef2ff;
	color: #4338ca;
	font-size: var(--font-size-xs, 12px);
	font-weight: 700;
	padding: 2px 8px;
	border-radius: var(--radius-full, 9999px);
	vertical-align: middle;
}