/*
Theme Name: Digifoto Divi Child
Description: Child theme for the parent divi theme which includes customizations for Digifoto.
Author: Tanel Teemusk
Author URI: https://massruum.ee
Template: Divi
Version: 1.0
*/



/* Add custom CSS styles below */

h1 a,
h2 a,
h3 a,
h4 a,
h5 a {
  text-decoration: none;
  border-bottom: 1px solid;
}

a:hover {
  text-decoration: none;
  color: #277082;
}

/* this will edit divi popup X button appearance */
.da-close {
  font-family: Open Sans, Arial, sans-serif !important;
  font-weight: 100 !important;
  font-size: 50px !important;
  width: 50px !important;
  height: 50px !important;
  margin-top: 20px;
  margin-right: 10px;
}

/* hide woocommerce gallery thumbnails */
.woocommerce-product-gallery .flex-control-thumbs {
  /* display: none; */
}

/* Tweaks for product page */
.wp-post-image {
  border: 1px solid #F6F6F6;
}

.woocommerce .woocommerce-ordering select {
  margin-top: -10px;
}

.woocommerce-ordering::after {
  margin-top: -8px;
}

/* styling select box... */
.select-wrapper, .woocommerce-ordering {
  position: relative;
}

.select-wrapper::after, .woocommerce-ordering::after {
  content: "▾";
  color: #9b9b9b;
  font-size: 1rem;
  position: absolute;
  right: 10px;
  top: 50%; /* Positioning the arrow in the middle vertically */
  transform: translateY(-50%); /* Centering the arrow vertically */
  pointer-events: none;
}

select, .orderby, 
.et_pb_wc_add_to_cart_0_tb_body.et_pb_module .et_pb_module_inner form.cart .variations td select,
.et_pb_wc_add_to_cart_1_tb_body.et_pb_module .et_pb_module_inner form.cart .variations td select {
  font-size: 14px; /* Match the font size of your inputs */
  height: 44px; /* Match the height of your inputs */
  width: 100%;
  color: #303030 !important; /* Text color */
  padding: 8px 16px 8px 8px !important;
  background-color: white !important; /* Background color to match your inputs */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: 0px;
  border-color: #bbb;
  min-width:220px;
}

.woocommerce div.product form.cart .variations select {
  margin-top: -9px;
}

.et_pb_wc_add_to_cart form.cart .variations td.value span::after {
  background-color: blue;
  display: none !important;
}


.et_pb_wc_add_to_cart_0_tb_body.et_pb_module .et_pb_module_inner form.cart .variations td select,
.et_pb_wc_add_to_cart_1_tb_body.et_pb_module .et_pb_module_inner form.cart .variations td select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url('/wp-content/themes/divi-child-digifoto/down-arrow.svg'), linear-gradient(to bottom, #ffffff, #ffffff);
  background-repeat: no-repeat, repeat;
  background-position: right 10px center, 100% 0;
  background-size: 15px auto, 100% 100%;
  border-color: #bbb; /* Adjust to match the dropdown's border color */
  color: #303030; /* Adjust to match the dropdown text color */
}

.woocommerce div.product form.cart .variations label {
  font-weight: 400;
  font-family: Open Sans, Arial, sans-serif;
}

/* Adjusted style for the label associated with the dropdown */
.group select + label {
  top: -12px;
  font-size: 12px;
  padding-left: 8px;
  padding-right: 8px;
  background-color: white;
}

/* Border for product description image */

.wp-block-image > img {
  border: 1px solid #d2d2d2;
}

.variations_form .variations th {
    border: 0;
    line-height: 2em;
    vertical-align: top;
}

.variations_form .variations td {
    padding: 0 20px 20px 0 !important;
    max-width: none !important;
    line-height: 1.3em;
}

.variations_form .reset_variations {
    display:none !important;
    font-size: .83em;
}

/* Checkout payment section.
   Divi's checkout payment module renders WooCommerce's stock markup but doesn't
   style it, so it fell back to Woo defaults: a lavender panel, a 2em gap above
   the place-order row, and a floated #place_order button sitting on top of the
   privacy policy text. Restyled to match the order table above it. */

.woocommerce-checkout #payment {
  background: #fff;
  border-radius: 0;
}

.woocommerce-checkout #payment ul.payment_methods {
  padding: 0;
  margin: 0;
  border-bottom: 1px solid #eee;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
  padding: 4px 0 16px;
  line-height: 1.5;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method + li.wc_payment_method {
  padding-top: 16px;
  border-top: 1px solid #eee;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label {
  display: inline-block;
  margin: 0;
  font-weight: 600;
  color: #303030;
  cursor: pointer;
}

.woocommerce-checkout #payment div.payment_box {
  margin: 10px 0 0;
  padding: 12px 16px;
  border-radius: 0;
  background-color: #f6f6f6;
  color: #4f4f4f;
  font-size: 14px;
}

.woocommerce-checkout #payment div.payment_box::before {
  display: none;
}

.et_pb_wc_checkout_payment_info form .form-row.place-order,
.woocommerce-checkout #payment div.form-row.place-order {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 16px;
  margin: 0;
  padding: 18px 0 4px;
}

/* Collapses to nothing while JS is on, gets its own row when it really renders. */
.woocommerce-checkout #payment div.form-row.place-order > noscript {
  flex: 0 0 100%;
}

.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper {
  flex: 1 1 320px;
  margin: 0;
}

.woocommerce-checkout #payment .woocommerce-privacy-policy-text p {
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
}

.woocommerce-checkout #payment #place_order {
  float: none;
  margin: 0 0 0 24px;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .woocommerce-checkout #payment #place_order {
    width: 100%;
    margin-left: 0;
    text-align: center;
  }
}

/* Cart-notice module (the login, coupon and add-to-cart-notice area).
   Its button background is set to white in the Theme Builder, while Divi's own
   .et_pb_button_helper_class rule keeps WooCommerce button text at #fff — so
   "Logi sisse", "Rakenda kupongi" and "Vaata ostukorvi" all rendered white on
   white and read as missing buttons. Brand background restored so they match
   #place_order and every other Woo button on the site.

   Divi's 20px button text also left these secondary submits at 46px against a
   14px/42px field. 18px lands them at the field's height while keeping Divi's
   em-based padding, so the hover arrow still gets its room. */

.woocommerce .et_pb_wc_cart_notice .button,
.woocommerce-page .et_pb_wc_cart_notice .button {
  background-color: #276f82 !important;
  font-size: 18px !important;
}

/* Divi styles this module's inputs from different settings than the billing
   fields, so they had drifted to 16px padding (58px tall) against the address
   fields' 8px/16px (42px tall). */

.woocommerce .et_pb_wc_cart_notice form .form-row input.input-text,
.woocommerce-page .et_pb_wc_cart_notice form .form-row input.input-text {
  padding: 8px 16px !important;
}

/* Divi button modules: remove the scrollbar under the label ------------------
   106 button modules across 35 posts were saved in the builder with
   overflow x/y = auto (Design > Visibility > Horizontal/Vertical Overflow).
   Divi emits that as
     .et-db #et-boc .et-l .et_pb_button_N { overflow-x:auto; overflow-y:auto }
   and because a button's content can be a couple of px wider than its box
   (measured: 162px content in a 158px box on /toode/fotolouend/), the browser
   draws a real horizontal scrollbar under the label.

   Fixing it in the builder would mean editing Divi JSON in post_content on 35
   posts - the same content that loses its backslash escapes when touched
   programmatically - so this overrides it in CSS instead. A button never needs
   to scroll, so this is safe to apply to all of them.
   !important is required: Divi's selector carries an id plus three classes. */

.et_pb_button,
.et_pb_button_module_wrapper .et_pb_button {
  overflow: visible !important;
}


/* --- Price-list popup: hidden until opened --------------------------------
   The popup is a shared Divi canvas (#price-list-popup) toggled by a button
   interaction. On the product page it happens to start hidden, but a page that
   only carries the copied trigger renders it open on load and the button then
   closes it - inverted. Pin the closed state; Divi's toggle sets an inline
   display, which still wins over this. */

#price-list-popup {
  display: none;
}


/* --- "Tutvu hinnakirjaga" popup trigger ------------------------------------
   This has to stay a Divi button module. Divi only emits a Canvas on pages
   where something targets it, so removing the Show/Hide interaction removes
   the popup markup from the page entirely. It is styled back down to a plain
   text link so it reads like the other links on the paper pages, and it
   carries data-price-list-paper so the table preselects this page's paper. */

.et_pb_button.hinnakiri-link,
.et_pb_button.hinnakiri-link:hover {
  display: inline;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: #277082 !important;
  text-decoration: underline;
}

.et_pb_button.hinnakiri-link::before,
.et_pb_button.hinnakiri-link::after {
  display: none !important;
  content: none !important;
}

.et_pb_button_module_wrapper:has(> .hinnakiri-link) {
  text-align: left;
  padding: 0;
  margin: 0 0 8px;
}


/* --- Product price size -----------------------------------------------------
   The Divi Theme Builder layouts disagreed about this. The tagged layouts
   (181/601/3516) emit `.et_pb_wc_price .price { font-size: 26px }` from their
   Divi 4 module, while the price module added to "All Products" (318) inherits
   the body size — so a frame or passepartout showed a visibly smaller price
   than a moulding. Set once here so every product page matches, whichever
   layout renders it, and so it no longer depends on which builder version a
   module happens to carry. */

.et_pb_wc_price p.price,
.et_pb_wc_price p.price span,
.et_pb_wc_price p.price del,
.et_pb_wc_price p.price ins {
  font-size: 26px !important;
}


/* --- Header cart alignment ---------------------------------------------------
   WP Menu Cart's link inherits Divi's 22.1px body line-height and the header
   layout adds a 3px top margin to the amount, so the cart icon and total sat
   ~4px below "Minu konto" and "Pood" (14px line-height). Match their line box
   and give the icon the same 3px bottom margin as their ::before icons. */

.et_pb_menu_0_tb_header.et_pb_menu .wpmenucartli a.wpmenucart-contents {
  line-height: 14px;
}

.et_pb_menu_0_tb_header.et_pb_menu .wpmenucartli .wpmenucart-contents span.amount {
  margin-top: 0;
  line-height: 14px;
}

.et_pb_menu_0_tb_header.et_pb_menu .wpmenucartli .wpmenucart-icon-shopping-cart-0 {
  margin-bottom: 3px;
}


/* --- Price list sections ([DigiFotoPriceListAll]) ---------------------------
   One <details> per Google Sheets tab, drawn to match the Divi toggles the
   page used before (26px title, chevron right, hairline divider), without
   depending on Divi's toggle script or FontAwesome being loaded. */

.digifoto-pricelist__section {
  padding: 20px;
  margin-bottom: 14.5px;
  border-bottom: 1px solid var(--gcid-5407911d-5933-4a8a-aca4-cbe54d5bcf40, #f6f6f6);
}

.digifoto-pricelist__title {
  position: relative;
  display: block;
  padding-right: 50px;
  cursor: pointer;
  list-style: none;
}

.digifoto-pricelist__title::-webkit-details-marker {
  display: none;
}

.digifoto-pricelist__title h2 {
  margin: 0;
  padding: 0;
  font-size: 26px;
  font-weight: 500;
  line-height: 26px;
  color: #666;
}

.digifoto-pricelist__section[open] .digifoto-pricelist__title h2 {
  color: #333;
}

.digifoto-pricelist__title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background-color: #ccc;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.digifoto-pricelist__section[open] .digifoto-pricelist__title::after {
  transform: rotate(180deg);
}

.digifoto-pricelist__content {
  padding-top: 20px;
}