/* ============================================================================
   LLP Profile Facelift v2.4.0
   1. Tab bar restyle — applies to ALL /my-pet-page/ profiles (customers + PROs)
   2. Pet Profile tab (.llp-ppf) — composed/designed layout, not label rows
   Brand: teal #28968f / deep teal #1d7a74 / accent #f0a905 (used sparingly)
   ========================================================================== */

/* ── 1. TAB BAR ──────────────────────────────────────────────────────────── */

.um.um-profile .um-profile-nav {
	background: linear-gradient(180deg, #2fa89f 0%, #218c85 100%) !important;
	border-radius: 14px;
	padding: 7px !important;
	box-shadow: 0 6px 16px rgba(29, 122, 116, .28), inset 0 1px 0 rgba(255, 255, 255, .18);
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 4px;
	border: none;
}

.um.um-profile .um-profile-nav .um-profile-nav-item {
	background: none !important;
	border: none !important;
	float: none;
}

.um.um-profile .um-profile-nav .um-profile-nav-item a {
	align-items: center;          /* icon + text vertically centered */
	gap: 8px;
	padding: 11px 18px !important;
	border-radius: 10px;
	background: transparent !important;
	color: rgba(255, 255, 255, .92) !important;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1 !important;
	border-bottom: none !important;
	transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}

/* UM renders TWO <a> per tab (desktop + mobile icon-only) and toggles them with
   uimob* classes that its JS puts on the .um container. Respect that toggle —
   forcing display on both is what doubles the tabs. */
.um.um-profile:not(.uimob800):not(.uimob500):not(.uimob340) .um-profile-nav .um-profile-nav-item a.uimob800-hide {
	display: inline-flex !important;
}
.um.um-profile:not(.uimob800):not(.uimob500):not(.uimob340) .um-profile-nav .um-profile-nav-item a.uimob800-show {
	display: none !important;
}
.um.um-profile.uimob800 .um-profile-nav .um-profile-nav-item a.uimob800-show,
.um.um-profile.uimob500 .um-profile-nav .um-profile-nav-item a.uimob500-show,
.um.um-profile.uimob340 .um-profile-nav .um-profile-nav-item a.uimob340-show {
	display: inline-flex !important;
}
.um.um-profile.uimob800 .um-profile-nav .um-profile-nav-item a.uimob800-hide,
.um.um-profile.uimob500 .um-profile-nav .um-profile-nav-item a.uimob500-hide,
.um.um-profile.uimob340 .um-profile-nav .um-profile-nav-item a.uimob340-hide {
	display: none !important;
}

.um.um-profile .um-profile-nav .um-profile-nav-item a i {
	display: inline-flex;
	align-items: center;
	font-size: 1.05em;
	line-height: 1 !important;
	margin: 0 !important;
	position: static !important;
	transform: none;
}

.um.um-profile .um-profile-nav .um-profile-nav-item a:hover {
	background: rgba(255, 255, 255, .14) !important;
	color: #fff !important;
}

/* Active tab: deep teal "pressed pill" with lift — no flat white/orange */
.um.um-profile .um-profile-nav .um-profile-nav-item.active a,
.um.um-profile .um-profile-nav .um-profile-nav-item.active a:hover {
	background: linear-gradient(180deg, #135f5a 0%, #0f524e 100%) !important;
	color: #fff !important;
	box-shadow: inset 0 2px 5px rgba(0, 0, 0, .28), 0 1px 0 rgba(255, 255, 255, .12);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .25);
}

.um.um-profile .um-profile-nav .um-profile-nav-item.active a i {
	color: #ffd887; /* warm glint of the brand orange, not a slab of it */
}

.um.um-profile .um-profile-nav .um-profile-nav-item a span.um-tab-notifier {
	position: static;
	margin-left: 4px;
}

@media (max-width: 800px) {
	.um.um-profile .um-profile-nav {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		border-radius: 12px;
	}
	.um.um-profile .um-profile-nav::-webkit-scrollbar { display: none; }
	.um.um-profile .um-profile-nav .um-profile-nav-item a {
		padding: 10px 14px !important;
		white-space: nowrap;
	}
}

/* ── 2. PET PROFILE TAB (.llp-ppf) ───────────────────────────────────────── */

.llp-ppf {
	--llp-teal: #28968f;
	--llp-teal-deep: #1d7a74;
	--llp-ink: #2d3338;
	--llp-muted: #7a868e;
	--llp-line: #e7eef0;
	max-width: 100%;
	color: var(--llp-ink);
	font-size: .95rem;
	line-height: 1.55;
}

/* Cards */
.llp-ppf-card {
	background: #fff;
	border: 1px solid var(--llp-line);
	border-radius: 16px;
	box-shadow: 0 4px 14px rgba(29, 122, 116, .07);
	padding: 20px 22px;
	margin: 0 0 18px;
}

.llp-ppf-card-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 1.12rem;
	font-weight: 700;
	color: var(--llp-teal-deep);
	margin: 0 0 12px;
	padding-bottom: 9px;
	border-bottom: 2px solid var(--llp-line);
}

.llp-ppf-card-emoji { font-size: 1.2em; line-height: 1; }

/* Household strip — compact composed header bar */
.llp-ppf-household {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px 16px;
	background: linear-gradient(180deg, #f4faf9, #ecf6f5);
	border: 1px solid #d9ecea;
	border-radius: 14px;
	padding: 13px 18px;
	margin: 0 0 18px;
}

.llp-ppf-household-main {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 18px;
	min-width: 0;
}

.llp-ppf-household-names {
	font-size: 1.12rem;
	font-weight: 800;
	color: var(--llp-teal-deep);
	white-space: nowrap;
}

/* Chips */
.llp-ppf-chips { display: inline-flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }

.llp-ppf-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	border: 1px solid #dcebe9;
	border-radius: 999px;
	padding: 4px 13px;
	font-size: .86rem;
	font-weight: 600;
	color: #3c4a4f;
	white-space: nowrap;
}

.llp-ppf-chip a { color: var(--llp-teal); text-decoration: none; }
.llp-ppf-chip a:hover { text-decoration: underline; }
.llp-ppf-chip-emoji { font-size: .95em; line-height: 1; }

.llp-ppf-dot { color: #b9c9c7; margin: 0 7px; font-weight: 700; }

/* Privacy lock emoji — tiny, muted, tooltip on hover */
.llp-ppf-lock {
	cursor: help;
	font-size: .82em;
	opacity: .65;
	margin-left: 5px;
	line-height: 1;
}

/* "+ Add" actions — clearly buttons, not empty inputs */
.llp-ppf-add {
	display: inline-flex;
	align-items: center;
	border: 1px solid #cfe5e3;
	background: #f6fbfa;
	color: var(--llp-teal-deep) !important;
	border-radius: 999px;
	padding: 3px 12px;
	font-size: .8rem;
	font-weight: 700;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background .15s ease, border-color .15s ease;
}

.llp-ppf-add:hover { background: #e7f4f2; border-color: var(--llp-teal); }

.llp-ppf-addline { padding: 3px 0; }
.llp-ppf-photo-add { text-align: center; margin-top: 6px; }

/* Pet cards */
.llp-ppf-pets { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 0 0 18px; }

@media (min-width: 980px) {
	.llp-ppf-pets-multi { grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }
}

.llp-ppf-pet-card { margin: 0; }

.llp-ppf-pet-head {
	display: flex;
	gap: 18px;
	align-items: center;
	margin-bottom: 12px;
}

.llp-ppf img.llp-ppf-pet-photo,
.llp-ppf .llp-ppf-pet-photo {
	width: 108px !important;
	height: 108px !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50% !important;
	border: 4px solid #d0efed;
	box-shadow: 0 3px 10px rgba(29, 122, 116, .18);
	flex: 0 0 auto;
	max-width: none !important;
}

.llp-ppf-pet-photo-empty {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 38px;
	background: #f1f8f7;
	color: #9fc9c5;
}

.llp-ppf-pet-name {
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--llp-teal-deep);
	margin: 0 0 4px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.llp-ppf-statline {
	font-size: .92rem;
	font-weight: 600;
	color: #55656b;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.llp-ppf-pet-bio {
	margin: 0 0 12px;
	padding: 9px 15px;
	border-left: 4px solid #d0efed;
	background: #f7fbfb;
	border-radius: 0 10px 10px 0;
	font-style: italic;
	color: #4a565c;
}

/* Personality pills */
.llp-ppf-pills { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }

.llp-ppf-pill {
	background: #eaf6f5;
	color: var(--llp-teal-deep);
	border-radius: 999px;
	padding: 3px 12px;
	font-size: .82rem;
	font-weight: 600;
}

.llp-ppf-pill-warn { background: #fdeeee; color: #a04545; }

/* Blocks inside pet cards (Health, Notes for providers) */
.llp-ppf-block { padding: 8px 0 2px; border-top: 1px dashed var(--llp-line); margin-top: 8px; }

.llp-ppf-block-title {
	font-size: .76rem;
	font-weight: 800;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--llp-teal);
	margin: 2px 0 7px;
	display: flex;
	align-items: center;
	gap: 6px;
}

/* Long-text rows (allergies, medicines, key info, access instructions) */
.llp-ppf-textrow { margin: 0 0 10px; }

.llp-ppf-textrow-label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: .8rem;
	font-weight: 800;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--llp-teal);
	margin-bottom: 3px;
}

.llp-ppf-textrow-value { display: block; color: #3c4a4f; }

.llp-ppf-note {
	background: #fffaf0;
	border: 1px solid #f0e4c8;
	border-radius: 10px;
	padding: 10px 14px;
	color: #6a5a2e;
}

/* Mini detail grid (markings, birthday, adopted, type) */
.llp-ppf-minigrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 8px 14px;
	border-top: 1px dashed var(--llp-line);
	margin-top: 10px;
	padding-top: 10px;
}

.llp-ppf-mini { min-width: 0; }

.llp-ppf-mini-label {
	display: block;
	font-size: .7rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--llp-muted);
}

.llp-ppf-mini-value { font-weight: 600; color: #3c4a4f; }

/* Home & Visits + Trusted Contacts side by side on desktop */
.llp-ppf-duo { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 0 0 18px; }

@media (min-width: 900px) {
	.llp-ppf-duo { grid-template-columns: 1fr 1fr; }
	.llp-ppf-duo > .llp-ppf-card { margin: 0; }
}

/* Trusted contact mini-cards */
.llp-ppf-contacts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 12px;
}

.llp-ppf-contact {
	background: #f8fbfb;
	border: 1px solid #e3efee;
	border-radius: 12px;
	padding: 10px 13px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.llp-ppf-contact-empty { justify-content: center; align-items: flex-start; background: none; border-style: dashed; }

.llp-ppf-contact-kind {
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--llp-teal);
	display: flex;
	align-items: center;
	gap: 5px;
}

.llp-ppf-contact-name { font-weight: 700; color: #2d3338; }

.llp-ppf-contact-phone a { color: var(--llp-teal); text-decoration: none; font-weight: 600; }
.llp-ppf-contact-phone a:hover { text-decoration: underline; }

.llp-ppf-contact-addr { font-size: .82rem; color: var(--llp-muted); }

/* Toolbar / edit / preview */
.llp-ppf-edit-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: linear-gradient(180deg, #2fa89f, #218c85);
	color: #fff !important;
	border-radius: 10px;
	padding: 8px 16px;
	font-weight: 700;
	text-decoration: none !important;
	box-shadow: 0 3px 9px rgba(29, 122, 116, .3);
	transition: transform .15s ease, box-shadow .15s ease;
	white-space: nowrap;
}

.llp-ppf-edit-btn:hover { transform: translateY(-1px); box-shadow: 0 5px 13px rgba(29, 122, 116, .38); }

.llp-ppf-preview {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	background: #f3f7f7;
	border: 1px solid var(--llp-line);
	border-radius: 12px;
	padding: 9px 13px;
	margin: 0 0 14px;
}

.llp-ppf-preview-label { font-size: .8rem; font-weight: 700; color: var(--llp-muted); margin-right: 2px; }

.llp-ppf-preview-pill {
	border-radius: 999px;
	padding: 3px 12px;
	font-size: .78rem;
	font-weight: 600;
	background: #fff;
	border: 1px solid #d5e2e1;
	color: var(--llp-teal-deep) !important;
	text-decoration: none !important;
}

.llp-ppf-preview-pill:hover { background: #eaf6f5; }

.llp-ppf-preview-on { background: var(--llp-teal-deep); border-color: var(--llp-teal-deep); color: #fff !important; }

/* Shortcode wrappers */
.llp-ppf-shortcode { margin: 0 0 18px; }

.llp-ppf-lovenotes,
.llp-ppf-slideshow {
	background: #fff;
	border: 1px solid var(--llp-line);
	border-radius: 16px;
	box-shadow: 0 4px 14px rgba(29, 122, 116, .07);
	padding: 20px 22px;
}

/* Version marker */
.llp-ppf-version {
	text-align: right;
	font-size: .68rem;
	color: #b9c4c8;
	padding: 4px 2px 0;
}

@media (max-width: 640px) {
	.llp-ppf-card { padding: 15px; border-radius: 13px; }
	.llp-ppf-household { padding: 11px 14px; }
	.llp-ppf-pet-head { gap: 13px; }
	.llp-ppf img.llp-ppf-pet-photo,
	.llp-ppf .llp-ppf-pet-photo { width: 84px !important; height: 84px !important; }
}

/* Instant, styled lock tooltip (replaces the slow/invisible native title) */
.llp-ppf-lock { position: relative; outline: none; }
.llp-ppf-lock::after {
	content: attr(data-tip);
	position: absolute;
	bottom: 135%;
	left: 50%;
	transform: translateX(-50%) translateY(4px);
	background: #1d2b2a;
	color: #fff;
	font-size: .72rem;
	font-weight: 600;
	font-style: normal;
	letter-spacing: .01em;
	line-height: 1.3;
	padding: 6px 10px;
	border-radius: 8px;
	white-space: normal;
	width: max-content;
	max-width: 220px;
	text-align: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
	opacity: 0;
	pointer-events: none;
	transition: opacity .14s ease, transform .14s ease;
	z-index: 30;
}
.llp-ppf-lock::before {
	content: "";
	position: absolute;
	bottom: 135%;
	left: 50%;
	transform: translateX(-50%) translateY(4px);
	border: 5px solid transparent;
	border-top-color: #1d2b2a;
	opacity: 0;
	pointer-events: none;
	transition: opacity .14s ease, transform .14s ease;
	z-index: 30;
}
.llp-ppf-lock:hover::after, .llp-ppf-lock:focus::after,
.llp-ppf-lock:hover::before, .llp-ppf-lock:focus::before {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

/* ============================================================================
   3. EDIT FORM — make filling out data as pleasant as reading it.
   Scoped to the UM edit form inside the new-profile tab (the form element;
   the read view has no <form>, so it's untouched).
   ========================================================================== */

.um-profile-body.new-profile form {
	background: #f6faf9;
	border: 1px solid var(--llp-line, #e7eef0);
	border-radius: 16px;
	padding: 8px 22px 22px;
	margin-top: 4px;
}

/* Section headers (the um_block <h3>: PROFILE, HEALTH + WELLNESS…). The accent
   line lives on the <h3> itself so empty spacer blocks never draw a stray rule.
   UM's own column grid (um-col-*) is left intact — we don't re-column fields. */
.um-profile-body.new-profile form .um-field-block { margin: 22px 0 6px !important; padding: 0 !important; border: none !important; }
.um-profile-body.new-profile form .um-field-block h3 {
	margin: 0 !important;
	padding: 0 0 8px !important;
	font-size: 1.05rem !important;
	color: #1d7a74 !important;
	letter-spacing: .03em;
	border-bottom: 2px solid #dceae8;
}
.um-profile-body.new-profile form .um-field-block h3 strong { font-weight: 800; }

/* Clean stacked field: label sits above a full-width input area. */
.um-profile-body.new-profile form .um-field-label,
.um-profile-body.new-profile form .um-field-area {
	float: none !important;
	width: 100% !important;
	display: block !important;
}

.um-profile-body.new-profile form .um-field-label label {
	font-size: .82rem !important;
	font-weight: 700 !important;
	color: #5a6a70 !important;
	letter-spacing: .02em;
	margin-bottom: 4px !important;
}

/* Inputs / selects / textareas — fill the column, soft, rounded, teal focus.
   The big fix: UM textareas have no width set and default to ~20 cols, leaving
   them marooned in white space. Force them (and all inputs) to full width. */
.um-profile-body.new-profile form .um-field-area input[type=text],
.um-profile-body.new-profile form .um-field-area input[type=tel],
.um-profile-body.new-profile form .um-field-area input[type=email],
.um-profile-body.new-profile form .um-field-area input[type=number],
.um-profile-body.new-profile form .um-field-area input[type=date],
.um-profile-body.new-profile form .um-field-area select,
.um-profile-body.new-profile form .um-field-area textarea {
	width: 100% !important;
	box-sizing: border-box !important;
	border: 1.5px solid #dbe7e6 !important;
	border-radius: 10px !important;
	background: #fff !important;
	padding: 11px 14px !important;
	font-size: .95rem !important;
	box-shadow: none !important;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.um-profile-body.new-profile form input:focus,
.um-profile-body.new-profile form select:focus,
.um-profile-body.new-profile form textarea:focus {
	border-color: #2fa89f !important;
	box-shadow: 0 0 0 3px rgba(47, 168, 159, .16) !important;
	outline: none !important;
}

.um-profile-body.new-profile form textarea { min-height: 110px !important; line-height: 1.5; height: auto !important; }

/* Save bar */
.um-profile-body.new-profile form .um-button,
.um-profile-body.new-profile form input[type=submit].um-button {
	background: linear-gradient(180deg, #2fa89f, #218c85) !important;
	border-radius: 10px !important;
	font-weight: 700 !important;
	padding: 12px 26px !important;
	box-shadow: 0 3px 9px rgba(29, 122, 116, .3) !important;
	border: none !important;
}
.um-profile-body.new-profile form .um-button:hover { transform: translateY(-1px); }

/* Image/file upload tiles */
.um-profile-body.new-profile form .um-field-image .um-single-image-preview img,
.um-profile-body.new-profile form .um-field-file .um-single-file-preview { border-radius: 12px !important; }

/* Age is computed live from birthday, so hide the legacy editable Age fields
   from the edit form — parents/providers fill in Birthday only. */
.um-profile-body.new-profile form .um-field-pet1_age,
.um-profile-body.new-profile form .um-field-pet2_age,
.um-profile-body.new-profile form .um-field-pet3_age {
	display: none !important;
}

/* The Camera Roll slideshow and Recent-Notes love-notes are display-only
   shortcodes — nobody can edit them, so drop them from the editor. The
   "Recent Notes" <strong> header block (um_block_9742_88) only introduced the
   love-notes widget, so hide it too or it's left orphaned. */
.um-profile-body.new-profile form .um-field-shortcode,
.um-profile-body.new-profile form [data-key="um_block_9742_88"] { display: none !important; }

/* A UM column whose only content was a shortcode is now empty — collapse it so
   the sibling column (the real fields) isn't pinned to half width. */
.um-profile-body.new-profile form [class*="um-col"]:has( > .um-field-shortcode:only-child ) {
	display: none !important;
}

/* Any row holding a long-text field (key info, access instructions, bios,
   medicines, notes…) or a removed shortcode goes full width so textareas
   aren't squashed into a half column. Short single-line fields keep UM's
   native two-up columns. */
.um-profile-body.new-profile form .um-row:has(.um-field-textarea) > [class*="um-col"],
.um-profile-body.new-profile form .um-row:has(.um-field-shortcode) > [class*="um-col"] {
	width: 100% !important;
	float: none !important;
}

/* ── Friends (pet friends + care team) ───────────────────────────────────── */
.llp-ppf-friends-group { margin: 0 0 18px; }
.llp-ppf-friends-group:last-child { margin-bottom: 0; }

.llp-ppf-friends-group-title {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 10px;
	font-size: .95rem;
	font-weight: 800;
	color: var(--llp-teal-deep);
	margin: 0 0 12px;
}

.llp-ppf-friends-sub {
	font-size: .76rem;
	font-weight: 600;
	color: var(--llp-muted);
	letter-spacing: .01em;
}

.llp-ppf-friend-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
	gap: 14px 10px;
}

.llp-ppf-friend {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 5px;
	text-decoration: none !important;
	padding: 6px 4px;
	border-radius: 12px;
	transition: background .14s ease, transform .14s ease;
}

.llp-ppf-friend:hover { background: #f1f8f7; transform: translateY(-2px); }

.llp-ppf-friend img.llp-ppf-friend-avatar,
.llp-ppf-friend .llp-ppf-friend-avatar {
	width: 64px !important;
	height: 64px !important;
	border-radius: 50% !important;
	object-fit: cover;
	border: 3px solid #d0efed;
	box-shadow: 0 2px 7px rgba(29, 122, 116, .16);
	max-width: none !important;
}

.llp-ppf-friend-name {
	font-size: .82rem;
	font-weight: 700;
	color: var(--llp-ink);
	line-height: 1.2;
	word-break: break-word;
}

.llp-ppf-friend-meta { font-size: .68rem; font-weight: 600; color: var(--llp-muted); }

.llp-ppf-friend-hidden { display: none; }

.llp-ppf-friends-more {
	margin-top: 12px;
	background: #f6fbfa;
	border: 1px solid #cfe5e3;
	color: var(--llp-teal-deep);
	border-radius: 999px;
	padding: 7px 18px;
	font-size: .82rem;
	font-weight: 700;
	cursor: pointer;
	transition: background .14s ease;
}
.llp-ppf-friends-more:hover { background: #e7f4f2; }

/* ── Edit form: prominent Update button, jump nav, collapsible sections ───── */

/* The Update (submit) button — big and clearly the primary action vs the small
   teal "ADD PET PHOTO" / "Change photo" upload buttons. */
.um-profile-body.new-profile form input[type=submit].um-button {
	display: block !important;
	width: 100% !important;
	max-width: 460px;
	margin: 28px auto 12px !important;
	font-size: 1.15rem !important;
	font-weight: 800 !important;
	letter-spacing: .05em;
	text-transform: uppercase;
	padding: 17px 30px !important;
	border-radius: 14px !important;
	background: linear-gradient(180deg, #33b3a8, #1a6f69) !important;
	box-shadow: 0 8px 20px rgba(29, 122, 116, .42) !important;
	border: none !important;
	cursor: pointer;
}
.um-profile-body.new-profile form input[type=submit].um-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 11px 24px rgba(29, 122, 116, .5) !important;
}

/* Keep the upload/secondary buttons visually lighter so Update stands out. */
.um-profile-body.new-profile form a.um-button.um-btn-auto-width {
	background: #eef6f5 !important;
	color: #1d7a74 !important;
	border: 1px solid #cfe5e3 !important;
	box-shadow: none !important;
	font-weight: 700 !important;
}

/* Sticky "Jump to" bar (built by JS in edit mode) */
.llp-edit-jumpnav {
	position: sticky;
	top: 0;
	z-index: 25;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	background: rgba(246, 250, 249, .97);
	border: 1px solid #d9ecea;
	border-radius: 12px;
	padding: 9px 12px;
	margin: 0 0 16px;
	box-shadow: 0 3px 10px rgba(29, 122, 116, .1);
}

.llp-jump-label { font-size: .76rem; font-weight: 800; color: var(--llp-muted); margin-right: 2px; }

.llp-jump-chip {
	border: 1px solid #cfe5e3;
	background: #fff;
	color: var(--llp-teal-deep);
	border-radius: 999px;
	padding: 5px 13px;
	font-size: .8rem;
	font-weight: 700;
	cursor: pointer;
	transition: background .14s ease;
}
.llp-jump-chip:hover { background: #e7f4f2; }
.llp-jump-all { margin-left: auto; background: #eaf6f5; }

/* Collapsible section headings (.um-row-heading) */
.um-profile-body.new-profile form .um-row-heading.llp-acc-head {
	cursor: pointer;
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	user-select: none;
}
.llp-acc-chev::before {
	content: "\25BE";          /* ▾ */
	display: inline-block;
	font-size: .85em;
	margin-left: 10px;
	transition: transform .18s ease;
}
.um-row-heading.llp-acc-collapsed .llp-acc-chev::before { transform: rotate(-90deg); }