/*
Theme Name: MetRIJK
Theme URI: https://www.metrijk.nl
Author: MetRIJK
Description: Eigen blokthema voor de MetRIJK webshop, in de huisstijl: pruim, oudroze, heide-lila, theegroen en linnen, met Xanh Mono voor koppen.
Version: 0.1.1
Requires at least: 6.5
Requires PHP: 7.4
License: Private
Text Domain: metrijk
*/

/* Achtergrond: linnen met een zacht ruitjespatroon */
body{
  background-color:#F3ECE2;
  background-image:
    linear-gradient(rgba(82,41,74,.06) 1.5px,transparent 1.5px),
    linear-gradient(90deg,rgba(82,41,74,.06) 1.5px,transparent 1.5px);
  background-size:28px 28px;
}

/* Kop: pruim ribfluweel met roze rand rond de naam */
.mk-top{
  background-color:#52294A;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.09) 0 2px,rgba(0,0,0,.12) 2px 5px);
  border-radius:0 0 28px 28px;
}
.mk-brand{
  display:inline-flex;align-items:baseline;background:#52294A;border:3px solid #D4A5A0;border-radius:999px;
  padding:10px 30px 14px;font-family:var(--wp--preset--font-family--xanh-mono);font-size:clamp(28px,5vw,40px);line-height:1;
  text-decoration:none;
}
.mk-brand .b1{color:#F3ECE2}.mk-brand .b2{color:#D4A5A0}
.mk-top a{color:#F3ECE2;text-decoration:none}
.mk-top a:hover{color:#D4A5A0}
.mk-top .wc-block-mini-cart__button,.mk-top .wc-block-customer-account a,.mk-top svg{color:#F3ECE2;fill:#F3ECE2}
.mk-dots{display:flex;gap:8px;align-items:center}
.mk-dots i{width:9px;height:9px;border-radius:50%;display:inline-block;background:#B7A3C0}
.mk-dots i:nth-child(2){background:#A8AE8C}.mk-dots i:nth-child(3){background:#A0607A}

/* Knoppen als pil, pruim met linnen tekst */
.wp-block-button__link,.wp-element-button,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.wc-block-components-button:not(.is-link){
  border-radius:30px;font-weight:600;min-height:48px;
}
.wp-block-button__link:hover,.wp-element-button:hover{background-color:#3D1C36}
.is-style-outline .wp-block-button__link{border:1.5px solid #52294A}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #D4A5A0;outline-offset:3px}

/* Pruim stippellijn rond beeld en kaarten */
.mk-dotted{border:3px dotted #52294A;border-radius:22px;padding:22px}
.mk-dotted-img img,.woocommerce ul.products li.product a img,.wc-block-components-product-image img,.wp-block-woocommerce-product-image img{
  border-radius:16px;
}
.woocommerce ul.products li.product,.wc-block-product{
  background:#FBF7F1;border:2px dotted #52294A;border-radius:22px;padding:16px;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--wp--preset--font-family--xanh-mono);font-size:22px;color:#52294A}
.woocommerce ul.products li.product .price,.woocommerce div.product p.price,.woocommerce div.product span.price{color:#A0607A;font-weight:600}
.woocommerce span.onsale{background:#A0607A;color:#F3ECE2;border-radius:30px;min-height:auto;min-width:auto;line-height:1;padding:8px 14px}

/* Vormen van de beginpagina */
.mk-arch{background-color:#D4A5A0;border-radius:160px 160px 18px 18px;padding:60px 28px 36px;text-align:center;
  background-image:repeating-linear-gradient(0deg,rgba(122,102,112,.12) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(122,102,112,.12) 0 1px,transparent 1px 3px)}
.mk-circle{background-color:#B7A3C0;border-radius:50% 50% 50% 50%/42% 42% 58% 58%;padding:60px 28px 48px;text-align:center}
.mk-half{background-color:#A8AE8C;border-radius:18px 18px 160px 160px;padding:36px 28px 80px;text-align:center;
  background-image:repeating-linear-gradient(62deg,rgba(80,55,35,.16) 0 2px,transparent 2px 7px),repeating-linear-gradient(-62deg,rgba(255,255,255,.14) 0 2px,transparent 2px 7px)}
.mk-arch,.mk-circle,.mk-half{color:#52294A}
.mk-band{
  background-color:#52294A;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.09) 0 2px,rgba(0,0,0,.12) 2px 5px);
  border-radius:18px;color:#F3ECE2;text-align:center;
}
.mk-band span{color:#D4A5A0}
.mk-pill{display:inline-block;font-size:13px;letter-spacing:2px;text-transform:uppercase;font-weight:600;color:#F3ECE2;background:#A0607A;padding:8px 16px;border-radius:30px}
.mk-chips{display:flex;flex-wrap:wrap;gap:10px}
.mk-chips span{font-weight:600;font-size:15px;padding:8px 18px;border-radius:30px;border:1.5px solid #52294A}
.mk-chips span:nth-child(1){background:#D4A5A0}.mk-chips span:nth-child(2){background:#B7A3C0}
.mk-chips span:nth-child(3){background:#A8AE8C}.mk-chips span:nth-child(4){background:#B3A394}

/* Voet */
.mk-foot{border-top:1px solid #DCCDBA;color:#6A545E;font-size:15px}
.mk-foot a{color:#52294A}

@media (max-width:781px){
  .mk-top{border-radius:0 0 22px 22px}
  .mk-arch{border-radius:120px 120px 18px 18px}
  .mk-half{border-radius:18px 18px 120px 120px}
}