/*
	AHG36 2026, public pages that still use the parent templates and the old CSS
	(painting page, cart, checkout, artists, events, text pages...).
	Here they get the fonts, colours and buttons of the new look; the painting page also gets a new layout.
*/

body.nx_legacy {
  font-family: var(--main_font);
  color: var(--ink);
}
body.nx_legacy h1,
body.nx_legacy h2,
body.nx_legacy h3,
body.nx_legacy .h1_size {
  font-family: var(--header_font);
  font-weight: 500;
  letter-spacing: -0.01em;
  text-transform: none;
}
body.nx_legacy .main_content,
body.nx_legacy .about_area {
  background: transparent;
}

/* ------------------------------------------------------------------ */
/* painting page (parent single-product.php, visitors only: body.nx_product)
   Left: the picture on a wall-coloured stage with three views. Right: title, facts, price, buttons, text. */

body.nx_product .main_content hr,
body.nx_product #htmltoimage- > .mshow,
body.nx_product #htmltoimage- > hr {
  display: none;
}
body.nx_product .bread {
  font-family: var(--main_font);
  font-size: 13.5px;
  color: var(--muted);
}
body.nx_product .bread a {
  color: var(--muted);
  text-decoration: none;
}
body.nx_product .bread .current,
body.nx_product .bread .current strong {
  color: var(--ink);
  font-weight: 400;
}
body.nx_product .the_pictute_row {
  display: grid !important;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(30px, 4.5vw, 70px);
  align-items: start;
  width: auto;
  padding: 10px 12px 40px;
}
body.nx_product .the_pictute_row > #htmltoimage- {
  grid-column: 1;
  grid-row: 1 / span 40;
  position: sticky;
  top: 100px;
  display: block;
  width: auto;
  padding: 0;
  float: none;
}
body.nx_product .single_image_card,
body.nx_product .pic_right_column {
  display: contents !important;
}
body.nx_product .single_image_card > *,
body.nx_product .pic_right_column > * {
  grid-column: 2;
  order: 5;
  min-width: 0;
}
body.nx_product .pic_right_column > style,
body.nx_product .pic_right_column > script {
  display: none;
}

/* stage */
body.nx_product #htmltoimage- #post_thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 4 / 3;
  padding: 9%;
  background: var(--wall);
}
body.nx_product #post_thumbnail a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
body.nx_product #post_thumbnail img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  box-shadow: 0 26px 50px -20px rgba(40, 30, 20, 0.6), 0 3px 8px rgba(40, 30, 20, 0.22);
}
body.nx_product [data-nx-mode="framed"] #post_thumbnail img {
  border: clamp(8px, 1.3vw, 18px) solid #2b2119;
  outline: 1px solid #5b4737;
  outline-offset: -4px;
}
body.nx_product [data-nx-mode] .interior- {
  display: none;
}
body.nx_product [data-nx-mode="room"] .interior- {
  display: block;
}
body.nx_product [data-nx-mode="room"] > .rela {
  display: none;
}
/* the room photo is drawn for a 400 px high box; a bigger box scales the painting with it */
body.nx_product .product_image_holder_interior {
  height: 520px;
}
body.nx_product .product_image_holder_interior img {
  transform: scale(1.3);
  border: 0;
}
body.nx_product .picture_thumbs {
  padding: 0;
}
.nx_thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.nx_thumbs button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 2px;
  font-family: var(--main_font);
  font-size: 14.5px;
  color: var(--ink);
  cursor: pointer;
}
.nx_thumbs button.current {
  border-color: var(--ink);
}
.nx_thumbs .material-symbols-outlined {
  font-size: 20px;
}

/* right side, top to bottom */
body.nx_product .single_image_card > h1 {
  order: 1;
  margin: 0;
  padding: 0;
  font-size: clamp(38px, 4vw, 58px);
  line-height: 1.08;
}
body.nx_product .single_image_card > .h4_look {
  order: 2;
  margin: 0;
}
body.nx_product .single_image_card > .h4_look:empty {
  display: none;
}
body.nx_product .single_image_card > .pic_author {
  order: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 2px 10px;
  margin-top: 12px;
  font-family: var(--main_font);
  font-size: 16px;
  color: var(--muted);
}
body.nx_product .pic_author .meta_value {
  padding: 0;
  margin: 0;
  font-family: var(--main_font);
  font-size: 16px;
}
body.nx_product .pic_author .meta_value ~ .meta_value::before {
  content: "\00b7";
  margin-right: 10px;
}
body.nx_product .pic_author .meta_value > div {
  display: inline;
}
body.nx_product .pic_author a {
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
}
body.nx_product .pic_right_column > .reg_price {
  order: 4;
  margin-top: 24px;
  padding: 0;
  text-align: left;
  font-family: var(--main_font);
  font-size: 15px;
  line-height: 1.5;
  color: var(--muted);
}
body.nx_product .reg_price .regular_price {
  font-family: var(--main_font);
  font-size: 34px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ink);
}
body.nx_product .reg_price > div {
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.nx_product .pic_right_column > .variable_prices {
  order: 5;
  text-align: left;
}
body.nx_product .pic_right_column > .add_to_cart_mobile {
  order: 6;
  margin-top: 20px;
  text-align: left;
}
body.nx_product .pic_right_column .add_to_cart_mobile a.button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-height: 54px;
  margin: 0;
  padding: 12px 34px;
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 2px !important;
  color: #fff;
  font-family: var(--main_font);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  box-shadow: none;
}
body.nx_product .pic_right_column .add_to_cart_mobile a.button:hover {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
}
body.nx_product .pic_right_column > .simplefavorite-button {
  order: 7;
  width: auto;
  height: 48px;
  margin-top: 10px;
  background-color: transparent;
  background-position: 14px center;
  border: 1px solid var(--ink);
  border-radius: 2px;
}
body.nx_product .pic_right_column .simplefavorite-button:after {
  top: 13px;
  left: 52px;
  font-family: var(--main_font);
  font-size: 15px;
  font-weight: 500;
}
body.nx_product .pic_right_column > a.btn {
  order: 8;
  display: flex;
  align-items: center;
  width: auto;
  margin: 10px 0 0;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 0;
  color: var(--ink);
  font-family: var(--main_font);
  font-size: 15.5px;
  font-weight: 500;
  transition: border-color 0.2s;
}
body.nx_product .pic_right_column > a.btn:hover {
  border-color: var(--accent);
}
body.nx_product .pic_right_column > a.btn .material-symbols-outlined {
  color: var(--accent);
}
body.nx_product .single_image_card > .short_abouts {
  order: 9;
  margin-top: 28px;
  padding: 22px 0 0;
  border-top: 1px solid var(--line);
  font-family: var(--main_font);
  font-size: 16px;
  line-height: 1.65;
  color: #4a453f;
  overflow-wrap: anywhere;
}
body.nx_product .short_abouts a {
  color: var(--ink);
}

/* sliders under the painting */
body.nx_product .page_sub_title {
  font-size: clamp(30px, 3vw, 44px);
  text-transform: none;
}

@media (max-width: 1000px) {
  /* one column: picture, then the same order as on the right side of the desktop */
  body.nx_product .the_pictute_row {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    padding: 0 12px 30px;
  }
  body.nx_product .the_pictute_row > #htmltoimage- {
    position: static;
    order: 0;
    margin-bottom: 22px;
  }
  body.nx_product .product_image_holder_interior {
    height: 300px;
  }
  body.nx_product .product_image_holder_interior img {
    transform: scale(0.75);
  }
  .nx_thumbs button {
    flex: 1;
    justify-content: center;
    padding: 9px 8px;
    font-size: 13.5px;
  }
  .nx_thumbs .material-symbols-outlined {
    display: none;
  }
}
