/**
 * @package     J2Commerce
 * @subpackage  com_j2commerce
 *
 * @copyright   (C)2024-2026 J2Commerce, LLC <https://www.j2commerce.com>
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

/* Inner wrapper for absolute-positioned clear button */
.j2c-coupon-form .input-group_inner,
.j2c-voucher-form .input-group_inner {
    position: relative;
    flex: 1 1 0%;
}

.j2c-coupon-form .input-group_inner > .form-control,
.j2c-voucher-form .input-group_inner > .form-control {
    width: 100%;
}

/* X clear button — absolutely positioned inside input-group_inner */
.j2c-input-clear {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1;
    font-weight: bold;
    padding: 0;
    background: transparent;
    border: none;
    color: #dc3545;
    z-index: 5;
    height: 24px;
}

/* Add right padding to input when clear button is visible */
.input-group_inner:has(.j2c-input-clear) > .form-control {
    padding-inline-end: 2rem;
}

.j2c-field-error {
    font-size: 0.875rem;
}

/* Focus styling */
.j2c-coupon-form .form-control:focus,
.j2c-voucher-form .form-control:focus {
    box-shadow: none;
    border-color: var(--bs-primary, #0d6efd);
}