/*
 * NeknarF Style — modo escuro (tema 0.14.0, inc/tema-escuro.php).
 * Só vale com html[data-nk-tema="escuro"], que o script do <head> põe quando o
 * cliente escolheu o modo escuro. O claro continua a ser o de sempre.
 *
 * Paleta (contraste do texto, calculado a 2026-10-26):
 *   surface #1A1917 (fundo e cartões)      ink    #F2EFE9 (texto)       15,3:1
 *   ivory   #121110 (secções alternadas)   subtle #A8A49D (legendas)     7,1:1
 *   base    #0A0A09 (hero, garantias, rodapé)  muted #C9C5BD             10,2:1
 *   accent  #C9A96E (dourado, igual)        dourado sobre o fundo         7,9:1
 * Texto sobre dourado: sempre #0D0D0D (--nk-sobre-dourado, 8,7:1).
 */

/* Só no ecrã: o que se imprime continua claro. */
@media screen {

	html[data-nk-tema="escuro"] {
		color-scheme: dark;
		--wp--preset--color--surface: #1A1917;
		--wp--preset--color--ivory: #121110;
		--wp--preset--color--ink: #F2EFE9;
		--wp--preset--color--base: #0A0A09;
		--wp--preset--color--contrast: #F2EFE9;
		--wp--preset--color--muted: #C9C5BD;
		--wp--preset--color--subtle: #A8A49D;
		--nk-verde: #8FC39E;
		--nk-erro: #F2A0A0;
		--nk-dourado-linha: rgba(201, 169, 110, .22);
		--wc-form-color-text: #F2EFE9;
		background-color: #1A1917;
	}

	html[data-nk-tema="escuro"] body {
		background-color: var(--wp--preset--color--surface);
		color: var(--wp--preset--color--ink);
	}

	/* Secções escuras de destaque: o tom mais escuro, separado por linhas douradas finas. */
	html[data-nk-tema="escuro"] .has-base-background-color.alignfull {
		border-block: 1px solid var(--nk-dourado-linha);
	}

	html[data-nk-tema="escuro"] .has-base-background-color.alignfull + .has-base-background-color.alignfull {
		border-top: 0;
	}

	/* O nome da loja (o logótipo é texto) fica claro sozinho; o dourado do hover mantém-se. */

	/* ------------------------------------------------------------------ Botões */
	/* Hover dos botões: texto escuro sobre o dourado (theme.json já usa #0D0D0D). */
	html[data-nk-tema="escuro"] .wp-element-button:hover,
	html[data-nk-tema="escuro"] .wp-block-button__link:hover,
	html[data-nk-tema="escuro"] .wc-block-components-button:not(.is-link):hover {
		color: var(--nk-sobre-dourado);
	}

	/* ------------------------------------------------------------------ Formulários (carrinho, checkout, conta, pesquisa) */
	html[data-nk-tema="escuro"] input[type="text"],
	html[data-nk-tema="escuro"] input[type="email"],
	html[data-nk-tema="escuro"] input[type="tel"],
	html[data-nk-tema="escuro"] input[type="password"],
	html[data-nk-tema="escuro"] input[type="number"],
	html[data-nk-tema="escuro"] input[type="search"],
	html[data-nk-tema="escuro"] input[type="url"],
	html[data-nk-tema="escuro"] select,
	html[data-nk-tema="escuro"] textarea {
		border-color: color-mix(in srgb, var(--wp--preset--color--ink) 28%, transparent);
		background-color: var(--wp--preset--color--ivory);
		color: var(--wp--preset--color--ink);
	}

	html[data-nk-tema="escuro"] ::placeholder {
		color: var(--wp--preset--color--subtle);
		opacity: 1;
	}

	/* Campos dos blocos do WooCommerce (o tema já os põe com as cores dos tokens). */
	html[data-nk-tema="escuro"] .wc-block-components-text-input input,
	html[data-nk-tema="escuro"] .wc-block-components-textarea,
	html[data-nk-tema="escuro"] .wc-block-components-combobox .wc-block-components-combobox-control input,
	html[data-nk-tema="escuro"] .wc-blocks-components-select .wc-blocks-components-select__select,
	html[data-nk-tema="escuro"] .wc-blocks-components-select .wc-blocks-components-select__container {
		background-color: var(--wp--preset--color--ivory) !important;
		color: var(--wp--preset--color--ink) !important;
	}

	html[data-nk-tema="escuro"] .wc-blocks-components-select .wc-blocks-components-select__expand {
		fill: var(--wp--preset--color--ink);
	}

	html[data-nk-tema="escuro"] .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:not(:checked),
	html[data-nk-tema="escuro"] .wc-block-components-radio-control__input {
		background-color: var(--wp--preset--color--ivory);
	}

	html[data-nk-tema="escuro"] .wc-block-components-radio-control__input:checked::before {
		background: var(--wp--preset--color--accent);
	}

	html[data-nk-tema="escuro"] .wc-block-gateway-container,
	html[data-nk-tema="escuro"] .wc-block-gateway-container .wc-block-gateway-input {
		background-color: var(--wp--preset--color--ivory);
		color: var(--wp--preset--color--ink);
	}

	html[data-nk-tema="escuro"] .wc-block-components-address-autocomplete-suggestions {
		border-color: var(--nk-line);
		background: var(--wp--preset--color--surface);
	}

	html[data-nk-tema="escuro"] .wc-block-components-address-autocomplete-suggestions .suggestions-list li {
		color: var(--wp--preset--color--ink);
	}

	/* Erros de validação: vermelho claro (o vermelho do WooCommerce não se lê no escuro). */
	html[data-nk-tema="escuro"] .wc-block-components-validation-error,
	html[data-nk-tema="escuro"] .wc-block-components-validation-error > p,
	html[data-nk-tema="escuro"] .wc-block-components-text-input.has-error label,
	html[data-nk-tema="escuro"] .has-error .wc-blocks-components-select .wc-blocks-components-select__label,
	html[data-nk-tema="escuro"] .has-error .wc-blocks-components-select .wc-blocks-components-select__select {
		color: var(--nk-erro) !important;
	}

	html[data-nk-tema="escuro"] .wc-block-components-text-input.has-error input,
	html[data-nk-tema="escuro"] .has-error .wc-blocks-components-select .wc-blocks-components-select__container,
	html[data-nk-tema="escuro"] .wc-block-components-checkbox.has-error .wc-block-components-checkbox__input {
		border-color: var(--nk-erro) !important;
	}

	html[data-nk-tema="escuro"] .has-error .wc-blocks-components-select .wc-blocks-components-select__expand {
		fill: var(--nk-erro);
	}

	/* ------------------------------------------------------------------ Avisos (blocos e clássicos) */
	html[data-nk-tema="escuro"] .wc-block-components-notice-banner {
		border-color: color-mix(in srgb, var(--wp--preset--color--ink) 35%, transparent);
		background-color: var(--wp--preset--color--ivory);
		color: var(--wp--preset--color--ink);
	}

	html[data-nk-tema="escuro"] .wc-block-components-notice-banner.is-error {
		border-color: var(--nk-erro);
		background-color: color-mix(in srgb, #CC1818 16%, var(--wp--preset--color--surface));
	}

	html[data-nk-tema="escuro"] .wc-block-components-notice-banner.is-warning {
		border-color: #F0B849;
		background-color: color-mix(in srgb, #F0B849 12%, var(--wp--preset--color--surface));
	}

	html[data-nk-tema="escuro"] .wc-block-components-notice-banner.is-success {
		border-color: var(--nk-verde);
		background-color: color-mix(in srgb, #4AB866 14%, var(--wp--preset--color--surface));
	}

	html[data-nk-tema="escuro"] .wc-block-components-notice-banner.is-info {
		border-color: #8CB8E0;
		background-color: color-mix(in srgb, #007CBA 16%, var(--wp--preset--color--surface));
	}

	html[data-nk-tema="escuro"] .wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward,
	html[data-nk-tema="escuro"] .wc-block-components-notice-banner > .wc-block-components-button {
		color: var(--wp--preset--color--ink) !important;
	}

	html[data-nk-tema="escuro"] .woocommerce-message,
	html[data-nk-tema="escuro"] .woocommerce-info,
	html[data-nk-tema="escuro"] .woocommerce-error,
	html[data-nk-tema="escuro"] .woocommerce-noreviews,
	html[data-nk-tema="escuro"] p.no-comments {
		background: var(--wp--preset--color--ivory);
		color: var(--wp--preset--color--ink);
	}

	html[data-nk-tema="escuro"] .woocommerce-error {
		border-top-color: var(--nk-erro);
	}

	html[data-nk-tema="escuro"] .woocommerce-error::before {
		color: var(--nk-erro);
	}

	/* ------------------------------------------------------------------ Carrinho, checkout e mini-carrinho */
	html[data-nk-tema="escuro"] .wc-block-components-drawer,
	html[data-nk-tema="escuro"] .wc-block-cart .wc-block-cart__submit-container--sticky,
	html[data-nk-tema="escuro"] .wc-block-checkout__shipping-method-option.wc-block-checkout__shipping-method-option--selected {
		background: var(--wp--preset--color--surface);
	}

	html[data-nk-tema="escuro"] .wc-block-components-drawer__screen-overlay {
		background-color: rgba(0, 0, 0, .6);
	}

	html[data-nk-tema="escuro"] .wc-block-mini-cart__shopping-button a:hover,
	html[data-nk-tema="escuro"] .wc-block-mini-cart__shopping-button a:focus {
		border-color: var(--wp--preset--color--accent);
		background-color: var(--wp--preset--color--accent);
		color: var(--nk-sobre-dourado);
	}

	html[data-nk-tema="escuro"] .wc-block-components-chip .wc-block-components-chip__remove {
		background: color-mix(in srgb, var(--wp--preset--color--ink) 18%, transparent);
	}

	html[data-nk-tema="escuro"] .wc-block-components-chip .wc-block-components-chip__remove-icon {
		fill: var(--wp--preset--color--ink);
	}

	/* Fotos dos produtos: um fundo um pouco mais claro atrás das imagens transparentes. */
	html[data-nk-tema="escuro"] .wc-block-components-product-image img,
	html[data-nk-tema="escuro"] .wc-block-cart-item__image img,
	html[data-nk-tema="escuro"] .wc-block-components-order-summary-item__image img {
		background-color: #24221F;
	}

	/* ------------------------------------------------------------------ Filtros da loja */
	html[data-nk-tema="escuro"] .wc-block-components-price-slider__range-input::-webkit-slider-thumb {
		border-color: var(--wp--preset--color--ink);
		background: var(--wp--preset--color--surface);
	}

	html[data-nk-tema="escuro"] .wc-block-components-price-slider__range-input::-moz-range-thumb {
		border-color: var(--wp--preset--color--ink);
		background: var(--wp--preset--color--surface);
	}

	/* ------------------------------------------------------------------ Guia de tamanhos, janelas e tabelas */
	html[data-nk-tema="escuro"] .neknarf-guia,
	html[data-nk-tema="escuro"] dialog {
		background: var(--wp--preset--color--surface);
		color: var(--wp--preset--color--ink);
	}

	html[data-nk-tema="escuro"] .neknarf-guia::backdrop,
	html[data-nk-tema="escuro"] .neknarf-gaveta::backdrop {
		background: rgba(0, 0, 0, .65);
	}

	html[data-nk-tema="escuro"] .wp-block-table td,
	html[data-nk-tema="escuro"] .wp-block-table th {
		border-color: var(--nk-line);
	}

	html[data-nk-tema="escuro"] .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
		background-color: var(--wp--preset--color--ivory);
	}

	/* ------------------------------------------------------------------ Botão do WhatsApp e barra fixa do telemóvel */
	html[data-nk-tema="escuro"] .neknarf-whatsapp {
		box-shadow: 0 6px 18px rgba(0, 0, 0, .6);
	}

	html[data-nk-tema="escuro"] .neknarf-barra {
		box-shadow: 0 -6px 18px rgba(0, 0, 0, .5);
	}

	/* ------------------------------------------------------------------ Botão "Modo escuro" */
	/* (os estilos base do botão estão em neknarf.css; aqui só o ícone de cada modo) */
	html[data-nk-tema="escuro"] .neknarf-tema__lua {
		display: none;
	}

	html[data-nk-tema="escuro"] .neknarf-tema__sol {
		display: inline-block;
	}
}