/* Diamante Bridge Membership — front-end base styles.
   Deliberately minimal/neutral: the active theme's own typography and
   color tokens take over anywhere these classes don't set a property. */

.dbm-notice {
	padding: 0.9rem 1.1rem;
	border-radius: 8px;
	margin: 0 0 1.2rem;
}
.dbm-notice--success { background: #e6f4ea; border: 1px solid #a8d5b5; color: #1e4620; }
.dbm-notice--error   { background: #fdecea; border: 1px solid #f3b4ac; color: #611a15; }
.dbm-notice--info    { background: #e8f1fb; border: 1px solid #a9c8e8; color: #1a3a5c; }

.dbm-btn {
	display: inline-block;
	padding: 0.6rem 1.4rem;
	border-radius: 999px;
	border: 1px solid currentColor;
	background: var(--dbt-accent, #2c5a39);
	color: #fff;
	font-family: var(--dbt-font-body, inherit);
	text-decoration: none;
	font-weight: 600;
	cursor: pointer;
}
.dbm-btn:hover { background: var(--dbt-accent-hover, #2c5a39); opacity: 0.9; color: #fff; }
.dbm-btn-secondary { background: transparent; color: var(--dbt-accent, #2c5a39); }
.dbm-btn-decline { border-color: #c0392b; color: #c0392b; }

/* Review decisions (Approvals) */
.dbm-review-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.dbm-field-note { margin: 0.2rem 0 0; font-size: 0.85em; opacity: 0.75; }

/* Login form */
.dbm-login-form-wrap { max-width: 26rem; margin: 0 auto; }
.dbm-login-form .dbm-field { margin: 0 0 1rem; display: flex; flex-direction: column; gap: 0.3rem; }
.dbm-login-form .dbm-field-inline { flex-direction: row; align-items: center; gap: 0.5rem; }
.dbm-login-form input[type="text"],
.dbm-login-form input[type="password"] {
	padding: 0.55rem 0.7rem;
	border: 1px solid #d3d3cd;
	border-radius: 6px;
	font-size: 1rem;
}
.dbm-login-links { margin-top: 1rem; font-size: 0.9rem; text-align: center; }
.dbm-login-status { max-width: 26rem; margin: 0 auto; text-align: center; }
.dbm-login-status .dbm-btn { margin: 0 0.3rem; }

/* Members directory pipeline-alert badge, shared with approvals list */
.dbm-pipeline-alert { margin-bottom: 1.2rem; }

/* Intro tour overlay (/apply/) — hidden by default in the markup itself;
   assets/js/dbm-intro-tour.js reveals it. Mobile-first: no fixed widths that
   would force horizontal scroll at ~400px. */
.dbm-tour {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: rgba(20, 30, 20, 0.72);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	box-sizing: border-box;
}
.dbm-tour-panel {
	position: relative;
	background: #fff;
	color: #1e2b1e;
	border-radius: 12px;
	padding: 3rem;
	max-width: 42rem;
	width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	box-sizing: border-box;
}
.dbm-tour-panel h2 {
	margin-top: 0;
	margin-bottom: 1.2rem;
	font-size: 1.6rem;
}
.dbm-tour-panel p {
	line-height: 1.7;
	margin: 0 0 1.1rem;
}
.dbm-tour-panel ul { padding-left: 1.2rem; line-height: 1.7; }
.dbm-tour-panel li { margin-bottom: 0.6rem; }
.dbm-tour-panel h3 {
	margin: 1.4rem 0 0.4rem;
	font-size: 0.95rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #2f6b34;
}
/* Stage slides: band label, badge, keyword, motto, pledge. */
.dbm-tour-band {
	margin: 0 0 0.8rem;
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #2f6b34;
}
.dbm-tour-stage-head {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	margin-bottom: 1.2rem;
}
.dbm-tour-badge {
	width: 110px;
	height: auto;
	flex: 0 0 auto;
}
.dbm-tour-stage-head h2 { margin-bottom: 0.3rem; }
.dbm-tour-keyword {
	margin: 0 0 0.2rem;
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.dbm-tour-motto {
	margin: 0;
	font-style: italic;
}
.dbm-tour-pledge {
	margin: 1.6rem 0 1.1rem;
	padding-left: 1rem;
	border-left: 3px solid #2f6b34;
	font-style: italic;
	line-height: 1.7;
}
.dbm-tour-nav {
	margin-top: 2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}
.dbm-tour-nav-forward {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-left: auto;
}
/* [hidden] must win over .dbm-btn's own `display: inline-block` — equal
   specificity, cascade order alone would let .dbm-btn show a hidden button. */
.dbm-tour-nav [hidden] { display: none; }
@media (max-width: 480px) {
	.dbm-tour-panel { padding: 2.2rem 1.5rem 1.5rem; }
	.dbm-tour-stage-head { flex-direction: column; align-items: flex-start; gap: 0.8rem; }
	.dbm-tour-badge { width: 84px; }
}

/* Intake form (/apply/ and the needs-info amend screen) — was entirely
   unstyled (raw fieldset/legend/p/label markup, no classes below the form
   root), rendering as bare browser defaults on both staging and dev.
   Uses the active theme's --dbt-* tokens with plain fallbacks, matching
   this file's existing minimal/neutral convention. */
.dbm-intake-form {
	max-width: 42rem;
	margin: 0 auto;
	font-family: var(--dbt-font-body, inherit);
}
.dbm-intake-form fieldset {
	border: 1px solid var(--dbt-line, #e0e0e0);
	border-radius: var(--dbt-radius, 10px);
	padding: 1.6rem 1.8rem 1.8rem;
	margin: 0 0 1.6rem;
}
.dbm-intake-form legend {
	font-family: var(--dbt-font-heading, sans-serif);
	font-weight: 600;
	font-size: 1.3rem;
	padding: 0 0.6rem;
	color: var(--dbt-ink, #1e2528);
}
.dbm-intake-form p { margin: 0 0 1.1rem; }
.dbm-intake-form fieldset > p:last-child { margin-bottom: 0; }
.dbm-intake-form label {
	display: block;
	margin: 0 0 0.4rem;
	font-weight: 600;
	color: var(--dbt-ink, #1e2528);
}
.dbm-intake-form input[type="text"],
.dbm-intake-form input[type="email"],
.dbm-intake-form input[type="tel"],
.dbm-intake-form select,
.dbm-intake-form textarea {
	width: 100%;
	padding: 0.6rem 0.8rem;
	border: 1px solid var(--dbt-line, #d3d3cd);
	border-radius: 6px;
	font-family: inherit;
	font-size: 1rem;
	color: var(--dbt-ink, #1e2528);
	background: var(--dbt-surface, #fff);
}
.dbm-intake-form input:focus,
.dbm-intake-form select:focus,
.dbm-intake-form textarea:focus {
	outline: 2px solid var(--dbt-accent, #00BAC6);
	outline-offset: 1px;
}
.dbm-intake-form textarea { resize: vertical; }
.dbm-intake-form .description {
	margin: 0.3rem 0 1rem;
	font-size: 0.88rem;
	color: var(--dbt-ink-soft, #5a666b);
}
/* Checkbox rows: label wraps the input, so it needs its own layout rather
   than the block/bold treatment above. */
.dbm-intake-form p:has(> label > input[type="checkbox"]) label,
.dbm-intake-form fieldset label:has(input[type="checkbox"]) {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-weight: 400;
}
.dbm-intake-form input[type="checkbox"] {
	margin-top: 0.2rem;
	flex-shrink: 0;
}
.dbm-intake-form .button.button-primary {
	display: inline-block;
	padding: 0.7rem 1.6rem;
	border-radius: 999px;
	border: 1px solid var(--dbt-accent, #00BAC6);
	background: var(--dbt-accent, #00BAC6);
	color: #fff;
	font-family: var(--dbt-font-body, inherit);
	font-weight: 600;
	font-size: 1rem;
	cursor: pointer;
}
.dbm-intake-form .button.button-primary:hover {
	background: var(--dbt-accent-hover, #FCB200);
	border-color: var(--dbt-accent-hover, #FCB200);
}

/* Members Area: quick links + community grid (D2, pulled forward 2026-09-19) */
.dbm-members-links { list-style: none; margin: 0 0 1.5rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1.2rem; }
.dbm-member-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 1.2rem;
	margin: 1rem 0 1.5rem;
}
.dbm-member-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	text-align: center;
	text-decoration: none;
	color: inherit;
	padding: 1rem 0.5rem;
	border-radius: 10px;
	transition: background 0.15s ease;
}
.dbm-member-card:hover { background: rgba(0, 0, 0, 0.04); }
.dbm-member-card img { border-radius: 50%; }
.dbm-member-card.is-self { font-weight: 600; }
.dbm-member-name { font-size: 0.92rem; }
.dbm-member-stage { font-size: 0.78rem; opacity: 0.7; }
.dbm-note { font-size: 0.85rem; opacity: 0.7; }

/* Self-service Edit Profile form (2026-09-19) */
.dbm-edit-profile-form { max-width: 34rem; }
.dbm-edit-profile-form label { display: block; font-weight: 600; margin-bottom: 0.3rem; }
.dbm-edit-profile-form input[type="text"],
.dbm-edit-profile-form textarea {
	width: 100%;
	padding: 0.55rem 0.7rem;
	border: 1px solid rgba(0,0,0,0.15);
	border-radius: 6px;
	font-family: inherit;
	font-size: 1rem;
	margin-bottom: 1rem;
}
.dbm-edit-profile-form .description { font-size: 0.82rem; opacity: 0.75; }
.dbm-current-photo img { border-radius: 50%; }