/**
 * Variantic Cart Edit - Styles for edit configuration link
 *
 * Supports:
 * - Classic WooCommerce cart
 * - WooCommerce Cart Blocks
 * - Mini cart
 * - Various themes
 * - Multiple style options: link, button, icon_only, text_only
 */

/* === BASE STYLES === */
.variantic-edit-config {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 16px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.variantic-edit-config:hover,
.variantic-edit-config:focus {
    text-decoration: underline;
}

/* Edit icon */
.variantic-edit-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232271b1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'%3E%3C/path%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'%3E%3C/path%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
    margin-right: 4px;
}

.variantic-edit-config:hover .variantic-edit-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23135e96' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'%3E%3C/path%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'%3E%3C/path%3E%3C/svg%3E");
}

/* === STYLE: BUTTON === */
.variantic-edit-config--style-button {
    display: inline-flex;
    padding: 6px 12px;
    background-color: #2271b1;
    color: #fff !important;
    border-radius: 4px;
    text-decoration: none !important;
}

.variantic-edit-config--style-button:hover,
.variantic-edit-config--style-button:focus {
    background-color: #135e96;
    color: #fff !important;
    text-decoration: none !important;
}

.variantic-edit-config--style-button .variantic-edit-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'%3E%3C/path%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'%3E%3C/path%3E%3C/svg%3E");
}

.variantic-edit-config--style-button:hover .variantic-edit-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'%3E%3C/path%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'%3E%3C/path%3E%3C/svg%3E");
}

/* === STYLE: ICON ONLY === */
.variantic-edit-config--style-icon_only {
    gap: 0;
    padding: 4px;
}

.variantic-edit-config--style-icon_only .variantic-edit-icon {
    width: 18px;
    height: 18px;
}

.variantic-edit-config--style-icon_only:hover {
    text-decoration: none;
}

/* === STYLE: TEXT ONLY === */
.variantic-edit-config--style-text_only {
    gap: 0;
}

.variantic-edit-config--style-text_only .variantic-edit-icon {
    display: none;
}

/* === INLINE VARIANT (after product name) === */
.variantic-edit-config--inline {
    display: inline-flex;
    margin-top: 5px;
}

/* === BLOCK VARIANT (separate container) === */
.variantic-edit-config-wrapper {
    margin-top: 8px;
}

.variantic-edit-config--block {
    display: inline-flex;
}

/* === CART BLOCKS VARIANT === */
.variantic-edit-config--blocks {
    display: inline-flex;
    margin-top: 8px;
    margin-bottom: 8px;
}

/* Cart Blocks: position after metadata (configuration info) */
.wc-block-cart-item__wrap > .variantic-edit-config,
.wc-block-cart-item__product > .variantic-edit-config {
    display: inline-flex;
    margin-top: 10px;
    margin-bottom: 10px;
    order: 3; /* After metadata, before quantity */
}

/* Cart Blocks: when inside wrap div */
.wc-block-cart-item__wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Align children to start, not stretch */
}

.wc-block-cart-item__wrap > .variantic-edit-config--blocks {
    order: 3;
}

/* Ensure edit link appears before quantity controls */
.wc-block-cart-item__quantity {
    order: 10;
}

/* Fallback positioning */
.wc-block-components-product-metadata + .variantic-edit-config,
.wc-block-components-product-name + .variantic-edit-config {
    display: inline-flex;
    margin-top: 8px;
}

/* === CLASSIC CART (JS INJECTION) === */
.variantic-edit-config-wrapper--js {
    margin-top: 8px;
    clear: both;
}

.variantic-edit-config--js {
    display: inline-flex;
}

/* === MINI CART VARIANT === */
.variantic-edit-config--mini {
    display: inline-block;
    margin: 8px 0;
    font-size: 0.9em;
    width: auto;
}

/* Mini cart in WooCommerce Blocks */
.wc-block-cart-item__wrap .variantic-edit-config--mini,
.wc-block-mini-cart-items .variantic-edit-config--mini {
    order: 3; /* After metadata, before quantity */
}

/* Classic mini cart widget */
.woocommerce-mini-cart-item .variantic-edit-config--mini {
    display: inline-block;
    margin-top: 5px;
}

/* === CLASSIC CART COMPATIBILITY === */
.woocommerce-cart-form .product-name .variantic-edit-config-wrapper,
.woocommerce table.cart .product-name .variantic-edit-config-wrapper {
    display: block;
    margin-top: 8px;
    clear: both;
}

/* === ANIMATION === */
.variantic-edit-config {
    position: relative;
}

.variantic-edit-config::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 0;
    height: 1px;
    background-color: currentColor;
    transition: width 0.2s ease;
}

.variantic-edit-config:hover::after {
    width: 100%;
}

/* Disable underline animation for text-decoration version */
.variantic-edit-config:hover {
    text-decoration: none;
}

/* === VARIANTIC SNAPSHOT IMAGES === */
/* Styles for replaced product thumbnails with Variantic snapshots */

/* Classic cart snapshot */
.woocommerce-cart-form .product-thumbnail img.variantic-snapshot,
.woocommerce-cart-form .product-thumbnail img.variantic-snapshot-replaced,
table.cart .product-thumbnail img.variantic-snapshot,
table.cart .product-thumbnail img.variantic-snapshot-replaced {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    background-color: #f8f8f8;
}

/* Cart Blocks snapshot */
.wc-block-cart-item__image img.variantic-snapshot-replaced,
.wc-block-components-product-image img.variantic-snapshot-replaced {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    background-color: #f8f8f8;
}

/* Mini cart snapshot */
.woocommerce-mini-cart-item img.variantic-snapshot,
.woocommerce-mini-cart-item img.variantic-snapshot-replaced {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* Order details snapshot */
.woocommerce-order-details img.variantic-snapshot,
.woocommerce-table--order-details img.variantic-snapshot {
    max-width: 100px;
    height: auto;
    object-fit: contain;
}

/* Checkout snapshot */
.woocommerce-checkout-review-order img.variantic-snapshot,
.woocommerce-checkout-review-order img.variantic-snapshot-replaced {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}