/* GT Expert Pass — 设计 token (Figma Expert Pass 页面)
   主色: #152869 / 强调: #2F63F5 / 文字: #15171D, #6B7280
   背景: #EEF1FB / 边框: #C7CDE6 */

/* 覆盖 WP block 主题全局内容宽度: 页面内容占满容器
   !important 必须 — WP 全局样式在 wp_head 内联 style 后输出, 无 important 会被覆盖 */
:root {
	--wp--style--global--content-size: 100% !important;
	--wp--style--global--wide-size: 100% !important;
}
/* 双保险: 直接覆盖 max-width 规则 (block 主题 .is-layout-constrained 子元素) */
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 100% !important;
}
.is-layout-constrained > .alignwide {
	max-width: 100% !important;
}

.gt-expert-wrap {
	--gt-exp-blue: #152869;
	--gt-exp-blue-light: #2F63F5;
	--gt-exp-ink: #15171D;
	--gt-exp-gray: #6B7280;
	--gt-exp-bg: #EEF1FB;
	--gt-exp-border: #C7CDE6;
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 48px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--gt-exp-ink);
}

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

.gt-expert-profile {
	padding: 32px 0 80px;
}

.gt-expert-breadcrumb {
	margin-bottom: 24px;
	font-size: 15px;
}
.gt-expert-breadcrumb a {
	color: var(--gt-exp-blue);
	text-decoration: none;
}

.gt-expert-profile__header {
	display: flex;
	gap: 40px;
	align-items: flex-start;
	padding-bottom: 40px;
}

.gt-expert-profile__avatar {
	width: 200px;
	height: 200px;
	flex-shrink: 0;
	border-radius: 16px;
	overflow: hidden;
	background: var(--gt-exp-bg);
}
.gt-expert-profile__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.gt-expert-profile__name {
	font-size: 44px;
	font-weight: 500;
	margin: 0 0 8px;
	color: var(--gt-exp-ink);
}

.gt-expert-profile__title {
	font-size: 18px;
	color: var(--gt-exp-gray);
	margin: 0 0 16px;
}

.gt-expert-profile__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}

.gt-expert-tag {
	display: inline-block;
	padding: 5px 14px;
	border: 1px solid var(--gt-exp-border);
	border-radius: 999px;
	background: #fff;
	font-size: 13px;
	color: var(--gt-exp-ink);
}

.gt-expert-profile__actions {
	display: flex;
	gap: 12px;
}

.gt-expert-btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	border: none;
	transition: background .15s;
}
.gt-expert-btn--primary {
	background: var(--gt-exp-blue);
	color: #fff;
}
.gt-expert-btn--primary:hover {
	background: var(--gt-exp-blue-light);
	color: #fff;
}
.gt-expert-btn--ghost {
	background: transparent;
	color: var(--gt-exp-blue);
	border: 1px solid var(--gt-exp-blue);
}
.gt-expert-btn--ghost:hover {
	background: var(--gt-exp-bg);
}

.gt-expert-profile__section {
	padding: 32px 0;
	border-top: 1px solid var(--gt-exp-border);
}

.gt-expert-profile__h2 {
	font-size: 24px;
	font-weight: 500;
	margin: 0 0 16px;
}

.gt-expert-profile__about {
	font-size: 16px;
	line-height: 1.7;
	color: var(--gt-exp-ink);
	max-width: 720px;
}

.gt-expert-services {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.gt-expert-services__item {
	padding: 10px 18px;
	background: var(--gt-exp-bg);
	border-radius: 8px;
	font-size: 14px;
}

.gt-expert-profile__placeholder {
	color: var(--gt-exp-gray);
	font-size: 15px;
}

/* ---------- Message (Dokan 联系表单) ---------- */

.gt-expert-contact {
	max-width: 560px;
}
.gt-expert-contact__row {
	margin-bottom: 12px;
}
.gt-expert-contact__input {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 14px;
	border: 1px solid var(--gt-exp-border);
	border-radius: 8px;
	background: #fff;
	font-size: 14px;
	color: var(--gt-exp-ink);
	font-family: inherit;
}
.gt-expert-contact__input:focus {
	outline: none;
	border-color: var(--gt-exp-blue-light);
}
.gt-expert-contact textarea {
	resize: vertical;
	min-height: 110px;
}
.gt-expert-contact .gt-expert-btn {
	margin-top: 4px;
}

/* ---------- Bookings 日历 (Figma 设计稿: 左侧日历 + 右侧时间) ---------- */

.gt-expert-booking-form {
	margin-top: 8px;
}

/* 分栏容器: form 2列 (booking-form 横跨, 按钮落第2列) */
.gt-expert-booking-form.gt-expert-booking-form {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
	margin: 0;
}

/* booking-form 内部: flex 左右 2 块 —
   左: .gt-expert-booking-left (日历) | 右: .gt-expert-booking-right (时间/地点/价格/按钮) */
.gt-expert-booking-form #wc-bookings-booking-form {
	display: flex;
	gap: 40px;
	align-items: flex-start;
	grid-column: 1 / -1;
	border: none;
	padding: 0;
	margin: 0;
}

/* 左容器: 日历 */
.gt-expert-booking-left {
	flex: 0 0 58%;
	min-width: 0;
	box-sizing: border-box;
}
.gt-expert-booking-left .wc-bookings-date-picker {
	margin: 0;
	line-height: 2.25em;
}

/* 右容器: 时间选择 + panel (PHP 已包好) */
.gt-expert-booking-right {
	flex: 1 1 42%;
	min-width: 0;
	box-sizing: border-box;
	background: #f7f8fc;
	border: 1px solid var(--gt-exp-border);
	border-radius: 12px;
	padding: 18px 20px 20px;
}

/* ---------- WC notices (自包含外壳补输出) ---------- */
.gt-expert-notices {
	max-width: 720px;
	margin: 16px auto 0;
	padding: 0 16px;
	box-sizing: border-box;
}
.gt-expert-notices .woocommerce-message,
.gt-expert-notices .woocommerce-error,
.gt-expert-notices .woocommerce-info {
	list-style: none;
	margin: 0 0 10px;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.5;
	border: 1px solid;
	box-sizing: border-box;
}
.gt-expert-notices .woocommerce-message {
	background: #E8F5E9;
	border-color: #A5D6A7;
	color: #1B5E20;
}
.gt-expert-notices .woocommerce-error {
	background: #FDECEA;
	border-color: #EF9A9A;
	color: #B71C1C;
}
.gt-expert-notices .woocommerce-info {
	background: #E8F0FE;
	border-color: #B8CCF5;
	color: var(--gt-exp-blue);
}
.gt-expert-notices .button {
	display: inline-block;
	margin: 0 0 0 8px;
	padding: 6px 12px;
	background: var(--gt-exp-blue);
	color: #fff;
	border-radius: 6px;
	text-decoration: none;
	font-size: 13px;
}

/* 右容器内: 时间选择 */
.gt-expert-booking-right .form-field-wide {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
}

/* 选中的日期显示条 (右容器最上方) */
.gt-expert-booking-date {
	display: flex;
	align-items: baseline;
	gap: 10px;
	padding: 10px 14px;
	margin: 0 0 12px;
	background: #F4F6FD;
	border: 1px solid var(--gt-exp-border);
	border-radius: 8px;
	font-size: 14px;
}
.gt-expert-booking-date__label {
	font-weight: 700;
	color: var(--gt-exp-blue);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.4px;
}
.gt-expert-booking-date__value {
	color: var(--gt-exp-ink);
	font-weight: 600;
}
.gt-expert-booking-date__value.has-value {
	color: var(--gt-exp-blue);
}

/* 时间下拉 (Start/End time) — 统一样式: 白底圆角边框, 与 Location 胶囊同风格 */
.gt-expert-booking-right select#wc-bookings-form-start-time,
.gt-expert-booking-right select#wc-bookings-form-end-time {
	display: block;
	width: 100%;
	margin: 0 0 10px;
	padding: 10px 34px 10px 14px;
	font-size: 14px;
	font-family: inherit;
	color: var(--gt-exp-ink);
	background: #fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23152169' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;
	border: 1px solid var(--gt-exp-border);
	border-radius: 8px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	line-height: 1.4;
	box-sizing: border-box;
}
.gt-expert-booking-right select#wc-bookings-form-start-time:hover,
.gt-expert-booking-right select#wc-bookings-form-end-time:hover {
	border-color: var(--gt-exp-blue-light);
}
.gt-expert-booking-right select#wc-bookings-form-start-time:focus,
.gt-expert-booking-right select#wc-bookings-form-end-time:focus {
	outline: none;
	border-color: var(--gt-exp-blue-light);
	box-shadow: 0 0 0 3px rgba(47, 99, 245, 0.15);
}
/* 选项文字提示行 (Start time / End time placeholder) */
.gt-expert-booking-right select#wc-bookings-form-start-time option[value="0"],
.gt-expert-booking-right select#wc-bookings-form-end-time option[value="0"] {
	color: var(--gt-exp-gray);
}
.gt-expert-booking-right .timezone-details {
	display: none;
}

/* 右容器内: panel 内容 (无独立边框, 随右容器一体) */
.gt-expert-booking-panel {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
}

/* 新会员首单免费提示 */
.gt-expert-new-member-note {
	margin: 0 0 12px;
	padding: 10px 12px;
	background: #E8F0FE;
	border: 1px solid #B8CCF5;
	border-radius: 8px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--gt-exp-blue);
}

/* ---------- 购物车非空弹窗 ---------- */
.gt-expert-cart-modal {
	display: none;
}
.gt-expert-cart-modal.is-open {
	display: block;
}
.gt-expert-cart-modal__overlay {
	position: fixed;
	inset: 0;
	background: rgba(21, 24, 37, 0.45);
	z-index: 99990;
}
.gt-expert-cart-modal__box {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(420px, calc(100vw - 40px));
	background: #fff;
	border-radius: 14px;
	padding: 26px 28px 22px;
	box-shadow: 0 12px 40px rgba(21, 24, 37, 0.25);
	z-index: 99991;
	box-sizing: border-box;
}
.gt-expert-cart-modal__title {
	margin: 0 0 10px;
	font-size: 19px;
	font-weight: 700;
	color: var(--gt-exp-ink);
}
.gt-expert-cart-modal__text {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--gt-exp-gray);
}
.gt-expert-cart-modal__actions {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
}
.gt-expert-cart-modal__actions .gt-expert-btn {
	font-size: 14px;
	padding: 10px 16px;
}
.gt-expert-cart-modal__cancel {
	background: none;
	border: none;
	color: var(--gt-exp-gray);
	font-size: 13px;
	cursor: pointer;
	text-decoration: underline;
	padding: 8px;
}
.gt-expert-booking-panel .wc-bookings-booking-cost {
	margin: 0;
	padding: 10px 0 2px;
	font-size: 18px;
	font-weight: 600;
	color: var(--gt-exp-ink);
}
.gt-expert-booking-form .gt-expert-booking-meta {
	margin: 0;
	padding: 6px 0 0;
	font-size: 13px;
	color: var(--gt-exp-gray);
}

/* 按钮: 框内底部 */
.gt-expert-booking-panel .wc-bookings-booking-form-button {
	margin: 16px 0 0;
	background: var(--gt-exp-blue);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 12px 32px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	width: 100%;
}
.gt-expert-booking-form .wc-bookings-booking-form-button:hover {
	background: var(--gt-exp-blue-light);
}
.gt-expert-booking-form .wc-bookings-booking-form-button:disabled {
	background: #c7cdd8;
	cursor: not-allowed;
}

/* 时长提示 (设计稿: 30 min • video call or on-site in Basel) — 已并入右侧卡片框样式 */

/* 预约地点单选按钮组 */
.gt-expert-booking-location {
	margin: 0 0 10px;
}
.gt-expert-booking-location > label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--gt-exp-ink);
	margin-bottom: 6px;
}
.gt-expert-location-options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.gt-expert-location-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border: 1px solid var(--gt-exp-border);
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	font-size: 14px;
	color: var(--gt-exp-ink);
	transition: border-color .15s, background .15s;
}
.gt-expert-location-option input[type="radio"] {
	margin: 0;
	accent-color: var(--gt-exp-blue);
}
.gt-expert-location-option:has(input:checked) {
	border-color: var(--gt-exp-blue);
	background: rgba(47, 99, 245, .06);
}

/* 时间选择格子样式 (设计稿: 09:00-16:00 列表) */
.gt-expert-booking-form .block-picker {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
	/* 覆盖 Bookings 自带 overflow:hidden (会裁剪下拉/内容) */
	overflow: visible;
	zoom: 1;
	min-height: 30px;
}
.gt-expert-booking-form .block-picker li {
	float: none;
	min-width: 0;
	padding: 0;
}
.gt-expert-booking-form .block-picker li a {
	margin: 0;
	padding: 10px 0;
	border: 1px solid var(--gt-exp-border);
	border-radius: 8px;
	background: #fff !important;
	color: var(--gt-exp-ink) !important;
	text-align: center;
	display: block;
	text-decoration: none;
	transition: all .15s;
}
.gt-expert-booking-form .block-picker li a:hover {
	border-color: var(--gt-exp-blue-light);
	color: var(--gt-exp-blue-light) !important;
}
.gt-expert-booking-form .block-picker li a.selected {
	background: var(--gt-exp-blue) !important;
	border-color: var(--gt-exp-blue);
	color: #fff !important;
}
.gt-expert-booking-form .block-picker li.unavailable a {
	background: #fff !important;
	color: #c7cdd8 !important;
	border-color: #e5e7ee;
	pointer-events: none;
}

/* 隐藏时区提示和日期字段 (设计稿无) */
.gt-expert-booking-form .wc-bookings-date-picker-timezone-block,
.gt-expert-booking-form .wc-bookings-date-picker-date-fields {
	display: none !important;
}

/* ---------- Directory ---------- */

.gt-expert-hero {
	padding: 48px 0 32px;
}

.gt-expert-hero__kicker {
	font-size: 15px;
	letter-spacing: .14em;
	color: var(--gt-exp-blue);
	text-transform: uppercase;
	margin: 0 0 12px;
}

.gt-expert-hero__title {
	font-size: 44px;
	font-weight: 500;
	margin: 0 0 16px;
}

.gt-expert-hero__note {
	font-size: 15px;
	color: var(--gt-exp-gray);
	max-width: 680px;
	line-height: 1.6;
}

.gt-expert-filters {
	background: var(--gt-exp-bg);
	border-radius: 16px;
	padding: 24px;
	margin-bottom: 32px;
}

.gt-expert-filter {
	margin-bottom: 16px;
}
.gt-expert-filter:last-of-type {
	margin-bottom: 20px;
}

.gt-expert-filter__label {
	display: block;
	font-size: 12px;
	letter-spacing: .12em;
	color: var(--gt-exp-gray);
	margin-bottom: 10px;
}

.gt-expert-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.gt-expert-chip {
	appearance: none;
	border: 1px solid var(--gt-exp-border);
	background: #fff;
	border-radius: 999px;
	padding: 7px 16px;
	font-size: 13px;
	color: var(--gt-exp-ink);
	cursor: pointer;
	transition: all .15s;
}
.gt-expert-chip:hover {
	border-color: var(--gt-exp-blue-light);
	color: var(--gt-exp-blue-light);
}
.gt-expert-chip.is-active {
	background: var(--gt-exp-blue);
	border-color: var(--gt-exp-blue);
	color: #fff;
}

.gt-expert-directory__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 20px;
}
.gt-expert-directory__title {
	font-size: 24px;
	font-weight: 500;
	margin: 0;
}
.gt-expert-directory__count {
	font-size: 13px;
	color: var(--gt-exp-gray);
}

.gt-expert-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	padding-bottom: 80px;
}

.gt-expert-card {
	display: block;
	background: #fff;
	border: 1px solid var(--gt-exp-border);
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: box-shadow .15s, transform .15s;
}
.gt-expert-card:hover {
	box-shadow: 0 8px 24px rgba(21, 40, 105, .12);
	transform: translateY(-2px);
}

.gt-expert-card__avatar {
	aspect-ratio: 4 / 3;
	background: var(--gt-exp-bg);
}
.gt-expert-card__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
	display: block;
}

.gt-expert-card__name {
	font-size: 18px;
	font-weight: 500;
	margin: 16px 16px 4px;
}

.gt-expert-card__title {
	font-size: 13px;
	color: var(--gt-exp-gray);
	margin: 0 16px 12px;
}

.gt-expert-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 0 16px 16px;
}

.gt-expert-directory__empty {
	color: var(--gt-exp-gray);
	padding: 40px 0;
	text-align: center;
}

/* AJAX 加载状态: 专家区域中央旋转圈圈 */
.gt-expert-directory__results {
	position: relative;
}
.gt-expert-directory__results.gt-expert-loading {
	opacity: .45;
	transition: opacity .15s;
}
.gt-expert-directory__results.gt-expert-loading::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 -10px;
	border: 3px solid rgba(47, 99, 245, .18);
	border-top-color: var(--gt-exp-blue-light);
	border-radius: 50%;
	animation: gt-expert-spin .7s linear infinite;
	z-index: 5;
	pointer-events: none;
}
@keyframes gt-expert-spin {
	to { transform: rotate(360deg); }
}

/* ---------- 响应式 ---------- */

@media (max-width: 1024px) {
	.gt-expert-cards { grid-template-columns: repeat(2, 1fr); }
	.gt-expert-wrap { padding: 0 24px; }
	.gt-expert-profile__header { flex-direction: column; }
}

@media (max-width: 600px) {
	.gt-expert-cards { grid-template-columns: 1fr; }
	.gt-expert-profile__name { font-size: 32px; }
}