/**
 * eCoupons Gift Form Styles
 */

.ecoupons-gift-form {
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    padding: 20px;
    margin: 20px 0;
}

.ecoupons-gift-form__header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #dee2e6;
}

.ecoupons-gift-form__title {
    font-size: 18px;
    font-weight: 600;
    color: #232323;
    margin: 0 0 5px 0;
}

.ecoupons-gift-form__subtitle {
    font-size: 14px;
    color: #6c757d;
    margin: 0;
}

.ecoupons-gift-form__fields {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.ecoupons-gift-form__group {
    margin-bottom: 0;
}

.ecoupons-gift-form__label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #232323;
    margin-bottom: 5px;
}

.ecoupons-gift-form__label .required {
    color: #dc3545;
}

.ecoupons-gift-form__input,
.ecoupons-gift-form__textarea {
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.5;
    color: #232323;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 4px;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.ecoupons-gift-form__input:focus,
.ecoupons-gift-form__textarea:focus {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.ecoupons-gift-form__input::placeholder,
.ecoupons-gift-form__textarea::placeholder {
    color: #6c757d;
    opacity: 0.7;
}

.ecoupons-gift-form__textarea {
    resize: vertical;
    min-height: 80px;
}

.ecoupons-gift-form__help {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #6c757d;
}

.ecoupons-gift-form__counter {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #6c757d;
    text-align: right;
}

/* Status messages */
.ecoupons-gift-form__status {
    margin-top: 15px;
    padding: 10px;
    border-radius: 4px;
    font-size: 13px;
    text-align: center;
}

.ecoupons-gift-form__status--saving {
    background-color: #fff3cd;
    color: #856404;
    border: 1px solid #ffeeba;
}

.ecoupons-gift-form__status--saved {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.ecoupons-gift-form__status--error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

/* Two column layout for From/To on larger screens */
@media (min-width: 576px) {
    .ecoupons-gift-form__fields {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }

    .ecoupons-gift-form__group:nth-child(3),
    .ecoupons-gift-form__group:nth-child(4) {
        grid-column: 1 / -1;
    }
}

/* Actions section */
.ecoupons-gift-form__actions {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #dee2e6;
}

.ecoupons-gift-form__preview-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    color: #232323;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

.ecoupons-gift-form__preview-btn:hover {
    background-color: #f8f9fa;
    border-color: #adb5bd;
}

.ecoupons-gift-form__preview-btn i {
    font-size: 18px;
}

/* Preview Modal */
.ecoupons-preview-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.ecoupons-preview-modal--visible {
    opacity: 1;
}

.ecoupons-preview-modal__backdrop {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
}

.ecoupons-preview-modal__content {
    position: relative;
    z-index: 1;
    max-width: 500px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    transform: scale(0.9);
    transition: transform 0.3s ease;
}

.ecoupons-preview-modal--visible .ecoupons-preview-modal__content {
    transform: scale(1);
}

.ecoupons-preview-modal__close {
    position: absolute;
    top: -15px;
    right: -15px;
    width: 36px;
    height: 36px;
    background-color: #fff;
    border: none;
    border-radius: 50%;
    font-size: 24px;
    line-height: 1;
    color: #666;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 2;
    transition: all 0.15s ease;
}

.ecoupons-preview-modal__close:hover {
    background-color: #f8f9fa;
    color: #333;
}

/* Preview Container */
.ecoupons-preview-container {
    background-color: #fff;
    border-radius: 12px;
    padding: 20px;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

/* Loading State */
.ecoupons-preview-loading {
    text-align: center;
    padding: 40px 20px;
}

.ecoupons-preview-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #e9ecef;
    border-top-color: #667eea;
    border-radius: 50%;
    animation: ecoupons-spin 1s linear infinite;
    margin: 0 auto 15px;
}

@keyframes ecoupons-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.ecoupons-preview-loading p {
    margin: 0;
    font-size: 14px;
    color: #6c757d;
}

/* Image Preview */
.ecoupons-preview-image-wrapper {
    width: 100%;
    text-align: center;
}

.ecoupons-preview-image {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* Error State */
.ecoupons-preview-error {
    text-align: center;
    padding: 40px 20px;
    color: #dc3545;
}

.ecoupons-preview-error i {
    font-size: 48px;
    margin-bottom: 15px;
    display: block;
}

.ecoupons-preview-error p {
    margin: 0;
    font-size: 14px;
}

/* Responsive adjustments */
@media (max-width: 575px) {
    .ecoupons-gift-form {
        padding: 15px;
        margin: 15px 0;
    }

    .ecoupons-gift-form__title {
        font-size: 16px;
    }

    .ecoupons-gift-form__input,
    .ecoupons-gift-form__textarea {
        padding: 8px 10px;
        font-size: 16px; /* Prevent zoom on iOS */
    }

    .ecoupons-preview-container {
        padding: 15px;
    }

    .ecoupons-preview-spinner {
        width: 36px;
        height: 36px;
    }

    .ecoupons-preview-modal__close {
        top: 10px;
        right: 10px;
    }
}

/* clay.lt 2026-09-16: amount selector */
.ecoupons-amounts{margin:16px 0 20px}
.ecoupons-amounts__label{font-weight:600;margin-bottom:8px;text-transform:uppercase;font-size:13px;letter-spacing:.04em}
.ecoupons-amounts__list{display:flex;flex-wrap:wrap;gap:8px}
.ecoupons-amount{display:inline-block;min-width:72px;padding:9px 14px;border:1px solid #222;color:#222;text-align:center;font-weight:600;text-decoration:none;background:#fff}
.ecoupons-amount:hover,.ecoupons-amount:focus{background:#222;color:#fff;text-decoration:none}
.ecoupons-amount.is-current{background:#222;color:#fff}
.ecoupons-amounts__note{margin:10px 0 0;font-size:13px;color:#555}
.ecoupons-gift-form__optional{font-weight:400;font-size:.85em;color:#777}
.ecoupons-gift-form__help{display:block;margin-top:4px;color:#666;line-height:1.4}

/* clay.lt 2026-09-16: give a workshop as a gift */
.ecoupons-giftworkshop{margin:14px 0 18px;padding:14px 16px;border:1px dashed #bdb9b1;background:#f5f4f1}
.ecoupons-giftworkshop__btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid #222;background:#fff;color:#222;font-weight:600;text-transform:uppercase;letter-spacing:.03em;text-decoration:none}
.ecoupons-giftworkshop__btn:hover,.ecoupons-giftworkshop__btn:focus{background:#222;color:#fff;text-decoration:none}
.ecoupons-giftworkshop__note{margin:8px 0 0;font-size:13px;color:#555}

/* clay.lt 2026-09-16 v2: one voucher page */
.ecoupons-voucher-page .ecoupons-amounts__note{display:none}
.ecoupons-step{margin:0 0 18px;padding-top:16px;border-top:1px solid #e3e1dc}
.ecoupons-step__title,.ecoupons-step3{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:14px;font-weight:600;text-transform:none;letter-spacing:0}
.ecoupons-step3{margin-top:4px;padding-top:16px;border-top:1px solid #e3e1dc}
.ecoupons-step__num{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#1e1e1c;color:#fff;font-size:12px;flex:0 0 24px}
.ecoupons-amounts .ecoupons-amounts__list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media (max-width:420px){.ecoupons-amounts .ecoupons-amounts__list{grid-template-columns:repeat(3,minmax(0,1fr))}}
button.ecoupons-amount{min-height:48px;width:100%;min-width:0;padding:8px 4px;border:1px solid #d9d6cf;background:#fff;color:#1e1e1c;font:inherit;font-weight:600;font-size:15px;cursor:pointer}
button.ecoupons-amount:hover{border-color:#1e1e1c;background:#fff;color:#1e1e1c}
button.ecoupons-amount[aria-pressed="true"]{background:#1e1e1c;border-color:#1e1e1c;color:#fff}
button.ecoupons-amount:focus-visible{outline:2px solid #1e1e1c;outline-offset:2px}
.ecoupons-attention .ecoupons-amounts__list{animation:ecouponsPulse 1.2s ease}
@keyframes ecouponsPulse{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 3px #d4d1cb}}
.ecoupons-gift-form.ecoupons-step{padding:16px 0 0;background:none;border-left:0;border-right:0;border-bottom:0;box-shadow:none}
.ecoupons-gift-form__fields{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.ecoupons-gift-form__group--full{grid-column:1/-1}
@media (max-width:420px){.ecoupons-gift-form__fields{grid-template-columns:1fr}}
.ecoupons-gift-form__optional{font-weight:400;font-size:13px;color:#8a877f}
.ecoupons-gift-form__actions{display:none}
.ecoupons-noprice .current-price,.ecoupons-noprice .current-price span{font-size:15px!important;font-weight:400!important;color:#6e6c66!important}
.ecoupons-voucher-page .product-add-to-cart [data-button-action="add-to-cart"][disabled]{opacity:.45;cursor:not-allowed}
.ecoupons-facts{display:flex;flex-direction:column;gap:6px;margin:16px 0;padding:14px 16px;background:#efeeea;font-size:13px}
.ecoupons-facts div{display:flex;gap:10px}
.ecoupons-facts span{flex:0 0 18px;text-align:center}
.ecoupons-howto{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:8px 0 18px}
@media (max-width:600px){.ecoupons-howto{grid-template-columns:1fr}}
.ecoupons-howto div{display:flex;flex-direction:column;gap:2px;font-size:13px;color:#555}
.ecoupons-howto b{color:#1e1e1c}
.ecoupons-howto__k{font-family:Georgia,serif;font-size:28px;line-height:1;color:#6f6c66}
.ecoupons-card .ecoupons-choose{display:inline-block;text-align:center}