/* Navneleg product lede v1.
 *
 * The description sits in an accordion: a row reading "Beskrivelse" with a
 * plus/minus on the right, and the text underneath. Nothing appears from
 * nowhere. The label and its control are visible before anything opens.
 *
 * The nl-readmore clamp from the global WPCode snippet is neutralised inside
 * the panel. Two collapse mechanisms on one block would fight each other, and
 * the accordion is the one the reader can see.
 */

/* ---------- "Læs mere om ..." under the short description ---------- */

/* The link belongs to the short description, so it is pulled tight under it
   and given room before the next section. Salient's summary paragraphs carry a
   bottom margin that otherwise left the link floating midway between the two,
   reading as a label for "Vælg størrelse" rather than as more of the text. */

.entry-summary .woocommerce-product-details__short-description{
  margin:0!important;
  padding:0!important;
  font-size:14.5px;
  line-height:1.55;
}

.entry-summary .woocommerce-product-details__short-description > *{
  line-height:inherit!important;
}

.entry-summary .woocommerce-product-details__short-description > *:last-child{
  margin-bottom:0!important;
  padding-bottom:0!important;
}

.nls-lede-more{
  display:inline-block;
  margin:6px 0 28px;
  font-size:14px;
  font-weight:500;
  color:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:rgba(40,36,42,.28);
}

.nls-lede-more:hover,
.nls-lede-more:focus-visible{ text-decoration-color:currentColor; }

body.nls-has-giftwrap .nls-lede-more{
  margin:4px 0 0;
  line-height:1.4;
}

.nls-lede-anchor{
  display:block;
  height:0;
  scroll-margin-top:90px;
}

/* ---------- product title scale ---------- */

/* The mockup uses 22px / 1.26 on mobile. Desktop and tablet step up
   deliberately instead of inheriting unrelated theme heading sizes. */
@media (min-width:1025px){
  html body.single-product div.product .summary.entry-summary h1.product_title.entry-title.nectar-inherit-h2{
    font-size:30px!important;
    line-height:1.22!important;
    letter-spacing:-.005em!important;
  }
}

@media (min-width:768px) and (max-width:1024px){
  html body.single-product div.product .summary.entry-summary h1.product_title.entry-title.nectar-inherit-h2{
    font-size:26px!important;
    line-height:1.24!important;
    letter-spacing:-.005em!important;
  }
}

@media (max-width:767px){
  html body.single-product div.product .summary.entry-summary h1.product_title.entry-title.nectar-inherit-h2{
    font-size:22px!important;
    line-height:1.26!important;
    letter-spacing:-.005em!important;
  }
}

/* ---------- price hierarchy ---------- */

/* Price typography is global on product pages. The descriptor is added by PHP
   only to products whose root category is krus-med-tekst. */
.single-product .summary.entry-summary > .price{
  margin:0 0 12px!important;
  padding:0!important;
  font-size:23px!important;
  font-weight:600!important;
  line-height:1.25;
  letter-spacing:-.015em;
  color:inherit;
}

.single-product .summary.entry-summary > .price .woocommerce-Price-amount,
.single-product .summary.entry-summary > .price .woocommerce-Price-amount bdi,
.single-product .summary.entry-summary > .price .woocommerce-Price-currencySymbol{
  font-size:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  color:inherit!important;
}

.single-product .summary.entry-summary > .price del{
  color:#918d86;
  font-size:.74em;
  font-weight:400;
}

.single-product .summary.entry-summary > .price ins{
  text-decoration:none;
}

.nls-product-spec{
  display:inline-block;
  margin-left:9px;
  color:#918d86;
  font-size:13px;
  font-weight:400;
  line-height:1.3;
  letter-spacing:0;
  white-space:nowrap;
}

/* ---------- variation label + info ---------- */

.single-product .summary.entry-summary .nl-label-with-info{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  line-height:1.2;
  vertical-align:middle;
}

.single-product .summary.entry-summary .nl-label-with-info > label{
  display:block!important;
  margin:0!important;
  padding:0!important;
  line-height:20px!important;
}

.single-product .summary.entry-summary .nl-label-with-info > .nl-info-icon{
  flex:0 0 20px;
  width:20px!important;
  height:20px!important;
  margin:0!important;
  transform:none!important;
  vertical-align:middle;
}

/* ---------- accordion ---------- */

/* One tab only, and the accordion head now carries the same word. */
body.nls-desc-on .woocommerce-tabs > ul.tabs{ display:none!important; }
body.nls-desc-on .woocommerce-tabs .hidden-tab-heading{
  position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}

.nls-desc{
  border-top:1px solid #e6e2dc;
  border-bottom:1px solid #e6e2dc;
  scroll-margin-top:90px;
}

.nls-desc__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:100%;
  padding:18px 2px;
  background:none;
  border:0;
  cursor:pointer;
  text-align:left;
  color:inherit;
  font:inherit;
}

.nls-desc__title{
  font-size:16px;
  font-weight:600;
  line-height:1.3;
}

/* Plus that becomes a minus: two bars, one rotated away when open. */
.nls-desc__icon{
  position:relative;
  flex:0 0 18px;
  width:18px;
  height:18px;
}

.nls-desc__icon::before,
.nls-desc__icon::after{
  content:"";
  position:absolute;
  top:50%;
  left:0;
  width:18px;
  height:1.5px;
  background:currentColor;
  transform:translateY(-50%);
  transition:transform .2s ease,opacity .2s ease;
}

.nls-desc__icon::after{ transform:translateY(-50%) rotate(90deg); }

.nls-desc__head[aria-expanded="true"] .nls-desc__icon::after{
  transform:translateY(-50%) rotate(0deg);
  opacity:0;
}

.nls-desc__panel{ padding:0 2px 22px; }
.nls-desc__panel[hidden]{ display:none; }

/* No JS: leave the text open rather than unreachable. */
.no-js .nls-desc__panel{ display:block!important; }

/* ---------- neutralise the old clamp inside the panel ---------- */

.nls-desc__panel .nl-readmore-content{
  display:block!important;
  -webkit-line-clamp:unset!important;
  max-height:none!important;
  overflow:visible!important;
}

.nls-desc__panel .nl-readmore-content::after{ display:none!important; }
.nls-desc__panel .nl-readmore-toggle{ display:none!important; }

@media (max-width:767px){
  .single-product .summary.entry-summary .nl-attr-buttons{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-auto-flow:row;
    gap:8px!important;
    width:100%;
    margin:10px 0 20px;
  }

  .single-product .summary.entry-summary .nl-attr-btn{
    display:flex!important;
    align-items:center;
    justify-content:center;
    width:100%!important;
    min-width:0!important;
    min-height:52px!important;
    padding:12px 6px!important;
    font-size:14px!important;
    line-height:1.2!important;
    touch-action:manipulation;
  }
}

@media (prefers-reduced-motion:reduce){
  .nls-desc__icon::before,
  .nls-desc__icon::after{ transition:none; }
}
