.elementor-67683 .elementor-element.elementor-element-5e8e4757{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:5%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-67683 .elementor-element.elementor-element-33cccc44{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:20px 20px;--row-gap:20px;--column-gap:20px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(163.20000000000002, 162.13565217391306, 162.13565217391306, 0.26);--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-67683 .elementor-element.elementor-element-33cccc44.e-con{--align-self:stretch;}.elementor-67683 .elementor-element.elementor-element-7eb34b3f > .elementor-widget-container{margin:-7px -7px -7px -7px;}.elementor-widget-divider .elementor-divider__text{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-67683 .elementor-element.elementor-element-3fbc49a3{--divider-border-style:solid;--divider-border-width:1px;}.elementor-67683 .elementor-element.elementor-element-3fbc49a3 .elementor-divider-separator{width:75%;margin:0 auto;margin-center:0;}.elementor-67683 .elementor-element.elementor-element-3fbc49a3 .elementor-divider{text-align:center;padding-block-start:14px;padding-block-end:14px;}.elementor-67683 .elementor-element.elementor-element-1182063{width:auto;max-width:auto;font-family:"Brandon PTK", Sans-serif;}.elementor-67683 .elementor-element.elementor-element-1182063 > .elementor-widget-container{margin:0px 20px 20px 20px;padding:0px 0px 0px 0px;}.elementor-67683 .elementor-element.elementor-element-1182063.elementor-element{--align-self:flex-start;--flex-grow:0;--flex-shrink:1;}.elementor-67683 .elementor-element.elementor-element-1182063:not(.elementor-woo-meta--view-inline) .product_meta .detail-container:not(:last-child){padding-bottom:calc(30px/2);}.elementor-67683 .elementor-element.elementor-element-1182063:not(.elementor-woo-meta--view-inline) .product_meta .detail-container:not(:first-child){margin-top:calc(30px/2);}.elementor-67683 .elementor-element.elementor-element-1182063.elementor-woo-meta--view-inline .product_meta .detail-container{margin-right:calc(30px/2);margin-left:calc(30px/2);}.elementor-67683 .elementor-element.elementor-element-1182063.elementor-woo-meta--view-inline .product_meta{margin-right:calc(-30px/2);margin-left:calc(-30px/2);}body:not(.rtl) .elementor-67683 .elementor-element.elementor-element-1182063.elementor-woo-meta--view-inline .detail-container:after{right:calc( (-30px/2) + (-1px/2) );}body:not.rtl .elementor-67683 .elementor-element.elementor-element-1182063.elementor-woo-meta--view-inline .detail-container:after{left:calc( (-30px/2) - (1px/2) );}.elementor-67683 .elementor-element.elementor-element-49e3d418{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-woocommerce-product-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-67683 .elementor-element.elementor-element-21ee35cf > .elementor-widget-container{margin:0px 0px 0px 30px;}.elementor-67683 .elementor-element.elementor-element-21ee35cf .elementor-heading-title{font-family:"General SANS", Sans-serif;font-size:36px;font-weight:600;text-transform:uppercase;color:#141414;}.elementor-67683 .elementor-element.elementor-element-54a5b5c5 > .elementor-widget-container{margin:0px 0px 0px 30px;}.elementor-67683 .elementor-element.elementor-element-1e0bec0f{--divider-border-style:solid;--divider-border-width:1px;}.elementor-67683 .elementor-element.elementor-element-1e0bec0f > .elementor-widget-container{margin:0px 0px 0px 30px;}.elementor-67683 .elementor-element.elementor-element-1e0bec0f .elementor-divider-separator{width:94%;margin:0 auto;margin-center:0;}.elementor-67683 .elementor-element.elementor-element-1e0bec0f .elementor-divider{text-align:center;padding-block-start:14px;padding-block-end:14px;}.elementor-67683 .elementor-element.elementor-element-6e5fbf7d > .elementor-widget-container{margin:0px 0px 0px 30px;}.elementor-widget-woocommerce-product-content{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-67683 .elementor-element.elementor-element-4c4f2aed > .elementor-widget-container{margin:0px 0px 0px 30px;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .elementor-add-to-cart.elementor-product-simple .cart{flex-direction:column;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart-wrapper{justify-content:center;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc > .elementor-widget-container{margin:0px 0px 10px 0px;}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .cart .button{width:100%;justify-content:center;color:#FFFFFF;background-color:var( --e-global-color-accent );transition:all 0.2s;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart{width:100%;justify-content:center;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-add-to-cart-wrapper .button-text{color:#FFFFFF;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-add-to-cart-wrapper .eael-add-to-cart{background-color:var( --e-global-color-accent );transition:all 0.2s;}.woocommerce div.product .eael-single-product-add-to-cart form.cart input[type=number] .qty, 
					.woocommerce div.product .eael-single-product-add-to-cart form.cart .quantity .qty,
					.eael-add-to-cart-wrapper input[type=number], 
					.eael-add-to-cart-wrapper .quantity-input{height:0px;width:100%;}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .quantity .qty{color:var( --e-global-color-accent );transition:all 0.2s;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart-wrapper .quantity-input{color:var( --e-global-color-accent );transition:all 0.2s;}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart form.cart .variations,
					.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-variable-product-edit .eael-variable-product{width:100%;}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .single_add_to_cart_button svg{height:18px;width:18px;margin:2px 10px 0px 0px;}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .single_add_to_cart_button i{font-size:18px;color:var( --e-global-color-secondary );}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart svg{height:18px;width:18px;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart i{font-size:18px;color:var( --e-global-color-secondary );}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .single_add_to_cart_button{display:flex;gap:0px;}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart-wrapper .eael-add-to-cart{gap:0px;}.woocommerce .elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .single_add_to_cart_button svg path{fill:var( --e-global-color-secondary );}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart svg path{fill:var( --e-global-color-secondary );}.elementor-67683 .elementor-element.elementor-element-7dc67ffc .eael-single-product-add-to-cart .eael-add-to-cart .cart-icon{margin:2px 10px 0px 0px;}.elementor-widget-eael-creative-button .eael-creative-button .cretive-button-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-eael-creative-button .eael-creative-button--rayen::before, 
                                .elementor-widget-eael-creative-button .eael-creative-button--winona::after, 
                                .elementor-widget-eael-creative-button .eael-creative-button--tamaya .eael-creative-button--tamaya-secondary span,
                                .elementor-widget-eael-creative-button .eael-creative-button.eael-creative-button--saqui::after{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button,
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--ujarak:hover,
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--wayra:hover,
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--tamaya::before,
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--tamaya::after
                {background-color:#7A7A7A87;}.elementor-67683 .elementor-element.elementor-element-1caed049 > .elementor-widget-container{margin:0px 0px 36px 0px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button-icon-left svg, 
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button-icon-right svg{rotate:0deg;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button-icon-left i,
                    .elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button-icon-right i{rotate:0deg;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button i{font-size:0px;color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button svg{height:0px;width:0px;fill:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button-wrapper{justify-content:center;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button{width:100%;padding:8px 8px 8px 8px;color:#ffffff;border-radius:8px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--winona::after{padding:8px 8px 8px 8px;color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--winona > .creative-button-inner{padding:8px 8px 8px 8px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--tamaya::before{padding:8px 8px 8px 8px;color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--rayen::before{padding:8px 8px 8px 8px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--rayen > .creative-button-inner{padding:8px 8px 8px 8px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--saqui::after{padding:8px 8px 8px 8px;color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button .creative-button-inner svg{fill:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button .eael-creative-button--tamaya-secondary{color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button.eael-creative-button--tamaya::after{color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button::before{border-radius:8px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button::after{border-radius:8px;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button:hover i{color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button:hover .creative-button-inner svg{fill:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button:hover{color:#ffffff;}.elementor-67683 .elementor-element.elementor-element-1caed049 .eael-creative-button:hover svg{fill:#ffffff;}.elementor-widget-image .widget-image-caption{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-67683 .elementor-element.elementor-element-1c1f74d6 > .elementor-widget-container{background-color:#E9E9E961;margin:2px 2px 2px 2px;border-radius:20px 20px 20px 20px;}.elementor-67683 .elementor-element.elementor-element-418af37c > .elementor-widget-container{margin:0px 0px 81px 0px;}.elementor-67683 .elementor-element.elementor-element-418af37c{--alignment:center;--grid-side-margin:45px;--grid-column-gap:45px;--grid-row-gap:4px;--grid-bottom-margin:4px;--e-share-buttons-primary-color:#0A3C2E;}.elementor-67683 .elementor-element.elementor-element-418af37c .elementor-share-btn{font-size:calc(0.65px * 10);border-width:2px;}.elementor-67683 .elementor-element.elementor-element-418af37c .elementor-share-btn__icon{--e-share-buttons-icon-size:3em;}.elementor-67683 .elementor-element.elementor-element-418af37c .elementor-share-btn:hover{--e-share-buttons-primary-color:var( --e-global-color-primary );}.elementor-67683 .elementor-element.elementor-element-418af37c .elementor-share-btn__title{font-family:"Brandon PTK", Sans-serif;}.elementor-67683 .elementor-element.elementor-element-2c80c059{--display:flex;}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.woocommerce .elementor-widget-woocommerce-product-related.elementor-wc-products .products > h2{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-67683 .elementor-element.elementor-element-e613247.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-67683 .elementor-element.elementor-element-e613247.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-67683 .elementor-element.elementor-element-3fbc49a3 .elementor-divider{padding-block-start:10px;padding-block-end:10px;}.elementor-67683 .elementor-element.elementor-element-1e0bec0f .elementor-divider{padding-block-start:10px;padding-block-end:10px;} .elementor-67683 .elementor-element.elementor-element-418af37c{--grid-side-margin:45px;--grid-column-gap:45px;--grid-row-gap:4px;--grid-bottom-margin:4px;}.elementor-67683 .elementor-element.elementor-element-e613247.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-67683 .elementor-element.elementor-element-5e8e4757{--margin-top:-33%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-67683 .elementor-element.elementor-element-49e3d418{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;} .elementor-67683 .elementor-element.elementor-element-418af37c{--grid-side-margin:45px;--grid-column-gap:45px;--grid-row-gap:4px;--grid-bottom-margin:4px;}.elementor-67683 .elementor-element.elementor-element-e613247.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for container, class: .elementor-element-33cccc44 */.elementor-67683 .elementor-element.elementor-element-33cccc44 {
   background: rgba(255, 255, 255,.09);
   
   backdrop-filter: blur(10px);
   -webkit-backdrop-filter: blur(25px); 
  
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6e5fbf7d */<!-- =================== OPORT · PAQUETE $1600 (CLEAN PINK VALENTINE) · WOO BTN =================== -->
<style>
  :root{
    --pink:#ff5aa5;
    --pink2:#ff86c4;
    --pinkSoft: rgba(255,90,165,.14);
    --pinkBorder: rgba(255,90,165,.30);

    --ink:#101318;
    --muted:#6b7280;
    --line:#e5e7eb;
    --card:#ffffff;
    --shadow: 0 14px 40px rgba(0,0,0,.10);
  }

  .oportp-quote{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;background:transparent;padding:0;color:var(--ink);}
  .oportp-quote .card{
    max-width:620px;margin:0 auto;background:var(--card);
    border:1px solid var(--line); border-radius:18px;
    box-shadow:var(--shadow);
    overflow:hidden; position:relative;
  }

  /* Corazones sutiles en el fondo (MUY leve) */
  .oportp-quote .val-bg{
    position:absolute; inset:0; pointer-events:none; opacity:.40;
    background-image:
      radial-gradient(circle at 12% 18%, rgba(255,90,165,.20) 0 6px, transparent 7px),
      radial-gradient(circle at 84% 26%, rgba(255,134,196,.16) 0 8px, transparent 9px),
      radial-gradient(circle at 70% 78%, rgba(255,90,165,.12) 0 10px, transparent 11px),
      radial-gradient(circle at 22% 76%, rgba(255,134,196,.10) 0 9px, transparent 10px);
    filter: blur(.2px);
  }

  /* Header clean con rosa */
  .oportp-quote .head{
    padding:16px 16px 12px;
    background:
      radial-gradient(900px 220px at 0% 0%, var(--pinkSoft), transparent 60%),
      radial-gradient(600px 220px at 100% 0%, rgba(255,134,196,.10), transparent 60%),
      linear-gradient(180deg, #fff, #fff);
    border-bottom:1px solid var(--line);
    position:relative; z-index:2;
  }

  .oportp-quote .badges{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
  .oportp-quote .badge{
    display:inline-flex;align-items:center;gap:8px;
    font-size:12px;font-weight:900;color:#7a1141;
    background:rgba(255,90,165,.12);
    border:1px solid var(--pinkBorder);
    padding:7px 10px;border-radius:999px;
  }
  .oportp-quote .badge .dot{
    width:8px;height:8px;border-radius:99px;background:var(--pink);
    box-shadow:0 0 0 4px rgba(255,90,165,.18);
  }
  .oportp-quote .badge2{
    display:inline-flex;align-items:center;gap:8px;
    font-size:12px;font-weight:900;color:#7a1141;
    background:#fff;
    border:1px dashed var(--pinkBorder);
    padding:7px 10px;border-radius:999px;
  }

  .oportp-quote .title{margin:10px 0 4px; font-size:20px; font-weight:950; letter-spacing:.2px;}
  .oportp-quote .subtitle{margin:0; font-size:13px; color:var(--muted); line-height:1.35;}

  /* Includes chips */
  .oportp-quote .includes{
    padding:12px 16px; display:flex; flex-wrap:wrap; gap:8px;
    border-bottom:1px solid var(--line);
    position:relative; z-index:2;
  }
  .oportp-quote .inc{
    display:inline-flex; align-items:center; gap:8px;
    padding:8px 10px; border-radius:999px;
    background:#fff;
    border:1px solid var(--line);
    font-size:12px; font-weight:900; color:#111827;
  }
  .oportp-quote .inc .emoji{
    width:22px;height:22px;border-radius:999px;display:grid;place-items:center;
    background:rgba(255,90,165,.12);
    border:1px solid rgba(255,90,165,.25);
  }

  /* Body */
  .oportp-quote .body{ padding:16px; display:grid; gap:12px; position:relative; z-index:2; }

  .oportp-quote label{font-size:12px;font-weight:900;color:#111827;margin-bottom:6px;display:block}
  .oportp-quote .hint{font-size:12px;color:var(--muted);margin-top:6px}

  .oportp-quote textarea,
  .oportp-quote select,
  .oportp-quote input[type="text"]{
    width:100%;
    background:#fff;
    border:1px solid var(--line);
    color:#111827;
    padding:12px 12px;border-radius:14px;outline:none;
    box-shadow:0 1px 0 rgba(0,0,0,.02);
  }
  .oportp-quote textarea{min-height:105px;resize:vertical}

  .oportp-quote .row{display:flex;gap:12px;flex-wrap:wrap}
  .oportp-quote .row > div{flex:1;min-width:190px}

  /* Tallas chips */
  .oportp-quote .chipsRow{display:flex;flex-wrap:wrap;gap:8px}
  .oportp-quote .chipBtn{
    border:1px solid var(--line);
    background:#fff;
    color:#111827;
    padding:9px 12px;border-radius:999px;
    font-size:12px;font-weight:950;
    cursor:pointer;
    transition:transform .08s ease, border-color .15s ease, box-shadow .15s ease;
    user-select:none;
  }
  .oportp-quote .chipBtn:hover{transform:translateY(-1px)}
  .oportp-quote .chipBtn.active{
    border-color:rgba(255,90,165,.55);
    box-shadow:0 10px 22px rgba(255,90,165,.14);
    background:rgba(255,90,165,.10);
    color:#7a1141;
  }

  /* Colores dots */
  .oportp-quote .dots{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
  .oportp-quote .dotBtn{
    width:26px;height:26px;border-radius:999px;cursor:pointer;
    border:2px solid #d1d5db;
    box-shadow:0 10px 26px rgba(0,0,0,.10);
    position:relative;
  }
  .oportp-quote .dotBtn.active{
    border-color:rgba(255,90,165,.70);
    box-shadow:0 12px 24px rgba(255,90,165,.14);
  }
  .oportp-quote .dotBtn.active:after{
    content:""; position:absolute; inset:6px; border-radius:999px;
    border:2px solid #fff;
  }
  .oportp-quote .dotLbl{font-size:12px;color:var(--muted)}

  /* Uploader */
  .oportp-quote .uploader{
    border-radius:16px;
    border:1px dashed rgba(255,90,165,.45);
    background:rgba(255,90,165,.06);
    padding:12px;
  }
  .oportp-quote .uploadbar{
    display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
    padding:10px;border-radius:14px;
    background:#fff;
    border:1px solid var(--line);
  }
  .oportp-quote input[type="file"]{
    width:100%;
    padding:10px;
    border-radius:12px;
    border:1px solid var(--line);
    background:#fff;
    color:#111827;
  }
  .oportp-quote .preview{
    margin-top:10px;display:none;gap:10px;align-items:center;
    padding:10px;border-radius:14px;background:#fff;
    border:1px solid var(--line);
  }
  .oportp-quote .preview img{
    width:72px;height:72px;object-fit:cover;border-radius:14px;
    border:1px solid var(--line);
  }

  /* Total */
  .oportp-quote .totalBox{
    border-radius:16px;padding:14px;
    background:#fff7fb;
    border:1px solid rgba(255,90,165,.22);
    display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  }
  .oportp-quote .price{font-size:22px;font-weight:950;color:#7a1141;}

  /* Mensajes */
  .oportp-quote .error, .oportp-quote .ok{
    display:none;margin-top:10px;
    padding:10px 12px;border-radius:14px;font-size:13px;
    border:1px solid var(--line);
  }
  .oportp-quote .error{background:#fff1f2;border-color:#fecdd3;color:#991b1b;}
  .oportp-quote .ok{background:#ecfdf5;border-color:#bbf7d0;color:#065f46;}

  .oportp-quote .mini{
    font-size:12px;color:#111827;opacity:.9;line-height:1.35;margin-top:8px;
    border-top:1px solid var(--line);padding-top:10px;
  }

  /* Mini confetti hearts (sutil) */
  .oportp-quote .mini-hearts{
    position:absolute; inset:0; pointer-events:none; opacity:.28; z-index:1;
    background-image:
      radial-gradient(circle at 20% 30%, rgba(255,90,165,.20) 0 3px, transparent 4px),
      radial-gradient(circle at 55% 22%, rgba(255,134,196,.16) 0 3px, transparent 4px),
      radial-gradient(circle at 78% 40%, rgba(255,90,165,.18) 0 3px, transparent 4px),
      radial-gradient(circle at 35% 70%, rgba(255,134,196,.14) 0 3px, transparent 4px),
      radial-gradient(circle at 68% 76%, rgba(255,90,165,.14) 0 3px, transparent 4px);
    animation:oportHeartsFloat 7s ease-in-out infinite alternate;
  }
  @keyframes oportHeartsFloat{ from{transform:translateY(0px)} to{transform:translateY(-10px)} }

  /* ======================
     WOO FLOW (IMPORTANT)
     ====================== */

  /* Oculta el botón Woo nativo hasta enviar datos */
  body.oport-hide-woo button.single_add_to_cart_button,
  body.oport-hide-woo .single_add_to_cart_button,
  body.oport-hide-woo button[name="add-to-cart"]{
    display:none !important;
  }

  /* Botón Enviar Datos */
  .oport-send-btn{
    width:100%;
    border:0;border-radius:14px;
    padding:14px 14px;
    cursor:pointer;font-size:15px;font-weight:950;
    color:#3b0520;
    background:linear-gradient(135deg, var(--pink), var(--pink2));
    box-shadow:0 18px 34px rgba(255,90,165,.20);
    position:relative; overflow:hidden;
    margin-top:6px;
  }
  .oport-send-btn:after{
    content:""; position:absolute; inset:-40%;
    background:linear-gradient(120deg, transparent 10%, rgba(255,255,255,.35) 30%, transparent 55%);
    transform:translateX(-40%) rotate(10deg);
    transition:transform .5s ease;
    pointer-events:none;
  }
  .oport-send-btn:hover:after{ transform:translateX(40%) rotate(10deg); }
  .oport-send-btn[disabled]{opacity:.55;cursor:not-allowed;filter:saturate(.75);box-shadow:none}
  .oport-send-btn[disabled]:after{display:none}

  /* Mensaje listo para comprar */
  .oport-woo-ready{
    display:none;
    margin-top:10px;
    padding:10px 12px;
    border-radius:14px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    color:#065f46;
    font-size:13px;
    font-weight:900;
  }
</style>

<div class="oportp-quote" data-product-id="12345">
  <div class="card">
    <div class="val-bg"></div>
    <div class="mini-hearts"></div>

    <div class="head">
      <div class="badges">
        <div class="badge"><span class="dot"></span> Paquete San Valentín · Precio fijo</div>
        <div class="badge2">💘 14 FEB · Edición limitada</div>
      </div>
      <div class="title">Paquete $1,600 MXN</div>
      <p class="subtitle">Arma tu regalo, elige tallas/colores y sube tu foto ✨</p>
    </div>

    <div class="includes">
      <span class="inc"><span class="emoji">🖼️</span>Canvas</span>
      <span class="inc"><span class="emoji">☕️</span>Taza</span>
      <span class="inc"><span class="emoji">👕</span>Playera</span>
      <span class="inc"><span class="emoji">🧥</span>Sudadera</span>
      <span class="inc"><span class="emoji">🌹</span>Flores “PASIÓN”</span>
    </div>

    <div class="body">
      <div class="row">
        <div>
          <label>Color de flores</label>
          <select id="oport_flower_color">
            <option value="Rojo">Rojo</option>
            <option value="Rosa">Rosa</option>
            <option value="Blanco">Blanco</option>
            <option value="Amarillo">Amarillo</option>
            <option value="Morado">Morado</option>
            <option value="Mix">Mix (sorpresa)</option>
          </select>
        </div>
        <div>
          <label>Frase / Nombre (opcional)</label>
          <input type="text" id="oport_phrase" placeholder="Ej. 'Te amo Dani' / 'Dylan & Dani'">
        </div>
      </div>

      <div class="row">
        <div>
          <label>Talla Playera</label>
          <div class="chipsRow" id="oport_size_tee">
            <button class="chipBtn" type="button" data-val="S">S</button>
            <button class="chipBtn" type="button" data-val="M">M</button>
            <button class="chipBtn" type="button" data-val="L">L</button>
            <button class="chipBtn" type="button" data-val="XL">XL</button>
            <button class="chipBtn" type="button" data-val="XXL">XXL</button>
          </div>
          <div class="hint">Selecciona una (opcional)</div>
        </div>

        <div>
          <label>Color Playera</label>
          <div class="dots" id="oport_color_tee">
            <span class="dotBtn" role="button" tabindex="0" data-name="Negro"  style="background:#111"></span>
            <span class="dotBtn" role="button" tabindex="0" data-name="Blanco" style="background:#f3f3f3"></span>
            <span class="dotBtn" role="button" tabindex="0" data-name="Rojo"   style="background:#ff2b2b"></span>
            <span class="dotBtn" role="button" tabindex="0" data-name="Gris"   style="background:#b9bcc2"></span>
          </div>
          <div class="dotLbl" id="oport_color_tee_lbl">Elegir color (opcional)</div>
        </div>
      </div>

      <div class="row">
        <div>
          <label>Talla Sudadera</label>
          <div class="chipsRow" id="oport_size_hoodie">
            <button class="chipBtn" type="button" data-val="S">S</button>
            <button class="chipBtn" type="button" data-val="M">M</button>
            <button class="chipBtn" type="button" data-val="L">L</button>
            <button class="chipBtn" type="button" data-val="XL">XL</button>
            <button class="chipBtn" type="button" data-val="XXL">XXL</button>
          </div>
          <div class="hint">Selecciona una (opcional)</div>
        </div>

        <div>
          <label>Color Sudadera</label>
          <div class="dots" id="oport_color_hoodie">
            <span class="dotBtn" role="button" tabindex="0" data-name="Negro"  style="background:#111"></span>
            <span class="dotBtn" role="button" tabindex="0" data-name="Blanco" style="background:#f3f3f3"></span>
            <span class="dotBtn" role="button" tabindex="0" data-name="Rojo"   style="background:#ff2b2b"></span>
            <span class="dotBtn" role="button" tabindex="0" data-name="Gris"   style="background:#b9bcc2"></span>
          </div>
          <div class="dotLbl" id="oport_color_hoodie_lbl">Elegir color (opcional)</div>
        </div>
      </div>

      <div>
        <label>Detalles del paquete (instrucciones extra)</label>
        <textarea id="oport_details" placeholder="Ej. Taza con nombre / Canvas en BN con LOVE / Entregar para el 14..."></textarea>
      </div>

      <div class="uploader">
        <div class="uploadbar">
          <div>
            <strong>Sube tu imagen (obligatorio)</strong>
            <div class="hint">Foto clara + sin pixelado = queda perrón 😈</div>
          </div>
          <div class="hint">JPG / PNG / WebP · Máx 12MB</div>
        </div>

        <div style="margin-top:10px;">
          <input type="file" id="oport_file" accept="image/*">
        </div>

        <div class="preview" id="oport_preview">
          <img id="oport_preview_img" src="" alt="preview">
          <div>
            <div style="font-weight:950" id="oport_preview_name">archivo.jpg</div>
            <div class="hint">Listo para enviar ✅</div>
          </div>
        </div>
      </div>

      <div class="totalBox">
        <div>
          <div style="font-size:12px;color:var(--muted)">Total</div>
          <div class="price">$<span id="oport_total">1600</span> MXN</div>
        </div>
        <div style="font-size:12px;color:var(--muted)">
          *Precio fijo del paquete
        </div>
      </div>

      <!-- BOTÓN NUEVO (NO COMPRA, SOLO ENVÍA DATOS) -->
      <button class="oport-send-btn" id="oport_send_data_btn" disabled>Enviar datos del cotizador 💘</button>

      <!-- MENSAJES -->
      <div class="error" id="oport_err"></div>
      <div class="ok" id="oport_ok"></div>

      <!-- MENSAJE PARA MOSTRAR CUANDO YA PUEDE COMPRAR (WOO) -->
      <div class="oport-woo-ready" id="oport_woo_ready">
        ✅ Datos enviados. Ya puedes comprar con el botón de WooCommerce 👇
      </div>

      <div class="mini">
        <div><strong>30 años de experiencia nos respaldan</strong></div>
        <div><strong>Por ser fabricantes, tenemos los mejores precios y mejoramos cualquier cotización</strong></div>
      </div>
    </div>
  </div>
</div>

<script>
(function(){
  const wrap = document.querySelector('.oportp-quote[data-product-id]');
  if(!wrap) return;

  const PRICE = 1600;
  const $ = (id)=>document.getElementById(id);

  // Woo form (debe existir en ficha producto)
  const wooForm = document.querySelector('form.cart');
  if(!wooForm) return;

  // Oculta Woo al inicio
  document.body.classList.add('oport-hide-woo');

  function ensureHidden(name){
    let el = wooForm.querySelector('input[name="'+name+'"]');
    if(!el){
      el = document.createElement('input');
      el.type = 'hidden';
      el.name = name;
      wooForm.appendChild(el);
    }
    return el;
  }

  const h = {
    price: ensureHidden('oport_pack_price'),
    includes: ensureHidden('oport_pack_includes'),
    flower: ensureHidden('oport_pack_flower_color'),
    phrase: ensureHidden('oport_pack_phrase'),
    details: ensureHidden('oport_pack_details'),
    fileUrl: ensureHidden('oport_pack_file_url'),
    fileName: ensureHidden('oport_pack_file_name'),
  };

  const fileInput = $('oport_file');
  const sendBtn = $('oport_send_data_btn');
  const readyBox = $('oport_woo_ready');
  const err = $('oport_err');
  const ok = $('oport_ok');
  const preview = $('oport_preview');
  const previewImg = $('oport_preview_img');
  const previewName = $('oport_preview_name');

  const colTeeLbl = $('oport_color_tee_lbl');
  const colHoodieLbl = $('oport_color_hoodie_lbl');

  const wooBtn = wooForm.querySelector('.single_add_to_cart_button, button[name="add-to-cart"]');
  if(wooBtn) wooBtn.disabled = true;

  let uploadedFileUrl = '';
  let uploadedFileName = '';

  let sizeTee = '';
  let sizeHoodie = '';
  let colorTee = '';
  let colorHoodie = '';

  function showErr(msg){ err.style.display='block'; err.textContent=msg; ok.style.display='none'; }
  function showOk(msg){ ok.style.display='block'; ok.textContent=msg; err.style.display='none'; }
  function clearMsgs(){ err.style.display='none'; ok.style.display='none'; }

  function enableSend(){
    sendBtn.disabled = !uploadedFileUrl;
  }

  function showWoo(){
    document.body.classList.remove('oport-hide-woo');
    if(wooBtn) wooBtn.disabled = false;
    readyBox.style.display = 'block';
  }

  function setupChipGroup(containerId, onPick){
    const container = $(containerId);
    if(!container) return;
    const btns = Array.from(container.querySelectorAll('.chipBtn'));
    btns.forEach(b=>{
      b.addEventListener('click', ()=>{
        const val = b.getAttribute('data-val') || '';
        const isActive = b.classList.contains('active');
        btns.forEach(x=>x.classList.remove('active'));
        if(!isActive){ b.classList.add('active'); onPick(val); }
        else{ onPick(''); }
      });
    });
  }
  setupChipGroup('oport_size_tee', (v)=>{ sizeTee = v; });
  setupChipGroup('oport_size_hoodie', (v)=>{ sizeHoodie = v; });

  function setupDots(containerId, onPick, labelEl){
    const container = $(containerId);
    if(!container) return;
    const dots = Array.from(container.querySelectorAll('.dotBtn'));
    function pickDot(el){
      const name = el.getAttribute('data-name') || '';
      const isActive = el.classList.contains('active');
      dots.forEach(x=>x.classList.remove('active'));
      if(!isActive){
        el.classList.add('active');
        onPick(name);
        if(labelEl) labelEl.textContent = `Color: ${name}`;
      }else{
        onPick('');
        if(labelEl) labelEl.textContent = 'Elegir color (opcional)';
      }
    }
    dots.forEach(d=>{
      d.addEventListener('click', ()=>pickDot(d));
      d.addEventListener('keydown', (e)=>{ if(e.key==='Enter' || e.key===' ') { e.preventDefault(); pickDot(d); } });
    });
  }
  setupDots('oport_color_tee', (v)=>{ colorTee = v; }, colTeeLbl);
  setupDots('oport_color_hoodie', (v)=>{ colorHoodie = v; }, colHoodieLbl);

  // Upload imagen
  fileInput.addEventListener('change', async (e)=>{
    clearMsgs();
    const f = e.target.files && e.target.files[0];
    uploadedFileUrl = '';
    uploadedFileName = '';
    enableSend();
    preview.style.display='none';

    if(!f){ return; }
    if(!f.type.startsWith('image/')){
      showErr('Solo se permiten imágenes (JPG/PNG/WebP).');
      fileInput.value='';
      return;
    }
    if(f.size > 12 * 1024 * 1024){
      showErr('La imagen pesa mucho. Máximo 12MB.');
      fileInput.value='';
      return;
    }

    const url = URL.createObjectURL(f);
    previewImg.src = url;
    previewName.textContent = f.name;
    preview.style.display='flex';

    try{
      showOk('Subiendo imagen...');
      const fd = new FormData();
      fd.append('action', 'oport_pack_upload');
      fd.append('file', f);

      const res = await fetch(window.location.origin + '/wp-admin/admin-ajax.php', {
        method: 'POST',
        body: fd
      });

      const data = await res.json();
      if(!data || !data.success){
        throw new Error((data && data.data && data.data.message) ? data.data.message : 'No se pudo subir.');
      }

      uploadedFileUrl = data.data.url;
      uploadedFileName = data.data.name || f.name;

      // también actualiza hidden fields
      h.fileUrl.value = uploadedFileUrl;
      h.fileName.value = uploadedFileName;

      showOk('Imagen subida ✅ Ahora envía tus datos para habilitar la compra.');
      enableSend();
    }catch(ex){
      uploadedFileUrl = '';
      uploadedFileName = '';
      enableSend();
      showErr('Error subiendo imagen: ' + (ex.message || 'intenta otra vez'));
    }
  });

  // Enviar datos -> sesión + hidden -> habilitar Woo
  sendBtn.addEventListener('click', async ()=>{
    clearMsgs();

    if(!uploadedFileUrl){
      showErr('Primero sube tu imagen para continuar.');
      return;
    }

    const flower = $('oport_flower_color').value;
    const phrase = $('oport_phrase').value.trim();
    const detailsRaw = $('oport_details').value.trim();

    const packedDetails =
`Playera: ${sizeTee || '—'} / ${colorTee || '—'}
Sudadera: ${sizeHoodie || '—'} / ${colorHoodie || '—'}
Flores: ${flower || '—'}
Detalles: ${detailsRaw || '—'}`.trim();

    // Hidden fields para Woo
    h.price.value = String(PRICE);
    h.includes.value = 'Cuadro Canvas, Taza, Playera, Sudadera, Flores “PASIÓN”';
    h.flower.value = flower;
    h.phrase.value = phrase;
    h.details.value = packedDetails;
    h.fileUrl.value = uploadedFileUrl;
    h.fileName.value = uploadedFileName;

    try{
      sendBtn.disabled = true;
      sendBtn.textContent = 'Enviando...';

      const fd = new FormData();
      fd.append('action','oport_val_pack_save');
      fd.append('oport_pack_price', h.price.value);
      fd.append('oport_pack_includes', h.includes.value);
      fd.append('oport_pack_flower_color', h.flower.value);
      fd.append('oport_pack_phrase', h.phrase.value);
      fd.append('oport_pack_details', h.details.value);
      fd.append('oport_pack_file_url', h.fileUrl.value);
      fd.append('oport_pack_file_name', h.fileName.value);

      const res = await fetch(window.location.origin + '/wp-admin/admin-ajax.php', {
        method:'POST',
        body: fd
      });

      const data = await res.json();
      if(!data || !data.success){
        throw new Error((data && data.data && data.data.message) ? data.data.message : 'No se pudo guardar.');
      }

      showOk('Datos enviados ✅ Ahora compra con el botón de WooCommerce.');
      sendBtn.textContent = 'Datos enviados ✅';
      showWoo();
    }catch(err){
      showErr('Error enviando datos: ' + (err.message || 'intenta otra vez'));
      sendBtn.disabled = false;
      sendBtn.textContent = 'Enviar datos del cotizador 💘';
    }
  });

  // Init
  $('oport_total').textContent = PRICE.toFixed(0);
  enableSend();
})();
</script>/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Brandon PTK';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url('https://test.sk33studio.com/wp-content/uploads/2025/03/HvDTrial_Brandon_Grotesque_bold-BF64a625c9151d5.ttf') format('truetype');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'General SANS';
	font-style: italic;
	font-weight: bold;
	font-display: auto;
	src: url('https://oport.mx/wp-content/uploads/2025/09/GeneralSans-Variable.ttf') format('truetype');
}
@font-face {
	font-family: 'General SANS';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: ;
}
/* End Custom Fonts CSS */