/*
 * BTP Marketplace — front-end styles.
 *
 * ===========================================================================
 * TWO SPECIFICITY TRAPS THIS FILE IS BUILT AROUND
 * ===========================================================================
 *
 * 1. THE THEME OUTGUNS CLASS SELECTORS.
 *    Travel Agency (style.css) sizes headings with
 *        #primary .page .entry-content h1 { font-size: 36px }
 *    which is specificity (1,2,1). Nothing built from classes can beat it —
 *    `.btpm-wrap h1` is (0,2,0) and loses. The real fix is the page template
 *    (elementor_canvas, set in BTPM_Agency_Dashboard::ensure_page), which
 *    removes the #primary/.entry-content wrapper entirely — and, being canvas
 *    rather than the Full Width template used until 2026-09-04, the theme
 *    header and footer with it.
 *
 *    The !important on headings below is belt and braces: a template change,
 *    or somebody opening the page in Elementor, puts that wrapper straight
 *    back, and the dashboard should not silently inflate when they do.
 *
 * 2. ELEMENT RESETS BEAT THEIR OWN COMPONENTS.
 *    A reset written the obvious way —
 *        .btpm-wrap a      { color: inherit }     (0,1,1)
 *        .btpm-wrap button { background: none }   (0,1,1)
 *    — outranks the component rules that follow it: `.btpm-nav-link` (0,1,0),
 *    `.btpm-btn--primary` (0,1,0). That shipped once on the agent wallet as
 *    inactive sidebar links inheriting the dark body colour and vanishing
 *    against a dark sidebar, and every primary button rendering
 *    `background:none` with white text — an invisible button on a white card.
 *
 *    So EVERY element reset here is wrapped in :where(), which zeroes its
 *    specificity: `:where(.btpm-wrap) a` is (0,0,1) and loses to any class
 *    rule, which is what a reset is supposed to do. Not just the first line —
 *    all of them.
 * ===========================================================================
 */

.btpm-wrap {
	--btpm-ink: #111827;
	--btpm-muted: #6b7280;
	--btpm-line: #e5e7eb;
	--btpm-bg: #ffffff;
	--btpm-soft: #f9fafb;
	--btpm-brand: #0f5132;
	--btpm-brand-ink: #ffffff;
	--btpm-accent: #b45309;
	--btpm-danger: #b91c1c;
	--btpm-radius: 12px;
	--btpm-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .1);

	max-width: 1180px;
	margin: 0 auto;
	padding: 24px 16px 64px;
	color: var(--btpm-ink);
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	box-sizing: border-box;
}

.btpm-wrap--narrow { max-width: 620px; }

/* ---------------------------------------------------------------------------
 * Resets — every one of these is :where()-wrapped. See the header.
 * ------------------------------------------------------------------------ */

:where(.btpm-wrap) *,
:where(.btpm-wrap) *::before,
:where(.btpm-wrap) *::after { box-sizing: border-box; }

:where(.btpm-wrap) a { color: var(--btpm-brand); text-decoration: none; }
:where(.btpm-wrap) a:hover { text-decoration: underline; }

:where(.btpm-wrap) button { font: inherit; cursor: pointer; }

:where(.btpm-wrap) p,
:where(.btpm-wrap) ul,
:where(.btpm-wrap) ol,
:where(.btpm-wrap) dl,
:where(.btpm-wrap) table,
:where(.btpm-wrap) figure { margin: 0 0 12px; }

:where(.btpm-wrap) ul,
:where(.btpm-wrap) ol { padding-left: 20px; }

:where(.btpm-wrap) h1,
:where(.btpm-wrap) h2,
:where(.btpm-wrap) h3,
:where(.btpm-wrap) h4 { margin: 0 0 10px; line-height: 1.25; font-weight: 650; }

:where(.btpm-wrap) input,
:where(.btpm-wrap) select,
:where(.btpm-wrap) textarea { font: inherit; color: inherit; }

:where(.btpm-wrap) table { border-collapse: collapse; width: 100%; }

/* Heading sizes, pinned. See trap 1 in the header. */
.btpm-wrap h1 { font-size: 26px !important; }
.btpm-wrap h2 { font-size: 20px !important; }
.btpm-wrap h3 { font-size: 17px !important; }
.btpm-wrap h4 { font-size: 15px !important; }

/* ---------------------------------------------------------------------------
 * Cards
 * ------------------------------------------------------------------------ */

.btpm-card {
	background: var(--btpm-bg);
	border: 1px solid var(--btpm-line);
	border-radius: var(--btpm-radius);
	box-shadow: var(--btpm-shadow);
	padding: 22px;
	margin: 0 0 20px;
}

.btpm-card--muted { background: var(--btpm-soft); box-shadow: none; }

.btpm-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 14px;
}

.btpm-card__head h2,
.btpm-card__head h3 { margin: 0; }

.btpm-sub { color: var(--btpm-muted); margin-bottom: 16px; }
.btpm-hint { display: block; color: var(--btpm-muted); font-size: 13px; margin-top: 4px; }
.btpm-note { background: var(--btpm-soft); border-left: 3px solid var(--btpm-line); padding: 10px 14px; border-radius: 0 6px 6px 0; }
.btpm-empty { color: var(--btpm-muted); padding: 16px 0; }
.btpm-label { display: block; font-weight: 600; margin-bottom: 6px; }
.btpm-req { color: var(--btpm-danger); }
.btpm-right { text-align: right; }
.btpm-pos { color: #047857; font-weight: 600; }
.btpm-neg { color: var(--btpm-danger); font-weight: 600; }
.btpm-muted { color: var(--btpm-muted); font-size: 13px; }
.btpm-locked { color: var(--btpm-muted); font-weight: 600; }
.btpm-count { color: var(--btpm-muted); font-size: 13px; }

/* ---------------------------------------------------------------------------
 * Buttons
 * ------------------------------------------------------------------------ */

.btpm-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 18px;
	border: 1px solid var(--btpm-line);
	border-radius: 8px;
	background: var(--btpm-bg);
	color: var(--btpm-ink);
	font-weight: 600;
	font-size: 14px;
	line-height: 1.2;
	text-decoration: none;
	transition: background .15s, border-color .15s;
}

.btpm-btn:hover { background: var(--btpm-soft); text-decoration: none; }

.btpm-btn--primary {
	background: var(--btpm-brand);
	border-color: var(--btpm-brand);
	color: var(--btpm-brand-ink);
}

.btpm-btn--primary:hover { background: #0c4028; border-color: #0c4028; color: var(--btpm-brand-ink); }

.btpm-btn--danger { border-color: #fecaca; color: var(--btpm-danger); background: #fff; }
.btpm-btn--danger:hover { background: #fef2f2; }

.btpm-btn--ghost { background: transparent; border-style: dashed; color: var(--btpm-muted); }
.btpm-btn--small { padding: 6px 12px; font-size: 13px; }

.btpm-linkbtn {
	background: none;
	border: 0;
	padding: 0;
	color: var(--btpm-brand);
	font-weight: 600;
	font-size: 13px;
	text-decoration: underline;
}

.btpm-linkbtn--danger { color: var(--btpm-danger); }
.btpm-inline { display: inline; }

/* ---------------------------------------------------------------------------
 * Pills and notices
 * ------------------------------------------------------------------------ */

.btpm-pill {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .01em;
	white-space: nowrap;
}

.btpm-pill--warn { background: #fef3c7; color: #92400e; }

.btpm-notice {
	border-radius: 8px;
	padding: 12px 16px;
	margin: 0 0 16px;
	border: 1px solid transparent;
	font-size: 14px;
}

.btpm-notice--success { background: #d1fae5; border-color: #6ee7b7; color: #065f46; }
.btpm-notice--error   { background: #fee2e2; border-color: #fca5a5; color: #991b1b; }
.btpm-notice--warn    { background: #fef3c7; border-color: #fcd34d; color: #92400e; }
.btpm-notice--info    { background: #dbeafe; border-color: #93c5fd; color: #1e40af; }
.btpm-notice p { margin: 6px 0 0; }
.btpm-notice a { text-decoration: underline; }

/* ---------------------------------------------------------------------------
 * Forms
 * ------------------------------------------------------------------------ */

.btpm-form label,
.btpm-form .btpm-full { display: block; margin-bottom: 14px; font-weight: 600; font-size: 14px; }

.btpm-form input[type="text"],
.btpm-form input[type="email"],
.btpm-form input[type="tel"],
.btpm-form input[type="url"],
.btpm-form input[type="number"],
.btpm-form input[type="search"],
.btpm-form input[type="date"],
.btpm-form select,
.btpm-form textarea {
	display: block;
	width: 100%;
	margin-top: 6px;
	padding: 10px 12px;
	border: 1px solid var(--btpm-line);
	border-radius: 8px;
	background: #fff;
	font-weight: 400;
	font-size: 14px;
}

.btpm-form input:focus,
.btpm-form select:focus,
.btpm-form textarea:focus {
	outline: 2px solid var(--btpm-brand);
	outline-offset: 1px;
	border-color: var(--btpm-brand);
}

.btpm-form input[type="file"] { display: block; margin-top: 6px; font-weight: 400; }
.btpm-form fieldset { border: 0; padding: 0; margin: 0; }
.btpm-form fieldset:disabled { opacity: .6; }

.btpm-form textarea { resize: vertical; min-height: 80px; }

.btpm-grid { display: grid; gap: 0 16px; }
.btpm-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.btpm-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.btpm-form--inline { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.btpm-form--inline label { margin-bottom: 0; }

.btpm-form__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }

.btpm-check { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; font-size: 14px; }
.btpm-check input { margin-top: 3px; flex: 0 0 auto; }

.btpm-checkgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; margin-top: 6px; }
.btpm-checkgrid__item,
.btpm-checkrow__item { display: flex; align-items: center; gap: 8px; font-weight: 400; font-size: 14px; margin: 0; }
.btpm-checkrow { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 6px; }

.btpm-readonly { background: var(--btpm-soft); border-radius: 8px; padding: 10px 14px; margin-bottom: 14px; }
.btpm-readonly span { display: block; font-size: 12px; color: var(--btpm-muted); text-transform: uppercase; letter-spacing: .04em; }

.btpm-filebtn { position: relative; overflow: hidden; display: inline-block; color: var(--btpm-brand); font-size: 13px; font-weight: 600; text-decoration: underline; cursor: pointer; }
.btpm-filebtn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

.btpm-thumb { display: block; margin: 8px 0; }
.btpm-thumb img { border-radius: 8px; }

.btpm-gallery__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; margin-top: 8px; }
.btpm-gallery__item { display: block; font-size: 12px; font-weight: 400; }
.btpm-gallery__item img { border-radius: 6px; display: block; width: 100%; height: auto; }
.btpm-gallery__item span { display: flex; align-items: center; gap: 6px; margin-top: 4px; }

.btpm-tier { padding: 12px; background: var(--btpm-soft); border-radius: 8px; margin-bottom: 10px; }

/* ---------------------------------------------------------------------------
 * Tables
 * ------------------------------------------------------------------------ */

.btpm-table { width: 100%; font-size: 14px; }
.btpm-table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--btpm-muted); padding: 8px 10px; border-bottom: 2px solid var(--btpm-line); }
.btpm-table td { padding: 12px 10px; border-bottom: 1px solid var(--btpm-line); vertical-align: top; }
.btpm-table tbody tr:hover td { background: var(--btpm-soft); }
.btpm-table__actions { white-space: nowrap; display: flex; gap: 10px; align-items: center; }
.btpm-table__sub td { background: var(--btpm-soft); }
.btpm-table__sub .btpm-card { margin: 0; box-shadow: none; }

/* Wide tables scroll inside their own container rather than the page. */
.btpm-card > .btpm-table { display: block; overflow-x: auto; white-space: nowrap; }
.btpm-card > .btpm-table td,
.btpm-card > .btpm-table th { white-space: normal; }

/* ---------------------------------------------------------------------------
 * Dashboard shell
 * ------------------------------------------------------------------------ */

.btpm-dash__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	padding-bottom: 18px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--btpm-line);
}

.btpm-dash__id { display: flex; align-items: center; gap: 14px; }
.btpm-dash__id h1 { margin: 0; }
.btpm-dash__id p { margin: 2px 0 0; color: var(--btpm-muted); font-size: 14px; }
.btpm-dash__logo { border-radius: 10px; }

.btpm-dash__balance { text-align: right; }
.btpm-dash__balance span { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--btpm-muted); }
.btpm-dash__balance strong { font-size: 24px; color: var(--btpm-brand); }

.btpm-dash__body { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 28px; align-items: start; }

.btpm-dash__nav { display: flex; flex-direction: column; gap: 2px; position: sticky; top: 24px; }

.btpm-nav-link {
	display: block;
	padding: 10px 14px;
	border-radius: 8px;
	color: var(--btpm-ink);
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
}

.btpm-nav-link:hover { background: var(--btpm-soft); text-decoration: none; }
.btpm-nav-link.is-active { background: var(--btpm-brand); color: var(--btpm-brand-ink); }
.btpm-nav-link.is-active:hover { background: #0c4028; color: var(--btpm-brand-ink); }

.btpm-dash__main { min-width: 0; }

/* ---------------------------------------------------------------------------
 * Stats
 * ------------------------------------------------------------------------ */

.btpm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; margin-bottom: 20px; }

.btpm-stat {
	background: var(--btpm-bg);
	border: 1px solid var(--btpm-line);
	border-radius: var(--btpm-radius);
	padding: 16px 18px;
	box-shadow: var(--btpm-shadow);
}

.btpm-stat span { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--btpm-muted); margin-bottom: 4px; }
.btpm-stat strong { font-size: 22px; line-height: 1.2; }
.btpm-stat--accent { border-color: var(--btpm-brand); }
.btpm-stat--accent strong { color: var(--btpm-brand); }

.btpm-steps { padding-left: 20px; }
.btpm-steps li { margin-bottom: 6px; }

.btpm-ticks { list-style: none; padding: 0; }
.btpm-ticks li { padding-left: 24px; position: relative; margin-bottom: 6px; }
.btpm-ticks li::before { content: "✓"; position: absolute; left: 0; color: var(--btpm-brand); font-weight: 700; }

.btpm-summary { display: grid; grid-template-columns: 1fr auto; gap: 6px 20px; margin: 16px 0; }
.btpm-summary dt { color: var(--btpm-muted); }
.btpm-summary dd { margin: 0; text-align: right; }
.btpm-summary__total { font-weight: 700; font-size: 17px; color: var(--btpm-ink); border-top: 1px solid var(--btpm-line); padding-top: 8px; }

.btpm-amount { font-size: 34px; font-weight: 700; color: var(--btpm-brand); margin: 8px 0 12px; }
.btpm-blurb { color: var(--btpm-muted); font-size: 14px; margin-bottom: 20px; }

/* ---------------------------------------------------------------------------
 * Itinerary builder
 * ------------------------------------------------------------------------ */

.btpm-days { list-style: none; padding: 0; margin: 0; }
.btpm-day { border: 1px solid var(--btpm-line); border-radius: 10px; margin-bottom: 10px; overflow: hidden; }
.btpm-day summary { padding: 14px 16px; cursor: pointer; display: flex; align-items: center; gap: 12px; background: var(--btpm-soft); font-weight: 600; }
.btpm-day summary::-webkit-details-marker { display: none; }
.btpm-day__num { background: var(--btpm-brand); color: var(--btpm-brand-ink); padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.btpm-day__title { color: var(--btpm-ink); }
.btpm-day__form { padding: 18px 16px; }
.btpm-day__ro { padding: 18px 16px; }
.btpm-day--new summary { background: #fff; border-top: 1px dashed var(--btpm-line); }
.btpm-day--new .btpm-day__num { background: var(--btpm-soft); color: var(--btpm-brand); border: 1px dashed var(--btpm-brand); }

.btpm-daymeta { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; font-size: 14px; }
.btpm-daymeta dt { color: var(--btpm-muted); }
.btpm-daymeta dd { margin: 0; }
.btpm-daylist { margin-top: 10px; }

/* Public itinerary */
/* ---------------------------------------------------------------------------
 * The customer's day-by-day itinerary
 *
 * Rebuilt 2026-08-31. Three things were wrong with the first version and all
 * three are visible in one screenshot:
 *
 *   1. NO SURFACE. The day had a border and a transparent background, so on
 *      the dashboard's slate page it read as an empty outline, and the summary
 *      strip (#f9fafb) was within a hair of the page colour. Next to the
 *      "Trip confirmation" card directly below it — white, bordered, shadowed —
 *      it looked unfinished. The day is a card now, in the same language.
 *   2. THREE LEFT EDGES. Body text sat at 29px, the activity list at 49px (the
 *      theme's `ul { padding-left: 20px }`), the meta labels back at 29px. One
 *      card, three margins. Everything now hangs off a single edge, with the
 *      activity bullets in the gutter rather than the text indented.
 *   3. NOTHING SAID DAY 2 OPENED. `summary` had its marker removed and nothing
 *      put back, so a closed day was a dead grey bar. There is a chevron now,
 *      it turns, and the row responds to hover and to keyboard focus.
 *
 * The activity bullet is a pseudo-element, not `list-style`, because the theme
 * and three of this site's own stylesheets all reset list markers and one of
 * them was already winning — that is why the list rendered as plain indented
 * lines with no bullets at all.
 * ------------------------------------------------------------------------ */

.btpm-itin-public { margin: 32px 0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }

/* Sized to the page's other section headings, not larger than them. */
.btpm-itin-public__title { font-size: 18px !important; font-weight: 700; margin: 0 0 14px; }

.btpm-itin-public__list { list-style: none; padding: 0; margin: 0; }

.btpm-itin-public__day {
	background: #fff;
	border: 1px solid var(--btpm-line, #e2e8f0);
	border-radius: 12px;
	margin-bottom: 12px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

.btpm-itin-public__day summary {
	padding: 14px 18px;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 12px;
	background: #fff;
	list-style: none;
	transition: background .15s ease;
}

.btpm-itin-public__day summary::-webkit-details-marker { display: none; }
.btpm-itin-public__day summary::marker { content: ""; }
.btpm-itin-public__day summary:hover { background: #f8fafc; }
.btpm-itin-public__day summary:focus-visible {
	outline: 2px solid var(--btpm-brand, #0f5132);
	outline-offset: -2px;
}

/* The affordance. Chevron right when closed, down when open. */
.btpm-itin-public__day summary::after {
	content: "";
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	margin-left: auto;
	border-right: 2px solid #94a3b8;
	border-bottom: 2px solid #94a3b8;
	transform: rotate(-45deg);
	transition: transform .18s ease;
}

.btpm-itin-public__day details[open] > summary::after { transform: rotate(45deg); }
.btpm-itin-public__day details[open] > summary { border-bottom: 1px solid #eef2f6; }

.btpm-itin-public__num {
	background: var(--btpm-brand, #0f5132);
	color: #fff;
	padding: 4px 11px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .02em;
	white-space: nowrap;
}

.btpm-itin-public__head { font-weight: 650; color: var(--btpm-ink, #111827); }

.btpm-itin-public__body { padding: 16px 18px 18px; }
.btpm-itin-public__body > *:first-child { margin-top: 0; }
.btpm-itin-public__body > *:last-child { margin-bottom: 0; }
.btpm-itin-public__body p { margin: 0 0 12px; }

.btpm-itin-public__img { float: right; margin: 0 0 12px 16px; border-radius: 8px; max-width: 240px; height: auto; }

/* Bullets hang in the gutter so the text keeps the body's left edge. */
.btpm-itin-public__acts { list-style: none; margin: 14px 0 0; padding: 0; }

.btpm-itin-public__acts li {
	position: relative;
	padding-left: 20px;
	margin-bottom: 6px;
	line-height: 1.5;
}

.btpm-itin-public__acts li::before {
	content: "";
	position: absolute;
	left: 3px;
	top: .62em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--btpm-brand, #0f5132);
}

.btpm-itin-public__meta {
	display: grid;
	grid-template-columns: 92px 1fr;
	gap: 10px 16px;
	align-items: baseline;
	font-size: 14px;
	clear: both;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid #eef2f6;
}

.btpm-itin-public__meta dt {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #94a3b8;
}

.btpm-itin-public__meta dd { margin: 0; color: #334155; }

/* ---------------------------------------------------------------------------
 * Escrow, documents, vendor badge
 * ------------------------------------------------------------------------ */

.btpm-confirmsteps { list-style: none; padding: 0; margin: 16px 0; }
.btpm-confirmsteps li { padding: 8px 0; border-bottom: 1px solid var(--btpm-line); font-weight: 600; }
.btpm-confirmsteps li:last-child { border-bottom: 0; }
.btpm-confirmsteps li.is-done { color: #065f46; }
.btpm-confirmsteps span { display: block; font-weight: 400; font-size: 13px; color: var(--btpm-muted); }

.btpm-dispute { margin-top: 12px; }
.btpm-dispute summary { cursor: pointer; color: var(--btpm-muted); font-size: 13px; text-decoration: underline; }
.btpm-dispute .btpm-form { margin-top: 12px; padding: 14px; background: var(--btpm-soft); border-radius: 8px; }

.btpm-doclist { list-style: none; padding: 0; }
.btpm-doclist li { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--btpm-line); }
.btpm-doclist li:last-child { border-bottom: 0; }
.btpm-doclist__icon { font-size: 22px; flex: 0 0 auto; }
.btpm-doclist__body { flex: 1 1 auto; min-width: 0; }
.btpm-doclist__body strong { display: block; }
.btpm-doclist__body span { display: block; font-size: 13px; color: var(--btpm-muted); }

.btpm-docs__add { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--btpm-line); }

.btpm-vendor {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	margin: 28px 0;
	padding: 18px;
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.btpm-vendor__logo { border-radius: 8px; flex: 0 0 auto; }
.btpm-vendor__label { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; }
.btpm-vendor__name { display: block; font-size: 17px; }
.btpm-vendor__meta { display: block; font-size: 14px; color: #6b7280; }
.btpm-vendor__note { margin: 8px 0 0; font-size: 13px; color: #6b7280; }

.btpm-timeline { list-style: none; padding: 0; }
.btpm-timeline li { padding: 10px 0 10px 16px; border-left: 2px solid var(--btpm-line); position: relative; }
.btpm-timeline time { display: block; font-size: 12px; color: var(--btpm-muted); }
.btpm-timeline strong { display: inline-block; margin-right: 8px; }
.btpm-timeline span { color: var(--btpm-muted); font-size: 13px; }
.btpm-timeline p { margin: 4px 0 0; font-size: 14px; }

/* ---------------------------------------------------------------------------
 * Sandbox checkout — deliberately unmissable
 * ------------------------------------------------------------------------ */

.btpm-sandbox { border: 2px dashed #f59e0b; border-radius: 10px; padding: 18px; background: #fffbeb; }
.btpm-sandbox__head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; font-size: 16px; }
.btpm-sandbox__note { font-size: 13px; color: #92400e; margin-bottom: 16px; }
.btpm-sandbox__form { display: inline-block; margin: 0 8px 8px 0; }

.btpm-checkout-page { background: #f3f4f6; margin: 0; padding: 40px 0; min-height: 100vh; }

/* ---------------------------------------------------------------------------
 * Responsive
 * ------------------------------------------------------------------------ */

@media (max-width: 900px) {
	.btpm-dash__body { grid-template-columns: 1fr; }
	.btpm-dash__nav { position: static; flex-direction: row; overflow-x: auto; padding-bottom: 6px; }
	.btpm-nav-link { white-space: nowrap; }
}

@media (max-width: 640px) {
	.btpm-grid--2,
	.btpm-grid--3 { grid-template-columns: 1fr; }
	.btpm-dash__head { flex-direction: column; align-items: flex-start; }
	.btpm-dash__balance { text-align: left; }
	.btpm-itin-public__img { float: none; margin: 0 0 12px; max-width: 100%; }

	/* A 92px label column leaves nothing for the value on a phone. */
	.btpm-itin-public__meta { grid-template-columns: 1fr; gap: 2px; }
	.btpm-itin-public__meta dd { margin-bottom: 10px; }
	.btpm-itin-public__meta dd:last-child { margin-bottom: 0; }

	/* Long day titles wrap under the pill rather than squeezing it. */
	.btpm-itin-public__day summary { flex-wrap: wrap; padding: 13px 14px; row-gap: 6px; }
	.btpm-itin-public__head { flex: 1 1 100%; order: 3; }
	.btpm-itin-public__body { padding: 14px; }

	.btpm-wrap { padding: 16px 12px 48px; }
}

@media print {
	.btpm-dash__nav,
	.btpm-form__actions,
	.btpm-btn { display: none !important; }
	.btpm-itin-public__day details { display: block; }
	.btpm-card { box-shadow: none; border-color: #ccc; }
}

/* ---------------------------------------------------------------------------
 * Direct-booking tier picker
 * ------------------------------------------------------------------------ */

.btpm-tierpick {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border: 1px solid var(--btpm-line);
	border-radius: 10px;
	margin-bottom: 8px;
	cursor: pointer;
	font-weight: 400;
}

.btpm-tierpick:hover { border-color: var(--btpm-brand); background: var(--btpm-soft); }
.btpm-tierpick:has(input:checked) { border-color: var(--btpm-brand); background: #f0fdf4; box-shadow: inset 0 0 0 1px var(--btpm-brand); }
.btpm-tierpick input { flex: 0 0 auto; }
.btpm-tierpick__name { flex: 1 1 auto; font-weight: 650; }
.btpm-tierpick__price { text-align: right; font-weight: 650; white-space: nowrap; }
.btpm-tierpick__price del { display: block; font-weight: 400; font-size: 13px; color: var(--btpm-muted); }
.btpm-tierpick__price em { display: block; font-style: normal; font-weight: 400; font-size: 12px; color: var(--btpm-muted); }

.btpm-bookbox { padding-top: 0; }

/* Back to home — the dashboards run headerless, so this is the way out. */
.btpm-btn--home { display: inline-flex; align-items: center; gap: 6px; }
.btpm-btn--home svg { width: 14px; height: 14px; flex-shrink: 0; }

/* ── Photo preview strips + lightbox (vendor tour form) ─────────────────
   The strip sits OUTSIDE its <label>: inside one, a click on a thumbnail
   reopens the file dialog instead of the viewer. */
.btpm-pv { display: flex; flex-wrap: wrap; gap: 10px; margin: -6px 0 14px; }
.btpm-pv:empty { margin: 0; }

.btpm-pv__item { margin: 0; position: relative; width: 118px; font-weight: 400; }
.btpm-pv__item.is-over .btpm-pv__open { border-color: var(--btpm-danger); }
.btpm-pv__item.is-over figcaption { color: var(--btpm-danger); }

.btpm-pv__open {
	display: block;
	text-decoration: none;
	width: 118px;
	height: 84px;
	padding: 0;
	border: 1px solid var(--btpm-line);
	border-radius: 8px;
	overflow: hidden;
	background: var(--btpm-soft);
	cursor: zoom-in;
}

.btpm-pv__open:hover { border-color: var(--btpm-brand); }
.btpm-pv__open:focus-visible { outline: 2px solid var(--btpm-brand); outline-offset: 2px; }
.btpm-pv__open img { width: 100%; height: 100%; object-fit: cover; display: block; }

.btpm-pv__kill {
	position: absolute;
	top: -6px;
	right: -6px;
	width: 22px;
	height: 22px;
	line-height: 1;
	padding: 0;
	border: 1px solid var(--btpm-line);
	border-radius: 50%;
	background: #fff;
	color: var(--btpm-muted);
	font-size: 15px;
	cursor: pointer;
}

.btpm-pv__kill:hover { background: var(--btpm-danger); border-color: var(--btpm-danger); color: #fff; }

.btpm-pv__item figcaption { font-size: 11px; color: var(--btpm-muted); margin-top: 4px; text-align: center; }
.btpm-pv__item.is-saved figcaption { font-weight: 600; }
.btpm-pv__warn { color: var(--btpm-danger); font-size: 13px; margin: -8px 0 14px; }

.btpm-lb {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(15, 23, 42, .88);
}

body.btpm-lb-open { overflow: hidden; }

.btpm-lb__fig { margin: 0; max-width: 100%; max-height: 100%; text-align: center; }
.btpm-lb__fig img { max-width: 100%; max-height: 82vh; border-radius: 10px; display: block; margin: 0 auto; }
.btpm-lb__fig figcaption { color: #e2e8f0; font-size: 13px; margin-top: 12px; word-break: break-all; }

.btpm-lb__x {
	position: absolute;
	top: 16px;
	right: 20px;
	width: 40px;
	height: 40px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}

.btpm-lb__x:hover { background: rgba(255, 255, 255, .24); }

/* Saved gallery thumbs open the same viewer. */
.btpm-gallery__item .btpm-pv__open { width: 100%; height: 90px; }

/* ── Inside the customer account, the wrap is a panel, not a page ───────
   `.btpm-wrap` carries the standalone page frame — 1180px centred with
   24/16/64px padding. Nested inside `.btp-bd-main` that frame becomes a
   stray indent, which is why the day-by-day block sat further right than
   every card above it. Two classes beats the one-class base rule, so this
   wins on specificity regardless of load order. */
.btp-bd .btpm-wrap,
.cad-section .btpm-wrap {
	max-width: none;
	margin: 0;
	padding: 0;
	font-size: inherit;
}

.btp-bd .btpm-itin-public,
.cad-section .btpm-itin-public { margin: 0 0 20px; }

.btp-bd .btpm-itin-public__title,
.cad-section .btpm-itin-public__title { margin-bottom: 12px; }

/* ── Itinerary options — the customer's compare-and-choose block ──────── */
.btpm-cust-itin__lede { color: #6b7280; margin: 0 0 16px; font-size: 14px; }
.btpm-cust-itin__list { display: grid; gap: 14px; }

.btpm-optcard {
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 16px 18px;
	background: #fff;
}

.btpm-optcard.is-chosen { border-color: #0f5132; box-shadow: inset 0 0 0 1px #0f5132; background: #f6fdf9; }

.btpm-optcard__hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.btpm-optcard__id h3 { margin: 0 0 2px; font-size: 16px; font-weight: 750; }
.btpm-optcard__id span { font-size: 12px; color: #6b7280; }
.btpm-optcard__price { text-align: right; white-space: nowrap; }
.btpm-optcard__price b { display: block; font-size: 20px; font-weight: 800; color: #0f5132; }
.btpm-optcard__price em { font-style: normal; font-size: 11px; color: #6b7280; }
.btpm-optcard__sum { margin: 10px 0 0; font-size: 14px; color: #374151; }

.btpm-optcard__days { margin-top: 12px; }
.btpm-optcard__days > summary {
	cursor: pointer;
	font-size: 13px;
	font-weight: 650;
	color: #0f5132;
	padding: 6px 0;
	list-style: none;
}
.btpm-optcard__days > summary::-webkit-details-marker { display: none; }
.btpm-optcard__days > summary::before { content: "\25B8 "; display: inline-block; transition: transform .15s; }
.btpm-optcard__days[open] > summary::before { transform: rotate(90deg); }
.btpm-optcard__days .btpm-itin-public { margin: 8px 0 0; }

.btpm-optcard__ft { margin-top: 14px; padding-top: 12px; border-top: 1px solid #f1f5f9; }
.btpm-optcard__ft form { margin: 0; }
.btpm-optcard__tick { color: #0f5132; font-weight: 700; font-size: 14px; }

.btpm-cust-itin__ask { margin-top: 18px; }
.btpm-cust-itin__ask > summary {
	cursor: pointer;
	font-size: 14px;
	font-weight: 650;
	color: #0f5132;
	padding: 10px 14px;
	border: 1px dashed #cbd5e1;
	border-radius: 10px;
	list-style: none;
}
.btpm-cust-itin__ask > summary::-webkit-details-marker { display: none; }
.btpm-cust-itin__ask > summary:hover { border-color: #0f5132; background: #f6fdf9; }
.btpm-cust-itin__ask form { margin-top: 12px; }
.btpm-cust-itin__ask textarea { width: 100%; border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px; font: inherit; }
.btpm-cust-itin__ask label { display: block; font-weight: 650; font-size: 13px; margin-bottom: 10px; }

p.btpm-cust-itin__ask {
	padding: 12px 14px;
	border-radius: 10px;
	font-size: 14px;
	margin-bottom: 0;
}
p.btpm-cust-itin__ask.is-waiting { background: #fffbeb; border: 1px solid #fde68a; color: #92400e; }
p.btpm-cust-itin__ask.is-capped { background: #f8fafc; border: 1px solid #e2e8f0; color: #475569; }

/* ── Itinerary options — the team's builder ───────────────────────────── */
.btpm-itinopts__count { font-size: 12px; font-weight: 700; color: #6b7280; }

.btpm-itinopt {
	border: 1px solid var(--btpm-line);
	border-radius: 12px;
	padding: 16px;
	margin-bottom: 16px;
	background: var(--btpm-soft);
}

.btpm-itinopt.is-chosen { border-color: var(--btpm-brand); background: #f6fdf9; }
.btpm-itinopt__hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.btpm-itinopt__no { font-weight: 750; font-size: 15px; }
.btpm-itinopt__days { margin-left: auto; font-size: 12px; color: var(--btpm-muted); }
.btpm-itinopt__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.btpm-itinopt__form { background: #fff; border: 1px solid var(--btpm-line); border-radius: 10px; padding: 14px; margin-bottom: 14px; }
.btpm-itinopt__ro { background: #fff; border: 1px solid var(--btpm-line); border-radius: 10px; padding: 12px 14px; }
.btpm-itinopt__send { margin-top: 12px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.btpm-itinopts__add { margin-top: 8px; }
.btpm-itinopts__chosen { margin: 16px 0 0; padding: 12px 14px; border-radius: 10px; background: #f6fdf9; border: 1px solid #a7f3d0; }

@media (max-width: 720px) {
	.btpm-itinopt__row { grid-template-columns: 1fr; }
	.btpm-optcard__hd { flex-direction: column; }
	.btpm-optcard__price { text-align: left; }
}


/* ── Rank Math metabox, on the vendor tour form ─────────────────────────
   Deliberately built to Rank Math's own proportions and colours: an agency
   that has ever seen the wp-admin sidebar should recognise this instantly
   rather than have to learn a second layout for the same nineteen tests. */
.btpm-rm {
	border: 1px solid #dadfe4;
	border-radius: 6px;
	background: #fff;
	margin: 0 0 18px;
	font-weight: 400;
}

.btpm-rm__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 16px;
	border-bottom: 1px solid #dadfe4;
}

.btpm-rm__brand { font-size: 14px; font-weight: 700; color: #1e1e1e; }

.btpm-rm__score,
.btpm-rm__kwscore {
	flex: 0 0 auto;
	padding: 4px 12px;
	border-radius: 4px;
	background: #f0f0f1;
	color: #50575e;
	font-size: 13px;
	white-space: nowrap;
}
.btpm-rm__score b, .btpm-rm__kwscore b { font-weight: 700; }
.btpm-rm__score--bad,  .btpm-rm__kwscore--bad  { background: #fdeaea; color: #b32d2e; }
.btpm-rm__score--ok,   .btpm-rm__kwscore--ok   { background: #fdf5e6; color: #996800; }
.btpm-rm__score--good, .btpm-rm__kwscore--good { background: #edf7ed; color: #1c7c34; }

.btpm-rm__tabs { display: flex; gap: 4px; padding: 0 12px; border-bottom: 1px solid #dadfe4; background: #f6f7f7; }
.btpm-rm__tab {
	border: 0;
	border-bottom: 2px solid transparent;
	background: none;
	padding: 12px 14px;
	font-size: 13px;
	font-weight: 500;
	color: #50575e;
	cursor: pointer;
	font-family: inherit;
}
.btpm-rm__tab:hover { color: #2271b1; }
.btpm-rm__tab.is-on { color: #2271b1; border-bottom-color: #2271b1; font-weight: 600; }

.btpm-rm__panel { display: none; }
.btpm-rm__panel.is-on { display: block; }

.btpm-rm__sec { padding: 16px; border-bottom: 1px solid #dadfe4; }
.btpm-rm__label { margin: 0 0 10px; font-size: 13px; font-weight: 600; color: #1e1e1e; }

.btpm-rm__serp { display: block; max-width: 600px; }
.btpm-rm__url { display: block; font-size: 13px; color: #202124; margin-bottom: 3px; word-break: break-all; }
.btpm-rm__title { display: block; font-size: 18px; line-height: 1.3; color: #1a0dab; margin-bottom: 3px; }
.btpm-rm__desc { display: block; font-size: 13px; line-height: 1.55; color: #4d5156; }

.btpm-rm__edit {
	margin-top: 12px;
	padding: 6px 14px;
	border: 0;
	border-radius: 3px;
	background: #2271b1;
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	font-family: inherit;
}
.btpm-rm__edit:hover { background: #135e96; }

.btpm-rm__snippet { margin-top: 14px; display: grid; gap: 12px; }
/* The class rule above sets `display`, which outranks the browser own
   [hidden]{display:none} — without this the snippet editor is permanently
   open and the Edit Snippet button toggles an attribute nothing reads. */
.btpm-rm__snippet[hidden] { display: none; }
.btpm-rm__snippet label,
.btpm-rm__full { display: block; font-size: 13px; font-weight: 600; color: #1e1e1e; }
.btpm-rm__snippet input, .btpm-rm__snippet textarea,
.btpm-rm__full input, .btpm-rm__full textarea {
	width: 100%;
	margin-top: 5px;
	padding: 8px 10px;
	border: 1px solid #8c8f94;
	border-radius: 4px;
	font: inherit;
	font-weight: 400;
	font-size: 13px;
	box-sizing: border-box;
}
.btpm-rm__snippet input:focus, .btpm-rm__snippet textarea:focus,
.btpm-rm__full input:focus, .btpm-rm__full textarea:focus { border-color: #2271b1; box-shadow: 0 0 0 1px #2271b1; outline: 0; }
.btpm-rm__count { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; color: #646970; }
.btpm-rm__full { margin-top: 14px; }
.btpm-rm__full:first-of-type { margin-top: 0; }

.btpm-rm__kw { display: flex; align-items: stretch; gap: 0; }
.btpm-rm__kw input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 9px 12px;
	border: 1px solid #8c8f94;
	border-right: 0;
	border-radius: 4px 0 0 4px;
	font: inherit;
	font-size: 13px;
}
.btpm-rm__kw input:focus { border-color: #2271b1; outline: 0; }
.btpm-rm__kw .btpm-rm__kwscore { display: flex; align-items: center; border-radius: 0 4px 4px 0; border: 1px solid #8c8f94; border-left: 0; }

.btpm-rm__check { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 400; margin-bottom: 8px; }
.btpm-rm__check input { margin: 0; }

.btpm-rm__group { border-top: 1px solid #dadfe4; }
.btpm-rm__group:first-child { border-top: 0; }
.btpm-rm__group > summary {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	cursor: pointer;
	list-style: none;
	font-size: 13px;
	font-weight: 600;
	color: #1e1e1e;
}
.btpm-rm__group > summary::-webkit-details-marker { display: none; }
.btpm-rm__group > summary::after { content: "\25BE"; margin-left: auto; color: #787c82; transition: transform .15s; }
.btpm-rm__group[open] > summary::after { transform: rotate(180deg); }
.btpm-rm__group > summary:hover { background: #f6f7f7; }

.btpm-rm__badge { padding: 2px 9px; border-radius: 10px; font-size: 11px; font-weight: 600; }
.btpm-rm__badge--bad { background: #f2a5a3; color: #6b1e1e; }
.btpm-rm__badge--ok { background: #b9e3c6; color: #12602c; }

.btpm-rm__list { list-style: none; margin: 0; padding: 0 16px 14px; display: grid; gap: 10px; }
.btpm-rm__item { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.5; color: #1e1e1e; }
.btpm-rm__dot { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%; margin-top: 1px; position: relative; }
.btpm-rm__dot::after { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 11px; font-weight: 700; }
.btpm-rm__item.is-bad .btpm-rm__dot { background: #e27c7c; }
.btpm-rm__item.is-bad .btpm-rm__dot::after { content: "\2715"; }
.btpm-rm__item.is-ok .btpm-rm__dot { background: #6cc17f; }
.btpm-rm__item.is-ok .btpm-rm__dot::after { content: "\2713"; }
.btpm-rm__text { flex: 1 1 auto; min-width: 0; }
.btpm-rm__text a { color: #2271b1; }
.btpm-rm__help {
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #dcdcde;
	color: #50575e;
	font-size: 11px;
	font-weight: 700;
	display: grid;
	place-items: center;
	text-decoration: none;
	margin-top: 1px;
}
.btpm-rm__help:hover { background: #2271b1; color: #fff; }

.btpm-rm__empty { margin: 0; padding: 16px; font-size: 13px; color: #646970; }

@media (max-width: 600px) {
	.btpm-rm__tabs { overflow-x: auto; }
	.btpm-rm__kw { flex-wrap: wrap; }
	.btpm-rm__kw input { border-right: 1px solid #8c8f94; border-radius: 4px; }
	.btpm-rm__kw .btpm-rm__kwscore { border-radius: 4px; border-left: 1px solid #8c8f94; margin-top: 8px; }
}