/*
 * Fiok oldal (my-account) javitasai.
 *
 * A szulo tema sajat myaccount-sablonokat hoz, es a sajat gombstilusat rahuzza
 * minden <button>-re a formokon belul. Ettol ket dolog romlik el:
 *
 *   1. A sotet dobozokban a szovegszin fekete marad, igy a "Regisztracio"
 *      cimsor olvashatatlan a sotetkek hatteren.
 *   2. A WooCommerce jelszo-mutato gombja (.show-password-input) megkapja a
 *      tema piros keretet es a ::before piros kitolteset, ezert tomor piros
 *      teglalapkent ul a mezo ALATT — a szulo .password-input ugyanis static,
 *      igy a gomb nem tud a mezobe pozicionalodni.
 *
 * Csak a fiok oldalra szukitve, hogy a bolt tobbi resze valtozatlan maradjon.
 */

/* ---- 1. Olvashato szoveg a sotet dobozokban ---- */

.woocommerce-account .u-columns .col-1,
.woocommerce-account .u-columns .col-2 {
	color: #fff;
}

.woocommerce-account .u-columns .col-1 h2,
.woocommerce-account .u-columns .col-1 h4,
.woocommerce-account .u-columns .col-2 h2,
.woocommerce-account .u-columns .col-2 h4 {
	color: #fff;
}

/* ---- 2. Jelszo-mutato gomb vissza a mezobe ---- */

.woocommerce-account form .password-input {
	position: relative;
	display: block;
}

.woocommerce-account form .show-password-input {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	min-width: 0;
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	opacity: .55;
	cursor: pointer;
	/* Szem ikon, hogy ne fuggjunk a tema ikonfontjatol. */
	background-image: url( 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%231a1a1a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>' );
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}

.woocommerce-account form .show-password-input:hover {
	opacity: .9;
}

/* A tema a ::before-ral tolti ki pirosra a gombokat — itt nem kell. */
.woocommerce-account form .show-password-input::before,
.woocommerce-account form .show-password-input::after {
	content: none;
	display: none;
}

/* Lathato allapot: athuzott szem. */
.woocommerce-account form .show-password-input.display-password {
	background-image: url( 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%231a1a1a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/></svg>' );
	opacity: .9;
}

/* A jelszomezo ne fusson bele az ikonba. */
.woocommerce-account form .password-input input {
	padding-right: 42px;
}

/* ---- 3. Gombok: a tema sajat alapszabalya szerint ---- */

/*
 * A tema styles.css-e kimondja, hogy `input[type="submit"] { background: #bc1e31 !important }`,
 * majd egy `#customer_login ...` szaballyal ezt sotetre irja felul. A hover-effekt
 * piros kitoltese kozben ::before-on, z-index: -1-en ul, vagyis az atlatszatlan sotet
 * hatter mogott — sosem latszik. Igy a fiok oldal gombja se nem piros, se nem reagal.
 *
 * Visszaallitjuk a tema sajat alapszinere. Ugyanazt az ID-specificitast kell hoznunk,
 * kulonben a !important-os szabaly nyer.
 */
#customer_login input[type="submit"],
#customer_login .col-1 input[type="submit"],
#customer_login .col-2 input[type="submit"] {
	background-color: #bc1e31 !important;
	border-color: #bc1e31 !important;
	color: #fff !important;
}

#customer_login input[type="submit"]:hover,
#customer_login .col-1 input[type="submit"]:hover,
#customer_login .col-2 input[type="submit"]:hover {
	background-color: #9c1828 !important;
	border-color: #9c1828 !important;
}

/* ---- 4. Elfelejtett jelszo es "Emlekezz ram" vissza ---- */

/*
 * A tema egy `#customer_login ... .lost_password { display: none }` szaballyal
 * elrejti az elfelejtett-jelszo linket, es a checkboxot is 0x0-ra huzza. Ettol
 * a vasarlo sehogy nem tud jelszot visszaallitani errol az oldalrol — ami
 * webshopnal egyenes ut az ugyfelszolgalati korlevelekhez.
 */
#customer_login .lost_password,
#customer_login .col-1 .lost_password,
#customer_login .col-2 .lost_password {
	display: block !important;
	margin-top: 14px;
}

#customer_login .lost_password a {
	color: #fff;
	text-decoration: underline;
}

#customer_login .lost_password a:hover {
	color: #f2c3ca;
}

#customer_login .woocommerce-form-login__rememberme,
#customer_login label.inline {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	color: #fff;
}

#customer_login #rememberme {
	width: 16px !important;
	height: 16px !important;
	min-width: 16px;
	margin: 0;
	opacity: 1;
	position: static;
	appearance: auto;
	-webkit-appearance: checkbox;
}
