/**
 * DBD Jewelry Studio — Front-end booking wizard.
 *
 * Luxury editorial aesthetic:
 *   Rose gold + deep navy + warm cream. Playfair serif titles.
 */

.dbdjs-book, .dbdjs-book * { box-sizing: border-box; }
.dbdjs-book {
	--dbdjs-primary: #C89B7B;
	--dbdjs-primary-dark: #B08159;
	--dbdjs-primary-light: #E4B698;
	--dbdjs-navy: #1A2140;
	--dbdjs-navy-light: #2A3358;
	--dbdjs-cream: #FAF6F1;
	--dbdjs-porcelain: #ffffff;
	--dbdjs-line: #EFE6DA;
	--dbdjs-text: #23283C;
	--dbdjs-text-soft: #6C6E7A;

	max-width: 1180px; margin: 0 auto; padding: 40px 20px;
	color: var(--dbdjs-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.6;
}
.dbdjs-book h3 { font-family: "Playfair Display", "Georgia", serif; margin: 0; font-weight: 500; color: var(--dbdjs-navy); }

/* ---------- Hero ---------- */
.dbdjs-book-hero { text-align: center; margin-bottom: 32px; }
.dbdjs-book-hero-logo { max-width: 180px; max-height: 64px; width: auto; height: auto; object-fit: contain; margin: 0 auto 16px; display: block; }
.dbdjs-book-hero-badge {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 6px 16px; border-radius: 20px;
	background: rgba(200,155,123,0.12); color: var(--dbdjs-primary-dark);
	font-size: 12px; letter-spacing: 2px; text-transform: uppercase; font-weight: 600;
	margin-bottom: 16px;
}
.dbdjs-book-hero-badge span {
	width: 6px; height: 6px; border-radius: 50%; background: var(--dbdjs-primary);
	animation: dbdjs-pulse 2s ease-in-out infinite;
}
@keyframes dbdjs-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50%      { opacity: 0.5; transform: scale(1.3); }
}
.dbdjs-book-hero-title { font-family: "Playfair Display", "Georgia", serif; font-size: 42px; font-weight: 500; color: var(--dbdjs-navy); margin: 0 0 10px; letter-spacing: -0.5px; line-height: 1.15; }
.dbdjs-book-hero-sub { color: var(--dbdjs-text-soft); max-width: 560px; margin: 0 auto; font-size: 16px; }

/* ---------- Layout shell ---------- */
/* min-width:0 below overrides the browser default of min-width:auto (min-content)
   on grid/flex items. Without it, any scrollable child (e.g. the horizontally
   scrolling step nav) forces its track — and the whole shell/page — to grow wide
   enough to fit its un-scrolled content, causing horizontal overflow on mobile. */
.dbdjs-book { overflow-x: hidden; width: 100%; }
.dbdjs-book-shell {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 32px;
	background: var(--dbdjs-porcelain);
	border: 1px solid var(--dbdjs-line);
	border-radius: 24px;
	box-shadow: 0 20px 60px rgba(26,33,64,0.08);
	overflow: hidden;
	min-width: 0;
	max-width: 100%;
}
.dbdjs-book-side {
	background: linear-gradient(180deg, #FBF6EF 0%, #F6EDDE 100%);
	padding: 32px 24px;
	border-right: 1px solid var(--dbdjs-line);
	position: relative;
	min-width: 0;
}
.dbdjs-book-side::before {
	content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
	background: linear-gradient(90deg, var(--dbdjs-navy), var(--dbdjs-primary), var(--dbdjs-navy));
}

/* ---------- Sidebar steps ---------- */
.dbdjs-book-steps { list-style: none; padding: 0; margin: 0 0 24px; }
.dbdjs-book-steps li { display: flex; align-items: center; gap: 12px; padding: 10px 0; color: var(--dbdjs-text-soft); font-size: 14px; font-weight: 500; position: relative; }
.dbdjs-book-steps li:not(:last-child)::after {
	content: ""; position: absolute; left: 15px; top: 40px; bottom: -10px;
	width: 2px; background: var(--dbdjs-line);
}
.dbdjs-book-steps li.is-complete::after { background: linear-gradient(180deg, var(--dbdjs-primary), var(--dbdjs-line)); }
.dbdjs-book-step-num {
	width: 32px; height: 32px; border-radius: 50%;
	background: #fff; border: 2px solid var(--dbdjs-line);
	display: flex; align-items: center; justify-content: center;
	font-weight: 600; font-size: 13px; color: var(--dbdjs-text-soft);
	flex-shrink: 0; position: relative; z-index: 1;
	transition: all 0.25s ease;
}
.dbdjs-book-step-label { font-family: "Playfair Display", serif; font-size: 15px; }
.dbdjs-book-steps li.is-active .dbdjs-book-step-num {
	background: linear-gradient(135deg, var(--dbdjs-primary), var(--dbdjs-primary-light));
	color: #fff; border-color: transparent;
	box-shadow: 0 4px 12px rgba(200,155,123,0.4);
	transform: scale(1.08);
}
.dbdjs-book-steps li.is-active { color: var(--dbdjs-navy); }
.dbdjs-book-steps li.is-complete .dbdjs-book-step-num {
	background: var(--dbdjs-navy); color: #fff; border-color: transparent;
}
.dbdjs-book-steps li.is-complete .dbdjs-book-step-num::before {
	content: "✓"; font-size: 14px;
}
.dbdjs-book-steps li.is-complete .dbdjs-book-step-num { font-size: 0; }

/* ---------- Sidebar summary ---------- */
.dbdjs-book-summary { padding: 18px; background: rgba(255,255,255,0.6); border-radius: 14px; border: 1px solid rgba(200,155,123,0.2); }
.dbdjs-book-summary-title { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--dbdjs-primary-dark); font-weight: 700; margin-bottom: 10px; }
.dbdjs-book-summary-row { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; font-size: 13px; border-bottom: 1px dashed rgba(200,155,123,0.25); }
.dbdjs-book-summary-row:last-child { border-bottom: 0; }
.dbdjs-book-summary-row span { color: var(--dbdjs-text-soft); }
.dbdjs-book-summary-row strong { color: var(--dbdjs-navy); font-weight: 600; text-align: right; }
.dbdjs-book-summary-price { color: var(--dbdjs-primary-dark) !important; font-family: "Playfair Display", serif; font-size: 16px; }

/* ---------- Stage ---------- */
.dbdjs-book-stage { padding: 36px 40px; min-height: 520px; position: relative; min-width: 0; }
.dbdjs-book-step { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.dbdjs-book-step-head h3 { font-size: 26px; margin-bottom: 6px; }
.dbdjs-book-step-head p  { margin: 0; color: var(--dbdjs-text-soft); }

/* ---------- Loading ---------- */
.dbdjs-book-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 60px 20px; color: var(--dbdjs-text-soft); }
.dbdjs-book-loading-text { font-size: 13px; }
.dbdjs-book-spinner {
	width: 32px; height: 32px; border-radius: 50%;
	border: 3px solid var(--dbdjs-line); border-top-color: var(--dbdjs-primary);
	animation: dbdjs-spin 0.8s linear infinite;
}
@keyframes dbdjs-spin { to { transform: rotate(360deg); } }

/* ---------- Category chips ---------- */
.dbdjs-book-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dbdjs-chip-btn {
	padding: 8px 18px; border-radius: 24px;
	background: #fff; border: 1.5px solid var(--dbdjs-line);
	color: var(--dbdjs-text-soft); font-size: 13px; font-weight: 600;
	cursor: pointer; font-family: inherit;
	transition: all 0.18s ease;
	--chip-color: var(--dbdjs-primary);
}
.dbdjs-chip-btn:hover { border-color: var(--chip-color); color: var(--dbdjs-navy); }
.dbdjs-chip-btn.is-active {
	background: linear-gradient(135deg, var(--dbdjs-navy), var(--dbdjs-navy-light));
	color: #fff; border-color: transparent;
	box-shadow: 0 4px 14px rgba(26,33,64,0.25);
}

/* ---------- Service cards ---------- */
.dbdjs-book-svcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.dbdjs-book-svc {
	display: flex; flex-direction: column; text-align: left;
	background: #fff; border: 1.5px solid var(--dbdjs-line);
	border-radius: 16px; overflow: hidden;
	cursor: pointer; font-family: inherit;
	transition: transform 0.18s ease, box-shadow 0.2s ease, border-color 0.2s ease;
	padding: 0;
}
.dbdjs-book-svc:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(26,33,64,0.12); border-color: var(--dbdjs-primary-light); }
.dbdjs-book-svc.is-active {
	border-color: var(--dbdjs-primary); background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%);
	box-shadow: 0 8px 28px rgba(200,155,123,0.25);
}
.dbdjs-book-svc-img { height: 120px; background-size: cover; background-position: center; background-color: #F5EDDF; display: flex; align-items: center; justify-content: center; position: relative; }
.dbdjs-book-svc-body { padding: 16px 18px; flex: 1; display: flex; flex-direction: column; gap: 5px; }
.dbdjs-book-svc-cat { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; }
.dbdjs-book-svc-name { font-family: "Playfair Display", serif; font-size: 18px; font-weight: 600; color: var(--dbdjs-navy); }
.dbdjs-book-svc-desc { color: var(--dbdjs-text-soft); font-size: 13px; flex: 1; }
.dbdjs-book-svc-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--dbdjs-line); font-size: 12px; color: var(--dbdjs-text-soft); }
.dbdjs-book-svc-price { font-family: "Playfair Display", serif; font-weight: 700; color: var(--dbdjs-primary); font-size: 18px; }

/* ---------- Staff cards ---------- */
.dbdjs-book-staffs { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.dbdjs-book-staff {
	background: #fff; border: 1.5px solid var(--dbdjs-line);
	border-radius: 16px; padding: 20px 18px;
	text-align: center; cursor: pointer; font-family: inherit;
	transition: all 0.18s ease;
	display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.dbdjs-book-staff:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(26,33,64,0.10); border-color: var(--dbdjs-primary-light); }
.dbdjs-book-staff.is-active {
	border-color: var(--dbdjs-primary); background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%);
	box-shadow: 0 8px 24px rgba(200,155,123,0.25);
}
.dbdjs-book-staff-avatar {
	width: 72px; height: 72px; border-radius: 50%;
	background: linear-gradient(135deg, var(--dbdjs-primary), var(--dbdjs-primary-light));
	background-size: cover; background-position: center;
	color: #fff; font-family: "Playfair Display", serif; font-size: 26px; font-weight: 600;
	display: flex; align-items: center; justify-content: center; margin-bottom: 10px;
	box-shadow: 0 8px 20px rgba(200,155,123,0.35);
}
.dbdjs-book-staff-name { font-family: "Playfair Display", serif; font-size: 17px; font-weight: 600; color: var(--dbdjs-navy); }
.dbdjs-book-staff-title { font-size: 11px; text-transform: uppercase; letter-spacing: 1.2px; color: var(--dbdjs-primary); font-weight: 600; }
.dbdjs-book-staff-bio { font-size: 12px; color: var(--dbdjs-text-soft); margin-top: 8px; }

/* ---------- Days ---------- */
.dbdjs-book-days { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x mandatory; }
.dbdjs-book-days::-webkit-scrollbar { height: 6px; }
.dbdjs-book-days::-webkit-scrollbar-thumb { background: var(--dbdjs-line); border-radius: 3px; }
.dbdjs-book-day {
	background: #fff; border: 1.5px solid var(--dbdjs-line);
	border-radius: 14px; padding: 12px 8px;
	min-width: 72px; cursor: pointer; font-family: inherit;
	display: flex; flex-direction: column; align-items: center; gap: 2px;
	transition: all 0.15s ease; scroll-snap-align: start;
}
.dbdjs-book-day:hover { border-color: var(--dbdjs-primary-light); transform: translateY(-2px); }
.dbdjs-book-day.is-active { background: linear-gradient(135deg, var(--dbdjs-navy), var(--dbdjs-navy-light)); border-color: transparent; color: #fff; box-shadow: 0 6px 18px rgba(26,33,64,0.28); }
.dbdjs-book-day-wd { font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; opacity: 0.7; }
.dbdjs-book-day-num { font-family: "Playfair Display", serif; font-size: 24px; font-weight: 600; line-height: 1; }
.dbdjs-book-day-mo { font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; opacity: 0.6; }

/* ---------- Slots ---------- */
.dbdjs-book-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; min-height: 100px; }
.dbdjs-book-slot {
	padding: 12px 8px; background: #fff;
	border: 1.5px solid var(--dbdjs-line); border-radius: 10px;
	font-size: 14px; font-weight: 600; color: var(--dbdjs-navy);
	cursor: pointer; font-family: inherit;
	transition: all 0.15s ease;
}
.dbdjs-book-slot:hover { border-color: var(--dbdjs-primary); background: linear-gradient(135deg, #FBF6EF, #fff); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(200,155,123,0.2); }

/* ---------- Form ---------- */
.dbdjs-book-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dbdjs-book-field { display: flex; flex-direction: column; gap: 6px; }
.dbdjs-book-field--full { grid-column: 1 / -1; }
.dbdjs-book-field label { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 700; color: var(--dbdjs-text-soft); }
.dbdjs-book-field input, .dbdjs-book-field textarea {
	width: 100%; padding: 12px 14px;
	border: 1.5px solid var(--dbdjs-line); border-radius: 10px;
	background: #fff; font-size: 15px; color: var(--dbdjs-text);
	font-family: inherit; transition: all 0.15s ease;
	resize: vertical;
}
.dbdjs-book-field input:focus, .dbdjs-book-field textarea:focus {
	outline: none; border-color: var(--dbdjs-primary);
	box-shadow: 0 0 0 4px rgba(200,155,123,0.12);
}

/* ---------- Actions ---------- */
.dbdjs-book-actions { display: flex; justify-content: space-between; gap: 10px; padding-top: 16px; margin-top: 8px; border-top: 1px solid var(--dbdjs-line); }
.dbdjs-book-btn {
	padding: 12px 22px; border-radius: 10px; font-size: 14px; font-weight: 600;
	cursor: pointer; border: 1.5px solid transparent;
	font-family: inherit; letter-spacing: 0.2px;
	transition: all 0.15s ease;
}
.dbdjs-book-btn--primary { background: linear-gradient(135deg, var(--dbdjs-primary), var(--dbdjs-primary-dark)); color: #fff; box-shadow: 0 8px 22px rgba(200,155,123,0.35); }
.dbdjs-book-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 10px 28px rgba(200,155,123,0.45); }
.dbdjs-book-btn--ghost { background: #fff; color: var(--dbdjs-navy); border-color: var(--dbdjs-line); }
.dbdjs-book-btn--ghost:hover { background: #FBF6EF; border-color: var(--dbdjs-primary-light); }

/* ---------- Review ---------- */
.dbdjs-book-review { background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%); border: 1px solid var(--dbdjs-line); border-radius: 16px; padding: 20px 24px; }
.dbdjs-book-review-row { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px dashed var(--dbdjs-line); gap: 12px; }
.dbdjs-book-review-row:last-child { border-bottom: 0; }
.dbdjs-book-review-row span { color: var(--dbdjs-text-soft); font-size: 12px; text-transform: uppercase; letter-spacing: 1.2px; font-weight: 600; align-self: center; }
.dbdjs-book-review-row strong { color: var(--dbdjs-navy); font-weight: 600; text-align: right; }
.dbdjs-book-review-row--total { border-top: 2px solid var(--dbdjs-primary); border-bottom: 0; margin-top: 8px; padding-top: 16px; }
.dbdjs-book-review-row--total strong { font-family: "Playfair Display", serif; font-size: 24px; color: var(--dbdjs-primary); }

/* ---------- Success ---------- */
.dbdjs-book-done { text-align: center; padding: 40px 20px; }
.dbdjs-book-done-check { width: 90px; height: 90px; margin: 0 auto 20px; animation: dbdjs-pop 0.5s ease; }
.dbdjs-book-done-check svg { width: 100%; height: 100%; }
@keyframes dbdjs-pop { 0% { transform: scale(0.5); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
.dbdjs-book-done h3 { font-size: 32px; margin: 0 0 10px; }
.dbdjs-book-done p  { color: var(--dbdjs-text-soft); max-width: 460px; margin: 0 auto 20px; font-size: 15px; }
.dbdjs-book-done-ref { display: inline-block; padding: 10px 20px; background: #FBF6EF; border-radius: 12px; color: var(--dbdjs-text-soft); font-size: 13px; margin-bottom: 24px; }
.dbdjs-book-done-ref strong { font-family: "SF Mono", Consolas, monospace; color: var(--dbdjs-primary); margin-left: 8px; }

/* ---------- Empty ---------- */
.dbdjs-book-empty { text-align: center; padding: 40px 20px; color: var(--dbdjs-text-soft); font-size: 14px; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.dbdjs-book-shell { grid-template-columns: 1fr; }
	.dbdjs-book-side { border-right: 0; border-bottom: 1px solid var(--dbdjs-line); padding: 24px; }
	.dbdjs-book-steps { display: flex; overflow-x: auto; padding-bottom: 4px; margin-bottom: 16px; }
	.dbdjs-book-steps li { flex-direction: column; padding: 6px 12px; text-align: center; min-width: 80px; }
	.dbdjs-book-steps li:not(:last-child)::after { display: none; }
	.dbdjs-book-step-label { font-size: 11px; }
	.dbdjs-book-stage { padding: 24px 20px; }
	.dbdjs-book-hero-title { font-size: 30px; }
	.dbdjs-book-form { grid-template-columns: 1fr; }
	.dbdjs-book-intake-form { grid-template-columns: 1fr; }
	.dbdjs-book-choice-cards { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
	.dbdjs-book { padding: 24px 12px; }
	.dbdjs-book-hero-title { font-size: 24px; }
	.dbdjs-book-hero-sub { font-size: 14px; }
	.dbdjs-book-stage { padding: 18px 14px; }
	.dbdjs-book-step-head h3 { font-size: 21px; }
	.dbdjs-book-svcs, .dbdjs-book-staffs { grid-template-columns: 1fr; }
	.dbdjs-book-style-cards { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
	.dbdjs-book-actions { flex-wrap: wrap; }
	.dbdjs-book-actions .dbdjs-book-btn { flex: 1; text-align: center; }
	.dbdjs-book-review-row { flex-direction: column; gap: 2px; }
	.dbdjs-book-review-row strong { text-align: left; }
	.dbdjs-book-info-img { width: 64px; height: 64px; }
	.dbdjs-book-info-reviews-list { grid-template-columns: 1fr; }
}

/* =================================================================
   NEW v1.1 ADDITIONS
   ================================================================= */

/* ---------- Price display modes ---------- */
.dbdjs-price-quote {
	background: #FBF6EF;
	color: var(--dbdjs-primary-dark);
	padding: 2px 10px;
	border-radius: 12px;
	font-size: 13px;
	font-weight: 600;
}
.dbdjs-price-from { font-weight: 500; }
.dbdjs-book-svc-price .dbdjs-price-quote { font-size: 12px; padding: 1px 8px; }

/* ---------- File upload / dropzone ---------- */
.dbdjs-book-upload-wrap { margin: 20px 0; }
.dbdjs-book-upload-label { display: flex; flex-direction: column; gap: 3px; font-size: 14px; font-weight: 500; color: var(--dbdjs-text); margin-bottom: 8px; }
.dbdjs-book-upload-hint { font-size: 12px; color: var(--dbdjs-text-soft); font-weight: 400; }
.dbdjs-book-dropzone {
	border: 2px dashed var(--dbdjs-line);
	border-radius: 12px;
	padding: 24px;
	text-align: center;
	cursor: pointer;
	transition: border-color .2s, background .2s;
}
.dbdjs-book-dropzone:hover,
.dbdjs-book-dropzone.is-over { border-color: var(--dbdjs-primary); background: rgba(200,155,123,0.05); }
.dbdjs-book-dropzone-icon { font-size: 28px; margin-bottom: 6px; }
.dbdjs-book-dropzone-text { font-size: 13px; color: var(--dbdjs-text-soft); }
.dbdjs-book-file-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.dbdjs-book-file-item {
	display: flex; align-items: center; gap: 8px;
	padding: 6px 10px; background: #FBF6EF; border-radius: 8px;
	font-size: 12px; max-width: 220px;
}
.dbdjs-book-file-item.is-uploading { opacity: .7; }
.dbdjs-book-file-item.is-error { background: #FEF2F2; }
.dbdjs-book-file-thumb { width: 32px; height: 32px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.dbdjs-book-file-name { font-size: 12px; color: var(--dbdjs-text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; }
.dbdjs-book-file-ok { color: #3D9970; font-size: 14px; }
.dbdjs-book-file-err { color: #B44856; font-size: 11px; }

/* =================================================================
   v1.3 ADDITIONS — intake form builder, estimate/lead choice, tooltips
   ================================================================= */

/* ---------- Tooltips ("?" help text) ---------- */
.dbdjs-tooltip {
	position: relative; display: inline-flex; margin-left: 6px;
	vertical-align: middle; outline: none;
}
.dbdjs-tooltip-icon {
	width: 16px; height: 16px; border-radius: 50%;
	background: var(--dbdjs-line); color: var(--dbdjs-text-soft);
	font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center;
	cursor: help; line-height: 1; user-select: none;
}
.dbdjs-tooltip-text {
	position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%) translateY(4px);
	width: max-content; max-width: 220px;
	background: var(--dbdjs-navy); color: #fff;
	font-size: 12px; font-weight: 400; line-height: 1.4; letter-spacing: normal; text-transform: none;
	padding: 8px 12px; border-radius: 8px;
	opacity: 0; pointer-events: none; transition: opacity .15s ease, transform .15s ease;
	z-index: 20; box-shadow: 0 8px 24px rgba(26,33,64,.25);
}
.dbdjs-tooltip-text::after {
	content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
	border: 5px solid transparent; border-top-color: var(--dbdjs-navy);
}
.dbdjs-tooltip:hover .dbdjs-tooltip-text,
.dbdjs-tooltip:focus .dbdjs-tooltip-text,
.dbdjs-tooltip:focus-within .dbdjs-tooltip-text {
	opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: auto;
}

/* ---------- Intake form fields ---------- */
.dbdjs-book-intake-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 14px; }
.dbdjs-book-intake-empty { color: var(--dbdjs-text-soft); grid-column: 1 / -1; margin: 0; }
.dbdjs-book-field-label {
	display: flex; align-items: center; font-size: 11px; letter-spacing: 1.5px;
	text-transform: uppercase; font-weight: 700; color: var(--dbdjs-text-soft); margin-bottom: 6px;
}
.dbdjs-required { color: #B44856; margin-left: 3px; }
.dbdjs-book-intake-form input[type=text],
.dbdjs-book-intake-form input[type=number],
.dbdjs-book-intake-form textarea,
.dbdjs-book-intake-form select {
	width: 100%; padding: 12px 14px;
	border: 1.5px solid var(--dbdjs-line); border-radius: 10px;
	background: #fff; font-size: 15px; color: var(--dbdjs-text);
	font-family: inherit; transition: all .15s ease; resize: vertical; appearance: none;
}
.dbdjs-book-intake-form select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236C6E7A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; padding-right: 36px;
}
.dbdjs-book-intake-form input:focus,
.dbdjs-book-intake-form textarea:focus,
.dbdjs-book-intake-form select:focus {
	outline: none; border-color: var(--dbdjs-primary); box-shadow: 0 0 0 4px rgba(200,155,123,0.12);
}
.dbdjs-book-field.has-error input,
.dbdjs-book-field.has-error textarea,
.dbdjs-book-field.has-error select {
	border-color: #B44856; box-shadow: 0 0 0 3px rgba(180,72,86,0.12);
}

/* Radio / checkbox groups */
.dbdjs-book-radio-group,
.dbdjs-book-checkbox-group { display: flex; flex-wrap: wrap; gap: 10px; }
.dbdjs-book-radio,
.dbdjs-book-checkbox {
	display: flex; align-items: center; gap: 8px;
	padding: 10px 16px; border: 1.5px solid var(--dbdjs-line); border-radius: 10px;
	background: #fff; font-size: 14px; cursor: pointer; transition: all .15s ease;
}
.dbdjs-book-radio:hover,
.dbdjs-book-checkbox:hover { border-color: var(--dbdjs-primary-light); }
.dbdjs-book-radio input,
.dbdjs-book-checkbox input { accent-color: var(--dbdjs-primary); width: 16px; height: 16px; flex-shrink: 0; }
.dbdjs-book-radio:has(input:checked),
.dbdjs-book-checkbox:has(input:checked) {
	border-color: var(--dbdjs-primary); background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%);
}

/* Visual style-cards */
.dbdjs-book-style-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.dbdjs-book-style-card {
	display: flex; flex-direction: column; align-items: center; gap: 6px;
	padding: 16px 10px; background: #fff; border: 1.5px solid var(--dbdjs-line); border-radius: 12px;
	cursor: pointer; font-family: inherit; transition: all .15s ease; text-align: center;
}
.dbdjs-book-style-card:hover { border-color: var(--dbdjs-primary-light); transform: translateY(-2px); }
.dbdjs-book-style-card.is-active {
	border-color: var(--dbdjs-primary); background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%);
	box-shadow: 0 6px 18px rgba(200,155,123,0.25);
}
.dbdjs-book-style-card-icon { font-size: 26px; line-height: 1; }
.dbdjs-book-style-card-label { font-size: 12px; font-weight: 600; color: var(--dbdjs-navy); }

/* ---------- Service info panel (description / FAQs / reviews) ---------- */
.dbdjs-book-info {
	background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%);
	border: 1px solid var(--dbdjs-line); border-radius: 16px;
	padding: 18px 20px; display: flex; flex-direction: column; gap: 14px;
}
.dbdjs-book-info-head { display: flex; gap: 14px; align-items: flex-start; }
.dbdjs-book-info-img {
	width: 84px; height: 84px; border-radius: 12px; flex-shrink: 0;
	background-size: cover; background-position: center; background-color: #F5EDDF;
}
.dbdjs-book-info-headtext { min-width: 0; }
.dbdjs-book-info-name { font-family: "Playfair Display", serif; font-size: 19px; font-weight: 600; color: var(--dbdjs-navy); }
.dbdjs-book-info-desc { margin: 4px 0 0; color: var(--dbdjs-text-soft); font-size: 13px; line-height: 1.5; }
.dbdjs-book-info-more { border-top: 1px dashed var(--dbdjs-line); padding-top: 12px; }
.dbdjs-book-info-more summary,
.dbdjs-book-faq-item summary {
	cursor: pointer; font-weight: 600; color: var(--dbdjs-primary-dark);
	font-size: 13px; list-style: none; display: flex; align-items: center; gap: 6px;
}
.dbdjs-book-info-more summary::-webkit-details-marker,
.dbdjs-book-faq-item summary::-webkit-details-marker { display: none; }
.dbdjs-book-info-more summary::before { content: "＋"; font-size: 12px; }
.dbdjs-book-info-more[open] summary::before { content: "－"; }
.dbdjs-book-info-longdesc {
	margin-top: 10px; font-size: 13px; line-height: 1.7; color: var(--dbdjs-text);
	max-width: 68ch;
}
.dbdjs-book-info-longdesc p { margin: 0 0 10px; }
.dbdjs-book-info-faqs { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.dbdjs-book-faq-item {
	background: #fff; border: 1px solid var(--dbdjs-line); border-radius: 10px; padding: 10px 14px;
}
.dbdjs-book-faq-item summary::before { content: "?"; width: 16px; height: 16px; border-radius: 50%; background: var(--dbdjs-line); color: var(--dbdjs-text-soft); font-size: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.dbdjs-book-faq-answer { margin-top: 8px; font-size: 13px; color: var(--dbdjs-text-soft); line-height: 1.6; }
.dbdjs-book-info-reviews { border-top: 1px dashed var(--dbdjs-line); padding-top: 12px; }
.dbdjs-book-info-reviews-title { font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--dbdjs-primary-dark); margin-bottom: 10px; }
.dbdjs-book-info-reviews-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.dbdjs-book-info-review { background: #fff; border: 1px solid var(--dbdjs-line); border-radius: 12px; padding: 12px 14px; }
.dbdjs-book-info-review-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.dbdjs-book-info-review-avatar { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.dbdjs-book-info-review-avatar--initial {
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(135deg, var(--dbdjs-primary), var(--dbdjs-navy)); color: #fff;
	font-size: 13px; font-weight: 700;
}
.dbdjs-book-info-review-name { font-size: 12px; font-weight: 600; color: var(--dbdjs-navy); }
.dbdjs-book-info-review-stars { font-size: 11px; letter-spacing: 1px; }
.dbdjs-book-star--filled { color: var(--dbdjs-primary); }
.dbdjs-book-star { color: var(--dbdjs-line); }
.dbdjs-book-info-review-text { margin: 0; font-size: 12px; color: var(--dbdjs-text-soft); line-height: 1.5; }

/* ---------- Estimate/lead choice cards ---------- */
.dbdjs-book-choice-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dbdjs-book-choice-card {
	display: flex; flex-direction: column; align-items: flex-start; gap: 8px; text-align: left;
	background: #fff; border: 1.5px solid var(--dbdjs-line); border-radius: 16px;
	padding: 24px 22px; cursor: pointer; font-family: inherit;
	transition: transform .18s ease, box-shadow .2s ease, border-color .2s ease;
}
.dbdjs-book-choice-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(26,33,64,0.12); border-color: var(--dbdjs-primary-light); }
.dbdjs-book-choice-card.is-active {
	border-color: var(--dbdjs-primary); background: linear-gradient(180deg, #FBF6EF 0%, #fff 100%);
	box-shadow: 0 8px 28px rgba(200,155,123,0.25);
}
.dbdjs-book-choice-icon { font-size: 30px; }
.dbdjs-book-choice-title { font-family: "Playfair Display", serif; font-size: 18px; font-weight: 600; color: var(--dbdjs-navy); }
.dbdjs-book-choice-desc { font-size: 13px; color: var(--dbdjs-text-soft); line-height: 1.5; }

/* ---------- Before/After gallery ---------- */
.dbd-js-gallery {
	display: grid;
	grid-template-columns: repeat(var(--dbd-cols, 3), 1fr);
	gap: 20px;
}
@media (max-width: 760px) { .dbd-js-gallery { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .dbd-js-gallery { grid-template-columns: 1fr; } }
.dbd-js-ba-wrap { border-radius: 12px; overflow: hidden; box-shadow: 0 2px 16px rgba(26,33,64,.08); }
.dbd-js-ba-slider { position: relative; aspect-ratio: 4/3; overflow: hidden; cursor: ew-resize; background: #EFE6DA; }
.dbd-js-ba-before,
.dbd-js-ba-after { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; user-select: none; }
.dbd-js-ba-before { z-index: 1; }
.dbd-js-ba-after  { z-index: 0; }
.dbd-js-ba-handle {
	position: absolute; top: 0; left: 50%; z-index: 3;
	height: 100%; width: 40px; cursor: ew-resize;
	transform: translateX(-50%);
	display: flex; align-items: center; justify-content: center;
}
.dbd-js-ba-handle::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 2px;
	background: #fff;
	transform: translateX(-50%);
	box-shadow: 0 0 6px rgba(0,0,0,0.3);
}
.dbd-js-ba-arrow {
	position: relative;
	z-index: 1;
	width: 32px; height: 32px;
	background: #fff;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 2px 8px rgba(0,0,0,0.2);
	flex-shrink: 0;
}
.dbd-js-ba-arrow::before,
.dbd-js-ba-arrow::after {
	content: '';
	display: block;
	width: 6px; height: 6px;
	border-top: 2px solid #C89B7B;
	border-right: 2px solid #C89B7B;
}
.dbd-js-ba-arrow--left::before { transform: rotate(225deg) translateX(1px); }
.dbd-js-ba-arrow--right::after { transform: rotate(45deg) translateX(-1px); }
.dbd-js-ba-arrow--left::after,
.dbd-js-ba-arrow--right::before { display: none; }
.dbd-js-ba-labels {
	position: absolute; bottom: 10px; left: 0; right: 0;
	z-index: 2; display: flex; justify-content: space-between;
	padding: 0 12px; pointer-events: none;
}
.dbd-js-ba-labels span {
	background: rgba(26,33,64,.7);
	color: #fff; font-size: 11px;
	padding: 3px 10px; border-radius: 20px;
	font-weight: 600; letter-spacing: 0.5px;
	text-transform: uppercase;
}
.dbd-js-ba-caption { font-size: 13px; color: #666; text-align: center; margin: 8px 0 0; padding: 0 8px; }
.dbd-js-gallery-empty { color: #888; font-size: 14px; }

/* ---------- Chat widget (floating) ---------- */
.dbd-js-chat-root {
	position: fixed; bottom: 24px; right: 24px; z-index: 99999;
	display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
}
.dbd-js-chat-bubble {
	width: 56px; height: 56px; border-radius: 50%;
	background: var(--chat-primary, #C89B7B);
	border: none; cursor: pointer; box-shadow: 0 4px 24px rgba(200,155,123,0.5);
	display: flex; align-items: center; justify-content: center; color: #fff;
	transition: transform .2s, box-shadow .2s;
	position: relative;
}
.dbd-js-chat-bubble:hover { transform: scale(1.07); box-shadow: 0 6px 32px rgba(200,155,123,0.65); }
.dbd-js-chat-dot {
	position: absolute; top: 6px; right: 6px;
	width: 10px; height: 10px; background: #e74c3c;
	border-radius: 50%; border: 2px solid #fff;
}
.dbd-js-chat-panel {
	width: min(380px, calc(100vw - 32px));
	max-height: min(560px, calc(100vh - 100px));
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 16px 60px rgba(26,33,64,.18);
	display: flex; flex-direction: column; overflow: hidden;
	animation: dbd-chat-in .25s ease;
}
/* [hidden] must win over the flex display above, or the panel never minimizes. */
.dbd-js-chat-panel[hidden] { display: none !important; }
@keyframes dbd-chat-in {
	from { opacity: 0; transform: translateY(16px) scale(.96); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}
.dbd-js-chat-header {
	background: linear-gradient(135deg, var(--chat-navy, #1A2140) 0%, var(--chat-primary, #C89B7B) 100%);
	padding: 16px 18px;
	display: flex; justify-content: space-between; align-items: center;
	color: #fff;
}
.dbd-js-chat-header-info { display: flex; align-items: center; gap: 10px; }
.dbd-js-chat-header-gem svg { stroke: rgba(255,255,255,.9); }
.dbd-js-chat-header-gem--logo {
	width: 32px; height: 32px; border-radius: 50%; overflow: hidden;
	background: rgba(255,255,255,.15); flex-shrink: 0;
	display: flex; align-items: center; justify-content: center;
}
.dbd-js-chat-header-gem--logo img { width: 100%; height: 100%; object-fit: cover; }
.dbd-js-chat-header-name { font-size: 14px; font-weight: 600; }
.dbd-js-chat-header-status { font-size: 11px; opacity: .8; display: flex; align-items: center; gap: 5px; }
.dbd-js-chat-online-dot { width: 7px; height: 7px; background: #3D9970; border-radius: 50%; flex-shrink: 0; }
.dbd-js-chat-close {
	background: transparent; border: none; cursor: pointer;
	color: rgba(255,255,255,.7); width: 32px; height: 32px;
	display: flex; align-items: center; justify-content: center;
	border-radius: 50%; transition: background .15s;
}
.dbd-js-chat-close:hover { background: rgba(255,255,255,.15); color: #fff; }
.dbd-js-chat-messages {
	flex: 1; overflow-y: auto; padding: 16px;
	display: flex; flex-direction: column; gap: 10px;
	scroll-behavior: smooth;
}
.dbd-js-chat-init, .dbd-js-chat-loading { display: flex; align-items: center; justify-content: center; padding: 32px; }
.dbd-js-chat-init[hidden], .dbd-js-chat-loading[hidden] { display: none !important; }
.dbd-js-chat-dots { display: flex; gap: 5px; }
.dbd-js-chat-dots span {
	width: 8px; height: 8px; background: #C89B7B; border-radius: 50%;
	animation: dbd-dot 1.4s ease-in-out infinite;
}
.dbd-js-chat-dots span:nth-child(1) { animation-delay: 0s; }
.dbd-js-chat-dots span:nth-child(2) { animation-delay: .2s; }
.dbd-js-chat-dots span:nth-child(3) { animation-delay: .4s; }
@keyframes dbd-dot { 0%,80%,100% { opacity:.2; transform:scale(.8); } 40% { opacity:1; transform:scale(1); } }
.dbd-js-chat-msg { display: flex; flex-direction: column; gap: 2px; }
.dbd-js-chat-msg--visitor { align-items: flex-end; }
.dbd-js-chat-msg--ai, .dbd-js-chat-msg--staff { align-items: flex-start; }
.dbd-js-chat-msg-label { font-size: 10px; font-weight: 600; color: #aaa; text-transform: uppercase; letter-spacing: .5px; }
.dbd-js-chat-msg-bubble {
	padding: 9px 13px; border-radius: 12px;
	max-width: 80%; font-size: 13px; line-height: 1.5;
	word-break: break-word; white-space: pre-wrap;
}
.dbd-js-chat-msg--visitor .dbd-js-chat-msg-bubble { background: var(--chat-navy, #1A2140); color: #fff; border-radius: 12px 12px 0 12px; }
.dbd-js-chat-msg--ai .dbd-js-chat-msg-bubble { background: #F6F1EB; color: #2b2b2b; border-radius: 12px 12px 12px 0; }
.dbd-js-chat-msg--staff .dbd-js-chat-msg-bubble { background: var(--chat-primary, #C89B7B); color: #fff; border-radius: 12px 12px 12px 0; }
.dbd-js-chat-msg-time { font-size: 10px; color: #bbb; }
.dbd-js-chat-attachment { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: underline; font-weight: 600; }
.dbd-js-chat-msg-bubble a { color: inherit; text-decoration: underline; word-break: break-all; }
.dbd-js-chat-intro { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.dbd-js-chat-intro[hidden] { display: none !important; }
.dbd-js-chat-greeting { font-size: 14px; font-weight: 500; color: #1A2140; margin: 0; }
.dbd-js-chat-input {
	width: 100%; border: 1px solid #E8DDD4; border-radius: 8px;
	padding: 9px 12px; font-size: 13px; font-family: inherit;
	box-sizing: border-box; outline: none;
	transition: border-color .2s;
}
.dbd-js-chat-input:focus { border-color: #C89B7B; }
.dbd-js-chat-intro-error {
	font-size: 12px; color: #B44856; background: #FBEAEA;
	border-radius: 6px; padding: 6px 10px;
}
.dbd-js-chat-intro-error[hidden] { display: none !important; }
.dbd-js-chat-start-btn {
	background: var(--chat-primary, #C89B7B);
	color: #fff; border: none; cursor: pointer;
	padding: 10px 18px; border-radius: 8px;
	font-size: 13px; font-weight: 600; font-family: inherit;
	transition: filter .2s;
}
.dbd-js-chat-start-btn:hover { filter: brightness(1.08); }
.dbd-js-chat-compose {
	padding: 10px 12px;
	border-top: 1px solid #F2E8DC;
	display: flex; gap: 8px; align-items: flex-end;
}
.dbd-js-chat-compose[hidden] { display: none !important; }
.dbd-js-chat-textarea {
	flex: 1; border: 1px solid #E8DDD4; border-radius: 8px;
	padding: 8px 12px; font-size: 13px; font-family: inherit;
	resize: none; outline: none; transition: border-color .2s;
	min-height: 38px; max-height: 120px;
}
.dbd-js-chat-textarea:focus { border-color: #C89B7B; }
.dbd-js-chat-send {
	width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
	background: var(--chat-primary, #C89B7B); border: none; cursor: pointer;
	color: #fff; display: flex; align-items: center; justify-content: center;
	transition: filter .2s;
}
.dbd-js-chat-send:hover { filter: brightness(1.1); }
.dbd-js-chat-attach-btn {
	width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
	background: #F6F1EB; border: none; cursor: pointer; font-size: 16px;
	color: #6C6E7A; display: flex; align-items: center; justify-content: center;
	transition: background .2s;
}
.dbd-js-chat-attach-btn:hover { background: #F2E8DC; }
.dbd-js-chat-attach-btn:disabled { cursor: default; }
.dbd-js-chat-handoff {
	padding: 12px 16px; background: #FBF6EF;
	border-top: 1px solid #F2E8DC; font-size: 13px; color: #666;
	text-align: center;
}
.dbd-js-chat-handoff[hidden] { display: none !important; }
.dbd-js-chat-handoff p { margin: 0; }
.dbd-js-chat-error { text-align: center; color: #B44856; font-size: 13px; padding: 20px; }

/* Inline chat embed */
.dbd-js-chat-inline {
	border-radius: 16px; border: 1px solid #E8DDD4;
	overflow: hidden; display: flex; flex-direction: column;
}

/* Chat widget — small screens */
@media (max-width: 480px) {
	.dbd-js-chat-root { bottom: 14px; right: 14px; }
	.dbd-js-chat-bubble { width: 50px; height: 50px; }
	.dbd-js-chat-panel { width: calc(100vw - 24px); max-height: calc(100vh - 90px); border-radius: 14px; }
}

/* ---- WhatsApp chat button ---- */
.dbd-js-chat-whatsapp-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 10px 16px;
  background: #25D366;
  color: #fff !important;
  border-radius: 10px;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  justify-content: center;
  transition: background .15s, transform .1s;
}
.dbd-js-chat-whatsapp-btn:hover { background: #1ebe5d; transform: translateY(-1px); }
.dbd-js-chat-whatsapp-btn svg { flex-shrink: 0; }

/* ---- Service page — Reviews ---- */
.sp-reviews-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
  margin-top: 20px;
}
.sp-review-card {
  background: #fff;
  border: 1px solid #F2E8DC;
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sp-review-top { display: flex; align-items: center; gap: 12px; }
.sp-review-avatar img {
  width: 48px; height: 48px; border-radius: 50%; object-fit: cover;
  border: 2px solid #F2E8DC;
}
.sp-review-avatar-initial {
  width: 48px; height: 48px; border-radius: 50%;
  background: linear-gradient(135deg, #C89B7B, #1A2140);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 700;
}
.sp-review-name { font-weight: 600; color: #1A2140; font-size: 15px; }
.sp-review-stars { font-size: 14px; letter-spacing: 1px; }
.sp-star--filled { color: #C89B7B; }
.sp-star { color: #E8DDD4; }
.sp-review-text {
  font-size: 14px; color: #555; line-height: 1.6;
  margin: 0; font-style: italic;
}

/* ---- Chat widget error state ---- */
.dbd-js-chat-error-wrap { padding: 16px; text-align: center; }
.dbd-js-chat-error { color: #B44856; font-size: 13px; margin: 0 0 10px; }
.dbd-js-chat-retry-btn {
  background: #F2E8DC; border: none; border-radius: 8px;
  padding: 8px 16px; font-size: 13px; cursor: pointer; color: #1A2140;
  transition: background .15s;
}
.dbd-js-chat-retry-btn:hover { background: #E8DDD4; }
