
/* Grid / Display */
body.logged-in.page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout .woocommerce-billing-fields {
  display : none;
}
body.logged-in.page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout .woocommerce-shipping-fields {
  display : none;
}

@media(min-width: 1784px) {
  .page-template-template-checkout #page.site article {
    display               : grid;
    grid-template-columns : subgrid;
    grid-template-rows    : auto auto 1fr;
    grid-template-areas : 
      "msg     . side"
      "login   . side"
      "loginF  . side"
      "coupon  . side"
      "couponF . side"
      "bill    . side"
      "account . side"
      "shipp   . side"
      "input   . side"
      "pay     . side";
  }
  .page-template-template-checkout article::after {
    grid-area : side;
  }
  .page-template-template-checkout #page.site .entry-content {
    display : contents;
  }
  .page-template-template-checkout #page.site .entry-content::before,
  .page-template-template-checkout #page.site .entry-content::after {
    display : none; /* also in order details */
  }
  .page-template-template-checkout #page.site .entry-content > div {
    display : contents;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-notices-wrapper {
    grid-area : msg;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-form-login-toggle {
    grid-area : login;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-form-login {
    grid-area : loginF;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-form-coupon-toggle {
    grid-area : coupon;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-form-coupon {
    grid-area : couponF;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout {
    display : contents;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout .woocommerce-NoticeGroup {
    grid-area : msg;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout .woocommerce-billing-fields {
    grid-area : bill;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout .woocommerce-account-fields {
    grid-area : account;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout .woocommerce-shipping-fields {
    grid-area : shipp;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout > .woocommerce-additional-fields {
    grid-area : input;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout > .c-cart-items {
    grid-area  : side;
  }
  .page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout > .c-checkout-summary {
    grid-area : pay;
  }
}

body:not(.logged-in).page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout > .c-checkout-summary > h2{
  display : none;
}
body:not(.logged-in).page-template-template-checkout #page.site .entry-content > div > .woocommerce-checkout > .c-checkout-summary .c-totals{
  display : none;
}



/* Empty Cart */
#page.site .wc-backward {
  display: inline-grid;
}

/* Orders - Grid */
.page-template-template-checkout .c-cart-items {
  display               : grid;
  grid-template-columns : auto auto 1fr;
  column-gap            : 16px;
}
.page-template-template-checkout .c-cart-items h2 {
  grid-column : 1/4;
}
.page-template-template-checkout .c-cart-item {
  display               : grid;
  grid-template-columns : subgrid;
  grid-template-rows    : auto auto 1fr;
  grid-column           : 1/4 ;
  grid-template-areas: 
    "img title    title  "
    "img sku      sku    "
    "img details  details"
    "img .        price  ";
}
.page-template-template-checkout .c-cart-item > img {
  grid-area : img;
}
.page-template-template-checkout .c-cart-item > h3 {
  grid-area : title;
  margin    : 0;
}
.page-template-template-checkout .c-cart-item .c-sku {
  grid-area     : sku;
  margin-bottom : 4px;
}
.page-template-template-checkout .c-cart-item > dl {
  grid-area             : details;
  display               : grid;
  grid-template-columns : subgrid;
}
.page-template-template-checkout .c-cart-item > dl dt {
  grid-column: 1/2;
}
.page-template-template-checkout .c-cart-item > dl dd {
  grid-column: 2/3;
}
.page-template-template-checkout .c-cart-item > div {
  grid-column: price;
}

/* Summary */
.page-template-template-checkout #page.site .woocommerce-thankyou-order-details {
  border           : 1px solid var(--c-border);
  background-color : white;
  padding          : 8px 16px; 
  margin           : 0 0 40px 0;
  position         : static;
  border-radius    : var(--c-radius);
}
.page-template-template-checkout #page.site .woocommerce-thankyou-order-details li {
  font-size     : 12px;
  line-height   : 18px ;
  font-weight   : 400;
  font-family   : var(--c-font-familiy-text);
  color         : var(--c-text-secondary);
  border-bottom : 1px dotted var(--c-border);
  padding       : 8px 8px 8px 8px;
}
.page-template-template-checkout #page.site .woocommerce-thankyou-order-details li:last-child {
  border : none;
}
.page-template-template-checkout #page.site .woocommerce-thankyou-order-details li strong {
  font-size   : 14px;
  line-height : 20px;
  font-weight : 500;
  font-family : var(--c-font-familiy-title);
  color       : var(--c-text-title);
}

/* Orders */
.page-template-template-checkout #page.site .c-cart-items {
  align-self            : start;
  z-index               : 1;
  width                 : 100%;
  background-color      : var(--c-background) ;
  padding               : 20px 0 16px 0;
  border-top            : 1px solid var(--c-border);
  float                 : none;
}
@media(min-width: 1784px) {
  .page-template-template-checkout #page.site .c-cart-items {
    border-left      : 1px solid var(--c-border);
    border-top       : none;
    background-color : white;
    padding          : 24px 16px 16px 16px; 
    margin-top       : -24px;
  }
}
.page-template-template-checkout #page.site .c-cart-items h2 {
  font-size     : 18px;
  line-height   : 26px;
  margin-bottom : 16px; 
}
/* .page-template-template-checkout #page.site .c-cart-items h2+h3 {
  border-top: none;
} */

/* Order items */
.page-template-template-checkout .c-cart-item {
  border-radius    : var(--c-radius);
  border           : 1px solid var(--c-border);
  padding          : 8px 16px;
  margin-bottom    : 8px;
  background-color : white;
}
.page-template-template-checkout .c-cart-item > img {
  height : 80px;
  width  : auto;
}
.page-template-template-checkout .c-cart-item dl {
  margin : 0;
}
.page-template-template-checkout .c-cart-item dt,
.page-template-template-checkout .c-cart-item dd {
  margin : 0;
}
.page-template-template-checkout .c-cart-item dl p {
  margin : 0;
}
.page-template-template-checkout .c-cart-item > div {
  justify-self : right;
  align-self   : end;
  font-size    : 14px;
  line-height  : 20px;
  font-weight  : 500;
  font-family  : var(--c-font-familiy-title);
  color        : var(--c-text-title);
}

/* Shipping fields */
.page-template-template-checkout .woocommerce-billing-fields  #billing_state_field,
.page-template-template-checkout .woocommerce-shipping-fields #shipping_state_field {
  display : none !important;
}
.page-template-template-checkout .woocommerce-billing-fields  #billing_country_field,
.page-template-template-checkout .woocommerce-shipping-fields #shipping_country_field {
  display : none;
}

/* Additional fields - grid*/
.page-template-template-checkout #page.site .woocommerce-additional-fields {
  display               : grid;
  grid-template-columns : 1fr;
  column-gap            : 16px;
  grid-template-areas: 
    "title    "
    "delivery "
    "billing  "
    "title2   "
    "cost     "
    "comment  "
    "title3   ";
}
@media(min-width: 500px) {
  .page-template-template-checkout #page.site .woocommerce-additional-fields {
    display               : grid;
    grid-template-columns : 1fr 1fr;
    column-gap            : 16px;
    grid-template-areas: 
      "title    title  "
      "delivery billing"
      "title2   title2  "
      "cost     cost   "
      "comment  comment"
      "title3   title3  ";
  }
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > h2:nth-child(2) {
  grid-area : title;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > div:nth-child(2) {
  grid-area : delivery;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > div:nth-child(3) {
  grid-area : billing;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > h2:nth-child(4) {
  grid-area : title2;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > #c-cost-center_field {
  grid-area : cost;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > #c-comment_field {
  grid-area : comment;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > h2:nth-child(7) {
  grid-area : title3;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > .woocommerce-additional-fields__field-wrapper {
  display : none;
}

/* Additional fields*/
.page-template-template-checkout #page.site .woocommerce-additional-fields > h2:nth-child(1) {
  font-size     : 18px;
  line-height   : 26px;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > div:nth-child(2),
.page-template-template-checkout #page.site .woocommerce-additional-fields > div:nth-child(3) {
  border-radius    : var(--c-radius);
  border           : 1px solid var(--c-border);
  padding          : 16px;
  background-color : white;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > div:nth-child(3) {
  margin-top : 8px;
}
@media(min-width: 500px) {
  .page-template-template-checkout #page.site .woocommerce-additional-fields > div:nth-child(3) {
    margin-top : 0;
  }
}

.page-template-template-checkout #page.site .woocommerce-additional-fields > h2:nth-child(4) {
  font-size   : 18px;
  line-height : 26px;
  margin-top  : 24px;
  border-top  : 1px solid var(--c-border);
  padding-top : 16px;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > #c-cost-center_field {
  margin : 0;
}
.page-template-template-checkout #page.site .woocommerce-additional-fields > #c-comment_field {
  margin : 16px 0 24px 0;
}

/* collaterals */
.page-template-template-checkout #page.site .c-checkout-summary {
  padding          : 16px;
  background-color : white;
  border           : 1px solid var(--c-border);
  border-radius    : var(--c-radius);

}
@media(min-width: 744px) {
  .page-template-template-checkout #page.site .c-checkout-summary {
    width        : calc(50% - 8px);
    justify-self : end;
    align-self   : start;
  }
}
.page-template-template-checkout #page.site .c-checkout-summary p {
  margin-bottom: 0;
}
.page-template-template-checkout #page.site .c-checkout-summary h2 {
  font-size   : 18px;
  line-height : 26px;
}
.page-template-template-checkout .c-totals tr th,
.page-template-template-checkout .c-totals tr td{
  padding          : 0;
  font-size        : 14px;
  line-height      : 20px ;
  font-weight      : 400;
  font-family      : var(--c-font-familiy-text);
  color            : var(--c-text-secondary);
  padding-bottom   : 8px; 
  background-color : white;
}
.page-template-template-checkout .c-totals tr.order-total th,
.page-template-template-checkout .c-totals tr.order-total td {
  border-top : 1px solid var(--c-border);
  padding-top : 8px
}
.page-template-template-checkout .c-totals tr.order-total td strong,
.page-template-template-checkout .c-totals tr.order-total th {
  font-size   : 14px;
  line-height : 20px;
  font-weight : 500;
  font-family : var(--c-font-familiy-title);
  color       : var(--c-text-title);
}
.page-template-template-checkout .woocommerce-checkout-payment .payment_methods {
  display : none;
}
.page-template-template-checkout #page.site .woocommerce-checkout-payment .place-order {
  margin           : 0;
  padding          : 0;
  background-color : white;
}
.page-template-template-checkout #page.site .woocommerce-terms-and-conditions-wrapper .woocommerce-form__label-for-checkbox {
  display               : grid;
  grid-template-columns : auto 1fr;
  column-gap            : 4px;
  align-items           : center;
  background-color      : white;
}

@media(min-width: 1784px) {
  .page-template-template-checkout article::after {
    content          : '';
    display          : block;
    background-color : white;
    border-left      : 1px solid var(--c-border);
    margin-bottom    : -40px;
    margin-top       : -24px; 
  }
}

#page.site .checkout-inline-error-message {
  color: var(--c-error);
}