/* ==========================================================================
   Estilos Personalizados — AEBIT Theme Enhancements (Blocksy)
   Migrados desde blocksy-child/style.css para consolidación en plugin core
   ========================================================================== */

/* ==========================================================================
   Filtros de WooCommerce / Categorías (Blocksy) — Botón Dropdown de Marca
   ========================================================================== */

/* Botón / flecha dropdown circular y sutil en elementos de taxonomía jerárquica */
.ct-filter-widget .ct-expandable-trigger,
.ct-filter-item-inner .ct-expandable-trigger,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger {
	position: relative;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 22px !important;
	min-width: 22px !important;
	height: 22px !important;
	min-height: 22px !important;
	padding: 0 !important;
	margin: 0 !important;
	margin-inline-start: 8px !important;
	background-color: rgba(0, 122, 67, 0.09) !important;
	color: var(--theme-palette-color-1, #007a43) !important;
	border: 1px solid rgba(0, 122, 67, 0.12) !important;
	border-radius: 50% !important;
	box-shadow: none !important;
	cursor: pointer !important;
	touch-action: manipulation;
	flex-shrink: 0 !important;
	transition:
		background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
		border-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
		color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
		box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.15s ease !important;
}

/* Ampliar hitbox táctil para pantallas táctiles (WCAG 2.5.8) */
.ct-filter-widget .ct-expandable-trigger::before,
.ct-filter-item-inner .ct-expandable-trigger::before,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	min-width: 44px;
	min-height: 44px;
	width: 100%;
	height: 100%;
	z-index: 1;
}

/* Icono SVG dentro de la flecha dropdown */
.ct-filter-widget .ct-expandable-trigger .ct-icon,
.ct-filter-widget .ct-expandable-trigger svg,
.ct-filter-item-inner .ct-expandable-trigger .ct-icon,
.ct-filter-item-inner .ct-expandable-trigger svg,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger .ct-icon,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger svg {
	width: 8px !important;
	height: 8px !important;
	fill: currentColor !important;
	color: inherit !important;
	stroke: transparent !important;
	--theme-icon-size: 8px !important;
	--theme-icon-color: currentColor !important;
	transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), fill 0.2s ease !important;
}

/* Hover y Focus */
.ct-filter-widget .ct-expandable-trigger:hover,
.ct-filter-item-inner .ct-expandable-trigger:hover,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger:hover {
	background-color: var(--theme-palette-color-1, #007a43) !important;
	color: #ffffff !important;
	border-color: transparent !important;
	box-shadow: 0 2px 6px rgba(0, 122, 67, 0.25) !important;
	transform: scale(1.06);
}

.ct-filter-widget .ct-expandable-trigger:active,
.ct-filter-item-inner .ct-expandable-trigger:active,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger:active {
	background-color: var(--theme-palette-color-2, #005a32) !important;
	color: #ffffff !important;
	border-color: transparent !important;
	transform: scale(0.95);
	box-shadow: 0 1px 2px rgba(0, 90, 50, 0.2) !important;
}

.ct-filter-widget .ct-expandable-trigger:focus-visible,
.ct-filter-item-inner .ct-expandable-trigger:focus-visible,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger:focus-visible {
	outline: 2px solid var(--theme-palette-color-1, #007a43) !important;
	outline-offset: 2px !important;
}

/* Estado abierto/expandido */
.ct-filter-widget .ct-expandable-trigger[aria-expanded="true"],
.ct-filter-item-inner .ct-expandable-trigger[aria-expanded="true"],
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger[aria-expanded="true"] {
	background-color: var(--theme-palette-color-1, #007a43) !important;
	color: #ffffff !important;
	border-color: transparent !important;
	box-shadow: 0 1px 4px rgba(0, 122, 67, 0.2) !important;
}

.ct-filter-widget .ct-expandable-trigger[aria-expanded="true"]:hover,
.ct-filter-item-inner .ct-expandable-trigger[aria-expanded="true"]:hover,
.wp-block-blocksy-woocommerce-filters .ct-expandable-trigger[aria-expanded="true"]:hover {
	background-color: var(--theme-palette-color-2, #005a32) !important;
	color: #ffffff !important;
	border-color: transparent !important;
	box-shadow: 0 2px 6px rgba(0, 90, 50, 0.3) !important;
}

/* ==========================================================================
   Menú de Navegación Header — Dropdown Submenú con Radius Inferior
   ========================================================================== */

/* Contenedor dropdown / submenú en desktop (solo esquinas inferiores redondeadas) */
header [data-device="desktop"] .sub-menu,
header [data-device="desktop"] [data-id*="menu"] .sub-menu,
header [data-device="desktop"] [class*="animated-submenu"] > .sub-menu,
header [data-device="desktop"] .ct-header-account > ul,
header [data-device="desktop"] .ct-language-switcher > ul,
.menu-item-has-children > .sub-menu {
	border-radius: 0 0 8px 8px !important;
	box-shadow: 0 10px 25px -4px rgba(0, 0, 0, 0.18), 0 4px 10px -2px rgba(0, 0, 0, 0.08) !important;
}

/* Redondeo de esquinas en el último ítem para que el hover respete la base redondeada */
header [data-device="desktop"] .sub-menu > li:last-child,
header [data-device="desktop"] .sub-menu > li:last-child > .ct-menu-link,
header [data-device="desktop"] .sub-menu > li:last-child > a,
header [data-device="desktop"] .ct-header-account > ul > li:last-child,
header [data-device="desktop"] .ct-header-account > ul > li:last-child > a {
	border-bottom-left-radius: 8px !important;
	border-bottom-right-radius: 8px !important;
}

/* ==========================================================================
   Checkout — Checkbox de Términos y Condiciones y Formularios
   ========================================================================== */

/* Contenedor transparente integrado naturalmente en la caja del checkout */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper,
#payment .woocommerce-terms-and-conditions-wrapper {
	margin-top: 8px !important;
	margin-bottom: 12px !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

/* Label del checkbox sutil y alineado con el texto legal */
.woocommerce-checkout .woocommerce-form__label-for-checkbox.checkbox,
.woocommerce-form__label-for-checkbox,
label.woocommerce-form__label-for-checkbox {
	display: inline-flex !important;
	align-items: flex-start !important;
	gap: 8px !important;
	cursor: pointer !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	line-height: 1.45 !important;
	color: #475569 !important;
	user-select: none !important;
}

/* Checkbox con borde nítido visible pero tamaño proporcionado (15x15 px) */
.woocommerce-checkout input[type="checkbox"]#terms,
.woocommerce input[type="checkbox"].woocommerce-form__input-checkbox,
.woocommerce-checkout input[type="checkbox"].input-checkbox,
#payment input[type="checkbox"].input-checkbox {
	appearance: auto !important;
	-webkit-appearance: checkbox !important;
	width: 15px !important;
	min-width: 15px !important;
	height: 15px !important;
	min-height: 15px !important;
	margin: 2px 0 0 0 !important;
	border: 1.5px solid #64748b !important;
	border-radius: 3px !important;
	background-color: #ffffff !important;
	cursor: pointer !important;
	accent-color: var(--theme-palette-color-1, #007a43) !important;
	outline: none !important;
	flex-shrink: 0 !important;
	transition: border-color 0.15s ease !important;
}

.woocommerce-checkout input[type="checkbox"]#terms:hover,
.woocommerce input[type="checkbox"].woocommerce-form__input-checkbox:hover,
#payment input[type="checkbox"].input-checkbox:hover {
	border-color: var(--theme-palette-color-1, #007a43) !important;
}

.woocommerce-checkout input[type="checkbox"]#terms:focus-visible,
.woocommerce input[type="checkbox"].woocommerce-form__input-checkbox:focus-visible,
#payment input[type="checkbox"].input-checkbox:focus-visible {
	outline: 2px solid var(--theme-palette-color-1, #007a43) !important;
	outline-offset: 1px !important;
}
