/* ============================================================
   Klantportaal — Mijn account
   Het thema zet de generieke WooCommerce-opmaak uit (assets.php),
   dus alles wat hier staat bouwt de accountomgeving op vanaf nul.
   Kleuren uitsluitend uit tokens.css; hier staan geen losse waarden.
   ============================================================ */

:root {
  --is-schrikstreep: repeating-linear-gradient(45deg, var(--is-geel) 0 9px, var(--is-zwart) 9px 18px);
}

/* ------------------------------------------------------------ oude aannames opheffen

   woo.css bevat al accountstijlen uit een eerdere opzet (regels 170-172 en 195).
   Die gaan ervan uit dat de navigatie en de inhoud directe kinderen van
   .woocommerce zijn, en zetten daar een raster van 260px + 1fr op. Het portaal
   brengt zijn eigen omhulsel mee, en op de inlogpagina is er helemaal geen
   navigatie — dan werd alle inhoud in die kolom van 260px geperst.

   woo.css blijft ongemoeid, want dat bestand wordt ook door de winkelwagen en
   het afrekenen gebruikt. Hier alleen opheffen wat het portaal in de weg zit. */

body.woocommerce-account .woocommerce {
  display: block;
  padding-block: 0;
  gap: 0;
}

/* Let op: hier géén `overflow` zetten. woo.css klipt de lijst met
   overflow:hidden, maar een blinde `overflow:visible` met deze specificiteit
   overrulet ook het horizontaal schuiven op smalle schermen verderop — en dan
   steekt de balk buiten beeld zonder dat iemand dat ziet. */
body.woocommerce-account .woocommerce-MyAccount-navigation ul {
  border: 0;
  border-radius: 0;
  overflow: visible;
}

@media (max-width: 860px) {
  body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  body.woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a {
  border-bottom: 0;
  font-size: 14px;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--is-primary-soft);
  color: var(--is-text);
}

/* ------------------------------------------------------------ raamwerk */

.is-portaal {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0 0 var(--is-sp-8);
  background: var(--is-wit);
  border: 1px solid var(--is-border);
}

.is-portaal__inhoud {
  flex: 1;
  min-width: 0;
  padding: var(--is-sp-6);
  background: var(--is-surface);
}

@media (max-width: 860px) {
  .is-portaal { flex-direction: column; }
  .is-portaal__inhoud { padding: var(--is-sp-4); }
}

/* ------------------------------------------------------------ titelblok met schrikstreep */

/* De paginakop komt van page.php; WooCommerce vult daar per endpoint de juiste
   titel in (Bestellingen, Bestelling #51). De templates zetten er geen tweede
   kop naast — één h1 per pagina. */

.is-portaal__titel {
  margin: 0 0 var(--is-sp-5);
  color: var(--is-muted);
  font-size: var(--is-fs-sm);
}

.is-portaal__titel p { margin: 0; }

/* De schrikstreep: geel-zwart diagonaal, onder de paginakop. Eén keer per
   scherm; hetzelfde motief dat de footer al voert. */
body.woocommerce-account .is-pagina > h1::after {
  content: "";
  display: block;
  width: 84px;
  height: 7px;
  margin-top: var(--is-sp-3);
  background: var(--is-schrikstreep);
}

/* ------------------------------------------------------------ navigatiebalk */

.woocommerce-MyAccount-navigation {
  width: 116px;
  flex: none;
  background: var(--is-wit);
  border-right: 1px solid var(--is-border);
  padding: var(--is-sp-2) 0;
}

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.woocommerce-MyAccount-navigation a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  border-left: 4px solid transparent;
  padding: var(--is-sp-3) var(--is-sp-1);
  color: var(--is-muted);
  font-family: var(--is-font-display);
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: center;
  line-height: 1.15;
  text-decoration: none;
}

.woocommerce-MyAccount-navigation a:hover {
  background: var(--is-surface);
  color: var(--is-text);
}

.woocommerce-MyAccount-navigation li.is-active a {
  background: var(--is-primary-soft);
  border-left-color: var(--is-geel);
  color: var(--is-text);
  font-weight: 700;
}

.woocommerce-MyAccount-navigation svg {
  width: 23px;
  height: 23px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 860px) {
  .woocommerce-MyAccount-navigation {
    width: 100%;
    border-right: 0;
    border-bottom: 1px solid var(--is-border);
    padding: 0;
    position: relative;
  }

  /* De schuifbalk is verborgen, dus zonder deze vervaging is niet te zien dat
     er rechts nog tabbladen staan. */
  .woocommerce-MyAccount-navigation::after {
    content: "";
    position: absolute;
    inset: 0 0 0 auto;
    width: 34px;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), var(--is-wit));
    pointer-events: none;
  }
  .woocommerce-MyAccount-navigation ul {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
  .woocommerce-MyAccount-navigation li { flex: none; }
  .woocommerce-MyAccount-navigation a {
    border-left: 0;
    border-bottom: 4px solid transparent;
    padding: var(--is-sp-3) var(--is-sp-4);
  }
  .woocommerce-MyAccount-navigation li.is-active a {
    border-left: 0;
    border-bottom-color: var(--is-geel);
  }
}

/* ------------------------------------------------------------ kaarten */

.is-kaart {
  background: var(--is-wit);
  border: 1px solid var(--is-border);
  margin-bottom: var(--is-sp-5);
}

.is-kaart__body { padding: var(--is-sp-5); }

.is-kaart h2,
.is-kaart h3 {
  font-family: var(--is-font-display);
  font-weight: 600;
  font-size: 1.35rem;
  line-height: 1.1;
  margin: 0 0 var(--is-sp-4);
}

.is-kolommen {
  display: grid;
  grid-template-columns: 330px 1fr;
  gap: var(--is-sp-5);
  align-items: start;
}

/* Breekpunten volgen de rest van het thema (820 / 860 / 900 / 960). */
@media (max-width: 960px) {
  .is-kolommen { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------ statusroute */

/* Hogere specificiteit dan `.is-pagina ol`, dat anders een inspringing en
   lijstnummers oplevert. */
.is-portaal .is-route {
  display: flex;
  list-style: none;
  background: var(--is-wit);
  border: 1px solid var(--is-border);
  padding: var(--is-sp-5) var(--is-sp-3) var(--is-sp-3);
  margin: 0 0 var(--is-sp-5);
  overflow-x: auto;
  scrollbar-width: none;
}

.is-portaal .is-route__stap { list-style: none; }

/* Gravatar Enhanced zet een avatarblok in de navigatiekolom. Die kolom is
   116px breed, dus het blok moet zich daarnaar voegen. */
.woocommerce-account-gravatar {
  padding: var(--is-sp-4) var(--is-sp-2);
  text-align: center;
  border-bottom: 1px solid var(--is-border);
}

.woocommerce-account-gravatar img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  margin: 0 auto;
}

.woocommerce-account-gravatar * {
  font-size: var(--is-fs-xs);
  line-height: 1.25;
}

/* Op een telefoon staat de navigatie als balk boven de inhoud. Een avatar
   kost daar alleen maar hoogte zonder iets toe te voegen. */
@media (max-width: 860px) {
  .woocommerce-account-gravatar { display: none; }
}

.is-route::-webkit-scrollbar { display: none; }

.is-route__stap {
  flex: 1;
  min-width: 118px;
  position: relative;
  text-align: center;
  padding: 0 var(--is-sp-1) var(--is-sp-4);
}

.is-route__stap::before {
  content: "";
  position: absolute;
  top: 11px;
  left: -50%;
  width: 100%;
  height: 6px;
  background: var(--is-surface-2);
}

.is-route__stap:first-child::before { display: none; }
.is-route__stap--klaar::before { background: var(--is-zwart); }

/* Het stuk route dat nu wordt afgelegd draagt de schrikstreep. */
.is-route__stap--nu::before { background: var(--is-schrikstreep); }

.is-route__bol {
  position: relative;
  z-index: 1;
  width: 26px;
  height: 26px;
  margin: 0 auto var(--is-sp-2);
  background: var(--is-wit);
  border: 3px solid var(--is-surface-2);
  border-radius: 50%;
  display: grid;
  place-items: center;
}

.is-route__bol svg {
  width: 13px;
  height: 13px;
  stroke: var(--is-wit);
  fill: none;
  stroke-width: 3.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.is-route__stap--klaar .is-route__bol {
  background: var(--is-zwart);
  border-color: var(--is-zwart);
}

.is-route__stap--nu .is-route__bol {
  background: var(--is-geel);
  border-color: var(--is-zwart);
}

.is-route__label {
  display: block;
  font-family: var(--is-font-display);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 14.5px;
  font-weight: 500;
  color: var(--is-muted);
}

.is-route__stap--klaar .is-route__label,
.is-route__stap--nu .is-route__label {
  color: var(--is-text);
  font-weight: 700;
}

.is-route__datum {
  display: block;
  font-size: var(--is-fs-xs);
  color: var(--is-muted);
  margin-top: 1px;
}

/* ------------------------------------------------------------ boodschap in gewone taal */

.is-boodschap {
  display: flex;
  gap: var(--is-sp-4);
  align-items: flex-start;
  background: var(--is-wit);
  border: 1px solid var(--is-border);
  border-left: 7px solid var(--is-geel);
  padding: var(--is-sp-4);
  margin-bottom: var(--is-sp-5);
}

.is-boodschap svg {
  width: 21px;
  height: 21px;
  flex: none;
  margin-top: 2px;
  stroke: var(--is-zwart);
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.is-boodschap h2 {
  font-family: var(--is-font-display);
  font-size: 1.2rem;
  margin: 0 0 2px;
}

.is-boodschap p { margin: 0; }

/* ------------------------------------------------------------ ISO-vormen */

.is-vorm {
  width: 44px;
  height: 44px;
  flex: none;
  position: relative;
  display: grid;
  place-items: center;
}

.is-vorm--verbod {
  border-radius: 50%;
  background: var(--is-wit);
  border: 6px solid var(--is-cat-verbod);
}

.is-vorm--verbod::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 44px;
  background: var(--is-cat-verbod);
  transform: rotate(45deg);
}

.is-vorm--gebod { border-radius: 50%; background: var(--is-cat-gebod); }
.is-vorm--brand { background: var(--is-cat-brand); }
.is-vorm--redding { background: var(--is-cat-redding); }

.is-vorm--redding::after {
  content: "";
  width: 16px;
  height: 16px;
  border: 3px solid var(--is-wit);
  border-left: 0;
  border-bottom: 0;
  transform: rotate(45deg);
  margin-left: -6px;
}

.is-vorm--waarschuwing {
  background: var(--is-cat-waarschuwing);
  clip-path: polygon(50% 2%, 100% 98%, 0 98%);
}

.is-vorm--waarschuwing::after {
  content: "!";
  font-family: var(--is-font-display);
  font-weight: 700;
  font-size: 19px;
  color: var(--is-zwart);
  margin-top: 11px;
}

/* Terugval als de categorie geen ISO-vorm prijsgeeft. */
.is-vorm--neutraal { background: var(--is-surface-2); border: 1px solid var(--is-border-strong); }
.is-vorm--neutraal::after {
  content: "";
  width: 18px;
  height: 18px;
  border: 2px solid var(--is-muted);
}

.is-vorm--groot { width: 74px; height: 74px; }
.is-vorm--groot.is-vorm--verbod::after { height: 74px; }

/* ------------------------------------------------------------ bestellingentabel */

.is-orders { width: 100%; border-collapse: collapse; }

.is-orders th {
  text-align: left;
  font-family: var(--is-font-display);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--is-muted);
  padding: var(--is-sp-3) var(--is-sp-4);
  border-bottom: 2px solid var(--is-zwart);
  white-space: nowrap;
}

.is-orders td {
  padding: var(--is-sp-4);
  border-bottom: 1px solid var(--is-border);
  vertical-align: top;
}

.is-orders tr:last-child td { border-bottom: 0; }
.is-orders tbody tr:hover { background: var(--is-surface); }

.is-orders__kern {
  display: flex;
  gap: var(--is-sp-4);
  align-items: center;
  min-width: 210px;
}

.is-orders__kern > div { min-width: 0; }
.is-orders__kern a { font-weight: 600; text-decoration: none; }
.is-orders__kern a:hover { text-decoration: underline; }
.is-orders__wat { display: block; color: var(--is-muted); font-size: var(--is-fs-sm); }

.is-balk {
  display: block;
  width: 104px;
  height: 6px;
  background: var(--is-surface-2);
  overflow: hidden;
  margin-bottom: 7px;
}

.is-balk i { display: block; height: 100%; background: var(--is-geel); }
.is-balk--onderweg i { background: var(--is-schrikstreep); }
.is-balk--klaar i { background: var(--is-success); }

.is-statuslabel {
  display: block;
  font-family: var(--is-font-display);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 14px;
  font-weight: 600;
}

.is-zacht { color: var(--is-muted); font-size: var(--is-fs-sm); }
.is-nowrap { white-space: nowrap; }

@media (max-width: 900px) { .is-verbergklein { display: none; } }

/* ------------------------------------------------------------ specificaties */

.is-spec { margin: 0; }

.is-spec > div {
  display: grid;
  grid-template-columns: 104px 1fr;
  gap: var(--is-sp-3);
  padding: var(--is-sp-3) 0;
  border-bottom: 1px solid var(--is-border);
}

/* In een smalle kolom is een label náást de waarde niet meer te doen. */
@media (max-width: 1200px) and (min-width: 961px) {
  .is-spec > div { grid-template-columns: 1fr; gap: 2px; }
}

.is-spec > div:last-child { border-bottom: 0; }
.is-spec dt { color: var(--is-muted); font-size: var(--is-fs-sm); }
.is-spec dd { margin: 0; }
.is-spec dd b { font-weight: 600; }

.is-norm {
  display: inline-block;
  background: var(--is-zwart);
  color: var(--is-geel);
  font-family: var(--is-font-display);
  font-weight: 600;
  letter-spacing: .06em;
  font-size: 12px;
  padding: 1px 7px;
}

/* ------------------------------------------------------------ besteldelen */

.is-regel {
  display: flex;
  gap: var(--is-sp-5);
  padding: var(--is-sp-5) 0;
  border-bottom: 1px solid var(--is-border);
}

.is-regel:first-child { padding-top: 0; }
.is-regel:last-child { border-bottom: 0; }
.is-regel__kern { flex: 1; min-width: 0; }

.is-regel__kop {
  display: flex;
  justify-content: space-between;
  gap: var(--is-sp-4);
  align-items: baseline;
  margin-bottom: var(--is-sp-2);
}

.is-regel__naam { font-weight: 600; }
.is-regel__prijs { font-weight: 600; white-space: nowrap; }

.is-totalen { border-top: 2px solid var(--is-zwart); margin-top: var(--is-sp-2); padding-top: var(--is-sp-4); }

.is-totaalrij {
  display: flex;
  justify-content: space-between;
  padding: var(--is-sp-1) 0;
}

.is-totaalrij--eind {
  font-family: var(--is-font-display);
  font-size: 1.7rem;
  font-weight: 700;
  align-items: baseline;
  padding-top: var(--is-sp-2);
}

.is-totaalrij--eind small {
  font-family: var(--is-font-body);
  font-size: var(--is-fs-sm);
  font-weight: 500;
  color: var(--is-muted);
}

/* ------------------------------------------------------------ knoppen en lijsten */

.is-portaal .button,
.is-knop {
  display: inline-flex;
  align-items: center;
  gap: var(--is-sp-2);
  border: 1px solid var(--is-border-strong);
  background: var(--is-wit);
  color: var(--is-text);
  padding: var(--is-sp-3) var(--is-sp-4);
  font-family: var(--is-font-display);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 14.5px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}

.is-portaal .button:hover,
.is-knop:hover { background: var(--is-surface); }

.is-knop--primair,
.is-portaal .button[name="login"],
.is-portaal .button[name="register"],
.is-portaal .button[name="save_account_details"],
.is-portaal .button[name="save_address"] {
  background: var(--is-geel);
  border-color: var(--is-geel);
  color: var(--is-zwart);
}

.is-knop--primair:hover,
.is-portaal .button[name="login"]:hover,
.is-portaal .button[name="register"]:hover { background: var(--is-primary-hover); border-color: var(--is-primary-hover); }

.is-knop--zwart { background: var(--is-zwart); border-color: var(--is-zwart); color: var(--is-wit); }
.is-knop--zwart:hover { background: var(--is-inverse-2); }

.is-knop svg,
.is-portaal .button svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.is-lijst { list-style: none; margin: 0; padding: 0; }

.is-lijst a {
  display: flex;
  align-items: center;
  gap: var(--is-sp-3);
  padding: 7px 0;
  font-weight: 500;
  text-decoration: none;
}

.is-lijst a:hover { color: var(--is-primary-active); }

.is-lijst svg {
  width: 15px;
  height: 15px;
  flex: none;
  stroke: var(--is-zwart);
  fill: none;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.is-terug {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--is-muted);
  font-size: var(--is-fs-sm);
  font-weight: 500;
  margin-bottom: var(--is-sp-2);
  text-decoration: none;
}

.is-terug:hover { color: var(--is-text); }

/* De icoonset heeft geen pijl naar links; de chevron omlaag gedraaid geeft er
   wel een. */
.is-terug svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.4;
  stroke-linecap: round;
  transform: rotate(90deg);
}

.is-titelrij { display: flex; align-items: flex-start; gap: var(--is-sp-4); flex-wrap: wrap; margin-bottom: var(--is-sp-5); }
.is-titelrij .is-knoppen { margin-left: auto; display: flex; gap: var(--is-sp-3); flex-wrap: wrap; }

/* ------------------------------------------------------------ formulieren */

.is-portaal .woocommerce-form-row { margin-bottom: var(--is-sp-4); }

.is-portaal label {
  display: block;
  font-weight: 600;
  font-size: var(--is-fs-sm);
  margin-bottom: var(--is-sp-1);
}

.is-portaal .input-text,
.is-portaal input[type="text"],
.is-portaal input[type="email"],
.is-portaal input[type="tel"],
.is-portaal input[type="password"],
.is-portaal select {
  width: 100%;
  border: 1px solid var(--is-border-veld);
  background: var(--is-wit);
  padding: var(--is-sp-3);
  font: inherit;
  color: var(--is-text);
}

.is-portaal .input-text:focus,
.is-portaal select:focus { outline: 3px solid var(--is-zwart); outline-offset: 1px; }

.is-portaal .woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: var(--is-sp-2); font-weight: 500; }
.is-portaal .woocommerce-form__label-for-checkbox input { width: auto; }
.is-portaal .required { color: var(--is-danger); }
.is-portaal fieldset { border: 1px solid var(--is-border); padding: var(--is-sp-4); margin: var(--is-sp-5) 0 0; }
.is-portaal legend { font-family: var(--is-font-display); text-transform: uppercase; letter-spacing: .05em; font-weight: 600; padding: 0 var(--is-sp-2); }

/* ------------------------------------------------------------ inloggen en registreren */

.is-inlog { display: grid; grid-template-columns: 1fr 1fr; gap: var(--is-sp-5); align-items: start; }
@media (max-width: 860px) { .is-inlog { grid-template-columns: 1fr; } }

.is-inlog__waarom { list-style: none; margin: 0 0 var(--is-sp-4); padding: 0; }

.is-inlog__waarom li {
  display: flex;
  align-items: flex-start;
  gap: var(--is-sp-3);
  padding: var(--is-sp-2) 0;
}

.is-inlog__waarom svg {
  width: 17px; height: 17px; flex: none; margin-top: 3px;
  stroke: var(--is-success); fill: none; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round;
}

.is-portaal .woocommerce-LostPassword { margin: var(--is-sp-3) 0 0; font-size: var(--is-fs-sm); }

/* ------------------------------------------------------------ meldingen */

.is-portaal .woocommerce-message,
.is-portaal .woocommerce-info,
.is-portaal .woocommerce-error {
  list-style: none;
  background: var(--is-wit);
  border: 1px solid var(--is-border);
  border-left: 7px solid var(--is-geel);
  padding: var(--is-sp-4);
  margin: 0 0 var(--is-sp-5);
}

.is-portaal .woocommerce-error { border-left-color: var(--is-danger); }
.is-portaal .woocommerce-message { border-left-color: var(--is-success); }

/* ------------------------------------------------------------ lege staat */

.is-leeg { text-align: center; padding: var(--is-sp-8) var(--is-sp-5); }
.is-leeg .is-vorm { margin: 0 auto var(--is-sp-5); }
.is-leeg p { color: var(--is-muted); max-width: 42ch; margin: 0 auto var(--is-sp-5); }

/* ------------------------------------------------------------ paginering */

.is-paginering { display: flex; gap: var(--is-sp-3); margin-top: var(--is-sp-5); }

/* ------------------------------------------------------------ fase 3: zakelijk */

.is-veld__uitleg {
  display: block;
  margin-top: var(--is-sp-1);
  color: var(--is-muted);
  font-size: var(--is-fs-xs);
}

.is-portaal fieldset.is-zakelijk { margin-top: var(--is-sp-5); }

/* ------------------------------------------------------------ adressen */

.is-adressen {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--is-sp-5);
  align-items: start;
}

@media (max-width: 860px) {
  .is-adressen { grid-template-columns: 1fr; }
}

.is-adres {
  font-style: normal;
  line-height: 1.6;
  margin: 0 0 var(--is-sp-4);
}

.is-adresboek {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--is-sp-4);
  margin-bottom: var(--is-sp-5);
}

.is-adresboek__item {
  border: 1px solid var(--is-border);
  padding: var(--is-sp-4);
  display: flex;
  flex-direction: column;
}

.is-adresboek__item h3 {
  font-family: var(--is-font-display);
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 var(--is-sp-2);
}

/* De naam van het adres krijgt de schrikstreep in het klein: hetzelfde motief,
   maar zo dat het de kaart niet overstemt. */
.is-adresboek__item h3::after {
  content: "";
  display: block;
  width: 40px;
  height: 4px;
  margin-top: 6px;
  background: var(--is-schrikstreep);
}

.is-adresboek__item .is-adres { flex: 1; }

.is-adresboek__acties {
  display: flex;
  flex-wrap: wrap;
  gap: var(--is-sp-2);
  align-items: center;
}

.is-adresboek__acties form { margin: 0; }

.is-adresboek__acties .is-knop {
  padding: var(--is-sp-2) var(--is-sp-3);
  font-size: 13px;
}

.is-knop--weg {
  border-color: var(--is-border);
  color: var(--is-danger);
}

.is-knop--weg:hover {
  background: var(--is-danger);
  border-color: var(--is-danger);
  color: var(--is-wit);
}

.is-adresformulier {
  border-top: 2px solid var(--is-zwart);
  padding-top: var(--is-sp-5);
}

.is-adresformulier h3 {
  font-family: var(--is-font-display);
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0 0 var(--is-sp-4);
}

/* Twee kolommen voor de korte velden; de rest over de volle breedte. */
@media (min-width: 620px) {
  .is-adresformulier {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 var(--is-sp-4);
  }
  .is-adresformulier h3,
  .is-adresformulier > p:last-of-type { grid-column: 1 / -1; }
}

.is-melding {
  background: var(--is-wit);
  border: 1px solid var(--is-border);
  border-left: 7px solid var(--is-success);
  padding: var(--is-sp-4);
  margin-bottom: var(--is-sp-5);
}

.is-melding--fout { border-left-color: var(--is-danger); }

/* ------------------------------------------------------------ bestellijst op telefoonformaat

   Een tabel van vijf kolommen past niet op 375px. Hem laten schuiven binnen de
   kaart is geen oplossing: .is-kaart heeft overflow-x:hidden, dus het bedrag
   werd definitief afgesneden in plaats van bereikbaar — en de paginatoets bleef
   groen omdat de pagina zelf niet meer horizontaal scrolde.

   Onder 600px wordt elke rij daarom een kaartje: ordernummer en bedrag naast
   elkaar bovenaan, status eronder. Het bedrag is wat men het eerst zoekt. */

@media (max-width: 600px) {
  .is-orders,
  .is-orders tbody,
  .is-orders tr,
  .is-orders td {
    display: block;
    width: 100%;
  }

  .is-orders thead { display: none; }

  .is-orders tr {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--is-sp-2) var(--is-sp-3);
    align-items: start;
    padding: var(--is-sp-4);
    border-bottom: 1px solid var(--is-border);
  }

  .is-orders tr:last-child { border-bottom: 0; }

  .is-orders td {
    padding: 0;
    border: 0;
  }

  /* Bestelling linksboven, bedrag rechts ernaast, status over de volle breedte. */
  .is-orders td:first-child { grid-column: 1; grid-row: 1; }

  .is-orders td:last-child {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
    font-size: var(--is-fs-md);
  }

  .is-orders td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }

  /* In kaartvorm is er wél ruimte voor de besteldatum en het inkoopnummer;
     die staan in tabelvorm onder .is-verbergklein verborgen. Hier zetten we ze
     bewust terug, naast elkaar op de onderste regel. */
  .is-orders td.is-verbergklein {
    display: block;
    grid-row: 3;
    font-size: var(--is-fs-sm);
    color: var(--is-muted);
  }

  .is-orders td.is-verbergklein:nth-child(3) { grid-column: 1; }
  .is-orders td.is-verbergklein:nth-child(4) { grid-column: 2; text-align: right; }

  .is-balk { width: 100%; max-width: 180px; }

  /* De minimumbreedte hoort bij de tabelweergave; in kaartvorm veroorzaakt hij
     alleen overloop. */
  .is-orders__kern { min-width: 0; gap: var(--is-sp-3); }

  /* Een kleiner pictogram laat meer ruimte over voor de omschrijving. */
  .is-orders__kern .is-vorm { width: 34px; height: 34px; }
  .is-orders__kern .is-vorm--verbod { border-width: 5px; }
  .is-orders__kern .is-vorm--verbod::after { height: 34px; width: 5px; }
  .is-orders__kern .is-vorm--waarschuwing::after { font-size: 15px; margin-top: 8px; }
  .is-orders__kern .is-vorm--redding::after { width: 12px; height: 12px; margin-left: -4px; }

  /* Twee regels omschrijving is genoeg; de rest staat op de detailpagina. */
  .is-orders__wat {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

/* ------------------------------------------------------------ fase 5: offertes */

.is-offerte__kop {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--is-sp-4);
  flex-wrap: wrap;
  margin-bottom: var(--is-sp-4);
}

.is-offerte__kop h2 { margin: 0 0 2px; }
.is-offerte__kop p { margin: 0; }

.is-offertestatus {
  font-family: var(--is-font-display);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 14px;
  font-weight: 600;
  padding: 3px var(--is-sp-3);
  white-space: nowrap;
  background: var(--is-surface-2);
  color: var(--is-text);
}

.is-offertestatus--uitgebracht { background: var(--is-geel); color: var(--is-zwart); }
.is-offertestatus--geaccepteerd { background: var(--is-success); color: var(--is-wit); }
.is-offertestatus--afgewezen,
.is-offertestatus--verlopen { background: var(--is-surface-2); color: var(--is-muted); }

/* De prijsopgave is waar het om draait; die krijgt de schrikstreep. */
.is-offerte__prijs {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--is-sp-5);
  flex-wrap: wrap;
  border-top: 7px solid transparent;
  border-image: repeating-linear-gradient(45deg, var(--is-geel) 0 9px, var(--is-zwart) 9px 18px) 7;
  padding-top: var(--is-sp-4);
  margin-top: var(--is-sp-4);
}

.is-offerte__label {
  display: block;
  font-family: var(--is-font-display);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .85rem;
  color: var(--is-muted);
}

.is-offerte__bedrag {
  display: block;
  font-family: var(--is-font-display);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.1;
}

.is-offerte__toelichting {
  margin: var(--is-sp-4) 0 0;
  padding: var(--is-sp-4);
  background: var(--is-surface);
  border-left: 4px solid var(--is-border-strong);
}

/* Een verlopen offerte hoort niet meer uit te nodigen. */
.is-offerte--verlopen .is-offerte__bedrag { color: var(--is-muted); }

/* ------------------------------------------------------------ toegankelijkheid

   Tekst die alleen voor een schermlezer bestaat. Nodig omdat de ISO-vormen en
   het vinkje in de statusroute hun betekenis uit vorm en kleur halen; zonder
   deze tekst gaat die informatie verloren voor wie het scherm niet ziet. */

.is-verborgen {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Een tabblad dat precies op de rand van de schuivende balk ligt, wordt door de
   browser niet in beeld gescrold: dat gebeurt alleen bij volledig onzichtbare
   elementen. Met een schuifmarge komt het bij toetsenbordfocus wél vrij. */
@media (max-width: 860px) {
  .woocommerce-MyAccount-navigation li { scroll-margin-inline: var(--is-sp-6); }
}

/* ------------------------------------------------------------ fase 6: bestanden */

.is-bestanden { list-style: none; margin: 0; padding: 0; }

.is-bestand {
  display: flex;
  align-items: center;
  gap: var(--is-sp-4);
  padding: var(--is-sp-4) 0;
  border-bottom: 1px solid var(--is-border);
}

.is-bestand:last-child { border-bottom: 0; }
.is-bestand:first-child { padding-top: 0; }

/* De extensie als etiket: een vakman herkent zijn bestand aan het type. */
.is-bestand__type {
  flex: none;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  background: var(--is-zwart);
  color: var(--is-geel);
  font-family: var(--is-font-display);
  font-weight: 700;
  font-size: .95rem;
  letter-spacing: .04em;
}

.is-bestand__kern { flex: 1; min-width: 0; }

.is-bestand__naam {
  display: block;
  font-weight: 600;
  word-break: break-word;
}

.is-bestand__kern .is-zacht { display: block; }
.is-bestand form { margin: 0; }

.is-portaal input[type="file"] {
  width: 100%;
  border: 1px dashed var(--is-border-strong);
  background: var(--is-wit);
  padding: var(--is-sp-4);
  font: inherit;
}

@media (max-width: 600px) {
  .is-bestand { flex-wrap: wrap; }
  .is-bestand__kern { flex-basis: calc(100% - 52px - var(--is-sp-4)); }
  .is-bestand form { flex-basis: 100%; }
}

/* Inloggen en account aanmaken: velden over de volle breedte, labels erboven */
.is-inlog{display:grid;grid-template-columns:1fr 1fr;gap:var(--is-sp-5);align-items:start}
@media(max-width:820px){.is-inlog{grid-template-columns:1fr}}
.is-inlog .is-kaart{height:100%}
.woocommerce-form-login .form-row,.woocommerce-form-register .form-row,.woocommerce-form-login .woocommerce-form-row,.woocommerce-form-register .woocommerce-form-row{margin:0 0 var(--is-sp-4)}
.woocommerce-form-login label,.woocommerce-form-register label{display:block;font-weight:600;font-size:var(--is-fs-sm);margin-bottom:6px}
.woocommerce-form-login .input-text,.woocommerce-form-register .input-text,
.woocommerce-form-login .woocommerce-Input,.woocommerce-form-register .woocommerce-Input{display:block;width:100%;box-sizing:border-box;height:46px;padding:0 14px;border:1px solid var(--is-border-veld);border-radius:var(--is-radius);background:var(--is-wit);font:inherit}
.woocommerce-form-login .input-text:focus,.woocommerce-form-register .input-text:focus{outline:none;border-color:var(--is-zwart);box-shadow:0 0 0 3px rgba(252,192,0,.35)}
.woocommerce-form-login .password-input,.woocommerce-form-register .password-input{display:block;width:100%;position:relative}
.woocommerce-form-login .show-password-input,.woocommerce-form-register .show-password-input{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;cursor:pointer}
.woocommerce-form-login__rememberme{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:var(--is-fs-sm);margin:0 0 var(--is-sp-4)}
.woocommerce-form-login__rememberme input{width:16px;height:16px;margin:0}
.woocommerce-form-login .button,.woocommerce-form-register .button{display:inline-flex;align-items:center;justify-content:center;width:100%;height:50px;border:2px solid var(--is-primary);background:var(--is-primary);color:var(--is-inverse);border-radius:var(--is-radius);font-family:var(--is-font-display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.woocommerce-form-login .button:hover,.woocommerce-form-register .button:hover{background:var(--is-primary-hover);border-color:var(--is-primary-hover)}
.woocommerce-form-register .button{background:var(--is-inverse);border-color:var(--is-inverse);color:var(--is-wit)}
.woocommerce-form-register .button:hover{background:var(--is-donkergrijs);border-color:var(--is-donkergrijs)}
.woocommerce-LostPassword{margin:var(--is-sp-3) 0 0;font-size:var(--is-fs-sm)}
.is-inlog__waarom{list-style:none;margin:0 0 var(--is-sp-5);padding:0;display:grid;gap:10px}
.is-inlog__waarom li{display:flex;gap:10px;align-items:flex-start}
.is-inlog__waarom svg{width:18px;height:18px;flex:none;color:var(--is-inverse);background:var(--is-primary);border-radius:50%;padding:3px;margin-top:1px}
.woocommerce-form-register .is-zacht{margin:var(--is-sp-3) 0 0;font-size:var(--is-fs-xs);color:var(--is-muted)}
/* Portaal: bredere zijbalk met horizontale menu-items, knoppen op eigen breedte */
.woocommerce-MyAccount-navigation{width:230px;padding:var(--is-sp-3) 0}
.woocommerce-MyAccount-navigation a{flex-direction:row;align-items:center;gap:12px;padding:11px 18px;text-align:left;text-transform:none;letter-spacing:0;font-size:15px;font-weight:600;line-height:1.2;border-left-width:3px}
.woocommerce-MyAccount-navigation svg{width:20px;height:20px;flex:none;display:block}
.woocommerce-MyAccount-navigation a span{display:block;line-height:1;padding-top:1px}
.woocommerce-MyAccount-navigation li.is-active a{font-weight:700}
/* Het avatarblok van Gravatar toont de inlognaam (een reeks tekens), niet de naam. Weg ermee. */
.woocommerce-MyAccount-navigation > :not(ul){display:none}
.woocommerce-MyAccount-navigation > :not(ul){padding:0 18px var(--is-sp-3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--is-fs-sm);color:var(--is-muted);text-align:left}
.woocommerce-MyAccount-navigation > :not(ul) img{width:40px;height:40px;border-radius:50%;display:block;margin:0 0 8px}
.is-portaal .is-knop{width:auto;display:inline-flex;border-radius:var(--is-radius)}
.is-portaal .is-kaart__body > .is-knop{margin-top:var(--is-sp-2)}
.is-portaal .is-kaart{border-radius:var(--is-radius-lg)}
.is-portaal__inhoud{padding:var(--is-sp-5)}
.is-portaal__titel{margin-bottom:var(--is-sp-4)}
@media(max-width:860px){.woocommerce-MyAccount-navigation{width:auto}.woocommerce-MyAccount-navigation a{flex-direction:column;gap:5px;padding:var(--is-sp-3) var(--is-sp-2);font-size:12px;text-align:center}}
/* Wachtwoord vergeten en wachtwoord instellen: als kaart, velden over de volle breedte */
.woocommerce-ResetPassword,.woocommerce-form.lost_reset_password{max-width:520px;margin:var(--is-sp-4) 0 var(--is-sp-7);padding:var(--is-sp-5);border:1px solid var(--is-border);border-radius:var(--is-radius-lg);background:var(--is-wit)}
.woocommerce-ResetPassword p:first-child{margin-top:0;color:var(--is-muted)}
.woocommerce-ResetPassword .form-row{margin:0 0 var(--is-sp-4);float:none;width:100%}
.woocommerce-ResetPassword label{display:block;font-weight:600;font-size:var(--is-fs-sm);margin-bottom:6px}
.woocommerce-ResetPassword .input-text{display:block;width:100%;box-sizing:border-box;height:46px;padding:0 14px;border:1px solid var(--is-border-veld);border-radius:var(--is-radius);background:var(--is-wit);font:inherit}
.woocommerce-ResetPassword .input-text:focus{outline:none;border-color:var(--is-zwart);box-shadow:0 0 0 3px rgba(252,192,0,.35)}
.woocommerce-ResetPassword .button{display:inline-flex;align-items:center;justify-content:center;width:100%;height:50px;border:2px solid var(--is-primary);background:var(--is-primary);color:var(--is-inverse);border-radius:var(--is-radius);font-family:var(--is-font-display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.woocommerce-ResetPassword .button:hover{background:var(--is-primary-hover);border-color:var(--is-primary-hover)}
.woocommerce-ResetPassword .clear{display:none}

/* Mijn gegevens: weergavenaam verborgen (volgt de naam), wachtwoordoogjes netjes in het veld */
.woocommerce-EditAccountForm p.form-row:has(#account_display_name){display:none}
.woocommerce-EditAccountForm .password-input{display:block;width:100%;position:relative}
.woocommerce-EditAccountForm .show-password-input{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;cursor:pointer;margin:0}
.woocommerce-EditAccountForm .show-password-input::after{display:none}
.woocommerce-EditAccountForm .is-veld__uitleg{display:block;margin-top:6px;font-size:var(--is-fs-xs);color:var(--is-muted)}
/* Lege staat: pictogram in gele cirkel in plaats van een zwarte bol */
.is-leeg__icoon{display:grid;place-items:center;width:72px;height:72px;margin:0 auto var(--is-sp-4);border-radius:50%;background:var(--is-primary);color:var(--is-zwart)}
.is-leeg__icoon svg{width:34px;height:34px;stroke-width:1.8}
.is-registratie__naam{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.is-registratie__naam .form-row{float:none;width:auto;margin:0 0 var(--is-sp-4)}
@media(max-width:480px){.is-registratie__naam{grid-template-columns:1fr}}
/* woo.css zet `li a` op display:block met hogere specificiteit; daardoor stond
   het icoon boven het label. Hier met dezelfde specificiteit alsnog een rij. */
body.woocommerce-account .woocommerce-MyAccount-navigation li a{display:flex;flex-direction:row;align-items:center;gap:12px;padding:11px 18px;border-bottom:0}
@media(max-width:860px){body.woocommerce-account .woocommerce-MyAccount-navigation li a{flex-direction:column;gap:5px;padding:var(--is-sp-3) var(--is-sp-2)}}

/* Wachtwoord vergeten / nieuw wachtwoord instellen / bevestiging: zelfde velden als het inlogformulier. */
.is-wachtwoordpagina{max-width:560px}
.is-wachtwoordpagina h2{margin-top:0}
.woocommerce-ResetPassword .woocommerce-Input{display:block;width:100%;box-sizing:border-box;height:46px;padding:0 14px;border:1px solid var(--is-border-veld);border-radius:var(--is-radius);background:var(--is-wit);font:inherit}
.woocommerce-ResetPassword .input-text:focus{outline:none;border-color:var(--is-zwart);box-shadow:0 0 0 3px rgba(252,192,0,.35)}
.woocommerce-ResetPassword .password-input{display:block;width:100%;position:relative}
.woocommerce-ResetPassword .show-password-input{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;cursor:pointer;margin:0}
.woocommerce-form-login .show-password-input::after,.woocommerce-form-register .show-password-input::after,.woocommerce-ResetPassword .show-password-input::after{display:none}

/* Wachtwoord tonen/verbergen: oog-icoon in plaats van een leeg grijs blokje. */
.woocommerce-form-login .show-password-input,.woocommerce-form-register .show-password-input,.woocommerce-ResetPassword .show-password-input,.woocommerce-EditAccountForm .show-password-input{border:0;padding:0;background-color:var(--is-muted);-webkit-mask:var(--is-oog) center/20px 20px no-repeat;mask:var(--is-oog) center/20px 20px no-repeat;--is-oog:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
.show-password-input.display-password{--is-oog:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.2A10.4 10.4 0 0 1 12 5c6.4 0 10 7 10 7a17 17 0 0 1-3.2 4.1M6.6 6.6C3.9 8.4 2 12 2 12s3.6 7 10 7a9.7 9.7 0 0 0 5.4-1.6'/%3E%3C/svg%3E")}
.show-password-input:hover,.show-password-input:focus-visible{background-color:var(--is-zwart)}

/* Orderregel op een smal scherm: prijs onder de naam in plaats van buiten de kaart. */
.is-regel__naam{min-width:0;overflow-wrap:anywhere}
@media (max-width:520px){
	.is-regel{gap:var(--is-sp-3)}
	.is-regel__kop{flex-direction:column;align-items:flex-start;gap:var(--is-sp-1)}
}


/* ------------------------------------------------------------ bestellingen: werkbalk en brede tabel (26 sep 2026) */

.is-orders__balk {
  display: flex;
  flex-wrap: wrap;
  gap: var(--is-sp-2);
  align-items: center;
  margin: 0 0 var(--is-sp-4);
}
.is-orders__zoek {
  flex: 1 1 260px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  background: var(--is-wit);
  border: 1px solid var(--is-border);
  border-radius: 6px;
}
.is-orders__zoek svg { width: 18px; height: 18px; stroke: var(--is-muted); fill: none; stroke-width: 1.8; flex: none; }
.is-orders__zoek input {
  flex: 1;
  min-width: 0;
  border: 0;
  padding: 10px 0;
  background: transparent;
  font: inherit;
}
.is-orders__zoek input:focus { outline: none; }
.is-orders__zoek:focus-within { border-color: var(--is-zwart); box-shadow: 0 0 0 3px rgba(255, 196, 0, .35); }
.is-orders__filter select {
  padding: 10px 12px;
  border: 1px solid var(--is-border);
  border-radius: 6px;
  background: var(--is-wit);
  font: inherit;
}
.is-orders__wis { font-size: var(--is-fs-sm); color: var(--is-muted); }

.is-kaart--tabel { overflow-x: auto; }
.is-orders--breed th:nth-child(2) { min-width: 150px; }
.is-orders__thumb {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  overflow: hidden;
  background: var(--is-surface-2);
  border: 1px solid var(--is-border);
  display: grid;
  place-items: center;
}
.is-orders__thumb img, .is-orders__afb { width: 100%; height: 100%; object-fit: contain; display: block; }
.is-orders__docs { text-align: right; }
.is-orders__docs a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 8px;
  color: var(--is-muted);
  text-decoration: none;
}
.is-orders__docs a:hover { color: var(--is-text); }
.is-orders__docs svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.7; }
.is-balk--stop i { background: var(--is-error, #b32d2e); }
.is-paginering { align-items: center; }
.is-paginering__stand { color: var(--is-muted); font-size: var(--is-fs-sm); }
.is-knop--klein { padding: 6px 10px; font-size: var(--is-fs-sm); display: inline-flex; align-items: center; gap: 6px; }
.is-verbergklein--omgekeerd { display: none; }
@media (max-width: 900px) {
  .is-verbergklein--omgekeerd { display: block; }
  .is-orders__balk .is-orders__filter { flex: 1 1 45%; }
  .is-orders__balk .is-orders__filter select { width: 100%; }
}

/* Navigatie: iets ruimer, zoals een inkoopportaal */
.woocommerce-MyAccount-navigation { width: 132px; }
.woocommerce-MyAccount-navigation a { font-size: 12.5px; letter-spacing: .03em; }


/* Brede bestellingentabel in kaartvorm op een smal scherm: bedrag rechtsboven,
   status over de volle breedte, daaronder besteld/referentie en levering/documenten. */
@media (max-width: 900px) {
  .is-orders--breed td:last-child { grid-column: 2; grid-row: 4; text-align: right; font-size: var(--is-fs-sm); }
  .is-orders--breed td:nth-child(6) { grid-column: 2; grid-row: 1; text-align: right; font-size: var(--is-fs-md); }
  .is-orders--breed td.is-verbergklein:nth-child(3) { grid-column: 1; grid-row: 4; }
  .is-orders--breed td.is-verbergklein:nth-child(4) { grid-column: 1; grid-row: 3; text-align: left; }
  .is-orders--breed td.is-verbergklein:nth-child(5) { grid-column: 2; grid-row: 3; text-align: right; }
  .is-orders--breed td.is-verbergklein:nth-child(7) { display: block; grid-column: 2; grid-row: 4; text-align: right; }
  .is-orders--breed .is-orders__docs a { margin-left: 10px; }
  .is-orders--breed td.is-verbergklein:nth-child(3):empty { display: none; }
  .is-orders__thumb { width: 36px; height: 36px; }
  .is-orders--breed td { min-width: 0; overflow-wrap: anywhere; }
}