/*
 * Moje konto (WooCommerce) — logowanie/rejestracja + panel zalogowanego.
 * BEM: dehoust-account__*. Zależny od dehoust-main. Improwizacja spójna z motywem
 * (pola jak w kontakcie/checkoucie, przyciski dehoust-btn, akcent #096cb2).
 */

.dehoust-account {
	background: #fff;
	padding-block: 2.75rem 3.5rem;
}

@media (min-width: 1024px) {
	.dehoust-account {
		padding-block: 3.75rem 4.5rem;
	}
}

/* ---------- Wspólne: karta, nagłówek z akcentem, pola, przyciski ---------- */

.dehoust-account__card {
	box-sizing: border-box;
	padding: 1.75rem;
	border: 0.8px solid var(--dehoust-color-accent);
	border-radius: 0.75rem;
	background: #fff;
}

@media (min-width: 768px) {
	.dehoust-account__card {
		padding: 2.25rem;
	}
}

.dehoust-account__card-heading {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}

.dehoust-account__card-title,
.dehoust-account .woocommerce-MyAccount-content h2,
.dehoust-account .woocommerce-MyAccount-content h3 {
	margin: 0;
	font-family: var(--dehoust-font-heading);
	font-size: 1.5rem; /* 24 px */
	font-weight: 700;
	line-height: 1.25;
	color: var(--dehoust-color-text);
}

.dehoust-account__card-accent {
	display: block;
	width: 2.5rem; /* 40 px */
	height: 0.375rem; /* 6 px */
	background: var(--dehoust-color-primary); /* #096cb2 */
}

/* Pola formularzy (login/rejestracja + edycja konta/adresu) */
.dehoust-account__form {
	display: flex;
	flex-direction: column;
	gap: 1.125rem;
}

.dehoust-account__field,
.dehoust-account .woocommerce-form-row {
	display: flex;
	flex-direction: column;
	gap: 0.4375rem;
	margin: 0;
}

.dehoust-account label,
.dehoust-account .woocommerce-form-row label {
	font-family: var(--dehoust-font-body);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--dehoust-color-text);
}

.dehoust-account__input,
.dehoust-account input.input-text,
.dehoust-account input[type="text"],
.dehoust-account input[type="email"],
.dehoust-account input[type="password"],
.dehoust-account input[type="tel"] {
	box-sizing: border-box;
	width: 100%;
	height: 3.25rem; /* 52 px */
	border: 0.8px solid var(--dehoust-color-primary); /* #096cb2 */
	border-radius: 0.5rem; /* 8 px */
	background: #fff;
	padding: 0 1rem;
	font-family: var(--dehoust-font-body);
	font-size: 1rem;
	color: var(--dehoust-color-text);
}

.dehoust-account__input::placeholder,
.dehoust-account input::placeholder {
	color: var(--dehoust-color-muted);
}

.dehoust-account__input:focus-visible,
.dehoust-account input:focus-visible {
	outline: 2px solid var(--dehoust-color-primary);
	outline-offset: 1px;
}

.dehoust-account .required {
	color: var(--dehoust-color-primary);
	border: 0;
}

.dehoust-account__form-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin: 0.25rem 0 0;
}

.dehoust-account__checkbox {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 500;
	color: var(--dehoust-color-text-muted);
}

.dehoust-account__checkbox input {
	width: 1.125rem;
	height: 1.125rem;
	accent-color: var(--dehoust-color-primary);
}

.dehoust-account__submit {
	min-height: 3.25rem;
	padding-inline: 1.75rem;
}

.dehoust-account__lost {
	margin: 0.25rem 0 0;
}

.dehoust-account__lost a {
	font-size: 0.9375rem;
	color: var(--dehoust-color-primary);
	text-decoration: none;
}

.dehoust-account__lost a:hover {
	text-decoration: underline;
}

.dehoust-account__note {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--dehoust-color-text-muted);
}

/* ---------- Stan niezalogowany: dwie kolumny ---------- */

.dehoust-account__auth {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}

@media (min-width: 900px) {
	.dehoust-account__auth--split {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2rem;
	}
}

/* ---------- Stan zalogowany: nawigacja + treść ---------- */

.dehoust-account .woocommerce-MyAccount-navigation ul,
.dehoust-account .woocommerce-MyAccount-content {
	margin: 0;
}

.dehoust-account .woocommerce {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.75rem;
}

/* Notices nie mogą zajmować kolumny nawigacji */
.dehoust-account .woocommerce-notices-wrapper {
	grid-column: 1 / -1;
}

/* Siatka 260px (nawigacja + treść) tylko dla zalogowanego panelu.
   Na stronie logowania brak nawigacji → treść pełnej szerokości (bez pustej kolumny). */
@media (min-width: 900px) {
	body.logged-in .dehoust-account .woocommerce {
		grid-template-columns: 16.25rem minmax(0, 1fr); /* 260 px + treść */
		gap: 2.5rem;
		align-items: start;
	}
}

/* Kursor „łapka" na wszystkich elementach interaktywnych konta */
.dehoust-account button,
.dehoust-account [type="submit"],
.dehoust-account .button,
.dehoust-account .woocommerce-Button,
.dehoust-account .woocommerce-button,
.dehoust-account a.dehoust-btn,
.dehoust-account label,
.dehoust-account input[type="checkbox"],
.dehoust-account .show-password-input {
	cursor: pointer;
}

.dehoust-account label.dehoust-account__label,
.dehoust-account .woocommerce-form-row > label:first-child {
	cursor: default; /* etykiety pól — bez łapki */
}

/* Toggle podglądu hasła (WooCommerce .show-password-input / .display-password) */
.dehoust-account .password-input {
	position: relative;
	display: block;
}

.dehoust-account .password-input input {
	width: 100%;
	padding-right: 2.875rem; /* miejsce na ikonę oka */
}

.dehoust-account .show-password-input {
	position: absolute;
	top: 0;
	right: 0;
	width: 2.875rem;
	height: 100%;
	margin: 0;
	padding: 0;
	/* Reset domyślnego chrome <button> (border/tło/appearance) — inaczej ikona
	   renderuje się jako szary prostokąt z ramką zamiast czystego oka w polu. */
	border: 0;
	background-color: transparent;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23096cb2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.25rem;
	transition: opacity var(--dehoust-transition);
}

.dehoust-account .show-password-input:hover {
	opacity: 0.7;
}

.dehoust-account .show-password-input:focus:not(:focus-visible) {
	outline: 0;
}

.dehoust-account .show-password-input:focus-visible {
	outline: 2px solid var(--dehoust-color-primary);
	outline-offset: 2px;
}

.dehoust-account .show-password-input.display-password {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23096cb2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-10-8-10-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 10 8 10 8a18.5 18.5 0 0 1-2.16 3.19'/%3E%3Cpath d='m1 1 22 22'/%3E%3C/svg%3E");
}

/* Nawigacja jako karta z zakładkami */
.dehoust-account .woocommerce-MyAccount-navigation {
	font-family: var(--dehoust-font-body);
}

.dehoust-account .woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.625rem;
	list-style: none;
	border: 0.8px solid #d6ebf6;
	border-radius: 0.75rem;
	background: var(--dehoust-color-surface); /* #e6f5fc */
}

.dehoust-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 0.75rem 1rem;
	border-radius: 0.5rem;
	font-size: 1rem;
	font-weight: 600;
	color: var(--dehoust-color-text);
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.dehoust-account .woocommerce-MyAccount-navigation li a:hover {
	background: #fff;
	color: var(--dehoust-color-primary);
}

.dehoust-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--dehoust-color-primary); /* #096cb2 */
	color: #fff;
}

/* Treść panelu */
.dehoust-account .woocommerce-MyAccount-content {
	min-width: 0;
	font-family: var(--dehoust-font-body);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--dehoust-color-text-muted);
}

.dehoust-account .woocommerce-MyAccount-content h2,
.dehoust-account .woocommerce-MyAccount-content h3 {
	margin: 0 0 1rem;
	font-size: 1.25rem;
}

.dehoust-account .woocommerce-MyAccount-content p {
	margin: 0 0 1rem;
}

.dehoust-account .woocommerce-MyAccount-content a:not(.button):not(.dehoust-btn) {
	color: var(--dehoust-color-primary);
	font-weight: 600;
}

/* Przyciski akcji w panelu (Woo .button) w stylu motywu */
.dehoust-account .woocommerce-MyAccount-content .button,
.dehoust-account .woocommerce-MyAccount-content button,
.dehoust-account .woocommerce-Address-title .edit {
	display: inline-flex;
	min-height: 2.75rem;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: var(--dehoust-radius-btn);
	padding-inline: 1.25rem;
	font-family: var(--dehoust-font-body);
	font-size: 0.9375rem;
	font-weight: 700;
	color: #fff;
	background: var(--dehoust-color-primary);
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease;
}

.dehoust-account .woocommerce-MyAccount-content .button:hover,
.dehoust-account .woocommerce-MyAccount-content button:hover,
.dehoust-account .woocommerce-Address-title .edit:hover {
	background: var(--dehoust-color-primary-hover);
	color: #fff;
}

/* Tabele (zamówienia, pobrania) w stylu koszyka/checkout */
.dehoust-account .woocommerce-orders-table,
.dehoust-account .shop_table,
.dehoust-account table.woocommerce-table {
	width: 100%;
	border-collapse: collapse;
	border: 0.8px solid #d6ebf6;
	border-radius: 0.5rem;
	overflow: hidden;
	font-size: 0.9375rem;
}

.dehoust-account .woocommerce-orders-table th,
.dehoust-account .shop_table th,
.dehoust-account table.woocommerce-table th {
	padding: 0.875rem 1rem;
	background: var(--dehoust-color-surface);
	font-weight: 700;
	color: var(--dehoust-color-text);
	text-align: left;
}

.dehoust-account .woocommerce-orders-table td,
.dehoust-account .shop_table td,
.dehoust-account table.woocommerce-table td {
	padding: 0.875rem 1rem;
	border-top: 0.8px solid #eef6fb;
	color: var(--dehoust-color-text-muted);
	vertical-align: middle;
}

.dehoust-account .woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions {
	text-align: right;
}

.dehoust-account .woocommerce-orders-table .button {
	min-height: 2.25rem;
	padding-inline: 0.875rem;
	font-size: 0.875rem;
}

@media (max-width: 640px) {
	.dehoust-account .woocommerce-orders-table thead {
		display: none;
	}

	.dehoust-account .woocommerce-orders-table tr {
		display: block;
		margin-bottom: 1rem;
		border: 0.8px solid #d6ebf6;
		border-radius: 0.5rem;
	}

	.dehoust-account .woocommerce-orders-table td {
		display: flex;
		justify-content: space-between;
		gap: 1rem;
		text-align: right;
		border-top: 0.8px solid #eef6fb;
	}

	.dehoust-account .woocommerce-orders-table td::before {
		content: attr(data-title);
		font-weight: 700;
		color: var(--dehoust-color-text);
	}
}

/* Adresy */
.dehoust-account .woocommerce-Addresses {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	margin-top: 0.5rem;
}

@media (min-width: 640px) {
	.dehoust-account .woocommerce-Addresses {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.dehoust-account .woocommerce-Address {
	padding: 1.5rem;
	border: 0.8px solid #d6ebf6;
	border-radius: 0.75rem;
	background: #fff;
}

.dehoust-account .woocommerce-Address-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.75rem;
}

.dehoust-account .woocommerce-Address-title h3 {
	margin: 0;
	font-size: 1.125rem;
}

.dehoust-account address {
	font-style: normal;
	line-height: 1.6;
}

/* Formularz edycji konta/adresu — pola pełnej szerokości */
.dehoust-account .woocommerce-EditAccountForm,
.dehoust-account .edit-account,
.dehoust-account form.woocommerce-address-fields,
.dehoust-account form.edit-account {
	display: flex;
	flex-direction: column;
	gap: 1.125rem;
	max-width: 34rem;
}

.dehoust-account fieldset {
	margin: 1rem 0 0;
	padding: 1.25rem;
	border: 0.8px solid #d6ebf6;
	border-radius: 0.5rem;
}

.dehoust-account fieldset legend {
	padding: 0 0.5rem;
	font-weight: 700;
	color: var(--dehoust-color-text);
}

.dehoust-account .woocommerce-form-row .required {
	text-decoration: none;
}

.dehoust-account em {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.8125rem;
	color: var(--dehoust-color-muted);
}
