/*
 * Barbara Rizzi website: the wishlist (/wishlist/), WordPress' page 6134 (its inline styles: .brwish) around YITH's
 * table, with the rules WordPress gives that table, in their order: YITH's style.css, woocommerce.css and
 * woocommerce-smallscreen.css, the theme's main.css and woocommerce-br.css, then the page's own. The table sits in a
 * .woocommerce block, as in YITH's form. Changed: "Unit price" shows in the header (woocommerce-br.css painted it the
 * header's colour); below 768 px a list with items has one block per product (WordPress' table scrolled sideways
 * without its photos; YITH sent phones a list of its own); × and "Aggiungi al carrello" are form buttons; text 12 px at
 * least, with less letter-spacing (readability pass; WordPress' colours kept).
 */

/* YITH's style.css */
table.wishlist_table { font-size: 80%; }
table.wishlist_table.shop_table { width: 100%; }
table.wishlist_table.shop_table .product-remove { width: 0; }
table.wishlist_table.shop_table .product-remove > div { display: flex; align-items: center; justify-content: center; }
table.wishlist_table tr { position: relative; }
table.wishlist_table tr th { text-align: center; }
table.wishlist_table tr th.product-remove { width: 40px; vertical-align: middle; }
table.wishlist_table tr th.product-thumbnail { width: 80px; }
table.wishlist_table tr th.product-name { text-align: left; }
table.wishlist_table thead th { padding: 16px 12px; border-top: 1px solid; }
table.wishlist_table tbody td { padding: 16px 12px; }
table.wishlist_table thead th, table.wishlist_table tbody td { border-color: #e7e7e7; }
table.wishlist_table tbody td.wishlist-empty { margin: 100px 0; text-align: center; }
.wishlist_table tr td { text-align: center; }
.wishlist_table tr td.product-thumbnail, .wishlist_table tr td.product-name { text-align: left; }
.wishlist_table tr td.product-remove { padding: 16px 0; }
.wishlist_table tr td.product-thumbnail a { display: block; max-width: 80px; border: none; }
.wishlist_table tr td.product-thumbnail a img { display: block; width: 100%; height: auto; }
.wishlist_table .product-stock-status span.wishlist-in-stock { color: #297e29; }
.wishlist_table .product-stock-status span.wishlist-out-of-stock { color: red; }
.wishlist_table .product-add-to-cart span.dateadded { display: block; }
.woocommerce table.shop_table.wishlist_table tr td { color: #6d6c6c; background: #ffffff; border-color: #cccccc; }
.wishlist_table thead tr th { background: #f4f4f4; }

/* WooCommerce's woocommerce.css (a.remove: the × button) */
.woocommerce table.shop_table {
  width: 100%;
  margin: 0 -1px 24px 0;
  text-align: left;
  border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 5px;
}
.woocommerce table.shop_table th { padding: 9px 12px; font-weight: 700; line-height: 1.5em; }
.woocommerce table.shop_table td {
  padding: 9px 12px;
  line-height: 1.5em;
  vertical-align: middle;
  border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent);
}
.woocommerce .remove {
  display: block;
  width: 1em;
  height: 1em;
  padding: 0;
  font-family: inherit;
  font-size: 1.5em;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  color: #aa0000;
  background: none;
  border: 0;
  border-radius: 100%;
  cursor: pointer;
}
.woocommerce .remove:hover { color: #ffffff; background: #aa0000; }

/* The theme's main.css and woocommerce-br.css */
.woocommerce table.cart { width: 100%; border-collapse: collapse; }
.woocommerce table.cart th {
  padding: 10px 14px;
  font-size: 8.5px;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #a8a8a2;
  border-bottom: 0.5px solid #e2ddd6;
}
.woocommerce table.cart td { padding: 20px 14px; vertical-align: middle; border-bottom: 0.5px solid #e2ddd6; }
.woocommerce { font-family: var(--br-font-sans); background: #faf8f5; }
.woocommerce table.shop_table { width: 100%; font-family: var(--br-font-sans); border: none; border-collapse: collapse; }
.woocommerce table.shop_table th {
  padding: 12px 16px;
  font-size: 8px;
  font-weight: 400;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #8a8580;
  background: none;
  border-bottom: 0.5px solid #e2ddd6;
}
.woocommerce table.shop_table td {
  padding: 20px 16px;
  font-size: 13px;
  color: #1a1816;
  vertical-align: middle;
  border-bottom: 0.5px solid #e2ddd6;
}
.woocommerce table.shop_table td.product-price { font-size: 14px; letter-spacing: 0.06em; color: #1a1816; }

/* Page 6134: the hero, the table's colours, the buttons; the page's background as on WordPress' WooCommerce pages
   (woocommerce-br.css: .woocommerce-page) */
body { background: #faf8f5; }
.brwish { font-family: 'Montserrat', sans-serif; background: #faf8f5; }
.brwish-hero {
  padding: 140px 40px 100px;
  text-align: center;
  background: #1a1816;
  border-bottom: 0.5px solid rgba(184, 146, 58, 0.2);
}
.brwish-hero-eye {
  display: block;
  margin-bottom: 14px;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #b8923a;
}
.brwish-hero-title {
  margin: 0 0 12px;
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 300;
  line-height: 1.05;
  color: #ffffff;
}
.brwish-hero-title em { font-style: italic; color: #b8923a; }
.brwish-hero-sub { font-size: 14px; line-height: 1.7; color: rgba(250, 248, 245, 0.45); }
.brwish-body { max-width: 1100px; margin: 0 auto; padding: 56px 40px 80px; }
.brwish-body table.shop_table { width: 100%; font-family: 'Montserrat', sans-serif; border-collapse: collapse; }
.brwish-body table.shop_table th {
  padding: 14px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b8923a;
  background: #1a1816;
  border-bottom: 0.5px solid rgba(184, 146, 58, 0.3);
}
.brwish-body table.shop_table td {
  padding: 16px 14px;
  font-size: 14px;
  color: #4a423a;
  vertical-align: middle;
  border-bottom: 0.5px solid #e8e0d5;
}
.brwish-body table.shop_table td.product-name a { font-weight: 500; color: #1a1816; text-decoration: none; }
.brwish-body table.shop_table td.product-name a:hover { color: #b8923a; }
.brwish-body .add_to_cart_button {
  display: inline-block;
  padding: 11px 18px;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #ffffff;
  text-decoration: none;
  background: #1a1816;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.3s;
}
.brwish-body .add_to_cart_button:hover { color: #ffffff; background: #b8923a; }
.brwish-body .wishlist_table .product-add-to-cart .add_to_cart_button { display: table; margin: 0 auto 5px; text-align: center; }
.brwish-body .wishlist_table .product-add-to-cart .dateadded { margin-bottom: 10px; font-size: 13px; }
/* The size saved (not shown on WordPress) in the colour WordPress' rules give the cell's text */
.brwish-body .wishlist-option { display: block; margin-top: 4px; font-size: 13px; }

@media only screen and (max-width: 768px) {
  .woocommerce table.cart .product-thumbnail { display: none; }
  .brwish-hero { padding: 100px 20px 64px; }
  .brwish-body { padding: 32px 16px 56px; }
  .brwish-body table.shop_table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* With items: one block per product, the photo beside its name, price, stock and the way to the cart, × at the end */
  .brwish-body table.wishlist_table.has-items { overflow: visible; }
  .brwish-body table.wishlist_table.has-items thead { display: none; }
  .brwish-body table.wishlist_table.has-items tbody { display: block; }
  .brwish-body table.wishlist_table.has-items tr {
    display: grid;
    grid-template-columns: 80px 1fr 32px;
    column-gap: 14px;
    align-items: start;
    padding: 14px;
    background: #ffffff;
    border-bottom: 0.5px solid #e8e0d5;
  }
  .brwish-body table.wishlist_table.has-items td { display: block; padding: 0 0 6px; text-align: left; border: 0; }
  .brwish-body table.wishlist_table.has-items td.product-thumbnail { display: block; grid-column: 1; grid-row: 1 / span 4; }
  .brwish-body table.wishlist_table.has-items td.product-remove { grid-row: 1; grid-column: 3; }
  .brwish-body table.wishlist_table.has-items td.product-name,
  .brwish-body table.wishlist_table.has-items td.product-price,
  .brwish-body table.wishlist_table.has-items td.product-stock-status,
  .brwish-body table.wishlist_table.has-items td.product-add-to-cart { grid-column: 2; }
  .brwish-body table.wishlist_table.has-items .product-add-to-cart .add_to_cart_button { margin: 6px 0 0; }
}