/*
 Theme Name:   MeliusHoney
 Description:  MeliusHoney Theme
 Author:       MeliusHoney
 Author URI:   http://MeliusHoney.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* Header */
.whb-row.whb-top-bar.whb-not-sticky-row.whb-without-bg.whb-without-border.whb-color-dark.whb-flex-flex-middle {
  margin-bottom: -40px;
}

.site-logo img {
  max-height: 100%;
  width: 500px;
}

.wd-slide-container {
  position: absolute;
  bottom: 0;
  left: 0;
}

.social-top a {
  background: #000 !important;
}

.wd-dropdown-menu.wd-design-default {
  background: #000;
  border-top: 3px solid#fff;
}
.wd-dropdown-menu.wd-design-default a {
  color: #fff;
}

.wd-post-date.wd-style-with-bg, .meta-author, .back-to-archive {
  display: none !important;
}

.wd-dropdown-menu.wd-design-default a:before {
  /*
	margin-right: 4px;
    font-weight: normal;
    font-style: normal;
    font-size: clamp(8px, 70%, 18px);
    content: "\f04b";
	font-family: Font Awesome 5 Free;
	color: rgb(132,118,74);
	*/
  margin-right: 4px;
  content: "";
  vertical-align: middle;
  display: inline-block;
  border: 0.35em solid transparent;
  border-left: 0.5em solid rgb(132, 118, 74);
  top: calc(50% - 0.175em);
}

.flickity-button.next:after {
  content: "" !important;
  vertical-align: middle;
  border: 0.6em solid transparent;
  border-left: 1em solid;
  margin-left: 14px;
}

.flickity-button.previous:after {
  content: "" !important;
  vertical-align: middle;
  border: 0.6em solid transparent;
  border-right: 1em solid;
  margin-right: 14px;
}

.wd-dropdown-menu.wd-design-default a:hover {
  color: rgb(132, 118, 74);
}

.arrows-style-3 .flickity-button {
  -webkit-clip-path: polygon(
    25% 5%,
    75% 5%,
    100% 50%,
    75% 95%,
    25% 95%,
    0% 50%
  );
  clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
  background: #000 !important;
  opacity: 1 !important;
  color: #fff;
}

/*#slider-121 .wd-slide {
  min-height: auto !important;
  height: 850px;
  max-height: 100vh !important;
}*/

.lang-meni .wpml-ls-legacy-dropdown a {
  color: #000;
  border: 0px solid #cdcdcd;
  background-color: transparent !important;
  line-height: 1;
  font-weight: bold;
  font-size: 14px;
}

.lang-meni .wpml-ls-legacy-dropdown a:hover {
  background-color: transparent !important;
}

.lang-meni .wpml-ls-legacy-dropdown {
  width: 55px;
  max-width: 100%;
}

/* button product home */
.product-home .wd-button-wrapper.text-center {
  text-align: right;
  margin-right: 25px;
  line-height: 20px;
}
.product-home .wd-button-wrapper.text-center a {
  color: rgb(132, 118, 74);
  text-transform: lowercase;
  font-weight: 300;
  font-size: 16px;
}

@property --radius {
  syntax: "<length>";
  inherits: true;
  initial-value: 0;
}

.melius {
  --size: 200px;
  --f: 5;
  --radius: calc(var(--size) / var(--f));

  width: var(--size);
  height: auto;
  aspect-ratio: 1.155;
  object-fit: cover;
  --cg: #0000, #000 1deg 119deg, #0000 120deg;
  --rad: radial-gradient(farthest-side, #000 99%, #0000 101%);
  --s: calc(2 * var(--radius)) calc(2 * var(--radius));
  -webkit-mask: var(--rad) left calc(0.25 * var(--size) - 0.4 * var(--radius))
      top 0 / var(--s),
    var(--rad) right calc(0.25 * var(--size) - 0.4 * var(--radius)) top 0 /
      var(--s),
    var(--rad) left calc(0.25 * var(--size) - 0.4 * var(--radius)) bottom 0 /
      var(--s),
    var(--rad) right calc(0.25 * var(--size) - 0.4 * var(--radius)) bottom 0 /
      var(--s),
    var(--rad) left calc(0.15 * var(--radius)) top 50% / var(--s),
    var(--rad) right calc(0.15 * var(--radius)) top 50% / var(--s),
    conic-gradient(
        from 30deg at left calc(-0.3 * var(--radius)) top 50%,
        var(--cg)
      )
      left calc(0.3 * var(--radius)) top 50% /50% calc(100% - 0.8 *
          var(--radius)),
    conic-gradient(
        from -150deg at right calc(-0.3 * var(--radius)) top 50%,
        var(--cg)
      )
      right calc(0.3 * var(--radius)) top 50% /50% calc(100% - 0.8 *
          var(--radius)),
    linear-gradient(#000 0 0) center/calc(45% - 1.1 * var(--radius));
  -webkit-mask-repeat: no-repeat;
  cursor: pointer;
  transition: --radius 0.3s linear;
}

.melius-newsletter {
  display: inline-flex;
  background: none;
  width: 285px;
  align-items: center;
}

button.melius-mail-submit {
  background: no-repeat;
  margin-left: 0;
  padding: 0;
}

.melius-newsletter input[type="email"] {
  height: 34px;
}

.newsletter-text {
  text-align: right;
  max-width: 285px;
}

.podnaslov {
  color: #84764a;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 18px;
}
.tekst-pod-slika {
  text-align: center;
  font-size: 16px;
}
.tekst-pod-slika h2 {
  margin-bottom: 0;
  text-align: center;
  margin-top: 0;
  font-size: 24px;
  font-weight: 400;
}
.tekst-pod-slika h2:first-child {
  font-weight: 600;
}

.tekst-pod-slika img {
  width: 140px;
  margin-top: 15px;
}
.tezina {
  display: inline-flex;
  line-height: 22px;
  font-size: 20px;
  font-weight: 500;
}
.oznaka img {
  max-width: 22px;
  margin-top: 0px;
  margin-left: 10px;
  vertical-align: top;
}

p.wd-product-stock.stock.wd-style-default.in-stock {
  display: none !important;
}

.product-wrapper h3.wd-entities-title:first-line {
  color: #000000;
  font-size: 28px;
  font-weight: 700;
  line-height: 32px;
  text-transform: uppercase;
}

h3.wd-entities-title {
  text-align: center;
  margin: 0 auto;
 /* font-size: 22px !important;*/
  text-transform: uppercase;
  /*width: min-intrinsic;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content;*/
}

.proizveduva span.wd-attr-name {
  font-weight: 600;
}

.vrednosti h4.title {
background:#000;
max-width: fit-content;
padding: 1px 5px
}

.vrednosti span.wd-attr-name {
padding: 0 5px;
}

p.read-more-section {
  text-align: right;
}

.read-more-section a:after {
  position: absolute;
  TOP: 0px;
  left: 100%;
  display: inline-block;
  margin-left: 5px;
  height: 14px;
  width: 12px;
  line-height: 1!important;
  opacity: 1 !important;
  content: url(/wp-content/uploads/2023/12/right-black.svg);
  transform: none !important;
  transition: none !important;
}

.read-more-section a {
  color: rgb(132, 118, 74);
  text-transform: lowercase;
  font-weight:500;
  font-size:14px;
}