/* Front-end button. Deliberately minimal - on the basket page it reuses the theme's own .button
   styling so it looks native on every site, and only adds the spacing WooCommerce's hooks do not
   provide. In the mini cart it is a text link instead; see below. */

.basket-quote-wrap {
    margin-top: 12px;
    text-align: center;
}

.basket-quote-wrap .basket-quote-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

/* Sized in em and coloured by currentColor, so it follows whatever the label does without this
   stylesheet knowing the theme's font size or link colour.
 *
 * Size and weight are both here so the icon can be retuned in one place. The stroke that actually
 * appears on screen is stroke-width x (rendered size / viewBox), so 2.5 at 1.25em of a 16px label
 * draws ~2.08px - which is what the surrounding site icons weigh. At the original 1em/2 it drew
 * 1.33px and read thin and small beside them. */
.basket-quote-icon {
    flex: 0 0 auto;
    width: 1.25em;
    height: 1.25em;
    stroke-width: 2.5;
}

/* Basket page: its own little section under the checkout button.
 *
 * Without the rule the quote reads as part of the checkout group, which works against the point -
 * one is "buy this now", the other is "take this away and get it approved". The hairline is a
 * neutral grey at low alpha rather than a fixed colour, so it sits correctly on a light or a dark
 * totals box without this stylesheet knowing which it is. */
.basket-quote-wrap--cart {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(127, 127, 127, 0.25);
}

.basket-quote-hint {
    margin: 8px 0 0 0;
    font-size: 0.8em;
    line-height: 1.4;
    opacity: 0.75;
}

/* Mini cart / flyout -------------------------------------------------------------------------
 *
 * A text link, not a button. The flyout already has a primary action (Checkout) and a secondary
 * one (View Basket); a third button would flatten that hierarchy, and this is the quietest of
 * the three.
 *
 * The markup omits the `button` class in this context, which is what keeps this section short:
 * page builders style their mini cart buttons by that class at a specificity this would
 * otherwise have to fight, and a link that never claims the class has nothing to override. No
 * !important anywhere below.
 *
 * Colour is deliberately not set, so the link takes the theme's own link colour.
 */
.basket-quote-wrap--mini {
    margin-top: 10px;
    text-align: center;
}

.basket-quote-wrap--mini .basket-quote-button {
    width: auto;
    padding: 6px 2px;
    background: none;
    border: 0;
    font-size: 0.95em;
    font-weight: 500;
    line-height: 1.3;
    text-decoration: none;
}

.basket-quote-wrap--mini .basket-quote-button:hover,
.basket-quote-wrap--mini .basket-quote-button:focus {
    text-decoration: underline;
}

.basket-quote-wrap--mini .basket-quote-hint {
    display: none;
}
