/*
Theme Name: poisson Child
Theme URI: https://www.portotheme.com/wordpress/porto
Author: P-THEMES
Author URI: https://www.portotheme.com/
Description: Porto Responsive WordPress + eCommerce Theme.
Version: 1.1
Template: porto
License: Commercial
License URI: http://themeforest.net/licenses/regular_extended
Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
*/

/*
 * ==========================================================================
 * Poisson à domicile — custom CSS (child theme only)
 * ==========================================================================
 * 1. Porto / header overrides
 * 2. Top bar — marquee gradient overlays
 * 3. Main navigation
 * 4. Footer waves (.ocean / .wave) + wave section background
 * 5. Icon “equal” boxes
 * 6. Contact — Elementor toggle + CF7 submit
 * 7. Sidebars (widget IDs — update if widgets are re-created)
 * 8. Boutique — “nos coquillages” layout
 * 9. Utilities — stroke text
 * 10. Pro registration form + pro section ambience
 * 11. Elementor footer — remove Porto black wrapper (#212529)
 * 12. Poppins typography — see functions.php (text/titles only; icons untouched)
 * 13. By-Weight Pricing — weight stepper (plugin) vs Porto/WC quantity
 * ==========================================================================
 */

/* --------------------------------------------------------------------------
   1. Porto / header overrides
   (Porto Theme Options inject #header { border-top: 3px solid #ededed; } inline)
   -------------------------------------------------------------------------- */
#header,
.sticky-header.header-main.sticky {
   border-top: none !important;
}

/* --------------------------------------------------------------------------
   2. Top header — marquee fade (gradient overlay)
   -------------------------------------------------------------------------- */
.gradient-overlay .marquee:before {
   background: radial-gradient(circle at 100%, transparent, #2b2a4a 100%) !important;
   left: 0;
}

.gradient-overlay .marquee:after {
   background: radial-gradient(circle at 100%, #2b2a4a, transparent 100%) !important;
   right: 0;
}

/* --------------------------------------------------------------------------
   3. Main menu
   -------------------------------------------------------------------------- */
ul#menu-main-menu {
   column-gap: 15px;
   align-items: center;
}

/* --------------------------------------------------------------------------
   4. Footer waves (HTML widget: .ocean > .wave)
   + parent container: white strip under waves (see §4b). SVG fill uses #2B2A4A.
   -------------------------------------------------------------------------- */
.ocean {
   height: 80px;
   width: 100%;
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   overflow-x: hidden;
}

.wave {
   background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 88.7'%3E%3Cpath d='M800 56.9c-155.5 0-204.9-50-405.5-49.9-200 0-250 49.9-394.5 49.9v31.8h800v-.2-31.6z' fill='%232B2A4A'/%3E%3C/svg%3E");
   position: absolute;
   width: 200%;
   height: 100%;
   animation: poisson-wave 10s -3s linear infinite;
   transform: translate3d(0, 0, 0);
   opacity: 1;
}

.wave:nth-of-type(2) {
   bottom: 0;
   animation: poisson-wave 18s linear reverse infinite;
   opacity: 0.5;
}

.wave:nth-of-type(3) {
   bottom: 0;
   animation: poisson-wave 20s -1s linear infinite;
   opacity: 0.5;
}

@keyframes poisson-wave {
   0% {
      transform: translateX(0);
   }

   50% {
      transform: translateX(-25%);
   }

   100% {
      transform: translateX(-50%);
   }
}

/*
 * 4b. Footer wave section — Elementor inner container background
 * (avoids dark band behind waves). data-id changes if block is duplicated:
 * add class `footer-wave-wrap` in Elementor Advanced and replace selector.
 */
.porto_stretch_css.stretch_row_content_css.elementor-element-bddfceb.e-con-full.e-flex.e-con.e-parent {
   background-color: #ffffff;
}

/* --------------------------------------------------------------------------
   5. Icon boxes — equal height / look
   -------------------------------------------------------------------------- */
.equal-box {
   background: rgba(87, 163, 199, 0.05);
   padding: 10px;
   min-height: 260px;
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   text-align: center;
   border-radius: 15px;
}

.equal-box .elementor-image-box-title {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

/* --------------------------------------------------------------------------
   6. Contact — toggle + CF7 button
   -------------------------------------------------------------------------- */
.elementor-toggle-item .elementor-active {
   border-left-color: #57a3c7 !important;
}

/* One click target on the title row; avoids double-toggle from inner <a>. */
.elementor-toggle .elementor-tab-title > a.elementor-toggle-title,
.elementor-accordion .elementor-tab-title > a.elementor-accordion-title {
   pointer-events: none;
   cursor: pointer;
}

.elementor-toggle .elementor-tab-title,
.elementor-accordion .elementor-tab-title {
   cursor: pointer;
}

input.wpcf7-form-control.wpcf7-submit.has-spinner.btn.btn-primary.btn-lg {
   padding: 10px 40px;
   border: 0;
}

/* --------------------------------------------------------------------------
   7. Sidebars (IDs from current widgets — update if widgets are re-added)
   -------------------------------------------------------------------------- */
aside#recent_posts-widget-3 {
   border-top: none;
}

aside#block-3 {
   border-bottom: none;
}

/* --------------------------------------------------------------------------
   8. Boutique — “nos coquillages” two-column + product thumbnails
   (Elementor inner: .elementor-element-cf06490 — update if structure changes)
   -------------------------------------------------------------------------- */
.noscoquillages .posts-wrap.has-ccols-spacing {
   margin-left: 0 !important;
   margin-right: 0 !important;
}

.noscoquillages .product {
   transform: none;
}

.noscoquillages .product .product-type-imgzoom,
.noscoquillages .product .porto-tb-featured-image,
.noscoquillages .product .img-thumbnail,
.noscoquillages .product .img-thumbnail img {
   width: 100% !important;
   max-width: 100% !important;
   margin: 0 !important;
   padding: 0 !important;
   border: 0 !important;
   display: block !important;
   box-sizing: border-box;
}

@media (min-width: 768px) {
   .elementor-element-cf06490>.e-con-inner {
      display: flex;
      align-items: stretch;
   }

   .noscoquillagesimage,
   .noscoquillages {
      flex: 1 1 0;
      display: flex;
      flex-direction: column;
   }
}

/* --------------------------------------------------------------------------
   9. Utility — outlined / hollow text (WebKit + standard where supported)
   -------------------------------------------------------------------------- */
.stroke {
   -webkit-text-stroke: 1px #000;
   color: transparent;
}

/* --------------------------------------------------------------------------
   10. Pro registration + pro section decorations
   -------------------------------------------------------------------------- */
.pro-registration-form label {
   display: block;
   width: 100%;
   margin-bottom: 15px;
}

.pro-registration-form input,
.pro-registration-form select,
.pro-registration-form textarea {
   width: 100% !important;
   box-sizing: border-box;
}

.pro-section {
   position: relative;
   overflow: hidden;
}

.pro-section::before {
   content: "";
   position: absolute;
   width: 500px;
   height: 500px;
   border-radius: 50%;
   background: #1a4a7a;
   filter: blur(100px);
   opacity: 0.5;
   top: -150px;
   left: -100px;
   pointer-events: none;
   z-index: 0;
}

.pro-section::after {
   content: "";
   position: absolute;
   width: 350px;
   height: 350px;
   border-radius: 50%;
   background: #0d3355;
   filter: blur(80px);
   opacity: 0.6;
   bottom: -100px;
   right: 0;
   pointer-events: none;
   z-index: 0;
}

.pro-section .elementor-container {
   position: relative;
   z-index: 1;
}

/* --------------------------------------------------------------------------
   11. Elementor footer — Porto dynamic CSS sets #footer { background: #212529 }
   That color bleeds through empty containers / “Drag widget here” in the editor
   and any gap between Elementor sections. Each footer block keeps its own bg.
   -------------------------------------------------------------------------- */
#footer.footer-builder {
   background-color: transparent !important;
}

#footer.footer-builder .footer-bottom {
   background-color: transparent !important;
}

.elementor-location-footer {
   background-color: transparent;
}

/* Elementor editor canvas — white instead of black under new sections */
body.elementor-editor-active #footer.footer-builder,
body.elementor-editor-active .elementor-location-footer {
   background-color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   13. By-Weight Pricing — weight stepper (not WooCommerce cart quantity)
   Plugin uses .minus / .plus / .qty — same class names as Porto quantity UI.
   -------------------------------------------------------------------------- */

/* Hide WC cart qty when weight stepper is active (weight = the real "quantity"). */
.poisson-has-bwpw .single_variation_wrap:has(.bwpw_calculation_section:not(:empty)) .woocommerce-variation-add-to-cart .quantity,
.poisson-has-bwpw form.cart:has(.bwpw_calculation_section:not(:empty)) .quantity.buttons_added,
.poisson-has-bwpw .woocommerce-variation-add-to-cart .quantity.buttons_added,
.poisson-has-bwpw .elementor-widget-porto_cp_add_to_cart .quantity {
   display: none !important;
}

.poisson-weight-live {
   margin: 0 0 10px;
   font-size: 15px;
   font-weight: 600;
   color: var(--porto-heading-color, #222529);
}

.bwpw_calculation_section:not(:empty) {
   display: block !important;
   margin: 16px 0;
   padding: 14px 16px;
   background: #f9f9f9;
   border: 1px solid #e0e0e0;
   border-radius: 6px;
}

.bwpw_calculation_section table {
   width: 100%;
   border-collapse: collapse;
}

.bwpw_calculation_section table td {
   padding: 6px 0;
   vertical-align: middle;
}

.bwpw_calculation_section .weight {
   display: inline-flex;
   align-items: stretch;
   vertical-align: middle;
}

.bwpw_calculation_section .weight .bwpw_button {
   box-sizing: border-box;
   width: 36px;
   min-width: 36px;
   height: 36px;
   margin: 0;
   padding: 0;
   border: 1px solid var(--porto-gray-2, #e7e7e7);
   background: #fff;
   color: var(--porto-heading-color, #222529);
   font-family: inherit;
   font-size: 18px;
   font-weight: 400;
   line-height: 34px;
   text-align: center;
   text-indent: 0;
   cursor: pointer;
   appearance: none;
   -webkit-appearance: none;
}

.bwpw_calculation_section .weight .bwpw_button:before,
.bwpw_calculation_section .weight .bwpw_button:after {
   display: none !important;
   content: none !important;
}

.bwpw_calculation_section .weight .bwpw_button.minus {
   border-radius: 2px 0 0 2px;
}

.bwpw_calculation_section .weight .bwpw_button.plus {
   border-radius: 0 2px 2px 0;
}

.bwpw_calculation_section .weight .bwpw_button:disabled {
   opacity: 0.45;
   cursor: not-allowed;
}

.bwpw_calculation_section .weight .qty,
.bwpw_calculation_section .weight #bwpw_weight {
   box-sizing: border-box;
   width: 72px !important;
   min-width: 72px;
   height: 36px !important;
   margin: 0;
   padding: 0 6px;
   border: 1px solid var(--porto-gray-2, #e7e7e7);
   border-left: none;
   border-right: none;
   border-radius: 0;
   background: #fff;
   color: var(--porto-heading-color, #222529);
   font-size: 14px;
   font-weight: 600;
   line-height: 34px;
   text-align: center;
   -moz-appearance: textfield;
   appearance: textfield;
}

.bwpw_calculation_section .weight .qty::-webkit-outer-spin-button,
.bwpw_calculation_section .weight .qty::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
}

/* --------------------------------------------------------------------------
   14. Cart / checkout — delivery + minimum order banner
   Fixed palette (yellow only on backgrounds — do not add blue gradients).
   -------------------------------------------------------------------------- */
.poisson-delivery-banner {
   display: flex;
   flex-direction: column;
   gap: 16px;
   margin: 0 0 28px;
   padding: 20px 22px;
   border: 1px solid #f6d929;
   border-radius: 12px;
   background: #fffbeb;
   box-shadow: 0 4px 18px rgba(43, 42, 74, 0.06);
   animation: poisson-banner-in 0.45s ease;
}

.poisson-delivery-banner--warning {
   border-color: #e8c547;
   background: #fff9df;
}

.poisson-delivery-banner__item {
   display: flex;
   align-items: flex-start;
   gap: 14px;
}

.poisson-delivery-banner__icon {
   flex: 0 0 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   color: #2b2a4a;
   background: rgba(255, 255, 255, 0.85);
}

.poisson-delivery-banner__icon--ship {
   color: #57a3c7;
}

.poisson-delivery-banner__icon--min {
   color: #2b2a4a;
}

.poisson-delivery-banner__icon--clock {
   width: auto;
   height: auto;
   flex: 0 0 auto;
   border-radius: 0;
   background: transparent;
   color: #c9a020;
}

.poisson-delivery-banner__content {
   flex: 1;
   min-width: 0;
}

.poisson-delivery-banner__label {
   margin: 0 0 4px;
   font-size: 11px;
   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
   color: #888;
}

.poisson-delivery-banner__title {
   margin: 0 0 4px;
   font-size: 17px;
   font-weight: 700;
   line-height: 1.35;
   color: #2b2a4a;
}

.poisson-delivery-banner__meta {
   margin: 0;
   font-size: 13px;
   line-height: 1.5;
   color: #666;
}

.poisson-delivery-banner__meta--alert {
   color: #8a6d00;
   font-weight: 600;
}

.poisson-delivery-banner__deadline {
   display: flex;
   align-items: center;
   gap: 10px;
   margin: 4px 0 0;
   padding: 12px 14px;
   border-radius: 8px;
   background: rgba(255, 255, 255, 0.72);
   font-size: 13px;
   font-weight: 600;
   color: #2b2a4a;
}

.poisson-min-order-alert {
   display: flex;
   align-items: center;
   gap: 12px;
   margin: 0 0 14px;
   padding: 14px 16px;
   border: 1px solid #f6d929;
   border-radius: 10px;
   background: #fffbeb;
   box-shadow: 0 2px 12px rgba(43, 42, 74, 0.06);
}

.poisson-min-order-alert__icon {
   flex: 0 0 36px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 36px;
   height: 36px;
   border-radius: 50%;
   color: #2b2a4a;
   background: #fff;
}

.poisson-min-order-alert__text {
   margin: 0;
   font-size: 14px;
   font-weight: 600;
   line-height: 1.45;
   color: #2b2a4a;
}

.poisson-continue-shopping {
   display: inline-block;
   width: 100%;
   text-align: center;
   background: #57a3c7 !important;
   border-color: #57a3c7 !important;
   color: #fff !important;
}

.poisson-continue-shopping:hover {
   background: #2b2a4a !important;
   border-color: #2b2a4a !important;
   color: #fff !important;
}

.poisson-min-order-checkout-link {
   margin: 0 0 16px;
   text-align: center;
}

.poisson-free-delivery-nudge {
   display: flex;
   align-items: flex-start;
   gap: 14px;
   margin: 20px 0 0;
   padding: 18px 20px;
   border: 1px solid #57a3c7;
   border-radius: 12px;
   background: #f0f8fc;
   box-shadow: 0 4px 18px rgba(43, 42, 74, 0.06);
}

.poisson-free-delivery-nudge__icon {
   flex: 0 0 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   color: #57a3c7;
   background: #fff;
}

.poisson-free-delivery-nudge__title {
   margin: 0 0 6px;
   font-size: 16px;
   font-weight: 700;
   color: #2b2a4a;
}

.poisson-free-delivery-nudge__text {
   margin: 0 0 12px;
   font-size: 14px;
   line-height: 1.5;
   color: #444;
}

.poisson-free-delivery-nudge__progress {
   height: 8px;
   overflow: hidden;
   border-radius: 999px;
   background: rgba(43, 42, 74, 0.08);
}

.poisson-free-delivery-nudge__progress span {
   display: block;
   height: 100%;
   border-radius: inherit;
   background: #57a3c7;
   transition: width 0.35s ease;
}

.poisson-checkout-disabled,
.checkout-button.poisson-checkout-disabled {
   opacity: 0.55;
   pointer-events: none;
   cursor: not-allowed;
}

@keyframes poisson-banner-in {
   from {
      opacity: 0;
      transform: translateY(8px);
   }

   to {
      opacity: 1;
      transform: translateY(0);
   }
}

@media (max-width: 767px) {
   .poisson-delivery-banner {
      padding: 16px;
   }

   .poisson-delivery-banner__title {
      font-size: 15px;
   }
}