/**
 * @third-party:LRM
 *
 * LRM(Ajax Login Registration Modal Popup Pro)樣式覆蓋
 *
 * Loaded by: canvas/src/Services/HeaderFooter/WooCommerceIntegration.php
 *            (enqueue_lrm_styles())
 *
 * Plugin 用清楚的 .lrm-* class prefix,我們用 !important 覆蓋它的硬編碼配色,
 * 把面板背景 / input / button / link / 標題對齊 hauzii design token。Modal 可能
 * 在任何頁面 trigger,因此跟 mini-cart 一樣全站載入(掛在 hauzii-tailwind 上)。
 *
 * Input background 故意寫死 #ffffff(功能性 UI 強制白底,不隨 palette 變)。
 * Chrome autofill 會用 internal :-webkit-autofill 蓋背景,要用 inset box-shadow trick 打贏。
 */

/* === LRM Login/Register Modal Override === */

/* 面板背景 — modal(浮出)與 inline(嵌入 my-account 頁)共用同一個元素
   .lrm-user-modal-container-inner;LRM 自家 lrm-core-compiled.css 寫死白底,
   改成 color.01。選中的分頁標籤(.selected)也是白底,一併同色,
   否則會在米色面板上浮出一塊白。未選中分頁維持灰,保留作用中對比。 */
.lrm-user-modal-container-inner {
	background-color: var(--hz-color-01) !important;
}

.lrm-switch-to-link.selected {
	background-color: var(--hz-color-01) !important;
}

/* 整體 form 字體統一 hauzii typo */
.lrm-form,
.lrm-form * {
	font-family: var(--hz-typo-typo-06-ff) !important;
}

/* Inputs — bg 強制白(功能性,不隨 palette);字色/邊框走 hauzii token */
.lrm-form input[type="text"],
.lrm-form input[type="email"],
.lrm-form input[type="password"] {
	background-color: #ffffff !important;
	color: var(--hz-color-09) !important;
	border: 1px solid var(--hz-surface-02-border) !important;
	border-radius: var(--hz-surface-02-radius) !important;
	font-size: var(--hz-typo-typo-19-fs) !important;
}

/* Chrome autofill 用 inset box-shadow 蓋過 internal 淡藍 */
.lrm-form input:-webkit-autofill,
.lrm-form input:-webkit-autofill:hover,
.lrm-form input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 30px #ffffff inset !important;
	-webkit-text-fill-color: var(--hz-color-09) !important;
}

/* Submit button(登入 / 註冊)— 藍 → color.04 CTA */
.lrm-form button[type="submit"] {
	background-color: var(--hz-color-04) !important;
	color: var(--hz-color-11) !important;
	font-family: var(--hz-typo-typo-09-ff) !important;
	font-size: var(--hz-typo-typo-09-fs) !important;
	font-weight: var(--hz-typo-typo-09-fw) !important;
	border-radius: var(--hz-button-01-radius) !important;
	border: none !important;
}
.lrm-form button[type="submit"]:hover {
	opacity: 0.85;
}

/**
 * 「記住我」/ 條款同意等勾選框 —— LRM 硬碼藍 #0B76EF
 *
 * ⚠️ 打不到 input。LRM 的 .lrm-nice-checkbox 是 `position:absolute; opacity:0`
 *    的 0×0 元素，勾選框由相鄰的 .lrm-nice-checkbox__indicator div 畫，勾勾則是
 *    該 div 的 ::after 用 border 折出來的。所以 checkout 那份
 *    `input[type="checkbox"]:checked` 規則對這裡完全無效（實測 input 的
 *    computed background 已是 color.14，畫面上仍是藍的）—— 同理也別寫
 *    accent-color，它對 div 不參與繪製。
 *
 * Slot 對齊 checkout 的表單控制項：未選中 color.20 Default Border、
 * 選中 color.14 Primary Accent、勾勾 color.11（深底上的反白）。
 * disabled 態的灰底維持 LRM 原樣（功能性狀態，不隨 palette 走）。
 */
.lrm-nice-checkbox__label .lrm-nice-checkbox__indicator {
	border-color: var(--hz-color-20) !important;
}

.lrm-nice-checkbox__label input:checked ~ .lrm-nice-checkbox__indicator,
.lrm-nice-checkbox__label:hover input:not([disabled]):checked ~ .lrm-nice-checkbox__indicator,
.lrm-nice-checkbox__label input:checked:focus ~ .lrm-nice-checkbox__indicator {
	background: var(--hz-color-14) !important;
	border-color: var(--hz-color-14) !important;
}

.lrm-nice-checkbox__label input:checked ~ .lrm-nice-checkbox__indicator::after {
	border-color: var(--hz-color-11) !important;
}

/* Modal 標題 */
.lrm-user-modal h2,
.lrm-user-modal h3 {
	color: var(--hz-color-07) !important;
	font-family: var(--hz-typo-typo-04-ff) !important;
}

/* Modal 內 link(忘記密碼 / 切換登入註冊 / 第三方 OAuth 等) */
.lrm-form a,
.lrm-user-modal a:not([class*="button"]) {
	color: var(--hz-color-14) !important;
}

/**
 * 「登入 / 註冊新帳號」分頁標籤 —— 文字回 heading 深字
 *
 * 這兩顆是分頁而不是連結，被上面那條通用 link 規則掃到後整排變 color.14 紅棕，
 * 跟左邊 icon 糊成一片。改用 color.07，紅棕留給 icon 與 CTA。
 * 上一條帶 !important(0,0,2,1)，這裡靠 0,0,3,1 的 specificity 才蓋得掉。
 *
 * ⚠️ icon 不在這裡處理。LRM 的分頁 icon 是 PNG background-image
 *    (free/assets/img/login.png、register.png)，`color` 對它無效 ——
 *    要換色得用 mask-image + background-color 把 PNG 當遮罩，且會綁死
 *    LRM 的檔案路徑。目前刻意維持 plugin 原樣。
 */
.lrm-user-modal-container .lrm-switcher a.lrm-switch-to-link {
	color: var(--hz-color-07) !important;
}