/* =========================================================
   ADDRILI WOO BASIS
   ========================================================= */

/*
 * Tijdelijk wat specifieker omdat oude Additional CSS
 * nog actief is. Die ruimen we later op.
 */
html body.single-product,
html body.woocommerce-cart,
html body.woocommerce-checkout,
html body.woocommerce-account,
html body.single-product #page,
html body.woocommerce-cart #page,
html body.woocommerce-checkout #page,
html body.woocommerce-account #page,
html body.single-product .site,
html body.woocommerce-cart .site,
html body.woocommerce-checkout .site,
html body.woocommerce-account .site,
html body.single-product main,
html body.woocommerce-cart main,
html body.woocommerce-checkout main,
html body.woocommerce-account main,
.addrili-woo,
.addrili-woo-shell {
  background: #edf4f2 !important;
}


/* =========================================================
   CENTRALE WOO SHELL
   ========================================================= */

.addrili-woo-shell {
  width: calc(100% - 48px) !important;
  max-width: 1180px !important;

  margin-left: auto !important;
  margin-right: auto !important;

  padding: 24px 0 40px !important;
  box-sizing: border-box !important;
}


/* =========================================================
   WOO BLOCKS BINNEN DE SHELL HOUDEN
   ========================================================= */

.addrili-woo-shell .alignwide,
.addrili-woo-shell .alignfull,
.addrili-woo-shell .wp-block-woocommerce-cart {
  width: 100% !important;
  max-width: 100% !important;

  margin-left: 0 !important;
  margin-right: 0 !important;

  box-sizing: border-box !important;
}


/* Winkelwagen zelf transparant over onze achtergrond */
.addrili-cart .wp-block-woocommerce-cart,
.addrili-cart .wc-block-cart,
.addrili-cart .wc-block-cart__main,
.addrili-cart .wc-block-cart__sidebar {
  background: transparent !important;
}


/* =========================================================
   MOBIEL
   ========================================================= */

@media (max-width: 768px) {

  .addrili-woo-shell {
    width: calc(100% - 28px) !important;
    padding: 18px 0 32px !important;
  }
}
/* =========================================================
   CHECKOUT - PLAATS BESTELLING
   ========================================================= */

body.woocommerce-checkout
.wc-block-components-checkout-place-order-button,
body.woocommerce-checkout
button.wc-block-components-checkout-place-order-button,
body.woocommerce-checkout
.wp-block-woocommerce-checkout
button[type="button"],
body.woocommerce-checkout
.wp-block-woocommerce-checkout
button[type="submit"] {
  background: #FE8A85 !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: 999px !important;

  min-height: 50px !important;
  padding: 14px 26px !important;

  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1 !important;

  box-shadow: 0 10px 22px rgba(254, 138, 133, 0.24) !important;
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    filter .15s ease !important;
}

body.woocommerce-checkout
.wc-block-components-checkout-place-order-button *,
body.woocommerce-checkout
.wp-block-woocommerce-checkout
button[type="submit"] * {
  color: #ffffff !important;
  fill: #ffffff !important;
}

body.woocommerce-checkout
.wc-block-components-checkout-place-order-button:hover,
body.woocommerce-checkout
.wp-block-woocommerce-checkout
button[type="submit"]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 28px rgba(254, 138, 133, 0.30) !important;
  filter: brightness(.97) !important;
}
/* =========================================================
   MIJN ACCOUNT – BREEDTEVERDELING
   ========================================================= */

.woocommerce-account .woocommerce-MyAccount-navigation {
  width: 24% !important;
}

.woocommerce-account .woocommerce-MyAccount-content {
  width: 72% !important;
}

@media (max-width: 900px) {

  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content {
    width: 100% !important;
  }
}
/* =========================================================
   MIJN ACCOUNT – BESTELLINGEN
   ========================================================= */

/* Tabel altijd volledige beschikbare breedte geven */
.woocommerce-account
.woocommerce-orders-table {
  width: 100% !important;
  table-layout: auto !important;
}

/* Bestelling */
.woocommerce-account
.woocommerce-orders-table
.woocommerce-orders-table__header-order-number {
  width: 14%;
}

/* Datum */
.woocommerce-account
.woocommerce-orders-table
.woocommerce-orders-table__header-order-date {
  width: 15%;
}

/* Status */
.woocommerce-account
.woocommerce-orders-table
.woocommerce-orders-table__header-order-status {
  width: 14%;
}

/* Totaal */
.woocommerce-account
.woocommerce-orders-table
.woocommerce-orders-table__header-order-total {
  width: 20%;
}

/* Acties krijgt bewust de meeste ruimte */
.woocommerce-account
.woocommerce-orders-table
.woocommerce-orders-table__header-order-actions {
  width: 37%;
}

/* Actieknoppen iets compacter */
.woocommerce-account
.woocommerce-orders-table
.woocommerce-orders-table__cell-order-actions .button {
  padding: 9px 14px !important;
  margin: 2px !important;
  white-space: nowrap;
}