/* Tickabell - front end.
 *
 * Every component draws its own surface from the tokens below, so it looks the same on any
 * theme. Light / dark / automatic comes from Settings -> General (a body class). Override any
 * --tb-* variable in your theme to restyle; --tickabell-brand is the accent from Settings.
 *
 * Buttons use !important for colours, borders and spacing: themes and page builders often
 * style every <button> with strong selectors, which would otherwise repaint the widget. */

/* ------------------------------------------------------------------ */
/* Tokens                                                              */
/* ------------------------------------------------------------------ */

/* Colours come in pairs: --tb-l-* for the light scheme and --tb-d-* for the dark one. A design
 * (Settings -> General) changes the pairs and the shape tokens; the scheme picks the pair. */
.tickabell,
.tickabell-standalone {
	--tb-l-bg: #ffffff;
	--tb-l-bg-soft: #f5f6f5;
	--tb-l-bg-sunken: #eef0ee;
	--tb-l-text: #16181a;
	--tb-l-muted: #686e72;
	--tb-l-faint: #a3a8ab;
	--tb-l-border: #e3e5e3;
	--tb-l-danger: #c0362c;
	--tb-l-ink: var(--tb-l-border);
	--tb-l-accent-text: var(--tickabell-brand-ink, var(--tb-accent));
	--tb-l-shadow-rgb: 16, 24, 20;
	--tb-d-bg: #151816;
	--tb-d-bg-soft: #1c201e;
	--tb-d-bg-sunken: #0f1110;
	--tb-d-text: #eef1ef;
	--tb-d-muted: #9ba39e;
	--tb-d-faint: #5f6763;
	--tb-d-border: #2a2f2c;
	--tb-d-danger: #ff8a7f;
	--tb-d-ink: var(--tb-d-border);
	--tb-d-accent-text: color-mix(in srgb, var(--tb-accent) 50%, #fff);

	--tb-accent: var(--tickabell-brand, #1f6f5c);
	--tb-on-accent: var(--tickabell-on-brand, #fff);
	--tb-accent-line: color-mix(in srgb, var(--tb-accent) 45%, transparent);
	--tb-success: #1f8a4c;
	--tb-radius-lg: 20px;
	--tb-radius: 14px;
	--tb-radius-sm: 10px;
	--tb-btn-radius: 999px;
	--tb-chip-radius: 999px;
	--tb-day-radius: 12px;
	--tb-head-weight: 700;
	--tb-ease: cubic-bezier(.2, .7, .2, 1);

	--tb-bg: var(--tb-l-bg);
	--tb-bg-soft: var(--tb-l-bg-soft);
	--tb-bg-sunken: var(--tb-l-bg-sunken);
	--tb-text: var(--tb-l-text);
	--tb-muted: var(--tb-l-muted);
	--tb-faint: var(--tb-l-faint);
	--tb-border: var(--tb-l-border);
	--tb-danger: var(--tb-l-danger);
	--tb-ink: var(--tb-l-ink);
	--tb-accent-text: var(--tb-l-accent-text);
	--tb-accent-soft: color-mix(in srgb, var(--tb-accent) 12%, transparent);
	--tb-shadow-sm: 0 1px 2px rgba(var(--tb-l-shadow-rgb), .06);
	--tb-shadow: 0 1px 2px rgba(var(--tb-l-shadow-rgb), .05), 0 12px 32px -8px rgba(var(--tb-l-shadow-rgb), .14);
	--tb-shadow-lg: 0 24px 60px -12px rgba(var(--tb-l-shadow-rgb), .28);
	box-sizing: border-box;
	color: var(--tb-text);
	font-family: var(--tb-font);
	-webkit-font-smoothing: antialiased;
}

.tickabell-scheme-dark .tickabell,
.tickabell-scheme-dark.tickabell-standalone {
	--tb-bg: var(--tb-d-bg);
	--tb-bg-soft: var(--tb-d-bg-soft);
	--tb-bg-sunken: var(--tb-d-bg-sunken);
	--tb-text: var(--tb-d-text);
	--tb-muted: var(--tb-d-muted);
	--tb-faint: var(--tb-d-faint);
	--tb-border: var(--tb-d-border);
	--tb-danger: var(--tb-d-danger);
	--tb-ink: var(--tb-d-ink);
	--tb-accent-text: var(--tb-d-accent-text);
	--tb-accent-soft: color-mix(in srgb, var(--tb-accent) 22%, transparent);
	--tb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
	--tb-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 16px 40px -12px rgba(0, 0, 0, .6);
	--tb-shadow-lg: 0 30px 70px -10px rgba(0, 0, 0, .75);
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	.tickabell-scheme-auto .tickabell,
	.tickabell-scheme-auto.tickabell-standalone {
		--tb-bg: var(--tb-d-bg);
		--tb-bg-soft: var(--tb-d-bg-soft);
		--tb-bg-sunken: var(--tb-d-bg-sunken);
		--tb-text: var(--tb-d-text);
		--tb-muted: var(--tb-d-muted);
		--tb-faint: var(--tb-d-faint);
		--tb-border: var(--tb-d-border);
		--tb-danger: var(--tb-d-danger);
		--tb-ink: var(--tb-d-ink);
		--tb-accent-text: var(--tb-d-accent-text);
		--tb-accent-soft: color-mix(in srgb, var(--tb-accent) 22%, transparent);
		--tb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
		--tb-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 16px 40px -12px rgba(0, 0, 0, .6);
		--tb-shadow-lg: 0 30px 70px -10px rgba(0, 0, 0, .75);
		color-scheme: dark;
	}
}

.tickabell *,
.tickabell *::before,
.tickabell *::after { box-sizing: inherit; }
.tickabell img { max-width: 100%; height: auto; display: block; }
.tickabell button { font: inherit; letter-spacing: inherit; }
.tickabell h2, .tickabell h3, .tickabell h4, .tickabell p { color: inherit; }
/* Themes colour headings, paragraphs and labels with their own rules; inside the plugin they
 * follow the plugin's colours (light / dark scheme) instead. */
.tickabell.tickabell :where(h1, h2, h3, h4, h5, h6, p, li, label, dt, dd, td, th, figcaption, legend, small, blockquote) { color: inherit; }
.tickabell :where(.tb-title, .tb-side__title, .tb-done h3, .tb-cal__month, .tb-times__date, .tb-hero__name, .tb-section__title, .tickabell-team__name, .tickabell-float__title),
.tickabell-standalone :is(h1, h2) { font-family: var(--tb-font-head); text-transform: var(--tb-head-case); }

/* ------------------------------------------------------------------ */
/* Buttons (extra specificity so theme link/button styles don't win)   */
/* ------------------------------------------------------------------ */

.tickabell .tickabell-btn,
.tickabell a.tickabell-btn,
.tickabell-standalone .tickabell-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	min-height: 46px !important; padding: .7em 1.35em !important; margin: 0;
	border: 1px solid var(--tb-accent) !important; border-radius: var(--tb-btn-radius) !important;
	background: var(--tb-accent) !important; color: var(--tb-on-accent) !important;
	font-weight: 600 !important; font-size: .95rem !important; line-height: 1.2 !important; text-decoration: none !important; text-transform: var(--tb-btn-case, none) !important; letter-spacing: var(--tb-btn-tracking, normal) !important;
	cursor: pointer; box-shadow: var(--tb-shadow-sm) !important;
	transition: transform .15s var(--tb-ease), filter .15s, background .15s, box-shadow .15s;
}
.tickabell a.tickabell-btn:hover, .tickabell .tickabell-btn:hover,
.tickabell-standalone .tickabell-btn:hover { filter: brightness(1.08); color: var(--tb-on-accent) !important; transform: translateY(-1px); }
.tickabell .tickabell-btn:active { transform: translateY(0); }
.tickabell .tickabell-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; filter: none; }
.tickabell .tickabell-btn.is-loading { cursor: wait; opacity: .8; }
.tickabell .tickabell-btn--ghost, .tickabell a.tickabell-btn--ghost {
	background: transparent !important; color: var(--tb-text) !important; border-color: var(--tb-border) !important; box-shadow: none !important;
}
.tickabell a.tickabell-btn--ghost:hover, .tickabell .tickabell-btn--ghost:hover { color: var(--tb-text) !important; background: var(--tb-bg-soft) !important; filter: none; }
.tickabell .tickabell-btn--block { width: 100% !important; }
.tickabell-standalone .tickabell-btn--danger, .tickabell .tickabell-btn--danger { background: #c0362c !important; border-color: #c0362c !important; color: #fff !important; }
.tickabell .tickabell-link {
	background: none !important; border: 0 !important; padding: 0 !important; color: var(--tb-accent-text) !important; font-weight: 600 !important;
	text-decoration: underline !important; text-underline-offset: 3px; cursor: pointer;
}
.tickabell :focus-visible, .tickabell-standalone :focus-visible { outline: 2px solid var(--tb-accent); outline-offset: 2px; }
.tickabell .tickabell-icon { flex: none; }

/* ------------------------------------------------------------------ */
/* Booking widget                                                      */
/* ------------------------------------------------------------------ */

/* Layout follows the space the widget gets (theme column, builder module), not the screen. */
.tickabell-booking { max-width: 1040px; margin-inline: auto; font-size: 15px; line-height: 1.5; container: tb-booking / inline-size; }

.tickabell .tb-shell {
	display: grid; grid-template-columns: 290px minmax(0, 1fr);
	background: var(--tb-bg); border: 1px solid var(--tb-border); border-radius: var(--tb-radius-lg);
	box-shadow: var(--tb-shadow); overflow: hidden; min-height: 560px;
}

/* Sidebar */
.tickabell .tb-side {
	display: flex; flex-direction: column; gap: 28px; padding: 30px 26px;
	background: var(--tb-bg-soft); border-right: 1px solid var(--tb-border);
}
.tickabell .tb-side__eyebrow { display: block; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--tb-accent-text); }
.tickabell .tb-side__title { display: block; margin-top: 4px; font-size: 20px; font-weight: var(--tb-head-weight); line-height: 1.25; }
.tickabell .tb-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; position: relative; }
.tickabell .tb-steps li { margin: 0; padding: 0; }
.tickabell .tb-steps li::marker { content: none; }
.tickabell .tb-stepbtn {
	display: flex; align-items: center; gap: 14px; width: 100% !important; padding: 10px 10px !important; margin: 0;
	background: transparent !important; border: 0 !important; border-radius: var(--tb-radius-sm) !important; text-align: left;
	color: var(--tb-muted) !important; cursor: default; transition: background .15s;
}
.tickabell .tb-stepbtn.is-done { cursor: pointer; color: var(--tb-text) !important; }
.tickabell .tb-stepbtn.is-done:hover { background: var(--tb-bg-sunken) !important; }
.tickabell .tb-stepbtn.is-current { color: var(--tb-text) !important; background: var(--tb-bg) !important; box-shadow: var(--tb-shadow-sm) !important; }
.tickabell .tb-stepnum {
	flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
	border: 1.5px solid var(--tb-border); background: var(--tb-bg); font-size: 13px; font-weight: 700; color: var(--tb-muted);
	transition: background .2s, border-color .2s, color .2s;
}
.tickabell .is-current .tb-stepnum { border-color: var(--tb-accent); color: var(--tb-accent-text); }
.tickabell .is-done .tb-stepnum { background: var(--tb-accent); border-color: var(--tb-accent); color: var(--tb-on-accent); }
.tickabell .tb-steptext { display: flex; flex-direction: column; min-width: 0; }
.tickabell .tb-steplabel { font-size: 13px; font-weight: 600; }
.tickabell .tb-stepvalue { font-size: 13px; color: var(--tb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tickabell .tb-side__foot { margin-top: auto; padding-top: 20px; border-top: 1px solid var(--tb-border); display: flex; flex-direction: column; gap: 8px; }
.tickabell .tb-sumrow { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; }
.tickabell .tb-sumrow span { color: var(--tb-muted); }
.tickabell .tb-sumrow strong { text-align: right; }

/* Main column */
.tickabell .tb-main { display: flex; flex-direction: column; min-width: 0; container: tb-main / inline-size; }
.tickabell .tb-progress { display: none; height: 4px; background: var(--tb-bg-sunken); }
.tickabell .tb-progress i { display: block; height: 100%; background: var(--tb-accent); border-radius: 0 4px 4px 0; transition: width .35s var(--tb-ease); }
.tickabell .tb-head { padding: 30px 34px 6px; }
.tickabell .tb-kicker { display: block; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--tb-muted); }
.tickabell .tb-title { margin: 4px 0 0; font-size: 26px; line-height: 1.2; font-weight: var(--tb-head-weight); letter-spacing: -.01em; }
.tickabell .tb-title:focus, .tickabell .tb-done h3:focus { outline: none; }
.tickabell .tb-body { flex: 1; padding: 22px 34px 30px; animation: tb-in .35s var(--tb-ease); }
.tickabell .tb-foot {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 16px 34px; border-top: 1px solid var(--tb-border); background: var(--tb-bg);
}
.tickabell .tb-foot__summary { display: none; min-width: 0; font-size: 13px; line-height: 1.3; }
.tickabell .tb-foot__summary strong { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tickabell .tb-foot__summary span { color: var(--tb-muted); }
.tickabell .tb-foot__spacer { flex: 1; }

@keyframes tb-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.tickabell .tb-note { color: var(--tb-muted); margin: 0; }
.tickabell .tb-alert { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--tb-radius-sm); background: color-mix(in srgb, var(--tb-danger) 10%, transparent); color: var(--tb-danger); font-weight: 600; font-size: 14px; }
.tickabell .tb-alert[hidden] { display: none; }
.tickabell .tb-info { padding: 10px 14px; border-radius: var(--tb-radius-sm); background: var(--tb-accent-soft); font-size: 14px; margin: 0 0 16px; }

/* Provider cards */
.tickabell .tb-people { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); }
.tickabell .tb-person {
	position: relative; display: flex; flex-direction: column; padding: 0 !important; margin: 0; overflow: hidden; text-align: left;
	background: var(--tb-bg) !important; color: var(--tb-text) !important; border: 1px solid var(--tb-border) !important; border-radius: var(--tb-radius) !important;
	cursor: pointer; transition: transform .2s var(--tb-ease), box-shadow .2s, border-color .2s;
}
.tickabell .tb-person:hover { transform: translateY(-3px); box-shadow: var(--tb-shadow) !important; border-color: var(--tb-accent-line) !important; }
.tickabell .tb-person.is-selected { border-color: var(--tb-accent) !important; box-shadow: 0 0 0 2px var(--tb-accent) !important; }
.tickabell .tb-person__photo { display: block; aspect-ratio: 4 / 5; background: var(--tb-bg-sunken) !important; overflow: hidden; }
.tickabell .tb-person__photo img { width: 100% !important; height: 100% !important; object-fit: cover; transition: transform .5s var(--tb-ease); }
.tickabell .tb-person:hover .tb-person__photo img { transform: scale(1.05); }
.tickabell .tb-person__initial { display: grid; place-items: center; width: 100% !important; height: 100% !important; font-size: 48px !important; font-weight: 700 !important; color: var(--tb-accent-text) !important; background: var(--tb-accent-soft) !important; }
.tickabell .tb-person__body { padding: 12px 14px 14px !important; display: flex; flex-direction: column; gap: 2px; }
.tickabell .tb-person__name { font-weight: 700 !important; font-size: 16px !important; }
.tickabell .tb-person__tag { font-size: 13px !important; color: var(--tb-muted) !important; }
.tickabell .tb-check {
	position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
	background: var(--tb-accent); color: var(--tb-on-accent); box-shadow: var(--tb-shadow-sm); opacity: 0; transform: scale(.6); transition: .2s var(--tb-ease);
}
.is-selected > .tb-check { opacity: 1; transform: none; }

/* Service list */
.tickabell .tb-options { display: flex; flex-direction: column; gap: 10px; }
.tickabell .tb-option {
	position: relative; display: flex; align-items: center; gap: 16px; width: 100% !important; margin: 0; padding: 16px 18px !important; text-align: left;
	background: var(--tb-bg) !important; color: var(--tb-text) !important; border: 1px solid var(--tb-border) !important; border-radius: var(--tb-radius) !important;
	cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s var(--tb-ease);
}
.tickabell .tb-option:hover { border-color: var(--tb-accent-line) !important; box-shadow: var(--tb-shadow-sm) !important; transform: translateY(-1px); }
.tickabell .tb-option.is-selected { border-color: var(--tb-accent) !important; box-shadow: 0 0 0 1px var(--tb-accent) !important; background: var(--tb-accent-soft) !important; }
.tickabell .tb-option__main { flex: 1; min-width: 0; }
.tickabell .tb-option__title { display: block; font-weight: 700 !important; font-size: 16px !important; }
.tickabell .tb-option__desc { display: block; margin-top: 2px; font-size: 14px !important; color: var(--tb-muted) !important; }
.tickabell .tb-option__meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex: none; }
.tickabell .tb-pill { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: var(--tb-chip-radius); background: var(--tb-bg-soft); border: 1px solid var(--tb-border); font-size: 12px; font-weight: 600; color: var(--tb-muted); white-space: nowrap; }
.tickabell .tb-price { font-weight: 700; font-size: 15px; white-space: nowrap; }
.tickabell .tb-option__arrow { flex: none; color: var(--tb-faint) !important; transition: transform .15s, color .15s; }
.tickabell .tb-option:hover .tb-option__arrow { color: var(--tb-accent-text) !important; transform: translateX(3px); }

/* Date & time */
.tickabell .tb-dt { display: grid; gap: 28px; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: start; }
.tickabell .tb-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.tickabell .tb-cal__month { font-weight: 700; font-size: 17px; }
.tickabell .tb-cal__nav { display: flex; gap: 6px; }
.tickabell .tb-iconbtn {
	display: grid; place-items: center; width: 38px !important; height: 38px !important; margin: 0; padding: 0 !important; border-radius: 50% !important;
	background: var(--tb-bg) !important; color: var(--tb-text) !important; border: 1px solid var(--tb-border) !important; cursor: pointer; transition: background .15s, border-color .15s;
}
.tickabell .tb-iconbtn:hover:not([disabled]) { background: var(--tb-bg-soft) !important; border-color: var(--tb-accent-line) !important; }
.tickabell .tb-iconbtn[disabled] { opacity: .35; cursor: default; }
.tickabell .tb-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.tickabell .tb-cal__wd { text-align: center; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--tb-muted); padding: 4px 0 8px; }
.tickabell .tb-day {
	position: relative; aspect-ratio: 1; min-height: 38px !important; margin: 0; padding: 0 !important; display: grid; place-items: center;
	border: 0 !important; border-radius: var(--tb-day-radius) !important; background: transparent !important; color: var(--tb-faint) !important; font-size: 14px !important; cursor: default;
	transition: background .15s, color .15s, transform .15s var(--tb-ease);
}
.tickabell .tb-day.is-free { color: var(--tb-text) !important; font-weight: 700 !important; background: var(--tb-accent-soft) !important; cursor: pointer; }
.tickabell .tb-day.is-free::after { content: ""; position: absolute; bottom: 6px; width: 4px !important; height: 4px !important; border-radius: 50% !important; background: var(--tb-accent) !important; }
.tickabell .tb-day.is-free:hover { transform: scale(1.06); }
.tickabell .tb-day.is-today { box-shadow: inset 0 0 0 1.5px var(--tb-border) !important; }
.tickabell .tb-day.is-selected { background: var(--tb-accent) !important; color: var(--tb-on-accent) !important; }
.tickabell .tb-day.is-selected::after { background: var(--tb-on-accent) !important; }
.tickabell .tb-cal.is-loading .tb-cal__grid { opacity: .45; }

.tickabell .tb-times__date { margin: 0 0 14px; font-weight: 700 !important; font-size: 17px !important; text-transform: none !important; }
.tickabell .tb-times__group + .tb-times__group { margin-top: 18px; }
.tickabell .tb-times__label { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .06em; text-transform: uppercase !important; color: var(--tb-muted) !important; }
.tickabell .tb-times__grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(82px, 1fr)); }
.tickabell .tb-place { display: flex; flex-wrap: wrap; gap: 8px; }
.tickabell .tb-place .tb-time { flex: 0 1 auto; min-width: 120px; padding-left: 18px; padding-right: 18px; }
.tickabell .tb-help { font-size: 13px; color: var(--tb-muted); margin: 0; }
.tickabell .tb-card.tb-bank { margin-bottom: 12px; border: 1.5px solid var(--tb-accent); }
.tickabell .tb-bank__title { margin: 0 0 6px; font-weight: 700; color: var(--tb-text); }
.tickabell .tb-mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .02em; overflow-wrap: anywhere; }
.tickabell .tb-time {
	min-height: 44px !important; margin: 0; padding: 0 8px !important; border-radius: var(--tb-slot-radius, var(--tb-radius-sm)) !important; border: 1px solid var(--tb-border) !important;
	background: var(--tb-bg) !important; color: var(--tb-text) !important; font-weight: 600 !important; font-variant-numeric: tabular-nums; cursor: pointer;
	transition: border-color .15s, background .15s, color .15s, transform .15s var(--tb-ease);
}
.tickabell .tb-time:hover { border-color: var(--tb-accent) !important; color: var(--tb-accent-text) !important; transform: translateY(-1px); }
.tickabell .tb-time.is-selected { background: var(--tb-accent) !important; border-color: var(--tb-accent) !important; color: var(--tb-on-accent) !important; }
.tickabell .tb-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px; border-radius: var(--tb-radius); background: var(--tb-bg-soft); border: 1px dashed var(--tb-border); }

.tickabell .tb-skel { border-radius: var(--tb-radius-sm); background: linear-gradient(90deg, var(--tb-bg-soft) 25%, var(--tb-bg-sunken) 50%, var(--tb-bg-soft) 75%); background-size: 200% 100%; animation: tb-shimmer 1.2s infinite linear; }
.tickabell .tb-skel--line { height: 18px; width: 55%; margin-bottom: 16px; }
.tickabell .tb-skel--time { height: 44px; }
@keyframes tb-shimmer { to { background-position: -200% 0; } }

/* Details form */
.tickabell .tb-form { display: grid; gap: 16px; grid-template-columns: 1fr 1fr; }
.tickabell .tb-field { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.tickabell .tb-field--full { grid-column: 1 / -1; }
.tickabell .tb-field label, .tickabell .tb-label { font-size: 13px; font-weight: 600; color: var(--tb-text); }
.tickabell .tb-req { color: var(--tb-danger); }
.tickabell .tb-input {
	width: 100%; min-height: 48px; margin: 0; padding: 12px 14px; border-radius: var(--tb-radius-sm);
	border: 1px solid var(--tb-border); background: var(--tb-bg); color: var(--tb-text); font: inherit; font-size: 15px;
	box-shadow: none; transition: border-color .15s, box-shadow .15s;
}
.tickabell textarea.tb-input { min-height: 110px; resize: vertical; }
.tickabell .tb-input::placeholder { color: var(--tb-faint); }
.tickabell .tb-input:focus { outline: none; border-color: var(--tb-accent); box-shadow: 0 0 0 3px var(--tb-accent-soft); }

.tickabell .tb-drop {
	position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 22px; text-align: center;
	border: 1.5px dashed var(--tb-border); border-radius: var(--tb-radius); background: var(--tb-bg-soft); color: var(--tb-muted);
	cursor: pointer; transition: border-color .15s, background .15s;
}
.tickabell .tb-drop:hover, .tickabell .tb-drop.is-over { border-color: var(--tb-accent); background: var(--tb-accent-soft); }
.tickabell .tb-drop strong { color: var(--tb-text); font-size: 14px; }
.tickabell .tb-drop small { font-size: 12px; }
.tickabell .tb-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.tickabell .tb-files { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.tickabell .tb-files:empty { display: none; }
.tickabell .tb-file { position: relative; width: 76px; height: 76px; border-radius: var(--tb-radius-sm); overflow: hidden; background: var(--tb-bg-sunken); border: 1px solid var(--tb-border); display: grid; place-items: center; font-size: 11px; font-weight: 700; color: var(--tb-muted); }
.tickabell .tb-file img { width: 100%; height: 100%; object-fit: cover; }
.tickabell .tb-file button { position: absolute; top: 4px; right: 4px; width: 22px !important; height: 22px !important; margin: 0; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: rgba(0, 0, 0, .65) !important; color: #fff !important; font-size: 14px !important; line-height: 1 !important; cursor: pointer; }

.tickabell .tb-check-field { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--tb-muted); cursor: pointer; }
.tickabell .tb-check-field input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--tb-accent); }
.tickabell .tb-check-field a { color: var(--tb-accent-text); }
.tickabell .tb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Summary card (details + done) */
.tickabell .tb-card { border: 1px solid var(--tb-border); border-radius: var(--tb-radius); background: var(--tb-bg-soft); padding: 6px 18px; }
.tickabell .tb-card__row { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; font-size: 14px; }
.tickabell .tb-card__row + .tb-card__row { border-top: 1px solid var(--tb-border); }
.tickabell .tb-card__row span { color: var(--tb-muted); }
.tickabell .tb-card__row strong { text-align: right; }

/* Done */
.tickabell .tb-done { max-width: 520px; margin: 0 auto; padding: 16px 0 8px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.tickabell .tb-done__badge { width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center; background: var(--tb-accent); color: var(--tb-on-accent); box-shadow: 0 0 0 10px var(--tb-accent-soft); animation: tb-pop .5s var(--tb-ease); }
.tickabell .tb-done__badge path { stroke-dasharray: 30; stroke-dashoffset: 30; animation: tb-draw .45s .2s var(--tb-ease) forwards; }
.tickabell .tb-done h3 { margin: 6px 0 0; font-size: 24px; font-weight: var(--tb-head-weight); }
.tickabell .tb-done p { margin: 0; color: var(--tb-muted); }
.tickabell .tb-done .tb-card { width: 100%; text-align: left; }
.tickabell .tb-done__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
@keyframes tb-pop { 0% { transform: scale(.4); opacity: 0; } 70% { transform: scale(1.08); } 100% { transform: none; opacity: 1; } }
@keyframes tb-draw { to { stroke-dashoffset: 0; } }

/* Service list extras */
.tickabell .tb-option__pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

/* Team member step: toolbar */
.tickabell .tb-tools { display: flex; flex-wrap: wrap; gap: 10px 16px; margin: 0 0 16px; }
.tickabell .tb-tool { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--tb-muted); }
.tickabell .tb-select {
	min-height: 38px; margin: 0; padding: 6px 10px; border: 1px solid var(--tb-border); border-radius: var(--tb-radius-sm);
	background: var(--tb-bg); color: var(--tb-text); font: inherit; font-size: 14px; box-shadow: none;
}
.tickabell .tb-select--num { width: 110px; }
.tickabell .tb-select:focus { outline: none; border-color: var(--tb-accent); box-shadow: 0 0 0 3px var(--tb-accent-soft); }

/* Team member cards */
.tickabell .tb-pros { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
.tickabell .tb-pro {
	display: flex; flex-direction: column; min-width: 0; overflow: hidden;
	background: var(--tb-bg); border: 1px solid var(--tb-border); border-radius: var(--tb-radius);
	transition: border-color .2s, box-shadow .2s, transform .2s var(--tb-ease);
}
.tickabell .tb-pro:hover { border-color: var(--tb-accent-line); box-shadow: var(--tb-shadow); transform: translateY(-2px); }
.tickabell .tb-pro.is-selected { border-color: var(--tb-accent); box-shadow: 0 0 0 2px var(--tb-accent); }
.tickabell .tb-pro__pick {
	position: relative; display: flex; align-items: flex-start; gap: 14px; width: 100% !important; margin: 0; padding: 14px !important; text-align: left;
	background: transparent !important; color: var(--tb-text) !important; border: 0 !important; border-radius: 0 !important; cursor: pointer;
}
.tickabell .tb-pro__photo { flex: none; width: 88px; height: 104px; border-radius: var(--tb-radius-sm); overflow: hidden; background: var(--tb-bg-sunken); }
.tickabell .tb-pro__photo img { width: 100% !important; height: 100% !important; object-fit: cover; }
.tickabell .tb-pro__photo--any { display: grid; place-items: center; color: var(--tb-accent-text); background: var(--tb-accent-soft); }
.tickabell .tb-pro__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
/* Only the name line makes room for the check mark; words never break in the middle (some themes allow it). */
.tickabell .tb-pro__name { font-weight: 700 !important; font-size: 17px !important; line-height: 1.25; padding-right: 28px; overflow-wrap: normal !important; word-break: normal !important; hyphens: manual !important; }
.tickabell .tb-pro__tag { overflow-wrap: break-word; word-break: normal; hyphens: manual; }
.tickabell .tb-pro__photo.tb-pro__photo--any { width: 56px; height: 56px; }
.tickabell .tb-pro__tag { font-size: 13px !important; color: var(--tb-muted) !important; }
.tickabell .tb-pro__facts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 4px; }
.tickabell .tb-pro__price { font-weight: 700; font-size: 15px; }
.tickabell .tb-pro__note { font-size: 12px; color: var(--tb-muted); line-height: 1.4; }
.tickabell .tb-pro__works { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 0 14px 12px; }
.tickabell .tb-pro__work {
	position: relative; aspect-ratio: 1; margin: 0; padding: 0 !important; overflow: hidden; cursor: zoom-in;
	border: 0 !important; border-radius: 8px !important; background: var(--tb-bg-sunken) !important;
}
.tickabell .tb-pro__work img { width: 100% !important; height: 100% !important; object-fit: cover; transition: transform .4s var(--tb-ease); }
.tickabell .tb-pro__work:hover img { transform: scale(1.08); }
.tickabell .tb-pro__more { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(0, 0, 0, .55); color: #fff; font-weight: 700; font-size: 15px; }
.tickabell .tb-pro__link {
	display: inline-flex; align-items: center; gap: 6px; margin: auto 14px 14px; align-self: flex-start;
	color: var(--tb-accent-text) !important; font-size: 13px; font-weight: 600; text-decoration: none !important;
}
.tickabell .tb-pro__link:hover { text-decoration: underline !important; }
.tickabell .tb-pro .tb-check { top: 12px; right: 12px; }
.is-selected .tb-pro__pick > .tb-check { opacity: 1; transform: none; }

/* Hours stepper */
.tickabell .tb-hours {
	display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 0 0 20px; padding: 14px 16px;
	border: 1px solid var(--tb-border); border-radius: var(--tb-radius); background: var(--tb-bg-soft);
}
.tickabell .tb-hours__label { font-weight: 700; }
.tickabell .tb-stepper { display: inline-flex; align-items: center; gap: 10px; }
.tickabell .tb-stepper__value { min-width: 64px; text-align: center; font-weight: 700; font-size: 18px; font-variant-numeric: tabular-nums; }
.tickabell .tb-hours__price { display: flex; flex-direction: column; margin-left: auto; text-align: right; line-height: 1.25; }
.tickabell .tb-hours__price small { font-size: 12px; color: var(--tb-muted); }
.tickabell .tb-hours__price strong { font-size: 17px; }
.tickabell .tb-hours__note { flex-basis: 100%; font-size: 13px; color: var(--tb-muted); }

/* Whole-day booking */
.tickabell .tb-wholeday { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 18px; border-radius: var(--tb-radius); background: var(--tb-accent-soft); }
.tickabell .tb-wholeday__icon { color: var(--tb-accent-text); }
.tickabell .tb-wholeday .tb-times__date { margin: 0; }

.tickabell .tb-side__note { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--tb-muted); }

/* Compact summary (narrow widget) */
.tickabell .tb-mini { display: none; flex-wrap: wrap; gap: 6px; padding: 14px 20px 0; }
.tickabell .tb-mini[hidden] { display: none !important; }
.tickabell .tb-mini__chip {
	display: inline-flex; align-items: center; gap: 5px; max-width: 100%; margin: 0; padding: 5px 10px !important;
	border: 1px solid var(--tb-accent-line) !important; border-radius: var(--tb-chip-radius) !important; background: var(--tb-accent-soft) !important;
	color: var(--tb-text) !important; font-size: 12.5px !important; font-weight: 600 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;
}
.tickabell .tb-mini__chip .tb-svg { color: var(--tb-accent-text); }

/* The step area has its own width: next to the side panel it can be narrow even on a wide page. */
@container tb-main (max-width: 600px) {
	.tickabell .tb-dt { grid-template-columns: 1fr; gap: 22px; }
	.tickabell .tb-cal { max-width: 420px; }
	.tickabell .tb-hours__price { margin-left: 0; text-align: left; }
}

/* Responsive (container width) */
@container tb-booking (max-width: 900px) {
	.tickabell .tb-shell { grid-template-columns: 236px minmax(0, 1fr); }
	.tickabell .tb-side { padding: 26px 18px; gap: 22px; }
	.tickabell .tb-head { padding: 26px 26px 6px; }
	.tickabell .tb-body { padding: 20px 26px 28px; }
	.tickabell .tb-foot { padding: 14px 26px; }
}
@container tb-booking (max-width: 680px) {
	.tickabell .tb-shell { grid-template-columns: 1fr; min-height: 0; }
	.tickabell .tb-side { display: none; }
	.tickabell .tb-mini { display: flex; }
	.tickabell .tb-progress { display: block; }
	.tickabell .tb-head { padding: 22px 20px 4px; }
	.tickabell .tb-title { font-size: 22px; }
	.tickabell .tb-body { padding: 18px 20px 24px; }
	.tickabell .tb-foot { position: sticky; bottom: 0; z-index: 5; padding: 12px 16px; box-shadow: 0 -8px 24px -12px rgba(0, 0, 0, .25); }
	.tickabell .tb-foot__summary { display: block; }
	.tickabell .tb-foot__spacer { display: none; }
	.tickabell .tb-dt { grid-template-columns: 1fr; gap: 22px; }
	.tickabell .tb-cal { max-width: 420px; }
	.tickabell .tb-form { grid-template-columns: 1fr; }
	.tickabell .tb-people { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.tickabell .tb-option { padding: 14px !important; gap: 12px; }
	.tickabell .tb-option__arrow { display: none; }
	.tickabell .tb-option__meta { align-self: flex-start; }
	.tickabell .tb-hours__price { margin-left: 0; text-align: left; }
}
@container tb-booking (max-width: 420px) {
	.tickabell .tb-foot .tickabell-btn { padding-inline: 1em !important; }
	.tickabell .tb-back-label { display: none; }
	.tickabell .tb-people { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tickabell .tb-person__body { padding: 10px 11px 12px !important; }
	.tickabell .tb-person__name { font-size: 15px !important; }
	.tickabell .tb-pro__photo { width: 72px; height: 88px; }
	.tickabell .tb-option { flex-wrap: wrap; }
}

/* ------------------------------------------------------------------ */
/* Team grid                                                           */
/* ------------------------------------------------------------------ */

/* Doubled class: theme / builder CSS for generic elements must not break the grid. */
/* Columns follow the available width: at most --tickabell-cols, each card at least 200px. */
.tickabell.tickabell-team {
	--tickabell-gap: 24px;
	display: grid; gap: var(--tickabell-gap); width: 100%;
	grid-template-columns: repeat(auto-fill, minmax(max(min(100%, 200px), calc((100% - (var(--tickabell-cols, 4) - 1) * var(--tickabell-gap)) / var(--tickabell-cols, 4))), 1fr));
}
/* Empty paragraphs that builders' wpautop may leave behind. */
.tickabell p:empty { display: none; }
.tickabell-team__item {
	box-sizing: border-box; display: flex; flex-direction: column; align-items: center; min-width: 0; margin: 0; padding: 26px 20px 20px; text-align: center;
	background: var(--tb-bg); border: 1px solid var(--tb-border); border-radius: var(--tb-radius-lg); box-shadow: var(--tb-shadow-sm);
	transition: transform .25s var(--tb-ease), box-shadow .25s;
}
.tickabell-team__item:hover { transform: translateY(-4px); box-shadow: var(--tb-shadow); }
.tickabell .tickabell-team__photo { display: grid; place-items: center; width: 112px; aspect-ratio: 1; margin-bottom: 14px; border-radius: 50%; overflow: hidden; background: var(--tb-accent); box-shadow: 0 0 0 6px var(--tb-accent-soft); text-decoration: none; }
.tickabell-team__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--tb-ease); }
.tickabell-team__item:hover .tickabell-team__photo img { transform: scale(1.06); }
.tickabell .tickabell-team__photo span { color: var(--tb-on-accent); font-size: 44px; font-weight: 800; line-height: 1; }
.tickabell .tickabell-team__name { margin: 0; font-size: 20px; line-height: 1.25; font-weight: 700; }
.tickabell .tickabell-team__name a { color: var(--tb-text) !important; text-decoration: none !important; }
.tickabell .tickabell-team__name a:hover { color: var(--tb-accent-text) !important; }
.tickabell .tickabell-team__tagline { margin: 2px 0 0; font-size: 15px; color: var(--tb-muted); }
.tickabell .tickabell-team__next { display: inline-block; margin: 10px 0 0; padding: 5px 12px; border-radius: 999px; background: var(--tb-accent-soft); color: var(--tb-accent-text); font-size: 13px; font-weight: 600; line-height: 1.4; }
.tickabell .tickabell-team__next i { display: inline-block; width: 7px; height: 7px; margin: 0 7px 1px 0; border-radius: 50%; background: var(--tb-accent); vertical-align: middle; }
.tickabell .tickabell-team__services { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 14px 0 0; padding: 0; list-style: none; }
.tickabell .tickabell-team__services li { margin: 0; padding: 3px 10px; border-radius: 999px; background: var(--tb-bg-soft); border: 1px solid var(--tb-border); color: var(--tb-muted); font-size: 12.5px; line-height: 1.5; }
.tickabell .tickabell-team__actions { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; margin: auto 0 0; padding: 18px 0 0; }
.tickabell .tickabell-team__actions .tickabell-btn { flex: 1 1 auto; min-height: 42px !important; padding-inline: .9em !important; font-size: .88rem !important; white-space: nowrap; }

/* ------------------------------------------------------------------ */
/* Profile                                                             */
/* ------------------------------------------------------------------ */

/* Plugin profile page (classic themes): own container between the theme header and footer. */
.tickabell-page { box-sizing: border-box; width: 100%; max-width: 1180px; margin: 0 auto; padding: clamp(28px, 6vw, 72px) 20px; }

/* A team member's profile: header card, main column and a side card, the booking form at the end. */
.tickabell-profile { display: flex; flex-direction: column; gap: 24px; }
.tickabell .tb-pf__card, .tickabell .tb-pf__head { box-sizing: border-box; background: var(--tb-bg); border: 1px solid var(--tb-border); border-radius: var(--tb-radius-lg); box-shadow: var(--tb-shadow-sm); }
.tickabell .tb-pf__card { padding: clamp(20px, 2.4vw, 28px); }
.tickabell .tb-pf__card > .tb-section__title, .tickabell .tb-pf__card .tb-section__head .tb-section__title { font-size: 22px; font-weight: 800; }
.tickabell .tb-pf__card > .tb-section__title { margin: 0 0 14px; }
.tickabell .tb-pf__card > .tb-section__title:not(:first-child) { margin-top: 24px; }
.tickabell .tb-pf__card .tb-section__head { margin-bottom: 14px; }

.tickabell .tb-pf__head { display: flex; align-items: center; gap: clamp(18px, 3vw, 32px); padding: clamp(20px, 3vw, 32px); }
.tickabell .tb-pf__photo { flex: none; width: clamp(96px, 11vw, 136px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--tb-accent); box-shadow: 0 0 0 6px var(--tb-accent-soft); display: grid; place-items: center; }
.tickabell .tb-pf__photo img { width: 100%; height: 100%; object-fit: cover; }
.tickabell .tb-pf__photo span { color: var(--tb-on-accent); font-size: clamp(40px, 5vw, 56px); font-weight: 800; line-height: 1; }
.tickabell .tb-pf__who { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.tickabell .tb-hero__name { margin: 0; padding: 0; font-size: clamp(28px, 3.4vw, 38px); line-height: 1.12; font-weight: 800; letter-spacing: -.02em; color: var(--tb-text); overflow-wrap: anywhere; }
.tickabell .tb-pf__role { margin: 0; color: var(--tb-muted); font-size: 1.05em; }
.tickabell .tb-pf__rating { color: inherit !important; text-decoration: none !important; }
.tickabell .tb-pf__rating:hover .tb-rating__count { text-decoration: underline; }
.tickabell .tb-pf__next { display: inline-block; line-height: 1.4; margin: 6px 0 0; padding: 7px 14px; border-radius: 999px; background: var(--tb-accent-soft); color: var(--tb-accent-text); font-size: .92em; font-weight: 600; }
.tickabell .tb-pf__next i { display: inline-block; width: 8px; height: 8px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--tb-accent); vertical-align: middle; }
.tickabell .tb-pf__acts { flex: none; display: flex; flex-direction: column; align-items: stretch; gap: 12px; min-width: 210px; }
.tickabell .tb-pf__icons { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.tickabell .tb-pf__icon { display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--tb-border) !important; border-radius: 50%; background: var(--tb-bg-soft) !important; color: var(--tb-text) !important; cursor: pointer; text-decoration: none !important; transition: transform .15s var(--tb-ease), border-color .15s; }
.tickabell .tb-pf__icon:hover { transform: translateY(-1px); border-color: var(--tb-accent) !important; }
.tickabell .tb-pf__icon.is-done { background: var(--tb-accent-soft) !important; color: var(--tb-accent-text) !important; }
.tickabell .tb-pf__icon--whatsapp { color: #1da851 !important; }
.tickabell .tb-pf__icon--viber { color: #7360f2 !important; }
.tickabell .tb-pf__icon--messenger { color: #0a7cff !important; }
.tickabell .tb-pf__icon--instagram { color: #d62976 !important; }
.tickabell .tb-pf__icon--telegram { color: #229ed9 !important; }

.tickabell .tb-pf__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; align-items: start; }
.tickabell .tb-pf__main { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.tickabell .tb-pf__sticky { position: sticky; top: 24px; }
.tickabell .tb-pf__side { font-size: 16px; line-height: 1.5; }
.admin-bar .tickabell .tb-pf__sticky { top: 56px; }

.tickabell .tb-pf__services { margin: 0; padding: 0; list-style: none; }
.tickabell .tb-pf__services li { display: flex; align-items: center; gap: 16px; margin: 0; padding: 14px 0; border-top: 1px solid var(--tb-border); }
.tickabell .tb-pf__services li:first-child { border-top: 0; padding-top: 4px; }
.tickabell .tb-pf__svc { flex: 1 1 auto; min-width: 0; }
.tickabell .tb-pf__svc b { display: block; font-weight: 600; }
.tickabell .tb-pf__svc small, .tickabell .tb-pf__price small { display: block; color: var(--tb-muted); font-size: .85em; font-weight: 400; }
.tickabell .tb-pf__price { flex: none; text-align: right; font-weight: 700; white-space: nowrap; }
.tickabell .tb-pf__svcbook { flex: none; padding: 8px 16px !important; font-size: .92em !important; }

.tickabell .tb-pf__sum { display: flex; align-items: center; gap: clamp(18px, 3vw, 32px); padding-bottom: 16px; }
.tickabell .tb-pf__avg { flex: none; display: flex; flex-direction: column; gap: 4px; }
.tickabell .tb-pf__avg strong { font-size: 44px; line-height: 1; font-weight: 800; }
.tickabell .tb-pf__avg small { color: var(--tb-muted); }
.tickabell .tb-pf__bars { flex: 1; margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font-size: .85em; color: var(--tb-muted); }
.tickabell .tb-pf__bars li { display: grid; grid-template-columns: 26px 1fr 28px; align-items: center; gap: 10px; margin: 0; }
.tickabell .tb-pf__bars i { height: 7px; border-radius: 4px; background: var(--tb-bg-sunken); overflow: hidden; }
.tickabell .tb-pf__bars b { display: block; height: 100%; border-radius: 4px; background: #f5a623; }
.tickabell .tb-pf__bars li span:last-child { text-align: right; }
.tickabell .tb-pf__rvlist { margin: 0; padding: 0; list-style: none; }
.tickabell .tb-pf__rvlist li { margin: 0; padding: 14px 0; border-top: 1px solid var(--tb-border); }
.tickabell .tb-pf__rvlist li[hidden] { display: none; }
.tickabell .tb-pf__rvhead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.tickabell .tb-pf__rvhead b { font-weight: 600; }
.tickabell .tb-pf__rvhead time { margin-left: auto; color: var(--tb-muted); font-size: .85em; white-space: nowrap; }
.tickabell .tb-pf__rvlist p { margin: 4px 0 0; line-height: 1.55; overflow-wrap: anywhere; }
.tickabell .tb-pf__more { margin: 6px 0 0; padding: 6px 0; border: 0; background: none !important; color: var(--tb-accent-text) !important; font: inherit; font-weight: 600; cursor: pointer; }

.tickabell .tb-pf__week { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.4; }
.tickabell .tb-pf__week th, .tickabell .tb-pf__week td { padding: 6px 0; border: 0; background: none; text-align: left; font-weight: 400; }
.tickabell .tb-pf__week th { padding-right: 14px; }
.tickabell .tb-pf__week td { text-align: right; white-space: nowrap; }
.tickabell .tb-pf__week tr.is-today th, .tickabell .tb-pf__week tr.is-today td { color: var(--tb-accent-text); font-weight: 700; }
.tickabell .tb-pf__week tr.is-off th, .tickabell .tb-pf__week tr.is-off td { color: var(--tb-faint); }
.tickabell .tb-pf__week th { white-space: nowrap; }
.tickabell .tb-pf__week th i { display: inline-block; width: 7px; height: 7px; margin: 0 7px 2px 0; border-radius: 50%; background: var(--tb-accent); vertical-align: middle; }
.tickabell .tb-pf .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tickabell .tb-pf__place { margin: 0 0 6px; }
.tickabell .tb-pf__socials { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.tickabell .tb-pf__socials .tickabell-btn { padding: 6px 14px !important; font-size: .88em !important; }
.tickabell .tb-pf__side .tb-pf__book { display: flex; justify-content: center; margin-top: 20px; width: 100%; }
.tickabell .tb-pf__bar { display: none; }

@media (max-width: 900px) {
	.tickabell .tb-pf__grid { grid-template-columns: minmax(0, 1fr); }
	.tickabell .tb-pf__sticky { position: static; }
}
@media (max-width: 700px) {
	.tickabell .tb-pf__head { flex-direction: column; text-align: center; }
	.tickabell .tb-pf__who { align-items: center; }
	.tickabell .tb-pf__acts { width: 100%; min-width: 0; }
	.tickabell .tb-pf__services li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; align-items: start; }
	.tickabell .tb-pf__svc { grid-row: 1 / 3; }
	.tickabell .tb-pf__svcbook { justify-self: end; }
	.tickabell .tb-pf__sum { gap: 18px; }
	.tickabell .tb-pf__avg strong { font-size: 36px; }
	/* Always at hand on phones; hidden while the booking form itself is on screen. */
	.tickabell .tb-pf__bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; display: flex; align-items: center; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: var(--tb-bg); border-top: 1px solid var(--tb-border); box-shadow: 0 -8px 24px rgba(0, 0, 0, .08); transition: transform .2s var(--tb-ease); }
	.tickabell .tb-pf__bar.is-hidden { transform: translateY(110%); }
	.tickabell .tb-pf__bar small { display: block; color: var(--tb-muted); font-size: .78em; }
	.tickabell .tb-pf__bar b { font-size: .95em; }
	.tickabell .tb-pf__bar .tickabell-btn { margin-left: auto; }
	.tickabell-profile { padding-bottom: 72px; }
}
.tickabell-profile__bio { font-size: 1.05em; line-height: 1.7; }
.tickabell .tb-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.tickabell .tb-section__title { margin: 0; font-size: 28px; line-height: 1.2; font-weight: var(--tb-head-weight); letter-spacing: -.01em; }
.tickabell .tb-section__count { color: var(--tb-muted); font-size: 14px; }
.tickabell .tickabell-social { min-height: 40px; padding: .5em 1em; font-size: .88rem; }

/* ------------------------------------------------------------------ */
/* Gallery (masonry) + lightbox                                        */
/* ------------------------------------------------------------------ */

.tickabell-gallery { column-count: 3; column-gap: 12px; }
@media (max-width: 900px) { .tickabell-gallery { column-count: 2; } }
@media (max-width: 480px) { .tickabell-gallery { column-gap: 8px; } }
.tickabell-gallery__item { break-inside: avoid; margin: 0 0 12px; }
@media (max-width: 480px) { .tickabell-gallery__item { margin-bottom: 8px; } }
.tickabell .tickabell-gallery__item a { position: relative; display: block; overflow: hidden; border-radius: var(--tb-radius); background: var(--tb-bg-sunken); }
.tickabell-gallery__item img { width: 100%; height: auto; transition: transform .6s var(--tb-ease), filter .3s; }
.tickabell-gallery__item a::after {
	content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .35), transparent 50%); opacity: 0; transition: opacity .3s;
}
.tickabell-gallery__item a:hover img { transform: scale(1.04); }
.tickabell-gallery__item a:hover::after { opacity: 1; }
.tickabell .tickabell-gallery__item figcaption { font-size: 13px; color: var(--tb-muted); margin-top: 6px; }

.tickabell-lb { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; background: rgba(8, 10, 9, .94); color: #fff; animation: tb-fade .2s ease; }
.tickabell-lb[hidden] { display: none; }
.tickabell-lb figure { margin: 0; max-width: 92vw; max-height: 90vh; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.tickabell-lb img { max-width: 92vw; max-height: 80vh; object-fit: contain; border-radius: 6px; transition: opacity .2s; }
.tickabell-lb figcaption { font-size: 14px; opacity: .85; text-align: center; }
.tickabell-lb__count { position: absolute; top: 22px; left: 24px; font-size: 13px; font-weight: 600; letter-spacing: .05em; opacity: .7; font-variant-numeric: tabular-nums; }
.tickabell-lb button { position: absolute; display: grid; place-items: center; width: 48px !important; height: 48px !important; margin: 0; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: rgba(255, 255, 255, .1) !important; color: #fff !important; font-size: 28px !important; line-height: 1 !important; cursor: pointer; transition: background .15s; }
.tickabell-lb button:hover { background: rgba(255, 255, 255, .22) !important; }
.tickabell-lb button[hidden] { display: none; }
.tickabell-lb__close { top: 14px; right: 14px; }
.tickabell-lb__prev { left: 16px; top: 50%; transform: translateY(-50%); }
.tickabell-lb__next { right: 16px; top: 50%; transform: translateY(-50%); }
@media (max-width: 600px) { .tickabell-lb__prev, .tickabell-lb__next { top: auto; bottom: 20px; transform: none; } }
html.tickabell-lb-open { overflow: hidden; }
@keyframes tb-fade { from { opacity: 0; } to { opacity: 1; } }

/* ------------------------------------------------------------------ */
/* Chat buttons + floating chat                                        */
/* ------------------------------------------------------------------ */

.tickabell-chat, .tickabell-social-links { display: flex; flex-wrap: wrap; gap: 8px; }
.tickabell a.tickabell-chat__btn {
	display: inline-flex; align-items: center; gap: .5em; min-height: 40px; padding: .45em 1em .45em .5em;
	border-radius: var(--tb-chip-radius); background: var(--tb-bg-soft); border: 1px solid var(--tb-border); color: var(--tb-text);
	font-weight: 600; font-size: .9rem; text-decoration: none; transition: border-color .15s, transform .15s var(--tb-ease);
}
.tickabell a.tickabell-chat__btn:hover { color: var(--tb-text); border-color: var(--tb-accent-line); transform: translateY(-1px); }
.tickabell-chat__icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: #555; }
.tickabell-chat__icon .tickabell-icon { width: 16px; height: 16px; }
.tickabell-chat__btn--whatsapp .tickabell-chat__icon { background: #25d366; }
.tickabell-chat__btn--viber .tickabell-chat__icon { background: #7360f2; }
.tickabell-chat__btn--messenger .tickabell-chat__icon { background: #0a7cff; }
.tickabell-chat__btn--telegram .tickabell-chat__icon { background: #229ed9; }
.tickabell-chat__btn--instagram .tickabell-chat__icon { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.tickabell-chat__btn--phone .tickabell-chat__icon { background: var(--tb-accent); }

.tickabell-float { position: fixed; right: 20px; bottom: 20px; z-index: 9999; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.tickabell .tickabell-float__toggle {
	display: inline-flex; align-items: center; gap: 10px; height: 56px !important; margin: 0; padding: 0 22px 0 18px !important; border: 0 !important; border-radius: 999px !important; cursor: pointer;
	background: var(--tb-accent) !important; color: var(--tb-on-accent) !important; font-weight: 700 !important; font-size: 15px !important; box-shadow: var(--tb-shadow-lg) !important;
	transition: transform .2s var(--tb-ease);
}
.tickabell .tickabell-float__toggle:hover { transform: translateY(-2px); }
.tickabell-float__toggle .tickabell-icon { width: 22px !important; height: 22px !important; }
.tickabell-float__panel {
	width: min(300px, calc(100vw - 40px)); padding: 18px; background: var(--tb-bg); color: var(--tb-text);
	border: 1px solid var(--tb-border); border-radius: var(--tb-radius-lg); box-shadow: var(--tb-shadow-lg);
	transform-origin: bottom right; animation: tb-panel .22s var(--tb-ease);
}
.tickabell-float__panel[hidden] { display: none; }
.tickabell .tickabell-float__title { margin: 0 0 4px; font-size: 16px; font-weight: 700; }
.tickabell .tickabell-float__sub { margin: 0 0 14px; font-size: 13px; color: var(--tb-muted); }
.tickabell-float__panel .tickabell-chat { flex-direction: column; }
.tickabell-float__panel .tickabell-chat__btn { width: 100%; }
@keyframes tb-panel { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) {
	.tickabell-float { right: 14px; bottom: 14px; }
	.tickabell .tickabell-float__toggle { width: 56px !important; padding: 0 !important; justify-content: center; }
	.tickabell-float__label { display: none; }
}

/* ------------------------------------------------------------------ */
/* Standalone cancel page                                              */
/* ------------------------------------------------------------------ */

.tickabell-standalone { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 16px; background: var(--tb-bg-sunken); font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.tickabell-card { box-sizing: border-box; width: 100%; max-width: 480px; background: var(--tb-bg); padding: 32px; border-radius: var(--tb-radius-lg); border: 1px solid var(--tb-border); box-shadow: var(--tb-shadow); }
.tickabell-card h1 { font-size: 1.6em; margin: .2em 0 1em; overflow-wrap: anywhere; }
@media (max-width: 480px) { .tickabell-card { padding: 24px 20px; } }
.tickabell-cancel__site a { color: var(--tb-muted); text-decoration: none; font-size: .9em; font-weight: 600; }
.tickabell-summary { display: grid; grid-template-columns: auto 1fr; gap: 10px 18px; margin: 0 0 1.5em; padding: 16px 18px; border-radius: var(--tb-radius); background: var(--tb-bg-soft); }
.tickabell-summary dt { color: var(--tb-muted); }
.tickabell-summary dd { margin: 0; font-weight: 700; }
.tickabell-notice { margin: 0 0 1.2em; padding: 12px 14px; border-radius: var(--tb-radius-sm); background: var(--tb-accent-soft); }
.tickabell-notice--error { background: color-mix(in srgb, var(--tb-danger) 10%, transparent); color: var(--tb-danger); font-weight: 600; }
.tickabell-manage { margin: 0 0 1.4em; padding-top: 1.2em; border-top: 1px solid var(--tb-border); }
.tickabell-manage h2 { margin: 0 0 .5em; font-size: 1.1em; }
.tickabell-manage p { margin: 0 0 1em; }
.tickabell-manage__note { color: var(--tb-muted); font-size: .92em; }
.tickabell-move__day { margin: 0 0 8px; border: 1px solid var(--tb-border); border-radius: var(--tb-radius-sm); background: var(--tb-bg); }
.tickabell-move__day summary { padding: 11px 14px; font-weight: 600; cursor: pointer; }
.tickabell-move__day summary::first-letter { text-transform: uppercase; }
.tickabell-move__times { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 6px; padding: 0 12px 12px; }
.tickabell-move__time { position: relative; }
.tickabell-move__time input { position: absolute; opacity: 0; }
.tickabell-move__time span {
	display: grid; place-items: center; min-height: 42px; border: 1px solid var(--tb-border); border-radius: var(--tb-slot-radius, var(--tb-radius-sm));
	font-weight: 600; font-variant-numeric: tabular-nums; cursor: pointer; transition: border-color .15s, background .15s;
}
.tickabell-move__time span:hover { border-color: var(--tb-accent); }
.tickabell-move__time input:checked + span { background: var(--tb-accent); border-color: var(--tb-accent); color: var(--tb-on-accent); }
.tickabell-move__time input:focus-visible + span { outline: 2px solid var(--tb-accent); outline-offset: 2px; }
.tickabell-manage form > .tickabell-btn { margin-top: 8px; }

/* Login page */
.tickabell-login { max-width: 420px; }
.tickabell-login__brand { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px; color: var(--tb-text); font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.tickabell-login__brand img { width: 40px; height: 40px; border-radius: 10px; object-fit: cover; }
.tickabell-login h1 { margin: 0 0 .7em; }
.tickabell-login__lead { margin: -.3em 0 1.2em; color: var(--tb-muted); line-height: 1.5; }
.tickabell-login__form { display: flex; flex-direction: column; gap: 16px; }
.tickabell-login__field { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: .95em; }
.tickabell-login__field input, .tickabell-login__pass input {
	box-sizing: border-box; width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid color-mix(in srgb, var(--tb-text) 28%, var(--tb-bg)); border-radius: var(--tb-radius-sm);
	background: var(--tb-bg); color: var(--tb-text); font: inherit; font-weight: 400; font-size: 16px; transition: border-color .15s, box-shadow .15s;
}
.tickabell-login__field input:focus { border-color: var(--tb-accent); box-shadow: 0 0 0 3px var(--tb-accent-soft); outline: none; }
.tickabell-login__pass { position: relative; display: block; }
.tickabell-login__pass input { padding-right: 52px; }
.tickabell-login__eye {
	position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: var(--tb-radius-sm);
	background: none; color: var(--tb-muted); cursor: pointer;
}
.tickabell-login__eye:hover, .tickabell-login__eye[aria-pressed="true"] { color: var(--tb-text); background: var(--tb-bg-soft); }
.tickabell-login__check { display: flex; align-items: center; gap: 10px; font-size: .95em; cursor: pointer; }
.tickabell-login__check input { width: 18px; height: 18px; margin: 0; accent-color: var(--tb-accent); }
.tickabell-login__form .tickabell-btn { min-height: 50px; margin-top: 4px; font-size: 1rem; }
.tickabell-login__links { margin: 18px 0 0; text-align: center; }
.tickabell-login__links a, .tickabell-login__back a { color: var(--tb-accent-text); font-weight: 600; text-decoration: none; }
.tickabell-login__links a:hover, .tickabell-login__back a:hover { text-decoration: underline; }
.tickabell-login__back { margin: 22px 0 0; padding-top: 16px; border-top: 1px solid var(--tb-border); font-size: .9em; }
.tickabell-login__back a { color: var(--tb-muted); }
.tickabell-login__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
	.tickabell *, .tickabell-lb, .tickabell-lb * { animation: none !important; transition: none !important; }
}

/* Team list page (classic themes without a chosen team page). */
.tickabell-page .tickabell-page__title { margin: 0 0 clamp(20px, 3vw, 36px); padding: 0; font-size: clamp(32px, 4.5vw, 52px); line-height: 1.1; font-weight: 800; letter-spacing: -.02em; }

/* Portfolio filter by service */
.tickabell-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.tickabell .tickabell-chip {
	margin: 0; padding: 8px 16px !important; border: 1px solid var(--tb-border) !important; border-radius: var(--tb-chip-radius) !important;
	background: var(--tb-bg) !important; color: var(--tb-text) !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.2 !important; cursor: pointer;
	transition: background .15s, border-color .15s, color .15s;
}
.tickabell .tickabell-chip:hover { border-color: var(--tb-accent-line) !important; }
.tickabell .tickabell-chip.is-active { background: var(--tb-accent) !important; border-color: var(--tb-accent) !important; color: var(--tb-on-accent) !important; }
.tickabell-gallery__item[hidden] { display: none !important; }

/* Plugin page template (team & booking pages): the page's own content above the widget. */
.tickabell-page__content > * { max-width: 100%; }
.tickabell-page__content > p { max-width: 720px; margin: 0 0 1em; font-size: 1.05rem; line-height: 1.6; }
.tickabell-page__content .tickabell-booking { margin-top: 8px; }
.tickabell-page-builder { width: 100%; }

/* Online payment */
.tickabell .tb-sumrow--pay strong { color: var(--tb-accent-text); }
.tickabell .tb-paysafe { margin: 0; font-size: 13px; color: var(--tb-muted); }
.tickabell-paynote { max-width: 1040px; margin: 0 auto 18px; padding: 18px 20px; border-radius: var(--tb-radius); border: 1px solid var(--tb-border); background: var(--tb-bg-soft); color: var(--tb-text); }
.tickabell-paynote strong { display: block; font-size: 17px; }
.tickabell.tickabell-paynote p { margin: 4px 0 0; color: var(--tb-muted); }
.tickabell-paynote--ok { border-color: var(--tb-accent-line); background: var(--tb-accent-soft); }
.tickabell-paynote--ok .tb-card { margin-top: 14px; background: var(--tb-bg); }
.tickabell-paynote--warn { border-color: color-mix(in srgb, var(--tb-danger) 35%, transparent); background: color-mix(in srgb, var(--tb-danger) 7%, transparent); }
.tickabell-paynote__again { max-width: 1040px; margin: 0 auto; }

/* ------------------------------------------------------------------ */
/* Designs (Settings -> General -> Design)                             */
/* ------------------------------------------------------------------ */

/* The design class sits on <body>. Each design sets both colour pairs, so every one of them
 * works with the light, dark and automatic scheme. Layout changes that must not fight the
 * narrow (mobile) layout live in container queries. */

/* Clinic */
.tickabell-design-clinic .tickabell,
.tickabell-design-clinic.tickabell-standalone {
	--tb-l-bg: #ffffff;
	--tb-l-bg-soft: #f4f7fb;
	--tb-l-bg-sunken: #e8eef6;
	--tb-l-text: #0f1b2d;
	--tb-l-muted: #56667b;
	--tb-l-faint: #97a4b5;
	--tb-l-border: #dbe3ee;
	--tb-l-shadow-rgb: 15, 40, 80;
	--tb-d-bg: #0f1621;
	--tb-d-bg-soft: #151e2b;
	--tb-d-bg-sunken: #0a1018;
	--tb-d-text: #e8eef6;
	--tb-d-muted: #93a2b6;
	--tb-d-faint: #56657a;
	--tb-d-border: #243044;
	--tb-radius-lg: 14px;
	--tb-radius: 10px;
	--tb-radius-sm: 8px;
	--tb-btn-radius: 8px;
	--tb-chip-radius: 6px;
	--tb-day-radius: 8px;
	--tb-head-weight: 650;
}

/* Minimal */
.tickabell-design-minimal .tickabell,
.tickabell-design-minimal.tickabell-standalone {
	--tb-l-bg: #ffffff;
	--tb-l-bg-soft: #fafafa;
	--tb-l-bg-sunken: #f0f0f0;
	--tb-l-text: #111111;
	--tb-l-muted: #666666;
	--tb-l-faint: #a8a8a8;
	--tb-l-border: #e4e4e4;
	--tb-l-accent-text: var(--tb-l-text);
	--tb-d-bg: #111111;
	--tb-d-bg-soft: #181818;
	--tb-d-bg-sunken: #0a0a0a;
	--tb-d-text: #f2f2f2;
	--tb-d-muted: #9c9c9c;
	--tb-d-faint: #575757;
	--tb-d-border: #2a2a2a;
	--tb-d-accent-text: var(--tb-d-text);
	--tb-accent: var(--tb-text);
	--tb-on-accent: var(--tb-bg);
	--tb-radius-lg: 0;
	--tb-radius: 0;
	--tb-radius-sm: 0;
	--tb-btn-radius: 0;
	--tb-chip-radius: 0;
	--tb-day-radius: 0;
	--tb-head-weight: 500;
	--tb-shadow-sm: none;
	--tb-shadow: none;
}
.tickabell-design-minimal :is(.tb-kicker, .tb-side__eyebrow, .tb-times__label, .tb-cal__wd, .tb-hero__eyebrow, .tb-hero__label) {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 500; letter-spacing: .06em;
}
.tickabell-design-minimal .tb-title { font-size: 30px; letter-spacing: -.02em; }
.tickabell-design-minimal .tb-option.is-selected { background: var(--tb-bg-soft) !important; }

/* Clinic and Minimal: the steps run across the top. */
@container tb-booking (min-width: 681px) {
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-shell { grid-template-columns: minmax(0, 1fr); min-height: 0; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-main { min-height: 470px; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-side { flex-direction: row; align-items: center; gap: 8px; padding: 12px 20px; border-right: 0; border-bottom: 1px solid var(--tb-border); }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-side > div:first-child,
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-side__foot { display: none; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-steps { flex: 1; flex-direction: row; gap: 6px; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-steps li { flex: 1; min-width: 0; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-foot__summary { display: block; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-foot__spacer { display: none; }
	:is(.tickabell-design-clinic, .tickabell-design-minimal) .tb-dt { grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 40px; }
	.tickabell-design-minimal .tb-side { background: var(--tb-bg); padding: 0 20px; }
	.tickabell-design-minimal .tb-stepbtn { padding: 16px 4px !important; border-bottom: 2px solid transparent !important; }
	.tickabell-design-minimal .tb-stepbtn.is-current { background: transparent !important; box-shadow: none !important; border-bottom-color: var(--tb-text) !important; }
	.tickabell-design-minimal .tb-stepbtn.is-done:hover { background: transparent !important; }
	.tickabell-design-minimal .tb-stepnum { width: auto; height: auto; border: 0; background: none; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
	.tickabell-design-minimal .is-done .tb-stepnum { background: none; color: var(--tb-text); }
}

/* Elegant */
.tickabell-design-elegant .tickabell,
.tickabell-design-elegant.tickabell-standalone {
	--tb-l-bg: #fffdfa;
	--tb-l-bg-soft: #f8f2ec;
	--tb-l-bg-sunken: #efe5dc;
	--tb-l-text: #2b221e;
	--tb-l-muted: #75665e;
	--tb-l-faint: #b0a299;
	--tb-l-border: #eadfd4;
	--tb-l-shadow-rgb: 90, 60, 40;
	--tb-d-bg: #1a1614;
	--tb-d-bg-soft: #221c19;
	--tb-d-bg-sunken: #120f0e;
	--tb-d-text: #f3ece6;
	--tb-d-muted: #b3a59c;
	--tb-d-faint: #6f625b;
	--tb-d-border: #352c27;
	--tb-font-head: "Cormorant Garamond", "Playfair Display", "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
	--tb-radius-lg: 28px;
	--tb-radius: 18px;
	--tb-radius-sm: 14px;
	--tb-day-radius: 50%;
	--tb-head-weight: 600;
}
.tickabell-design-elegant .tb-title { font-size: 32px; letter-spacing: 0; }
.tickabell-design-elegant .tb-side__title { font-size: 24px; }
.tickabell-design-elegant .tb-done h3 { font-size: 30px; }
.tickabell-design-elegant .tb-hero__name { letter-spacing: 0; font-weight: 600; }
.tickabell-design-elegant :is(.tb-kicker, .tb-side__eyebrow, .tb-hero__eyebrow) { letter-spacing: .2em; }
.tickabell-design-elegant .tb-side { background: linear-gradient(180deg, var(--tb-bg-soft), var(--tb-bg)); }

/* Ink */
.tickabell-design-ink .tickabell,
.tickabell-design-ink.tickabell-standalone {
	--tb-l-bg: #ffffff;
	--tb-l-bg-soft: #f4f4f4;
	--tb-l-bg-sunken: #e8e8e8;
	--tb-l-text: #0b0b0b;
	--tb-l-muted: #555555;
	--tb-l-faint: #9a9a9a;
	--tb-l-border: #d9d9d9;
	--tb-l-ink: #0b0b0b;
	--tb-d-bg: #0b0b0b;
	--tb-d-bg-soft: #151515;
	--tb-d-bg-sunken: #000000;
	--tb-d-text: #f4f4f4;
	--tb-d-muted: #a3a3a3;
	--tb-d-faint: #5a5a5a;
	--tb-d-border: #2c2c2c;
	--tb-d-ink: #f4f4f4;
	--tb-font-head: Oswald, "Bebas Neue", "Barlow Condensed", "Roboto Condensed", "Arial Narrow", sans-serif;
	--tb-head-case: uppercase;
	--tb-head-weight: 700;
	--tb-radius-lg: 2px;
	--tb-radius: 2px;
	--tb-radius-sm: 2px;
	--tb-btn-radius: 0;
	--tb-chip-radius: 0;
	--tb-day-radius: 0;
	--tb-btn-case: uppercase;
	--tb-btn-tracking: .08em;
}
.tickabell-design-ink .tb-shell { border: 2px solid var(--tb-ink); box-shadow: 8px 8px 0 var(--tb-accent); }
.tickabell-design-ink .tb-title { font-size: 30px; letter-spacing: .02em; }
.tickabell-design-ink :is(.tb-stepnum, .tb-check, .tb-done__badge) { border-radius: 0; }
.tickabell-design-ink .tb-option.is-selected,
.tickabell-design-ink .tb-pro.is-selected { border-color: var(--tb-ink) !important; box-shadow: 4px 4px 0 var(--tb-accent) !important; }
.tickabell-design-ink .tickabell-team__item { border: 2px solid var(--tb-ink); }
.tickabell-design-ink .tickabell-team__item:hover { box-shadow: 6px 6px 0 var(--tb-accent); }
.tickabell-design-ink .tickabell-team__name { letter-spacing: .03em; }

/* Fresh */
.tickabell-design-fresh .tickabell,
.tickabell-design-fresh.tickabell-standalone {
	--tb-l-bg: #ffffff;
	--tb-l-bg-soft: #f1f8f4;
	--tb-l-bg-sunken: #e2f0e8;
	--tb-l-text: #12241b;
	--tb-l-muted: #53665c;
	--tb-l-faint: #98ada1;
	--tb-l-border: #d6e8de;
	--tb-l-shadow-rgb: 20, 70, 45;
	--tb-d-bg: #0f1a15;
	--tb-d-bg-soft: #14231c;
	--tb-d-bg-sunken: #0a120e;
	--tb-d-text: #e6f3ec;
	--tb-d-muted: #95ada1;
	--tb-d-faint: #52685c;
	--tb-d-border: #22372c;
	--tb-font-head: ui-rounded, "SF Pro Rounded", Nunito, "Varela Round", Quicksand, system-ui, sans-serif;
	--tb-radius-lg: 30px;
	--tb-radius: 22px;
	--tb-radius-sm: 16px;
	--tb-slot-radius: 999px;
	--tb-day-radius: 50%;
	--tb-head-weight: 800;
}
.tickabell-design-fresh .tb-side { background: color-mix(in srgb, var(--tb-accent) 9%, var(--tb-bg)); border-right-color: transparent; }
.tickabell-design-fresh .tb-stepbtn.is-current { border-radius: 999px !important; }

/* Business */
.tickabell-design-business .tickabell,
.tickabell-design-business.tickabell-standalone {
	--tb-l-bg: #ffffff;
	--tb-l-bg-soft: #f5f6f8;
	--tb-l-bg-sunken: #eceef2;
	--tb-l-text: #111827;
	--tb-l-muted: #5d6574;
	--tb-l-faint: #9ea4af;
	--tb-l-border: #e1e4ea;
	--tb-l-shadow-rgb: 17, 24, 39;
	--tb-d-bg: #111318;
	--tb-d-bg-soft: #171a21;
	--tb-d-bg-sunken: #0b0d11;
	--tb-d-text: #eceef2;
	--tb-d-muted: #9aa1ad;
	--tb-d-faint: #596070;
	--tb-d-border: #272b34;
	--tb-radius-lg: 10px;
	--tb-radius: 8px;
	--tb-radius-sm: 6px;
	--tb-btn-radius: 6px;
	--tb-chip-radius: 6px;
	--tb-day-radius: 6px;
}
.tickabell-design-business .tb-side {
	--tb-bg: #222b3d;
	--tb-bg-soft: #151b28;
	--tb-bg-sunken: #1d2536;
	--tb-text: #f3f5f9;
	--tb-muted: #a7b0c0;
	--tb-border: #2e3749;
	--tb-accent-text: color-mix(in srgb, var(--tb-accent) 40%, #fff);
	color: var(--tb-text);
	border-right-color: transparent;
}
.tickabell-design-business .tb-title { font-size: 24px; }
.tickabell-design-business .tb-body { padding-top: 18px; }

/* Playful */
.tickabell-design-playful .tickabell,
.tickabell-design-playful.tickabell-standalone {
	--tb-l-bg: #fffdf6;
	--tb-l-bg-soft: #fff5dc;
	--tb-l-bg-sunken: #ffedc2;
	--tb-l-text: #1f1b2e;
	--tb-l-muted: #5f5a77;
	--tb-l-faint: #a5a0b8;
	--tb-l-border: #eee1c2;
	--tb-l-ink: #1f1b2e;
	--tb-d-bg: #17152a;
	--tb-d-bg-soft: #1f1c36;
	--tb-d-bg-sunken: #110f20;
	--tb-d-text: #f4f1ff;
	--tb-d-muted: #aca6c8;
	--tb-d-faint: #625c82;
	--tb-d-border: #35305a;
	--tb-d-ink: #b9b0ff;
	--tb-font: ui-rounded, "SF Pro Rounded", Nunito, "Varela Round", Quicksand, system-ui, sans-serif;
	--tb-font-head: ui-rounded, "SF Pro Rounded", Nunito, "Varela Round", Quicksand, system-ui, sans-serif;
	--tb-radius-lg: 22px;
	--tb-radius: 16px;
	--tb-radius-sm: 12px;
	--tb-btn-radius: 14px;
	--tb-head-weight: 800;
}
.tickabell-design-playful .tb-shell { border: 2px solid var(--tb-ink); box-shadow: 6px 6px 0 var(--tb-ink); }
.tickabell-design-playful .tb-side { border-right: 2px solid var(--tb-ink); }
.tickabell-design-playful :is(.tb-option, .tb-pro, .tb-time, .tb-iconbtn) { border-width: 2px !important; border-color: var(--tb-ink) !important; }
.tickabell-design-playful :is(.tb-option, .tb-pro):hover,
.tickabell-design-playful :is(.tb-option, .tb-pro).is-selected { box-shadow: 4px 4px 0 var(--tb-ink) !important; transform: translate(-2px, -2px); }
.tickabell-design-playful .tickabell-btn:not(.tickabell-btn--ghost) { border: 2px solid var(--tb-ink) !important; box-shadow: 3px 3px 0 var(--tb-ink) !important; }
.tickabell-design-playful .tickabell-team__item { border: 2px solid var(--tb-ink); }
.tickabell-design-playful .tickabell-team__item:hover { box-shadow: 6px 6px 0 var(--tb-ink); }

/* Premium */
.tickabell-design-premium .tickabell,
.tickabell-design-premium.tickabell-standalone {
	--tb-l-bg: #fbfaf7;
	--tb-l-bg-soft: #f4f0e8;
	--tb-l-bg-sunken: #eae4d7;
	--tb-l-text: #1c1a16;
	--tb-l-muted: #6a6356;
	--tb-l-faint: #a9a191;
	--tb-l-border: #e2dbcc;
	--tb-l-shadow-rgb: 60, 45, 20;
	--tb-d-bg: #121110;
	--tb-d-bg-soft: #1a1816;
	--tb-d-bg-sunken: #0b0a09;
	--tb-d-text: #f2ede4;
	--tb-d-muted: #b1a896;
	--tb-d-faint: #6b6456;
	--tb-d-border: #2d2923;
	--tb-font-head: "Playfair Display", "Cormorant Garamond", "Bodoni 72", Didot, "Bodoni MT", "Iowan Old Style", Georgia, serif;
	--tb-radius-lg: 14px;
	--tb-radius: 10px;
	--tb-radius-sm: 8px;
	--tb-btn-radius: 4px;
	--tb-chip-radius: 4px;
	--tb-head-weight: 600;
	--tb-btn-case: uppercase;
	--tb-btn-tracking: .12em;
}
.tickabell-design-premium .tb-shell { box-shadow: var(--tb-shadow), inset 0 3px 0 var(--tb-accent); }
.tickabell-design-premium .tickabell-btn:not(.tickabell-btn--ghost):not(.tickabell-btn--danger) {
	background: linear-gradient(135deg, var(--tb-accent), color-mix(in srgb, var(--tb-accent) 70%, #fff)) !important;
	font-size: .82rem !important;
}
.tickabell-design-premium :is(.tb-kicker, .tb-side__eyebrow, .tb-hero__eyebrow, .tb-times__label) { letter-spacing: .24em; }
.tickabell-design-premium .tb-title { font-size: 30px; letter-spacing: 0; }
.tickabell-design-premium .tb-hero__name { letter-spacing: 0; font-weight: 600; }

/* Services as cards (Elegant, Fresh, Playful). */
:is(.tickabell-design-elegant, .tickabell-design-fresh, .tickabell-design-playful) .tb-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 14px; }
:is(.tickabell-design-elegant, .tickabell-design-fresh, .tickabell-design-playful) .tb-option { flex-direction: column; align-items: stretch; gap: 12px; padding: 20px !important; }
:is(.tickabell-design-elegant, .tickabell-design-fresh, .tickabell-design-playful) .tb-option__main { padding-right: 26px; }
:is(.tickabell-design-elegant, .tickabell-design-fresh, .tickabell-design-playful) .tb-option__meta { align-items: flex-start; }
:is(.tickabell-design-elegant, .tickabell-design-fresh, .tickabell-design-playful) .tb-option__arrow { display: block; position: absolute; top: 18px; right: 16px; }

/* ------------------------------------------------------------------ */
/* Ratings                                                             */
/* ------------------------------------------------------------------ */

.tb-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.tb-stars { position: relative; display: inline-block; font-size: 1em; line-height: 1; letter-spacing: .08em; vertical-align: -.08em; white-space: nowrap; }
.tb-stars::before { content: "\2605\2605\2605\2605\2605"; color: color-mix(in srgb, var(--tb-muted, #888) 35%, transparent); }
.tb-stars__on { position: absolute; inset: 0 auto 0 0; overflow: hidden; }
.tb-stars__on::before { content: "\2605\2605\2605\2605\2605"; color: #f5a623; }
.tb-rating { display: inline-flex; align-items: center; gap: .4em; flex-wrap: wrap; }
.tb-rating__value { font-weight: 800; }
.tb-rating__count { color: var(--tb-muted); font-size: .92em; }
.tickabell .tb-reviews { margin: clamp(28px, 4vw, 48px) 0 0; }
.tickabell .tb-reviews__summary { margin: 0 0 18px; font-size: 1.25em; }
.tickabell .tb-reviews__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.tickabell .tb-review { margin: 0; padding: 16px 18px; border: 1px solid var(--tb-border); border-radius: var(--tb-radius); background: var(--tb-bg); }
.tickabell .tb-review__head { display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; margin: 0 0 8px; }
.tickabell .tb-review__who { font-weight: 700; }
.tickabell .tb-review__when { margin-left: auto; color: var(--tb-muted); font-size: .85em; }
.tickabell .tb-review__text { margin: 0; line-height: 1.55; overflow-wrap: anywhere; }
.tickabell .tb-reviews__note { margin: 12px 0 0; color: var(--tb-muted); font-size: .85em; }
.tickabell .tb-option__rating, .tickabell .tb-side__rating, .tickabell .tickabell-team__rating { display: block; margin-top: 4px; font-size: .88em; }
.tb-rating-line { display: inline-block; }

/* The client's rating page */
.tickabell-rate__what { margin: -.6em 0 1.2em; color: var(--tb-muted); }
.tickabell-rate__stars { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 4px; margin: 0; padding: 0; border: 0; }
.tickabell-rate__stars input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.tickabell-rate__stars label { font-size: 44px; line-height: 1; cursor: pointer; color: color-mix(in srgb, var(--tb-muted) 35%, transparent); transition: color .1s, transform .1s; }
.tickabell-rate__stars input:checked ~ label, .tickabell-rate__stars label:hover, .tickabell-rate__stars label:hover ~ label { color: #f5a623; }
.tickabell-rate__stars:hover input:checked ~ label:not(:hover):not(:hover ~ label) { color: color-mix(in srgb, var(--tb-muted) 35%, transparent); }
.tickabell-rate__stars input:focus-visible + label { outline: 2px solid var(--tb-accent); outline-offset: 2px; border-radius: 4px; }
.tickabell-rate__stars label:active { transform: scale(.92); }
.tickabell-rate__scale { display: flex; justify-content: space-between; max-width: 248px; margin: 2px 0 1.2em; color: var(--tb-muted); font-size: .85em; }
.tickabell-rate__label { display: block; margin: 0 0 6px; font-weight: 600; }
.tickabell-rate textarea { box-sizing: border-box; width: 100%; padding: 10px 12px; border: 1px solid var(--tb-border); border-radius: var(--tb-radius-sm); background: var(--tb-bg); color: var(--tb-text); font: inherit; }
.tickabell-rate__check { display: flex; align-items: center; gap: 8px; margin: 12px 0 4px; }
.tickabell-rate form > .tickabell-btn { margin-top: 12px; width: 100%; }
.tickabell-rate a:not(.tickabell-btn) { color: var(--tb-accent-text); font-weight: 600; }
.tickabell .tb-pro__rating { display: block; margin: 2px 0 0; font-size: .88em; }
.tickabell .tickabell-team__rating { margin: 8px 0 0; font-size: 14px; }

/* Price notes, birthday and the business's own questions */
.tickabell .tb-vat { display: block; margin-top: 2px; font-size: 11.5px; font-weight: 500; color: var(--tb-muted); text-align: right; }
.tickabell .tb-bday { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 8px; }
.tickabell .tb-qset { margin: 0; padding: 0; border: 0; min-width: 0; }
.tickabell .tb-qset legend { padding: 0; }
.tickabell .tb-qchecks { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.tickabell .tb-field .tb-help { display: block; margin-top: 4px; }

/* Add-ons, codes */
.tickabell .tb-extras { margin: 0 0 16px; padding: 0; border: 0; min-width: 0; }
.tickabell .tb-extras legend { padding: 0; margin-bottom: 8px; }
.tickabell .tb-extras__list { display: flex; flex-wrap: wrap; gap: 8px; }
.tickabell .tb-extra { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--tb-border); border-radius: 999px; cursor: pointer; font-size: 14px; }
.tickabell .tb-extra.is-on { border-color: var(--tb-accent); background: var(--tb-accent-soft); }
.tickabell .tb-extra input { margin: 0; accent-color: var(--tb-accent); }
.tickabell .tb-extra__more { color: var(--tb-muted); font-size: 13px; }
.tickabell .tb-coderow { display: flex; gap: 8px; }
.tickabell .tb-coderow .tb-input { flex: 1; min-width: 0; text-transform: uppercase; letter-spacing: .05em; }
.tickabell .tb-codechip { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 14px; border: 1px dashed var(--tb-accent); border-radius: 12px; background: var(--tb-accent-soft); color: var(--tb-text); }
.tickabell .tb-codechip .tickabell-link { margin-left: auto; }
.tickabell .tb-help--error { color: var(--tb-danger); }

/* Places, groups, waiting list */
.tickabell .tb-time--left { display: inline-flex; flex-direction: column; align-items: center; gap: 1px; line-height: 1.15; }
.tickabell .tb-time--left small { font-size: 11px; font-weight: 500; color: var(--tb-muted); }
.tickabell .tb-time--left.is-selected small { color: inherit; opacity: .85; }
.tickabell .tb-waitlink { display: inline-flex; align-items: center; gap: 4px; margin-top: 14px; font-size: 13.5px; }
.tickabell .tb-wait { display: flex; flex-direction: column; gap: 10px; }
.tickabell .tb-wait .tb-field { margin: 0; }
.tickabell .tb-wait__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.tickabell .tb-option__desc .tb-svg { display: inline-block; vertical-align: -2px; }