/*
 * Interaction states that the parent theme's reset gets wrong.
 *
 * Loaded last on purpose (inc/omid-states.php, wp_enqueue_scripts at 1003).
 *
 * hello-elementor/assets/css/reset.css ends with a rule that reads, in effect,
 * "any button on hover or focus gets background-color var(--om-b) and white text".
 * --om-b is #004851, the same teal the components use for their own labels, so any
 * component that sets its text colour with !important keeps that colour while the
 * reset still paints the fill teal - and where the component's colour happens to BE
 * the brand teal, the label becomes #004851 on #004851: an invisible bar. Measured
 * on the live site, four button types collide:
 *
 *   .omid-faq__q     the home page FAQ, 13 rows, all three languages  <- reported
 *   .omidM__x        the mobile drawer close button
 *   .om-qcart-close  the quick-cart close button
 *   .om-qpay-link    the "send the code again" link-button
 *
 * Each one gets an explicit hover/focus pair here instead of the reset being
 * edited, because the reset is the parent theme's and is shared by every
 * component that does NOT override its colour.
 *
 * No nested comments in this file: CSS comments do not nest, and an inner close
 * terminator here silently turned the rest of the header into a selector, which
 * is how this sheet ended up applying nothing at all.
 */

/*
 * Anchored on `.omid-faq`, not `.om-home-body .omid-faq-shell`: /en/ renders the
 * list as a bare `<div class="omid-faq">` with no shell and no om-home-body
 * wrapper, so the longer form matched zero nodes on English and the reset kept
 * winning there. `.omid-faq .omid-faq__q` is (0,2,1) with :hover, which beats the
 * reset's (0,1,1), and `background` as a shorthand also drops the EN gradient so
 * the tint is actually visible.
 */
.omid-faq .omid-faq__q:hover,
.omid-faq .omid-faq__q:focus {
	background: rgba(146, 132, 44, .12);
	border-color: var(--a, #92842c);
	color: var(--b, #004851) !important;
}

.omid-faq .omid-faq__q[aria-expanded="true"]:hover,
.omid-faq .omid-faq__q[aria-expanded="true"]:focus {
	background: rgba(146, 132, 44, .18);
	color: var(--b, #004851) !important;
}

/* The +/- glyph is drawn from the same gold, so state changes stay legible. */
.omid-faq .omid-faq__q:hover .omid-faq__icon {
	background: rgba(146, 132, 44, .22);
}

/* --- Icon-only close buttons: gold on the card, never teal on teal --- */
.omidM__x:hover,
.omidM__x:focus,
.om-qcart-close:hover,
.om-qcart-close:focus {
	background-color: rgba(146, 132, 44, .16);
	border-color: transparent;
	color: var(--b, #004851) !important;
}

/* --- Text link-buttons inside the payment panel --- */
.om-qpay-link:hover,
.om-qpay-link:focus {
	background-color: transparent;
	border-color: var(--a, #92842c);
	color: var(--a, #92842c) !important;
	text-decoration: underline;
}

/*
 * Keyboard focus has to be visible without relying on the fill, so every control
 * keeps the gold ring the theme already uses for :focus-visible.
 */
.omid-faq .omid-faq__q:focus-visible,
.omidM__x:focus-visible,
.om-qcart-close:focus-visible,
.om-qpay-link:focus-visible {
	outline: 3px solid var(--a, #92842c);
	outline-offset: 3px;
}