/* ===========================================================================
   Product Questions 1.2-fork  -  storefront  -  https://ocmod.net
   ---------------------------------------------------------------------------
   The blocks come from the OCMOD.NET storefront library (ocmod-ui-1.0.css),
   the buttons and fields from the theme's Bootstrap classes. This file only
   places the parts the library has no layout for. Every selector starts with
   the module's root class; colours are the library variables.
   =========================================================================== */

.ocmod-pq [hidden] { display: none; }
.ocmod-pq { margin: 0 0 calc(var(--ocm-gap) * 2); }

/* ---------- the list ---------------------------------------------------- */
.ocmod-pq__items { margin: 0 0 var(--ocm-gap); }
.ocmod-pq__items.is-loading { color: var(--ocm-muted); }
.ocmod-pq__more { justify-content: center; margin: 0 0 calc(var(--ocm-gap) * 2); }
.ocmod-pq__pending { margin: 0; font-size: .93em; }
.ocmod-pq__empty { margin: 0 0 calc(var(--ocm-gap) * 2); border: 1px solid var(--ocm-line); border-radius: var(--ocm-r); }
.ocmod-pq__empty p { margin: 0; }

/* the answer may carry the owner's markup: it stays inside the card */
.ocmod-pq__answer { margin-top: 4px; overflow-wrap: anywhere; }
.ocmod-pq__answer > :last-child { margin-bottom: 0; }
.ocmod-pq__answer img { max-width: 100%; height: auto; }
.ocmod-pq__answer table { max-width: 100%; }

/* ---------- the form ---------------------------------------------------- */
.ocmod-pq__form { margin-bottom: 0; }
.ocmod-pq__row { display: flex; flex-wrap: wrap; gap: 0 var(--ocm-gap); }
.ocmod-pq__row > .ocm-field { flex: 1 1 220px; min-width: 0; }
.ocmod-pq__form textarea { min-height: 96px; resize: vertical; }
.ocmod-pq__form .ocm-check { margin: 0; }
.ocmod-pq__form .ocm-block__foot .btn { margin-left: auto; }
.ocmod-pq__note { flex: 1 1 220px; font-size: .93em; }
.ocmod-pq__message { margin: 0 0 var(--ocm-gap); padding: 10px 12px; border-radius: var(--ocm-r); }
.ocmod-pq__message.is-good { background: var(--ocm-good-tint); color: var(--ocm-good); }
.ocmod-pq__message.is-bad { background: var(--ocm-bad-tint); color: var(--ocm-bad); }

/* ---------- site fork: theme without tabs ------------------------------- */
.ocmod-pq-site { clear: both; display: flow-root; padding-top: 24px; } /* the theme floats .product-container and .description-block */
.ocmod-pq-site .ocmod-pq { margin-bottom: 0; }
.ocmod-pq-ask { display: inline-block; margin-top: 12px; color: inherit; text-decoration: none; border-bottom: 1px dashed currentColor; line-height: 1.3; cursor: pointer; }
.ocmod-pq-ask:hover, .ocmod-pq-ask:focus { color: inherit; text-decoration: none; border-bottom-style: solid; }
.ocmod-pq-ask span { opacity: .7; }
/* everything in .product-info floats left: the link goes under the cart form, not up to the price */
.product-info > .ocmod-pq-ask { float: left; clear: both; }