/* GolfSeed - My Account custom styles (avatar, tab Thong tin tai khoan, Mat khau, Giai dau tham gia) */

/* Avatar + loi chao nam BEN TRONG cung 1 khoi cream voi menu (khong tao khoi
   rieng) de khop dung khung ".woocommerce-MyAccount-navigation" theme da co. */
.golfseed-account-greeting {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}

/* Chinh lai chieu rong toan bo khoi Tai khoan cho khop chuan chieu rong noi
   dung THAT SU cua site. Da kiem tra bang DevTools: cac section Elementor
   (container/flexbox moi) tren site dung bien --content-width = min(100%,
   1430px). Trang "Tai khoan" lai khong dung Elementor Container moi ma dung
   grid Bootstrap cu cua theme (div#pxl-content-area nam BEN TRONG 1 the
   ".container" rieng, gioi han max-width: 1312px trong style.css) - do la ly
   do khoi bi hep hon phan con lai cua site. Ep lai .container ve dung 1430px,
   nhung CHI o trang Tai khoan (body.woocommerce-account) de khong lam vo cac
   trang khac dang dung dung .container 1312px cu.
   QUAN TRONG: footer (template-parts/footer/default.php) cung co RIENG 1 the
   ".container" khac (nam ngoai #pxl-content-area, trong get_footer()) - neu
   chon thang ".container" se trung ca cai cua footer, lam footer bi keo
   rong/vo bo cuc theo (da tung xay ra tren trang GolfSeed Ranking, cung loi
   nay). Dung ":has(#pxl-content-area)" de chi nham dung the .container nao
   thuc su la cha cua #pxl-content-area. */
body.woocommerce-account .container:has(#pxl-content-area) {
	max-width: min(100%, 1430px) !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.woocommerce-account #pxl-content-area {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.golfseed-account-avatar {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid #a9c93c;
}

.golfseed-greeting-text {
	font-size: 13px;
	color: #6b6b5a;
}

.golfseed-greeting-name {
	font-weight: 600;
	color: #16382c;
}

.golfseed-account-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.golfseed-account-nav li {
	margin-bottom: 8px;
}

.golfseed-account-nav li a {
	display: block;
	padding: 12px 16px;
	border-radius: 6px;
	background: #fff;
	color: #16382c;
	text-decoration: none;
}

.golfseed-account-nav li.is-active a,
.golfseed-account-nav li a[aria-current="page"] {
	background: #16382c;
	color: #fff;
}

/* ---- Thong bao trang thai ho so ---- */

.golfseed-notice {
	padding: 12px 16px;
	border-radius: 6px;
	margin-bottom: 20px;
	font-size: 14px;
}

.golfseed-notice--pending {
	background: #fff8e1;
	border: 1px solid #f0c419;
	color: #6b5300;
}

.golfseed-notice--rejected {
	background: #fdeceb;
	border: 1px solid #e57373;
	color: #8a2c22;
}

.golfseed-notice--first-time {
	background: #eef7ec;
	border: 1px solid #a9c93c;
	color: #2e4c1e;
}

/* ---- Form Thong tin tai khoan / Mat khau ---- */

.golfseed-account-form h3,
.golfseed-password-form h3 {
	margin: 0 0 20px !important;
	font-size: 24px !important;
	line-height: 42px !important;
	font-weight: 700 !important;
	color: #02151a !important;
}

/* Khung the trang (card) trang: nen trang, vien mong, bo goc - dung chung
   cho "Thong tin tai khoan". Header co dong ke phia duoi tach voi noi dung,
   giong Figma. */
.golfseed-card {
	background: #fff;
	border: 1px solid #e9e9e9;
	border-radius: 8px;
	padding: 24px 32px 32px;
}

.golfseed-card-header {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.6;
	color: #02151a;
	margin: -24px -32px 24px;
	padding: 24px 32px 16px;
	border-bottom: 1px solid #e9e9e9;
}

/* Layout 2 cot: anh dai dien BEN TRAI, cac truong nhap BEN PHAI (dung theo
   Figma - truoc do bi xep doc nen sai). */
.golfseed-account-form-layout {
	display: flex;
	align-items: flex-start;
	gap: 32px;
}

.golfseed-avatar-col {
	flex: 0 0 138px;
	width: 138px;
	text-align: center;
}

.golfseed-fields-col {
	flex: 1 1 auto;
	min-width: 0;
}

.golfseed-avatar-preview img {
	width: 138px;
	height: 138px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid #ebecef;
}

.golfseed-avatar-actions {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 10px;
}

/* Nut sua/xoa avatar - dung all:unset + !important vi theme co san rule
   "button:not(.btn)" (padding 13px 30px, nen mau xanh, display:flex) do
   dac ta cao hon (0,1,1) so voi .golfseed-icon-btn (0,1,0), khien rieng nut
   xoa (<button>, con nut sua la <label> nen khong bi anh huong) bi phinh to
   va doi mau thay vi giu dung kich thuoc hinh tron 32x32 nhu nut sua. */
.golfseed-icon-btn {
	all: unset !important;
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 32px !important;
	height: 32px !important;
	border-radius: 50% !important;
	background: #f0f0e0 !important;
	border: none !important;
	cursor: pointer !important;
}

.golfseed-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 20px;
}

.golfseed-form-row {
	margin-bottom: 16px;
}

.golfseed-form-row label {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	color: #2c2c2c;
}

.golfseed-form-row--social label {
	color: #5e6267;
}

.golfseed-input {
	width: 100%;
	height: 56px;
	padding: 0 16px;
	border: 1px solid rgba(8, 108, 102, 0.2);
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 14px;
	color: #02151a;
}

.golfseed-input::placeholder {
	color: #5e6267;
}

select.golfseed-input {
	height: 56px;
}

@media (max-width: 600px) {
	.golfseed-account-form-layout {
		flex-direction: column;
		align-items: center;
	}
}

.golfseed-radio-group {
	display: flex;
	gap: 20px;
}

.golfseed-radio {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: normal;
	font-size: 14px;
	color: #2c2c2c;
}

.golfseed-radio input[type="radio"] {
	width: 20px;
	height: 20px;
	margin: 0;
	border: 1.3px solid #086c66;
	border-radius: 50%;
	accent-color: #16382c;
}

.golfseed-social-row {
	position: relative;
	display: flex;
	gap: 8px;
	align-items: center;
	margin-bottom: 8px;
}

.golfseed-social-icon {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 14px;
	pointer-events: none;
}

.golfseed-social-icon--img {
	width: 18px;
	height: 18px;
	font-size: 0;
}

/* !important vi theme co rule input[type="url"] (dac ta cao hon do dung
   attribute selector) dat san padding:6px 20px, de len padding-left 44px
   nay khien icon che mat chu "http://". */
.golfseed-input--icon {
	padding-left: 44px !important;
}

.golfseed-remove-social {
	border: none;
	background: transparent;
	cursor: pointer;
	color: #a00;
	font-size: 14px;
	flex: 0 0 auto;
}

.golfseed-add-link-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: #f6f7e5 !important;
	border: 1px solid #e9e9e9 !important;
	border-radius: 4px !important;
	height: 52px;
	width: 100%;
	cursor: pointer;
	margin-top: 4px;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #084743 !important;
	text-align: center;
	text-transform: none !important;
}

.golfseed-add-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border: 1.4px solid currentColor;
	border-radius: 50%;
	font-size: 13px;
	line-height: 1;
	flex: 0 0 auto;
}

.golfseed-save-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 56px;
	background: #e9e9e9 !important;
	color: #02151a !important;
	border: none !important;
	border-radius: 4px !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 24px !important;
	letter-spacing: 1px !important;
	text-transform: uppercase;
}

/* ---- Tab Giai dau tham gia ---- */

.golfseed-orders-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 16px;
}

.golfseed-orders-title {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.6;
	color: #02151a;
}

.golfseed-orders-controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Dung dung kich thuoc trong Figma: o Tim kiem 330x40, dropdown sap xep
   cao 40, rong theo noi dung (~124px), cung border/mau. */
.golfseed-search-box {
	position: relative;
	display: inline-block;
}

.golfseed-search-icon {
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 13px;
	pointer-events: none;
	opacity: 0.6;
}

#golfseed-orders-search {
	width: 330px;
	height: 40px;
	padding: 0 40px 0 16px;
	border: 1px solid #e9e9e9;
	border-radius: 4px;
	background: #fff;
	box-sizing: border-box;
	font-size: 14px;
	color: #02151a;
}

#golfseed-orders-search::placeholder {
	font-size: 14px;
	color: #02151a;
	opacity: 1;
}

#golfseed-orders-sort {
	height: 40px;
	min-width: 124px;
	padding: 0 11px;
	border: 1px solid #e9e9e9;
	border-radius: 4px;
	background: #fff;
	box-sizing: border-box;
	font-size: 15px;
	font-weight: 600;
	color: #02151a;
	text-align: center;
	text-align-last: center;
}

@media (max-width: 480px) {
	#golfseed-orders-search {
		width: 100%;
	}
}

.golfseed-orders-table {
	width: 100%;
	border-collapse: collapse;
}

.golfseed-orders-table th {
	text-align: left;
	padding: 10px 20px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	color: #02151a;
	background: #e9e9e9;
	border-bottom: 1px solid #e9e9e9;
	border-right: 1px solid #e9e9e9;
}

.golfseed-orders-table th:last-child {
	border-right: none;
}

.golfseed-orders-table td {
	padding: 12px 20px;
	border-bottom: 1px solid #f0f0f0;
	vertical-align: middle;
}

.golfseed-order-info-inner {
	display: flex;
	align-items: center;
	gap: 16px;
}

.golfseed-order-thumb {
	width: 112px;
	height: 112px;
	object-fit: cover;
	border-radius: 8px;
	flex: 0 0 auto;
}

.golfseed-order-name {
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: #02151a;
	text-decoration: none;
}

.golfseed-order-submeta {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	font-size: 14px;
	line-height: 1.6;
	color: #02151a;
	margin-top: 4px;
}

.golfseed-status-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.6;
	text-align: center;
}

.golfseed-status-upcoming {
	background: rgba(0, 117, 255, 0.1);
	color: #0075ff;
}

.golfseed-status-ongoing {
	background: rgba(150, 197, 82, 0.1);
	color: #96c552;
}

.golfseed-status-ended {
	background: rgba(219, 68, 68, 0.1);
	color: #db4444;
}

.golfseed-view-btn {
	background: #f0f0e0 !important;
	color: #16382c !important;
	border-radius: 6px !important;
	padding: 6px 16px !important;
}

@media (max-width: 782px) {
	.golfseed-form-grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================================================
 * Header rieng cho trang Tai khoan: mui ten back + "Tai khoan" + breadcrumb,
 * thay cho banner tieu de mac dinh cua theme ("My account" + khoang trang
 * lon). An banner goc bang CSS (khong sua header.php/class-page.php de
 * khong anh huong cac trang khac dang dung chung banner do).
 * ========================================================================= */

body.woocommerce-account #pxl-ptit__default {
	display: none !important;
}

.golfseed-account-topbar {
	padding: 24px 0 28px;
}

.golfseed-account-topbar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
}

.golfseed-account-back {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

.golfseed-account-back-arrow {
	font-size: 22px;
	line-height: 1;
	color: #02151a;
}

/* Dung dung so lieu Figma dev-mode: tieu de "Tai khoan" Open Sans 700,
   24px, line-height 20px, mau #02151A. */
.golfseed-account-back-title {
	font-family: "Open Sans", sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: 0;
	color: #02151a;
}

.golfseed-account-breadcrumb {
	display: flex;
	align-items: center;
	gap: 6px;
	font-family: "Open Sans", sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0;
}

/* "Trang chu": Open Sans 400, 16px, line-height 24px, mau #5E6267. */
.golfseed-account-breadcrumb a {
	color: #5e6267;
	text-decoration: none;
}

.golfseed-account-breadcrumb a:hover {
	color: #084743;
}

/* "Tai khoan" (muc hien tai): Open Sans 400, 16px, line-height 24px,
   mau #02151A (khong bold/xanh nhu truoc). */
.golfseed-account-breadcrumb-current {
	color: #02151a;
	font-weight: 400;
}

@media (max-width: 782px) {
	.golfseed-account-topbar {
		padding: 16px 0 20px;
	}
	.golfseed-account-back-title {
		font-size: 20px;
	}
	.golfseed-account-breadcrumb {
		font-size: 13px;
	}
}
