/* Used in Cart and Order List */
.c-item-list .c-item {
  position         : relative;
  margin-bottom    : 12px;
  padding          : 12px;
  display          : grid;
  column-gap       : 12px;
  align-items      : center;
  justify-items    : stretch;
  border           : 1px solid var(--c-border);
  border-radius    : var(--c-radius);
  background-color : white;
}
@media (min-width: 782px) {
  .c-item-list .c-item {
    padding     : 24px;
    align-items : start;
  }
}

.c-item-list .c-item:not(.c-open) .c--comment {
  display: none !important;
}

/* .c-item-list .c-item {
  grid-template-columns : auto  1fr;
  grid-template-areas   :
    "icons    offer  "
    "title    title  "
    "meta     meta   "
    "gDate    .      "
    "lDate    iDate  "
    ".        eDate  "
    "gAmount  .      "
    "lAmount  iAmount"
    ".        eAmount"
    "gPiece   .      "
    "lPiece   iPiece "
    ".        ePiece "
    "gSummary .      "
    "summary  summary"
    "mobile   mobile "
    "open     open   "
    "gUnit    .      " 
    "lUnit    lUnit  "
    "iUnit    iUnit  "
    "gComm    .      "
    "lComm    lComm  "
    "iComm    iComm  "
    "gInfo    .      "
    "info     info   ";
} */

/* @media (min-width: 782px) {
  .c-item-list .c-item {
    grid-template-columns: 
       58px     155px   124px     124px    124px    1fr;
    grid-template-areas:
      "open     image   title     title    title    offer  "
      "open     image   meta      meta     meta     meta   " 
      "open     image   .         .        .        .      "
      "open     image   lDate     lAmount  lPiece   .      "
      "open     image   iDate     iAmount  iPiece   .      "
      ".        .       eAmount   eAmount  eAmount  eAmount"
      ".        .       ePiece    ePiece   ePiece   ePiece "
      ".        .       eDate     eDate    eDate    eDate  "
      ".        .       .         .        .        .      "
      ".        .       c-slot-1  c-slot-2 c-slot-3 .      "
      ".        .       summary   summary  summary  summary"
      ".        .       .         .        .        .      "
      "lUnit    lUnit   lUnit     lUnit    lUnit    lUnit  "
      "iUnit    iUnit   iUnit     iUnit    iUnit    iUnit  "
      ".        .       .         .        .        .      "
      "lComm    lComm   lComm     lComm    lComm    lComm  "
      "iComm    iComm   iComm     iComm    iComm    iComm  "
      ".        .       .         .        .        .      "
      "info     info    info      info     info     info   "
  }
} */

@media (min-width: 1200px) {
  .c-item-list .c-item {

    grid-template-rows :
      auto  /* offer*/ 
      auto  /* piece */
      auto  /* amount */
      auto  /* price */
      auto  /* summ */
      12px  /* . */
      auto  /* slots */
      12px  /* . */
      auto  /* eAmount */
      auto  /* ePiece */
      auto  /* eDate */
      auto  /* info */
      auto  /* lComm*/
      auto  /* iComm */
    ;
    grid-template-columns: 
       2fr       2fr      1fr      1fr      2fr       2fr;
    grid-template-areas:
      "open      title    title    title     title    offer  "
      "image     meta     meta     meta      meta     piece  "
      "image     .        .        .         .        amount "
      "image     lDate    lAmount  lAmount   lPiece   price  "
      "image     iDate    iAmount  iAmount   iPiece   summ   "
      "image     .        .        .         .        .      "
      ".         c-slot-1 c-slot-1 c-slot-2  c-slot-2 .      "
      ".         .        .        .         .        .      "
      ".         eAmount  eAmount  eAmount   eAmount  eAmount"
      ".         ePiece   ePiece   ePiece    ePiece   ePiece "
      ".         eDate    eDate    eDate     eDate    eDate  "
      ".         info     info     info      info     .      "
      "lComm     lComm    lComm    lComm     lComm    lComm  "
      "iComm     iComm    iComm    iComm     iComm    iComm  ";
  }
}


/* Icons */
.c-item-list .c-item::before {
  content   : '';
  grid-area : icons;
  height    : 20px;
}
@media (min-width: 782px) {
  .c-item-list .c-item::before {
    display: none;
  }
}

/* Product name */
.c-item-list .c-item > a:nth-child(1) {
  grid-area       : title;
  text-decoration : none;
  height          : 20px;
}
.c-item-list .c-item > a:nth-child(1):focus {
  outline         : none;
  text-decoration : underline;
}

/* Meta */
.c-item-list .c-item > div:nth-child(2) {
  grid-area : meta;
}

/* List name */
.c-item-list .c-item .span_listName::before {
  content             : '';
  display             : inline-block;
  height              : 11px;
  width               : 16px;
  background-image    : url(/wp-content/plugins/custom/assets/list-icon.svg);
  background-repeat   : no-repeat;
  background-size     : 12px;
  background-position : center center;
}
/* image */
.c-item-list .c-item > .attachment-woocommerce_gallery_thumbnail {
  display : none;
}
@media(min-width: 782px) {
  .c-item-list .c-item > .attachment-woocommerce_gallery_thumbnail {
    display        : block;
    grid-area      : image;
    justify-self   : left;
    margin         : 0;
    height         : 116px;
    width          : auto;
    border-radius  : var(--c-radius);
  }
}

/* select item */
.c-item-list .c-item > .input_select {
  position : absolute;
  top      : 12px;
  left     : 12px;
}
@media(min-width: 782px) {
  .c-item-list .c-item > .input_select {
    top  : 24px;
    left : 24px;
  }
}

/* delete item */
.c-item-list .c-item > .button_delete {
  position            : absolute;
  top                 : 9px;
  right               : 7px;
  height              : 24px;
  width               : 24px;
  padding             : 0;
  border-radius       : var(--c-radius);
  background-color    : white;
  background-image    : url(/wp-content/plugins/custom/assets/trash-icon.svg);
  background-repeat   : no-repeat;
  background-size     : 16px;
  background-position : center center;
} 
.c-item-list .c-item:has(.span_summaryOffer:not(.c-hidden)) > .button_delete{
  top : 24px;
}

@media(min-width: 782px) {
  .c-item-list .c-item > .button_delete {
    top   : 24px;
    right : 24px;
  }
}

/* open item */
.c-item-list .c-item > .button_open {
  grid-area           : open;
  align-self          : center;
  justify-self        : center;
  margin-top          : 12px;
  width               : 32px;
  height              : 20px;
  border-radius       : 6px;
  border              : none;
  padding             : 0px;
  background-color    : white;
  background-image    : url(/wp-content/plugins/custom/assets/chevron-down-icon.svg);
  background-repeat   : no-repeat;
  background-size     : 16px;
  background-position : center center;
}
.c-item-list .c-item.c-open > .button_open {
  background-image    : url(/wp-content/plugins/custom/assets/chevron-up-icon.svg);
}
@media(min-width: 782px) {
  .c-item-list .c-item > .button_open {
    justify-self  : left;
    margin-top    : 0;
    border        : 1px solid var(--c-button);
    border-radius : 50% ;
    width         : 32px;
    height        : 32px;
  }
}

/* Summary */
.c-item-list .c-item > .fieldset_summary {
  display : contents;
}
.c-item-list .c-item > .fieldset_summary::before {
  content   : '';
  grid-area : gSummary;
  height    : 12px;
}
/* todo-design remvove */
.c-item-list .c-item > .fieldset_summary .span_summaryOffer {
  position         : absolute;
  top              : 0;
  justify-self     : right;
  margin-bottom    : 0;

  color            : white;
  border           : none;
  font-size        : 12px;
  line-height      : 18px;
  font-weight      : 400;
  font-family      : var(--c-font-familiy-text);
  padding          : 1px 6px;
  border-radius    : 0 4px 0 4px;
  text-transform   : none;
}
.c-item-list .c-item > .fieldset_summary .span_summaryOffer.c-offer {
  background-color : var(--c-error);
}
.c-item-list .c-item > .fieldset_summary .span_summaryOffer.c-individual-price {
  background-color : var(--c-button);
}
/* --- todo-design remvove end ---*/
.c-item-list .c-item > .fieldset_summary > .span_summaryPiece {
  display: none;
}
.c-item-list .c-item > .fieldset_summary > .span_summaryAmount {
  display: none;
}
.c-item-list .c-item > .fieldset_summary > .span_summaryPrice {
  display: none;
}
.c-item-list .c-item > .fieldset_summary > .span_summarySum {
  grid-area    : mobile;
  justify-self : right;
  font-size    : 14px;
  line-height  : 20px;
  font-weight  : 500;
  font-family  : var(--c-font-familiy-title);
  color        : var(--c-text-title);
  margin-left  : 1em;
}
.c-item-list .c-item > .fieldset_summary > .span_summaryAll {
  display : none;
}
.c-item-list .c-item > .fieldset_summary > .span_summaryAllShort {
  display : none;
}
.c-item-list .c-item > .fieldset_summary > .span_summaryAllMobile {
  grid-area    : summary;
  justify-self : right;
}
#page.site .c-item-list .c-item > .fieldset_summary .c-ca {
  font-weight : 400;
  font-size   : 12px;
  font-family : var(--c-font-familiy-text);
  color       : var(--c-text-secondary);
}
@media (min-width: 782px) {
  .c-item-list .c-item > .fieldset_summary > .span_summaryAll {
    display      : block;
    grid-area    : summary;
    justify-self : right;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summaryAll span {
    font-size    : 14px;
    line-height  : 20px;
    font-weight  : 500;
    font-family  : var(--c-font-familiy-title);
    color        : var(--c-text-title);
    margin-left  : 1em;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summarySum {
  display: none;
}
  .c-item-list .c-item > .fieldset_summary .span_summaryAllMobile {
    display: none;
  }
}

@media (min-width: 1200px) {
  .c-item-list .c-item > .fieldset_summary::before {
    display : none;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summaryPiece {
    display      : block;
    grid-area    : piece;
    justify-self : right;
    position     : relative;
    top          : 8px;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summaryAmount {
    display      : block;
    grid-area    : amount;
    justify-self : right;
    position     : relative;
    top          : 8px;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summaryPrice {
    display      : block;
    grid-area    : price;
    justify-self : right;
    position     : relative;
    top          : 8px;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summarySum {
    display      : block;
    grid-area    : summ;
    justify-self : right;
    align-self   : center;
    font-size    : 14px;
    line-height  : 20px;
    font-weight  : 500;
    font-family  : var(--c-font-familiy-title);
    color        : var(--c-text-title);
  }
  .c-item-list .c-item > .fieldset_summary > .span_summaryAll {
    display : none;
  }
  .c-item-list .c-item > .fieldset_summary > .span_summaryAllShort {
    display : none;
  }

}



/* Amount */
.c-item-list .c-item > .c--amount {
  display : contents;
}
.c-item-list .c-item > .c--amount > label {
  grid-area : lAmount;
}
.c-item-list .c-item > .c--amount > div:nth-child(2) {
  grid-area : iAmount;
  justify-self: stretch;
}
.c-item-list .c-item > .c--amount > div:nth-child(3) {
  grid-area : eAmount;
}


/* Amount Select */
.c-item-list .c-item > .c--amount-select {
  display : contents;
}
.c-item-list .c-item > .c--amount-select > label {
  grid-area : lAmount;
}
.c-item-list .c-item > .c--amount-select > select {
  grid-area : iAmount;
}
.c-item-list .c-item > .c--amount-select > div:nth-child(3) {
  grid-area : eAmount;
}

/* Weight per piece */
.c-item-list .c-item > .c--weight-per-piece {
  display : contents;
}
.c-item-list .c-item > .c--weight-per-piece > label {
  grid-area : lPiece;
}
.c-item-list .c-item > .c--weight-per-piece > div:nth-child(2) {
  grid-area : iPiece;
  justify-self: stretch;
}
.c-item-list .c-item > .c--weight-per-piece > div:nth-child(3) {
  grid-area : ePiece;
}

/* Delivery Date */
.c-item-list .c-item > .c-delivery-date {
  display : contents;
}
.c-item-list .c-item > .c-delivery-date > label {
  grid-area : lDate;
}
.c-item-list .c-item > .c-delivery-date > div {
  grid-area    : iDate;
  justify-self : stretch;
}
.c-item-list .c-item > .c-delivery-date > p {
  grid-area : eDate;
  margin    : 0;
}

/* Comment */
.c-item-list .c-item > .c--comment {
  display : contents;
}
.c-item-list .c-item > .c--comment > label {
  grid-area: lComm;
}
.c-item-list .c-item > .c--comment > textarea {
  grid-area: iComm;
}

/* Delivery Date Info */
.c-item-list .c-item > .c--delivery-date-info {
  grid-area  : info;
  width      : 100%;

}
@media(min-width: 1200px) {
  .c-item-list .c-item > .c--delivery-date-info {
    margin-top: 0;
  }
}

/* New **************/
.c-item-list .c-item .div_summaryOffer {
  background-color : var(--c-error);
  color            : white;
  position         : absolute;
  top              : 0;
  right            : 0;
  border-radius    : 0 var(--c-radius) 0 0;
  padding          : 2px 4px 4px 4px;
  .div_summaryOfferTextName {
    display      : inline-block;
    margin-right : 0.3em;
  }
  .div_summaryOfferTextDate {
    display: inline-block;
  }
  .del_summaryOfferOld{
    display : block;
    opacity : 0.8;
    text-align: right;
  }
  .span_summaryOfferOldCur {
    margin-right : 0.3em;
  }
  .span_summaryOfferNewCur {
    font-size    : 12px;
    margin-right : 0.3em;
  }
 .span_summaryOfferNewUnit {
    font-size    : 12px;
  }
  .ins_summaryOfferNew {
    display: block;
    font-size: 18px;
    text-align: right;
  }
}