/*
 * Impulse Visuals UI Tweaks
 *
 * Purpose
 * - Move site tweaks from "Appearance → Customize → Additional CSS" into an update-safe plugin.
 *
 * Scope & Conflict Notes (reviewed against the provided Mayosis theme ZIP)
 * - Many selectors are Mayosis-specific (e.g., .mayosis--thumb, .mayosis-woo-ac-sidebr, .mayosis-term-item).
 * - A few selectors are more generic (.main-navigation .msv-main-menu, .styleone.btn). If you switch themes/plugins,
 *   these rules may have no effect or could style matching elements. Disable the plugin if needed.
 * - For WooCommerce archive layout, Mayosis defines .mayosis-archive-woo-container in woocommerce.css
 *   (e.g., padding-bottom: 60px). This plugin overrides only what you explicitly requested.
 */

/* =====================================================
   FOOTER & FORM CLEANUP
   - Contact Form 7 messages + footer border cleanup.
===================================================== */
.additional-footer,
div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing{
  border-color: transparent !important;
}

.additional-footer{
  padding-top: 0 !important;
}

/* =====================================================
   PRODUCT BADGES
   - Mayosis Woo sale badge position + brand color.
===================================================== */
.pivoo-product-sale-tag{
  left: -5px !important;
}

.pivoo-product-sale-tag span.onsale-percent{
  background: #7c3efe !important;
}

/* =====================================================
   SINGLE PRODUCT GALLERY – STYLE
   - Rounded gallery images.
   - Disable Woo/Mayosis zoom overlay (minimum required).
===================================================== */
.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery__image img{
  border-radius: 10px !important;
}

/* Disable single product image zoom (minimum required) */
.single-product .woocommerce-product-gallery img{
  transform: none !important;
  transition: none !important;
  cursor: default !important;
}

.single-product .zoomImg{
  display: none !important;
}

/* =====================================================
   BUTTONS & SIDEBAR
   - Button rounding and sidebar widget border styling.
===================================================== */
.styleone.btn,
.styletwo.btn,
.transbutton.btn{
  border-radius: 5px !important;
}

.theme--sidebar--widget{
  border: 1px solid #e2e5e9 !important;
}

/* Remove border for Mayosis filters widget (avoid brittle widget instance IDs) */
.theme--sidebar--widget[id^="mayosis_filters_widget"],
.theme--sidebar--widget[id*="mayosis_filters_widget"]{
  border: none !important;
}

/* =====================================================
   PRODUCT META VISIBILITY
   - Hide price meta blocks and star ratings in specific Mayosis components.
===================================================== */
.msb-inner-meta-price,
.msuv-rating-box-p,
.mayosis-woo-sidebar-p-details .star-rating,
.photo--price--block .star-rating{
  display: none !important;
}

/* Hide single add-to-cart button in the prime cart button area */
.prime-cart-button .single_add_to_cart_button{
  display: none !important;
}

/* =====================================================
   TYPOGRAPHY & NAVIGATION
===================================================== */
.woo-prime-product-template{
  text-align: left !important;
}

.mayosis-woo-single-style-one .woocommerce-breadcrumb{
  justify-content: flex-start !important;
}

/* MAIN MENU – ALL CAPS (Mayosis)
   - Mayosis uses #mayosis-menu.msv-main-menu for the default walker.
   - Mega menu uses .xoopic-m-menu with Bootstrap-style .nav links.
*/
.main-navigation #mayosis-menu.msv-main-menu > ul > li > a,
.main-navigation .xoopic-m-menu .nav > li > a{
  text-transform: uppercase !important;
  letter-spacing: 0.6px;
}

/* =====================================================
   SQUARE GRID THUMBNAILS (GRID ONLY)
   - Uses padding-top square ratio trick.
   - Scoped away from single product/download pages.
===================================================== */
body:not(.single-product):not(.single-download) .mayosis--thumb{
  position: relative;
  overflow: hidden;
}

body:not(.single-product):not(.single-download) .mayosis--thumb::before{
  content: "";
  display: block;
  padding-top: 100%;
}

body:not(.single-product):not(.single-download) .mayosis--thumb img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

body:not(.single-product):not(.single-download) .mayosis--thumb figcaption,
body:not(.single-product):not(.single-download) .mayosis--thumb .thumb-caption{
  position: absolute;
  inset: 0;
  z-index: 2;
}

/* =====================================================
   MAYOSIS FILTER SIDEBAR
   - Filter widget title color
   - Count aligned right
   - Etsy-style hover underline (single underline)
   - Typography tuned for readability
===================================================== */

/* FILTER SIDEBAR – TITLE COLOR (Mayosis)
   Note: Uses !important because theme CSS may load after plugin CSS. */
body .mayosis-filters-widget-wrapper .widget-title.mayosis-filter-title-widbar{
  color: #1a1e23 !important;
}

/* OPTIONAL: Force show the title in the compact filter box layout.
   Mayosis may hide this title inside .msv-cs-filter-box via `display:none !important`.
   Uncomment if you want the title visible.

.msv-cs-filter-box .mayosis-filters-widget-wrapper .widget-title.mayosis-filter-title-widbar{
  display: block !important;
}
*/

.widget-area li.mayosis-term-item,
.mayosis-filters-widget-main-wrapper li.mayosis-term-item{
  width: 100%;
}


/* FALLBACK (Mayosis variations / 3rd-party filter output)
   Some Mayosis installs output filter terms without `.mayosis-term-item`.
   This fallback targets common structures inside the Mayosis filters wrapper only. */
body .mayosis-filters-widget-wrapper li,
body .theme--sidebar--widget[id^="mayosis_filters_widget"] .mayosis-filters-widget-wrapper li,
body .theme--sidebar--widget[id*="mayosis_filters_widget"] .mayosis-filters-widget-wrapper li{
  width: 100%;
}

/* Fallback row layout */
body .mayosis-filters-widget-wrapper li label{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  position: relative;
  cursor: pointer;
}

/* Fallback count styling */
body .mayosis-filters-widget-wrapper li .count,
body .mayosis-filters-widget-wrapper li .mayosis-term-count,
body .mayosis-filters-widget-wrapper li .term-count{
  min-width: 44px;
  text-align: right;
  opacity: 0.55;
  font-variant-numeric: tabular-nums;
}

/* Fallback underline */
body .mayosis-filters-widget-wrapper li label::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 2px;
  background: rgba(0,0,0,0.45);
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.18s ease, opacity 0.18s ease;
}

body .mayosis-filters-widget-wrapper li:hover > label::after{
  opacity: 1;
  transform: scaleX(1);
}

/* Row layout (checkbox + label + count) */
.widget-area li.mayosis-term-item label,
.mayosis-filters-widget-main-wrapper li.mayosis-term-item label{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  position: relative; /* required for ::after underline */
  cursor: pointer;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.01em;
}

/* Count (same size feel; subtly lighter) */
.widget-area li.mayosis-term-item .mayosis-term-count,
.mayosis-filters-widget-main-wrapper li.mayosis-term-item .mayosis-term-count{
  min-width: 44px;
  text-align: right;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.01em;
  opacity: 0.55;
  font-variant-numeric: tabular-nums;
}

/* Etsy-style underline (single line on label only) */
.widget-area li.mayosis-term-item label::after,
.mayosis-filters-widget-main-wrapper li.mayosis-term-item label::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 2px;
  background: rgba(0,0,0,0.45);
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.18s ease, opacity 0.18s ease;
}

.widget-area li.mayosis-term-item:hover label::after,
.mayosis-filters-widget-main-wrapper li.mayosis-term-item:hover label::after{
  opacity: 1;
  transform: scaleX(1);
}

/* Prevent any accidental underline from links if present */
.widget-area li.mayosis-term-item a,
.mayosis-filters-widget-main-wrapper li.mayosis-term-item a{
  text-decoration: none;
}

/* =====================================================
   WOO ARCHIVE LAYOUT TWEAKS (Mayosis)
   - Sidebar/main width split.
   - Remove extra right/left space on archives (per your final working version).
===================================================== */
@media (min-width: 768px){
  /* Sidebar/main split (use flex-basis/max-width to play nicely with Bootstrap columns) */
  body.woocommerce.archive .mayosis-woo-ac-sidebr{
    flex: 0 0 22% !important;
    max-width: 22% !important;
    width: 22% !important; /* fallback */
  }
  body.woocommerce.archive .mayosis-archive-woo-container-main{
    flex: 0 0 78% !important;
    max-width: 78% !important;
    width: 78% !important; /* fallback */
  }
}

/* Fix extra spacing on Woo archive only */
body.woocommerce.archive .mayosis-archive-woo-container,
body.woocommerce.archive .mayosis-archive-woo-container-main{
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.woocommerce.archive .mayosis-archive-woo-container .row{
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Keep gutter set to 0 because you explicitly preferred edge-to-edge */
body.woocommerce.archive .mayosis-archive-woo-container-main{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.woocommerce-breadcrumb {
    display: none !important;
}

/* =====================================================
   SINGLE PRODUCT IMAGE PROTECTION (SOFT)
   - Keeps swipe/slider working
   - Disables drag-to-desktop and (via JS) blocks right-click menu in product gallery
===================================================== */
body.single-product .woocommerce-product-gallery img{
  user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* ==================================
   IV Product Information (Mayosis style)
================================== */

.iv-product-info{
  padding: 18px;
}

/* centered title */
.iv-info-title{
  text-align: center;
  font-weight: 700;
  color: #1a1e23;
  letter-spacing: .5px;
  margin-bottom: 16px;
}

/* table */
.iv-info-table{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* each row */
.iv-row{
  display: grid;
  grid-template-columns: 1fr 16px 1fr; /* label : value */
  align-items: center;
  font-size:16px;
  font-weight:400;
  color:#1a1e23;
}

/* left label */
.iv-label{
  text-align: left;
  font-size:16px;
  font-weight:400;
  color:#1a1e23;
}

/* center colon */
.iv-colon{
  text-align: center;
  font-size:16px;
  font-weight:400;
  color:#1a1e23;
}

/* right value */
.iv-value{
  text-align: right;
  font-size:16px;
  font-weight:400;
  color:#1a1e23;
}

/* subtle spacing like Mayosis */
.iv-row + .iv-row{
  border-top: 1px solid #e9edf7;
  padding-top: 10px;
}

.iv-info-title{
  text-transform: uppercase;
  font-size: 16px;
}


/* Price styling inside Product Information */
.iv-product-info .iv-value del{ opacity:.6; margin-right:6px; }
.iv-product-info .iv-value ins{ text-decoration:none; }


/* Hide Mayosis default Product Release Info widget */
.woo_product_release_info{
  display:none !important;
}


/* Bottom post footer spacing, mobile view */
.bottom-post-footer-widget{
  margin-top: 10px;
}


/* ==============================
   Mayosis-style CF7 (Impulse Visuals)
============================== */

.iv-mayosis-cf7{
  background: #fff;
  border: 1px solid rgba(26,30,35,.10);
  border-radius: 12px;
  padding: 18px;
  box-shadow: 0 8px 22px rgba(26,30,35,.06);
}

.iv-mayosis-cf7 .iv-cf7-row{
  display: grid;
  gap: 14px;
  margin: 0 0 14px;
}

@media (min-width: 768px){
  .iv-mayosis-cf7 .iv-cf7-2col{
    grid-template-columns: 1fr 1fr;
  }
}

.iv-mayosis-cf7 .iv-field{
  margin: 0;
}

.iv-mayosis-cf7 label{
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #1a1e23;
  margin: 0 0 8px;
}

.iv-mayosis-cf7 .wpcf7-form-control{
  width: 100%;
  max-width: 100%;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.35;
  color: #1a1e23;
  background: #fff;
  border: 1px solid rgba(26,30,35,.14);
  border-radius: 10px;
  outline: none;
  box-shadow: none;
}

.iv-mayosis-cf7 textarea.wpcf7-form-control{
  min-height: 140px;
  resize: vertical;
}

.iv-mayosis-cf7 .wpcf7-form-control:focus{
  border-color: rgba(26,30,35,.45);
  box-shadow: 0 0 0 3px rgba(26,30,35,.08);
}

/* Select dropdown arrow consistency */
.iv-mayosis-cf7 select.wpcf7-form-control{
  appearance: auto;
}

/* Submit button (Mayosis-like dark button) */
.iv-mayosis-cf7 .iv-cf7-actions{
  margin-top: 6px;
}

.iv-mayosis-cf7 input.iv-cf7-submit{
  width: 100%;
  padding: 12px 16px;
  border-radius: 10px;
  border: 1px solid rgba(26,30,35,.20);
  background: #1a1e23;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: transform .08s ease, opacity .12s ease;
}

.iv-mayosis-cf7 input.iv-cf7-submit:hover{
  opacity: .92;
}

.iv-mayosis-cf7 input.iv-cf7-submit:active{
  transform: translateY(1px);
}

/* CF7 messages */
.iv-mayosis-cf7 .wpcf7-response-output{
  margin: 14px 0 0;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 14px;
}

.iv-mayosis-cf7 .wpcf7-not-valid-tip{
  font-size: 13px;
  margin-top: 6px;
}

/* Optional: tighter spacing on mobile */
@media (max-width: 480px){
  .iv-mayosis-cf7{ padding: 14px; }
}


/* ======================================
   IV Footer blocks (more reliable)
====================================== */

/* Scope to common Mayosis/footer wrappers */
.main-footer .iv-footer-brand .iv-footer-desc,
.main-footer .iv-footer-col .iv-footer-desc{
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.8;
  opacity: 1;
}

.main-footer .iv-footer-col .iv-footer-title{
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  font-size: 20px;
  opacity: 1;
  margin-bottom: 25px;
}

/* Lists */
.main-footer .iv-footer-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

.main-footer .iv-footer-list li{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  line-height: 1.5;
  margin: 6px 0;
  opacity: 1;

  /* make font consistent even if not a link */
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
}

/* Icons */
.main-footer .iv-footer-list .iv-ico{
  width: 20px;
  display: inline-flex;
  justify-content: center;
  flex: 0 0 20px;
}

/* Button */
.main-footer .iv-footer-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
  padding: 12px 18px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 15px;
  text-decoration: none;
  background: #6d4cff;
  color: #fff;
  transition: transform .15s ease, opacity .15s ease;
}

.main-footer .iv-footer-btn:hover{
  transform: translateY(-1px);
  opacity: .95;
}

/* If Mayosis forces footer link styles, keep your button clean */
.main-footer a.iv-footer-btn:visited,
.main-footer a.iv-footer-btn:active{
  color: #fff;
}


/* ========================================
   IV My Account – Sidebar Fix (Mayosis)
======================================== */

/* Give the sidebar enough width + stop weird wrapping */
.pivoo-woo-my-account.row{
  grid-template-columns: 320px 1fr !important; /* was 280px */
}

/* Sidebar container: make it a real card */
.woocommerce-MyAccount-navigation{
  padding: 20px 18px !important;
  border-radius: 18px !important;
  overflow: hidden; /* keeps rounded corners clean */
}

/* Fix the top profile block (avatar + name) */
.pivoo-woo-account-information{
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 6px 8px 16px !important;
  margin: 0 0 14px !important;
  border-bottom: 1px solid #f0f2f8;
}

.pivoo-woo-account-information img{
  width: 64px !important;
  height: 64px !important;
  border-radius: 999px !important;
}

/* Username: prevent ugly line breaks */
.pivoo-user-name-woo{
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center;
  word-break: keep-all;
  white-space: normal;
}

/* Nav list: stop one-word-per-line wrapping */
.woocommerce-MyAccount-navigation ul{
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-MyAccount-navigation li a{
  white-space: nowrap;       /* keep "Payment methods" in one line */
  overflow: hidden;
  text-overflow: ellipsis;   /* if ever too long */
  padding: 6px 12px !important;
  border-radius: 12px !important;
}

/* If you WANT "Payment methods" / "Account details" to break nicely into 2 lines (not per word),
   use this instead of nowrap: */

/*
.woocommerce-MyAccount-navigation li a{
  white-space: normal;
  word-break: normal;
  line-height: 1.35;
}
*/

/* Make sidebar look balanced on mobile */
@media (max-width: 768px){
  .pivoo-woo-my-account.row{
    grid-template-columns: 1fr !important;
  }
  .woocommerce-MyAccount-navigation li a{
    white-space: normal;
  }
}

/* ========================================
   IV Dashboard Welcome (custom)
======================================== */
.iv-account-title{
  margin: 0 0 12px;
  font-size: 16px;
  line-height: 1.7;
  font-weight: 400;
  color: #1a1e23;
}

.iv-account-links{
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.iv-account-links a{
  display: inline-flex;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid #e7eaf2;
  border-radius: 12px;
  text-decoration: none !important;
  font-weight: 400;
  color: #1a1e23;
  background: #f8fafc;
}

.iv-account-links a:hover{
  filter: brightness(0.98);
}

.iv-account-help{
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: #4b5563;
}


/* Hide default Woo dashboard text */
.woocommerce-MyAccount-content > p:not(.iv-account-welcome){
  display: none !important;
}