/* ==========================================================================
  WOOCOMMERCE: Notices (Error/Info/Message) + Login Exception
   ========================================================================== */

/* Hides the WooCommerce notices wrapper completely if there are no messages to display */
.woocommerce-notices-wrapper:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Base styling for all WooCommerce alert boxes (errors, general info, success messages) */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
  background-color: #d8d8d8 !important; /* Light grey background */
  border-left: 4px solid #7a0000 !important; /* Dark red left border for visual hierarchy */
  color: #000000 !important; /* Black text */
  border-radius: 8px; /* Rounded corners */
  padding: 15px 20px !important; /* Inner spacing */
  margin: 0 auto 30px auto !important; /* Centered with bottom margin */

  /* Sets a maximum width to prevent alerts from stretching too far on large screens */
  max-width: 1000px !important;

  width: 100% !important; /* Responsive width up to the max-width */
  box-shadow: none !important; /* Removes default WooCommerce shadows */
  font-size: 14px !important; /* Standardized text size */
}

/* Specific overrides for error messages (which are usually lists in WooCommerce) */
.woocommerce-error {
  list-style: none !important; /* Removes bullet points */
  padding-left: 25px !important; /* Adjusts left padding to account for the border */
}

/* Targets notices specifically on the My Account page, ONLY when the user is NOT logged in */
.woocommerce-account:not(.logged-in) .woocommerce-error,
.woocommerce-account:not(.logged-in) .woocommerce-message,
.woocommerce-account:not(.logged-in) .woocommerce-info {
  /* Reduces the max-width to match the login box width perfectly */
  max-width: 600px !important;
}

/* ==========================================================================
  THEME: WooCommerce – Login Page Styling
   ========================================================================== */

/* Centers the entire WooCommerce content area on the My Account page for logged-out users */
.woocommerce-account:not(.logged-in) .woocommerce {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* Main styling for the login form container */
.woocommerce-form-login {
  background-color: #d8d8d8 !important; /* Light grey background */
  border: 1px solid #000000 !important; /* Solid black border */
  border-radius: 20px !important; /* Highly rounded corners */
  padding: 40px !important; /* Generous inner spacing */
  width: 100% !important;
  max-width: 600px !important; /* Restricts width for a compact login box */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
  margin: 0 auto !important; /* Centers the form horizontally */
}

/* Styling for form field labels (Username/Email, Password) */
.woocommerce-form-login label {
  color: #353535 !important; /* Dark grey text */
  font-size: 18px !important; /* Enlarged text for readability */
  margin-bottom: 10px !important; /* Space below the label */
  display: block; /* Ensures labels sit on their own line above inputs */
}

/* Styling for the text input fields */
.woocommerce-form-login input.input-text {
  background-color: #ffffff !important; /* White background */
  border: 1px solid #cccccc !important; /* Light grey border */
  border-radius: 12px !important; /* Rounded corners for inputs */
  padding: 12px !important; /* Inner spacing for text cursor */
  font-size: 16px !important; /* Readable input text size */
  margin-bottom: 20px !important; /* Space below each input */
  width: 100% !important; /* Full width of the container */
}

/* Styling for the Login submit button */
.woocommerce-form-login button.woocommerce-form-login__submit {
  width: 100% !important; /* Full width button */
  margin-top: 10px !important; /* Space above the button */
  border-radius: 15px !important; /* Rounded corners matching the form style */
}

/* Styling for the "Remember me" checkbox label and "Lost password" link */
.woocommerce-form-login__rememberme,
.woocommerce-LostPassword {
  color: #818181 !important; /* Light grey text */
  font-size: 14px !important; /* Smaller text size */
}

/* ==========================================================================
   Wordfence 2FA prompt inside WooCommerce login form
   ========================================================================== */

/* Couche Wordfence 2FA */
.woocommerce-form-login #wfls-prompt-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 20 !important;

  background-color: #d8d8d8 !important;
  border: 0 !important;
  border-radius: inherit !important;
  box-shadow: none !important;

  padding: 40px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

/* Bloc interne du prompt 2FA */
.woocommerce-form-login #wfls-prompt-wrapper {
  width: 100% !important;
  max-width: 420px !important;
  margin: 0 auto !important;

  position: relative !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;

  text-align: center !important;
}

/* Champ code 2FA */
.woocommerce-form-login #wfls-token {
  display: block !important;
  width: 100% !important;
  max-width: 220px !important;

  margin: 0 auto 20px auto !important;
  padding: 12px !important;

  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  border-radius: 12px !important;

  font-size: 18px !important;
  text-align: center !important;
  letter-spacing: 0.15em !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
  WOOCOMMERCE: MON COMPTE STYLE (My Account)
   ========================================================================== */

/* Removes the top margin from H2 headings inside the My Account area */
.woocommerce-account .woocommerce h2 {
  margin-top: 0 !important;
}

/* Modifies the action buttons (View, Pay, Cancel) in the My Account Orders table */
.woocommerce-MyAccount-orders .woocommerce-button.button {
  padding: 6px 20px !important; /* Reduces padding for a slimmer button */
  font-size: 13px !important; /* Smaller text */
  line-height: 2 !important;
  min-height: auto !important; /* Overrides theme default minimum heights */
  font-weight: 500 !important; /* Medium font weight */

  display: inline-block !important; /* Required for proper horizontal centering */
  float: none !important; /* Prevents theme from floating buttons left/right */
  margin-top: 4px !important; /* Vertical spacing */
  margin-bottom: 4px !important;
}

/* Adds horizontal spacing between multiple buttons in the same row */
.woocommerce-MyAccount-orders
  .woocommerce-button.button
  + .woocommerce-button.button {
  margin-left: 5px !important;
}

/* Forces the content of the "Actions" column in the orders table to be perfectly centered */
.woocommerce-MyAccount-orders .woocommerce-orders-table__cell-order-actions {
  text-align: center !important; /* Horizontal alignment */
  vertical-align: middle !important; /* Vertical alignment */
}

/* Removes the top margin of the main content area to close the gap */
.archive .content-area {
  margin-top: 2rem;
}

/* ==========================================================================
  SIDEBAR
   ========================================================================== */

/* Responsive rules for tablets and mobile devices (screens smaller than 1024px) */
@media screen and (max-width: 1024px) {
  /* Reverses the flex order so the Sidebar (Filters) appears ABOVE the main products grid */
  .woocommerce-page.has-sidebar .content-container {
    display: flex;
    flex-direction: column-reverse;
  }

  /* Removes unnecessary margins and paddings from the sidebar on smaller screens */
  .woocommerce-page.has-sidebar .primary-sidebar {
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
  }

  /* Removes the top margin of the main content area to close the gap */
  .archive .content-area {
    margin-top: 0;
  }
}

/* Adds bottom padding to the top row (sorting, results count) of the shop */
.kadence-shop-top-row {
  padding-bottom: 20px;
}

/* Removes bottom margin from the results count text to align it properly */
.kadence-woo-results-count {
  margin-bottom: 0;
}

/* Custom styling for the "Order by" dropdown selector */
select.orderby {
  border-bottom-style: none; /* Removes the bottom border */
  padding-right: 1px; /* Minor right inner adjustment */
  padding-top: 3px; /* Minor top inner adjustment */
}

/* Hides the results count text (e.g., "Showing all 7 results") on very small screens */
@media (max-width: 420px) {
  .kadence-shop-top-row .kadence-woo-results-count {
    display: none !important;
  }
}

/* ==========================================================================
  ARCHIVE - Description en bas de page (Bottom SEO Description)
   ========================================================================== */

/* Main container for the custom SEO text block at the bottom of archives */
.talitor-archive-seo {
  margin-top: clamp(
    26px,
    4vw,
    56px
  ); /* Responsive top margin based on viewport width */
  padding: clamp(16px, 3vw, 20px); /* Responsive inner padding */
  border-radius: 16px; /* Rounded corners */
  background: var(--global-palette8); /* Uses Kadence global color palette */
}

/* Inner wrapper to restrict the maximum width and center the SEO content */
.talitor-archive-seo__inner {
  /*max-width: 980px;*/
  margin: 0 0;
}

/* Title styling for the SEO block */
.talitor-archive-seo__title {
  margin: 0 0 10px;
  font-size: 1.2rem;
}

/* Text styling for the SEO block content */
.talitor-archive-seo__content {
  font-size: 0.9rem;
  line-height: 1.65;
  opacity: 0.9; /* Slight transparency for a softer reading experience */
}

/* Removes the bottom margin on the last paragraph to keep padding even */
.talitor-archive-seo__content p:last-child {
  margin-bottom: 0;
}

/* ==========================================================================
  ARCHIVE - Catalog layout (Title/Brands)
   ========================================================================== */

/* Removes top padding from product titles in the archive grid */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding-top: 0 !important;
}

/* Removes top padding from the Kadence product details container */
.woocommerce ul.products li.product .product-details {
  padding-top: 0 !important;
}

/* Styling and positioning for the custom product brand text */
.woocommerce ul.products li.product .talitor-product-brand {
  padding-top: 8px !important;
  padding-bottom: 0px !important;
  display: inline-block; /* Allows the element to only take up necessary width */
  margin-left: 22px; /* Horizontal offset */
  text-align: left !important;
  font-size: 13px !important;
  margin-bottom: 4px !important;
  color: #555 !important;
  font-weight: 500 !important;
}

/* Reduces the font size of the "Add to cart" button in specific archive contexts */
.woocommerce
  ul.products:not(.woo-archive-btn-button)
  li:where(:not(.woo-archive-btn-button))
  .button:not(.kb-button) {
  font-size: 60% !important;
}

/* ==========================================================================
  BADGE PRODUCT (Optimized for DRY Principle)
   ========================================================================== */

/* --- Single Product Page Badges --- */

/* Shared properties for all badges on the single product page */
.badge-pro-single,
.badge-ny-single {
  display: inline-block;
  color: #fff;
  padding: 4px 10px;
  font-size: 12px;
  margin-bottom: 10px;
  border-radius: 3px;
}

/* Specific properties for PRO badge */
.badge-pro-single {
  background: #000;
}

/* Specific properties for NY badge */
.badge-ny-single {
  background: #e60023;
  font-weight: 600;
}

/* --- Archive/Catalog Badges --- */

/* Shared properties for all badges in the catalog */
.badge-ny {
  position: absolute;
  top: 10px;
  left: 10px;
  color: #fff;
  padding: 3px 8px;
  font-size: 11px;
  letter-spacing: 1px;
  border-radius: 3px;
  z-index: 10;
  background: #e60023;
}