/*
 * Voltaic_CallToOrder styling
 * ---------------------------
 * 1) Minimal styling for the button + popup form fields (theme-neutral).
 * 2) A CSS-only fallback that hides common wishlist/compare selectors in
 *    case the layout XML block removals in default.xml / catalog_category_view.xml
 *    don't match this theme's actual block names. Safe to delete once the
 *    correct block names have been confirmed and layout removal works.
 */

.voltaic-call-to-order-btn {
    cursor: pointer;
}

.voltaic-cto-product-label {
    font-weight: 600;
}

.voltaic-cto-error {
    color: #e02b27;
}

.voltaic-cto-success {
    color: #006400;
}

#voltaic-call-to-order-form .field {
    margin-bottom: 15px;
}

#voltaic-call-to-order-form .field label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
}

#voltaic-call-to-order-form .field input,
#voltaic-call-to-order-form .field textarea,
#voltaic-call-to-order-form .field select {
    width: 100%;
}

/* Related-products "add to cart" checkboxes become moot once native
   Add to Cart is removed store-wide. */
.block.related .field.choice,
.related-checkbox {
    display: none !important;
}

/* --- CSS fallback: hide native purchase/wishlist/compare controls ----- */
/* Remove any of these lines once the corresponding layout XML removal is
   confirmed to be working, to avoid keeping dead CSS around. */
.wishlist_sidebar,
.block.block-wishlist,
[class*="wishlist-link"],
.action.towishlist,
/* .action.tocompare, */
.link.wishlist
/* .link.compare  */
{
    display: none !important;
}

div.products.wrapper.list.products-list .voltaic-call-to-order-icon{
    display: none !important;
}
/* Default = TEXT */
.voltaic-call-to-order-icon {
    display: none;
}

.voltaic-call-to-order-text {
    display: inline;
}

/* GRID = ICON */
.voltaic-product-grid-view-btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.voltaic-product-grid-view-btn .voltaic-call-to-order-text {
    display: none;
}

.voltaic-product-grid-view-btn .voltaic-call-to-order-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.voltaic-product-grid-view-btn .voltaic-call-to-order-icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

@media (max-width: 767px) {
    .voltaic-calltoorder-product-actions {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 10px;
    }

    .voltaic-calltoorder-product-actions .voltaic-call-to-order-btn {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .voltaic-calltoorder-product-actions .tocompare {
        flex: 0 0 auto;
        width: auto;
        white-space: nowrap;
    }
}

#voltaic-call-to-order-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
    row-gap: 15px;
}

#voltaic-call-to-order-form .voltaic-cto-product-field,
#voltaic-call-to-order-form .voltaic-cto-message-field,
#voltaic-call-to-order-form .voltaic-cto-phone-hint,
#voltaic-call-to-order-form .voltaic-cto-error,
#voltaic-call-to-order-form .voltaic-cto-success,
#voltaic-call-to-order-form .actions-toolbar {
    grid-column: 1 / -1;
}

#voltaic-call-to-order-form .field {
    margin-bottom: 0;
}

@media (max-width: 767px) {
    #voltaic-call-to-order-form {
        display: block;
    }

    #voltaic-call-to-order-form .field {
        width: 100%;
        margin-bottom: 15px;
    }
}
@media (max-width: 767px) {
    .product-item .product-item-actions {
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .product-item .product-item-actions .actions-primary,
    .product-item .product-item-actions .actions-secondary {
        display: block !important;
        width: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .product-item .product-item-actions .actions-primary {
        flex: 0 0 auto;
    }

    .product-item .product-item-actions .actions-secondary {
        flex: 0 0 auto;
    }

    .product-item .product-item-actions .tocompare {
        display: inline-flex !important;
        white-space: nowrap;
    }
}