.bds-wrap{--bds-teal:#005566;--bds-ink:#0f2530;--bds-muted:#5b6b73;--bds-line:rgba(15,37,48,.12);--bds-soft:#e8f3f5;font-family:Inter,system-ui,sans-serif;color:var(--bds-ink);margin:1.5rem 0}
.bds-hero h2{margin:0 0 .35rem;color:var(--bds-teal);font-size:1.6rem}
.bds-hero p,.bds-note{color:var(--bds-muted)}
.bds-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:1.25rem}
@media(max-width:860px){.bds-layout{grid-template-columns:1fr}}
.bds-card{border:1px solid var(--bds-line);background:#fff;padding:1.1rem 1.25rem;border-radius:8px}
.bds-steps{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem;font-size:.9rem;color:var(--bds-muted)}
.bds-steps .is-active{color:var(--bds-teal);font-weight:700}
.bds-panel.is-hidden,.is-hidden{display:none!important}
.bds-input,select.bds-input,textarea.bds-input{width:100%;margin:.35rem 0 1rem;padding:.65rem .75rem;border:1px solid var(--bds-line);border-radius:6px}
.bds-label{margin:.5rem 0 .4rem;font-weight:600}
.bds-type-grid,.bds-slots{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:1rem}
.bds-type,.bds-slot{border:1px solid var(--bds-line);background:var(--bds-soft);padding:.7rem;border-radius:6px;cursor:pointer;text-align:left}
.bds-type.is-active,.bds-slot.is-active{border-color:var(--bds-teal);background:#dff1f4}
.bds-btn{background:var(--bds-teal);color:#fff;border:0;border-radius:6px;padding:.7rem 1rem;cursor:pointer;font-weight:600}
.bds-btn:disabled{opacity:.45;cursor:not-allowed}
.bds-btn-light{background:#fff;color:var(--bds-teal);border:1px solid var(--bds-teal)}
.bds-btn-sm{padding:.35rem .6rem;font-size:.85rem}
.bds-row{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.75rem}
.bds-review{list-style:none;margin:0 0 1rem;padding:0}
.bds-review li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--bds-line)}
.bds-badge{display:inline-block;background:var(--bds-soft);color:var(--bds-teal);padding:.35rem .65rem;border-radius:999px;font-size:.85rem;font-weight:600}
.bds-success{border:1px solid #b7e4c7;background:#edf9f1;padding:1.25rem;border-radius:8px;margin-bottom:1rem}
.bds-msg{min-height:1.2rem;font-weight:600}
.bds-msg.is-ok{color:#0a7a3e}.bds-msg.is-err{color:#b42318}
.bds-table-wrap{overflow:auto}
.bds-table{width:100%;border-collapse:collapse}
.bds-table th,.bds-table td{border-bottom:1px solid var(--bds-line);padding:.65rem;text-align:left;vertical-align:top}
.bds-status{display:inline-block;padding:.2rem .5rem;border-radius:4px;background:var(--bds-soft);font-size:.8rem}
.bds-status-completed{background:#edf9f1}.bds-status-cancelled{background:#fdecec}
.bds-job-list button.bds-ticket-open{display:flex;flex-direction:column;gap:.2rem;width:100%;padding:.75rem 0;border:0;border-bottom:1px solid var(--bds-line);background:transparent;text-align:left;cursor:pointer;color:inherit;font:inherit}
.bds-job-list button.bds-ticket-open:hover{background:var(--bds-soft)}
.bds-job-list small{color:var(--bds-muted);font-size:.8rem}
.bds-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:1rem}
.bds-modal.is-hidden{display:none!important}
.bds-modal-backdrop{position:absolute;inset:0;background:rgba(15,37,48,.45)}
.bds-modal-dialog{position:relative;z-index:1;width:min(560px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:12px;padding:1.25rem 1.35rem;box-shadow:0 16px 48px rgba(0,0,0,.2)}
.bds-modal-close{position:absolute;top:.5rem;right:.75rem;border:0;background:transparent;font-size:1.5rem;cursor:pointer;line-height:1}
.bds-modal-body p{margin:.4rem 0}
.bds-modal-status.is-closed{color:#0a7a3e;font-weight:700}
.bds-closed-row{color:#0a7a3e}
.bds-duration-row{color:#0a7a3e;font-weight:600}
.bds-ticket-open.is-closed .bds-status{background:#edf9f1}
.bds-modal-photo{margin:0.75rem 0}
.bds-modal-photo img{max-width:100%;border-radius:8px}
.bds-actions.is-hidden{display:none!important}
.bds-survey-ref{color:var(--bds-muted);margin:0 0 1rem}
.bds-survey-done{color:#0a7a3e;font-weight:600;font-size:.9rem}
.bds-geo-manual{margin:.75rem 0;padding:.75rem;background:var(--bds-soft);border-radius:8px}
.bds-geo-hint{margin:0 0 .5rem;font-size:.85rem;color:var(--bds-muted)}
.bds-geo-row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.bds-geo-row .bds-input{margin:0}

/* ========== Client account panels (devices / tickets / dashboard card) ========== */
.bds-account-panel {
	margin: 0;
}

.bds-account-panel-head {
	margin-bottom: 20px;
}

.bds-account-panel-head h2 {
	margin: 0 0 6px;
	font-family: "Plus Jakarta Sans", system-ui, sans-serif;
	font-size: 1.2rem;
	font-weight: 800;
	color: #111827;
}

.bds-account-panel-head p {
	margin: 0;
	font-size: 14px;
	color: #6b7280;
	line-height: 1.5;
}

.bds-account-empty {
	padding: 28px 20px;
	text-align: center;
	background: #f8fafb;
	border: 1px dashed rgba(0, 0, 0, 0.1);
	border-radius: 14px;
}

.bds-account-empty p {
	margin: 0;
	color: #6b7280;
	font-size: 14px;
}

.bds-my-tickets .bds-table-wrap {
	border: 1px solid rgba(0, 0, 0, 0.07);
	border-radius: 14px;
	overflow: auto;
	background: #fff;
	-webkit-overflow-scrolling: touch;
}

.bds-my-tickets .bds-table {
	margin: 0;
	min-width: 720px;
}

.bds-my-tickets .bds-table th,
.bds-my-tickets .bds-table td {
	padding: 12px 14px;
	font-size: 13px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.bds-my-tickets .bds-table thead th {
	background: #e8f8fc;
	font-family: "Plus Jakarta Sans", system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	color: #111827;
	white-space: nowrap;
}

.bds-my-tickets .bds-table tbody tr:last-child td {
	border-bottom: none;
}

.bds-my-tickets .bds-status {
	border-radius: 999px;
	padding: 3px 10px;
	font-size: 11px;
	font-weight: 700;
}

.bds-status-pending { background: #fff7ed; color: #c2410c; }
.bds-status-scheduled,
.bds-status-confirmed { background: #e0f2fe; color: #0369a1; }
.bds-status-en_route { background: #fef3c7; color: #b45309; }
.bds-status-in_progress { background: #ede9fe; color: #6d28d9; }
.bds-status-out_of_warranty { background: #fdecec; color: #b42318; }
.bds-status-completed { background: #edf9f1; color: #0a7a3e; }
.bds-status-cancelled { background: #f3f4f6; color: #4b5563; }

.bds-dash-service-card {
	margin: 0 0 1.5rem;
	padding: 20px 22px;
	border-radius: 16px;
	border: 1px solid rgba(0, 180, 216, 0.2);
	background: linear-gradient(135deg, #e8f8fc 0%, #fff 72%);
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}

.bds-dash-service-card h3 {
	margin: 0 0 6px;
	font-family: "Plus Jakarta Sans", system-ui, sans-serif;
	font-size: 1.05rem;
	font-weight: 800;
	color: #111827;
}

.bds-dash-service-card > p {
	margin: 0 0 14px;
	font-size: 14px;
	color: #6b7280;
}

.bds-dash-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 !important;
}

.bds-dash-actions .bds-btn {
	text-decoration: none;
}

.woocommerce-MyAccount-content .bds-btn,
.bds-account-panel .bds-btn {
	background: #00b4d8;
	border-radius: 10px;
	font-family: "Plus Jakarta Sans", system-ui, sans-serif;
}

.woocommerce-MyAccount-content .bds-btn:hover,
.bds-account-panel .bds-btn:hover {
	background: #0096b4;
}

.woocommerce-MyAccount-content .bds-btn-light,
.bds-account-panel .bds-btn-light {
	background: #fff;
	color: #0096b4;
	border: 1px solid rgba(0, 180, 216, 0.45);
}

.woocommerce-MyAccount-content .bds-btn-light:hover,
.bds-account-panel .bds-btn-light:hover {
	background: rgba(0, 180, 216, 0.08);
}

.bds-my-tickets .bds-modal-dialog {
	display: flex;
	flex-direction: column;
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow: hidden;
	padding: 0;
}

.bds-my-tickets .bds-modal-dialog > h3 {
	flex: 0 0 auto;
	margin: 0;
	padding: 20px 52px 12px 24px;
	background: #e8f8fc;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	font-family: "Plus Jakarta Sans", system-ui, sans-serif;
}

.bds-my-tickets .bds-modal-dialog > .bds-survey-ref,
.bds-my-tickets #bdsSurveyForm {
	padding-left: 24px;
	padding-right: 24px;
}

.bds-my-tickets #bdsSurveyForm {
	padding-bottom: 24px;
	overflow-y: auto;
	min-height: 0;
}

/* ========== Staff Ticket Dashboard ========== */
.bds-staff {
	--bds-cyan: #00b4d8;
	--bds-cyan-dark: #0096b4;
	--bds-bg: #f5f7f8;
	--bds-charcoal: #111827;
	--bds-gray: #6b7280;
	--bds-display: "Plus Jakarta Sans", system-ui, sans-serif;
	--bds-body: Inter, system-ui, sans-serif;
	background: var(--bds-bg);
	margin: 0;
	padding: 28px 16px 64px;
	font-family: var(--bds-body);
	color: var(--bds-charcoal);
	min-height: 50vh;
}

@media (min-width: 768px) {
	.bds-staff {
		padding: 36px 24px 80px;
	}
}

.bds-staff-header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	max-width: 960px;
	margin: 0 auto 24px;
}

.bds-staff-header-text h1 {
	margin: 0 0 6px;
	font-family: var(--bds-display);
	font-size: clamp(1.4rem, 3vw, 1.85rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--bds-charcoal);
	line-height: 1.2;
}

.bds-staff-header-text p {
	margin: 0;
	font-size: 14px;
	color: var(--bds-gray);
	max-width: 42rem;
	line-height: 1.5;
}

.bds-staff-stats {
	display: flex;
	gap: 10px;
}

.bds-staff-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 72px;
	padding: 10px 14px;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 12px;
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}

.bds-staff-stat strong {
	font-family: var(--bds-display);
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1;
	color: var(--bds-charcoal);
}

.bds-staff-stat small {
	margin-top: 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--bds-gray);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.bds-staff-stat-open strong {
	color: var(--bds-cyan-dark);
}

.bds-staff .bds-staff-card {
	max-width: 960px;
	margin: 0 auto;
	padding: 0;
	border: 1px solid rgba(0, 0, 0, 0.07);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 32px rgba(15, 23, 42, 0.04);
	overflow: hidden;
}

.bds-staff-card-head {
	padding: 18px 20px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	background: #e8f8fc;
}

.bds-staff-card-head h2 {
	margin: 0;
	font-family: var(--bds-display);
	font-size: 1rem;
	font-weight: 800;
	color: var(--bds-charcoal);
}

.bds-staff-empty {
	padding: 40px 24px;
	text-align: center;
}

.bds-staff-empty p {
	margin: 0;
	color: var(--bds-gray);
	font-size: 14px;
}

.bds-staff .bds-job-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bds-staff .bds-job-item {
	margin: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.bds-staff .bds-job-item:last-child {
	border-bottom: none;
}

.bds-staff .bds-job-item.is-closed {
	opacity: 0.78;
}

.bds-staff .bds-job-list button.bds-ticket-open {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-areas:
		"top chevron"
		"type chevron"
		"meta chevron";
	gap: 4px 12px;
	width: 100%;
	padding: 16px 20px;
	border: 0;
	border-bottom: 0;
	background: transparent;
	text-align: left;
	cursor: pointer;
	color: inherit;
	font: inherit;
	transition: background 0.15s;
}

.bds-staff .bds-job-list button.bds-ticket-open:hover {
	background: rgba(0, 180, 216, 0.06);
}

.bds-staff .bds-ticket-top {
	grid-area: top;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.bds-staff .bds-ticket-ref {
	font-family: var(--bds-display);
	font-size: 15px;
	font-weight: 800;
	color: var(--bds-charcoal);
	letter-spacing: -0.01em;
}

.bds-staff .bds-ticket-type {
	grid-area: type;
	font-size: 13px;
	font-weight: 600;
	color: var(--bds-cyan-dark);
}

.bds-staff .bds-ticket-meta {
	grid-area: meta;
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: 2px;
}

.bds-staff .bds-ticket-meta small,
.bds-staff .bds-job-list small {
	color: var(--bds-gray);
	font-size: 12px;
	line-height: 1.4;
}

.bds-staff .bds-ticket-chevron {
	grid-area: chevron;
	display: flex;
	align-items: center;
	color: var(--bds-gray);
	opacity: 0.55;
	align-self: center;
}

.bds-staff .bds-status {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	background: #e8f3f5;
	color: var(--bds-teal);
}

.bds-staff .bds-status-pending {
	background: #fff7ed;
	color: #c2410c;
}

.bds-staff .bds-status-scheduled,
.bds-staff .bds-status-confirmed {
	background: #e0f2fe;
	color: #0369a1;
}

.bds-staff .bds-status-en_route {
	background: #fef3c7;
	color: #b45309;
}

.bds-staff .bds-status-in_progress {
	background: #ede9fe;
	color: #6d28d9;
}

.bds-staff .bds-status-out_of_warranty {
	background: #fdecec;
	color: #b42318;
}

.bds-staff .bds-status-completed {
	background: #edf9f1;
	color: #0a7a3e;
}

.bds-staff .bds-status-cancelled {
	background: #f3f4f6;
	color: #4b5563;
}

.bds-staff .bds-modal {
	align-items: center;
	justify-content: center;
	padding: 16px;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
}

.bds-staff .bds-modal-dialog {
	display: flex;
	flex-direction: column;
	width: min(640px, 100%);
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	padding: 0;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 24px 64px rgba(15, 23, 42, 0.22);
}

.bds-staff .bds-modal-head {
	flex: 0 0 auto;
	padding: 20px 52px 16px 24px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	background: #e8f8fc;
}

.bds-staff .bds-modal-head h3 {
	margin: 0;
	font-family: var(--bds-display);
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--bds-charcoal);
}

.bds-staff .bds-modal-close {
	top: 14px;
	right: 16px;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	color: var(--bds-gray);
	transition: background 0.15s, color 0.15s;
}

.bds-staff .bds-modal-close:hover {
	background: rgba(0, 0, 0, 0.06);
	color: var(--bds-charcoal);
}

.bds-staff .bds-modal-body {
	flex: 1 1 auto;
	min-height: 0;
	padding: 20px 24px 24px;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
}

body.bds-modal-open {
	overflow: hidden !important;
}

.bds-staff .bds-modal-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
}

@media (min-width: 560px) {
	.bds-staff .bds-modal-grid {
		grid-template-columns: 1fr 1fr;
		gap: 0 20px;
	}
}

.bds-staff .bds-modal-body p,
.bds-staff .bds-modal-grid p {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 10px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
	font-size: 14px;
	color: var(--bds-charcoal);
}

.bds-staff .bds-modal-grid .bds-modal-full {
	grid-column: 1 / -1;
}

.bds-staff .bds-modal-body p strong,
.bds-staff .bds-modal-grid p strong {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--bds-gray);
}

.bds-staff .bds-modal-status.is-closed {
	color: #0a7a3e;
	font-weight: 700;
}

.bds-staff .bds-actions {
	margin-top: 20px;
	padding-top: 18px;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.bds-staff .bds-actions-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 12px;
}

.bds-staff .bds-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 16px;
	border-radius: 10px;
	background: var(--bds-cyan);
	color: #fff;
	font-family: var(--bds-display);
	font-size: 13px;
	font-weight: 700;
	transition: background 0.15s, opacity 0.15s;
}

.bds-staff .bds-btn:hover {
	background: var(--bds-cyan-dark);
}

.bds-staff .bds-btn-light {
	background: #fff;
	color: var(--bds-cyan-dark);
	border: 1px solid rgba(0, 180, 216, 0.45);
}

.bds-staff .bds-btn-light:hover {
	background: rgba(0, 180, 216, 0.08);
}

.bds-staff .bds-btn-danger {
	width: 100%;
	margin-top: 4px;
	background: #0f766e;
}

.bds-staff .bds-btn-danger:hover {
	background: #0d9488;
}

.bds-staff .bds-input,
.bds-staff select.bds-input,
.bds-staff textarea.bds-input {
	margin: 0 0 10px;
	padding: 10px 12px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	font-size: 14px;
	background: #fff;
	box-sizing: border-box;
}

.bds-staff .bds-input:focus {
	outline: none;
	border-color: var(--bds-cyan);
	box-shadow: 0 0 0 3px rgba(0, 180, 216, 0.15);
}

.bds-staff .bds-charge-row {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin: 0.5rem 0;
}

.bds-staff .bds-geo-manual {
	margin: 0 0 12px;
	padding: 12px;
	background: #f0f9fb;
	border: 1px solid rgba(0, 180, 216, 0.2);
	border-radius: 12px;
}

.bds-staff .bds-modal-photo {
	margin: 12px 0 0;
}

.bds-staff .bds-modal-photo img {
	border-radius: 12px;
	border: 1px solid rgba(0, 0, 0, 0.06);
}

.bds-staff .bds-msg {
	margin: 10px 0 0;
	font-size: 13px;
}