/* =========================================================
   SS DECO - ORDERBY SELECT FIX 3.1b
   ========================================================= */

/*
 * El popup de <select> es nativo del navegador.
 * Ademas de background/color hay que forzar color-scheme: light
 * para evitar opciones oscuras con texto de poco contraste.
 */

body.post-type-archive-product .woocommerce-ordering select.orderby,
body.post-type-archive-product .woo-listing-top select.orderby {
	color-scheme: light !important;

	background-color: #F3EEE6 !important;
	color: #141416 !important;

	border: 1px solid rgba(20, 20, 22, 0.22) !important;
	box-shadow: none !important;

	-webkit-text-fill-color: #141416 !important;
	opacity: 1 !important;
}

/* Opciones del desplegable nativo */
body.post-type-archive-product .woocommerce-ordering select.orderby option,
body.post-type-archive-product .woo-listing-top select.orderby option {
	background: #F3EEE6 !important;
	background-color: #F3EEE6 !important;
	color: #141416 !important;
	-webkit-text-fill-color: #141416 !important;
}

/* Opcion seleccionada / foco */
body.post-type-archive-product .woocommerce-ordering select.orderby:focus,
body.post-type-archive-product .woo-listing-top select.orderby:focus {
	border-color: #744052 !important;
	outline: 1px solid #744052 !important;
	outline-offset: 1px !important;
}

/*
 * Lo dejamos marfil tambien en dark mode a pedido:
 * queda como un control claro dentro del catalogo oscuro.
 */
html[data-ss-theme="dark"]
body.post-type-archive-product .woocommerce-ordering select.orderby,
html[data-ss-theme="dark"]
body.post-type-archive-product .woo-listing-top select.orderby {
	color-scheme: light !important;
	background-color: #F3EEE6 !important;
	color: #141416 !important;
	border-color: rgba(243, 238, 230, 0.38) !important;
	-webkit-text-fill-color: #141416 !important;
}

html[data-ss-theme="dark"]
body.post-type-archive-product .woocommerce-ordering select.orderby option,
html[data-ss-theme="dark"]
body.post-type-archive-product .woo-listing-top select.orderby option {
	background-color: #F3EEE6 !important;
	color: #141416 !important;
	-webkit-text-fill-color: #141416 !important;
}
