/* Forms outside the product page (lesson inquiry, value voucher) laid out like the course
   purchase form: rows between black lines from .kurzy-row (frontend.css), fields and
   button with the same sizes as the attendee form. */

.fr-formular,
.lekce-cenik{
  --fr-sipka:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* The Bricks block around the shortcode aligns its children to the start. */
.brxe-shortcode:has(> .fr-formular){
  align-self:stretch;
  width:100%;
}

.fr-formular{
  position:relative;
  /* Same width as the course purchase form */
  max-width:952px;
}

.fr-formular > .fr-radek:first-child{
  border-top:2px solid var(--bricks-color-eqcrjq);
}

.fr-formular [hidden]{
  display:none !important;
}

.fr-formular .kurzy-row__label{
  margin:0;
  padding:0;
  color:var(--bricks-color-eqcrjq);
  font-size:1.1em;
  font-weight:700;
}

/* Selects look like the "Vyber si" toggle of the term selector */
.fr-formular .fr-vyber{
  display:flex;
  justify-content:flex-end;
  min-width:0;
}

.fr-formular .fr-vyber select{
  appearance:none;
  -webkit-appearance:none;
  width:auto;
  max-width:100%;
  height:auto;
  margin:0;
  padding:6px 20px 6px 0;
  border:0;
  border-radius:0;
  background:transparent var(--fr-sipka) no-repeat right center / 12px 8px;
  box-shadow:none;
  color:var(--bricks-color-eqcrjq);
  font-family:inherit;
  font-size:1.05em;
  font-weight:600;
  line-height:1.15;
  text-align:right;
  text-align-last:right;
  text-overflow:ellipsis;
  cursor:pointer;
}

.fr-formular .fr-vyber select:hover{
  opacity:.7;
}

.fr-formular .fr-vyber select.has-value{
  font-style:italic;
  font-weight:700;
}

.fr-formular .fr-vyber select:focus-visible{
  outline:2px solid rgba(0,0,0,.7);
  outline-offset:2px;
}

/* Contact and text fields like the attendee fields */
.fr-pole{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  padding:20px 0 18px;
}

.fr-pole__polozka,
.fr-formular label.fr-pole__polozka{
  display:block;
  margin:0;
  padding:0;
  color:var(--bricks-color-eqcrjq);
  font-size:.9em;
  font-weight:400;
  line-height:1.55;
}

.fr-pole__polozka--cela{
  grid-column:1 / -1;
}

.fr-formular .fr-pole input:not([type="checkbox"]),
.fr-formular .fr-pole textarea{
  display:block;
  width:100%;
  height:42px;
  margin:6px 0 0;
  padding:8px 10px;
  border:1px solid var(--bricks-color-eqcrjq);
  border-radius:0;
  background:var(--bricks-color-ygrnej);
  box-shadow:none;
  box-sizing:border-box;
  color:var(--bricks-color-eqcrjq);
  font-family:inherit;
  font-size:max(16px, 1em);
  line-height:1.5;
}

.fr-formular .fr-pole textarea{
  height:auto;
  min-height:110px;
  resize:vertical;
}

.fr-formular .fr-pole input:focus,
.fr-formular .fr-pole textarea:focus,
.fr-formular .fr-volba input:focus-visible{
  outline:2px solid rgba(0,0,0,.7);
  outline-offset:1px;
}

.fr-formular .fr-tlacitko{
  display:inline-block;
  margin:16px 0 0;
  padding:18px 28px;
  border:0;
  border-radius:0;
  background:var(--bricks-color-eqcrjq);
  color:var(--bricks-color-ygrnej);
  font-family:inherit;
  font-size:1em;
  font-weight:700;
  line-height:1.15;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
}

.fr-formular .fr-tlacitko:hover{
  opacity:.85;
}

.fr-formular .fr-tlacitko:disabled{
  opacity:.5;
  cursor:default;
}

.fr-formular.is-odeslano .fr-tlacitko{
  display:none;
}

.fr-hlaska{
  margin:16px 0 0;
  font-weight:700;
}

.fr-hlaska.is-chyba{
  color:#c0392b;
}

.fr-past{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* Value voucher: own value stepper like the "Kolik chceš míst" row, voucher type and
   greeting like the voucher choice of an attendee, total like "Cena celkem". */
.fr-krokovac{
  display:inline-flex;
  align-items:center;
  gap:24px;
}

.fr-formular .fr-krokovac__krok{
  min-width:0;
  height:auto;
  margin:0;
  padding:0 6px;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  color:var(--bricks-color-eqcrjq);
  font-family:inherit;
  font-size:1.1em;
  font-weight:700;
  line-height:1.3;
  cursor:pointer;
}

.fr-formular .fr-krokovac__krok:hover{
  opacity:.6;
}

.fr-krokovac__hodnota{
  display:inline-flex;
  align-items:baseline;
  font-size:1.1em;
  font-weight:700;
  line-height:1.3;
  white-space:nowrap;
}

/* Typed own value: the number as in the stepper, the underline says it can be typed. */
.fr-formular .fr-krokovac__hodnota input{
  width:4.2em;
  height:auto;
  margin:0;
  padding:0 0 2px;
  border:0;
  border-bottom:2px solid var(--bricks-color-eqcrjq);
  border-radius:0;
  background:none;
  box-shadow:none;
  color:var(--bricks-color-eqcrjq);
  font-family:inherit;
  font-size:max(16px, 1em);
  font-weight:700;
  line-height:1.3;
  text-align:right;
}

.fr-formular .fr-krokovac__hodnota input:focus{
  outline:2px solid rgba(0,0,0,.7);
  outline-offset:3px;
}

.fr-formular .fr-radek--jina{
  flex-wrap:wrap;
  row-gap:12px;
}

.fr-rychle-volby{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 120px));
  gap:8px;
  flex-basis:100%;
}

.fr-formular .fr-rychla-volba{
  min-width:0;
  height:auto;
  margin:0;
  padding:8px 4px;
  border:0;
  border-radius:0;
  background:var(--bricks-color-jxhqau, #f8f7fa);
  white-space:nowrap;
  box-shadow:none;
  color:var(--bricks-color-eqcrjq);
  font-family:inherit;
  font-size:.9em;
  font-weight:700;
  line-height:1.3;
  cursor:pointer;
}

.fr-formular .fr-rychla-volba[aria-pressed="true"]{
  background:var(--bricks-color-eqcrjq);
  color:var(--bricks-color-ygrnej);
}

.fr-formular .fr-rychla-volba:focus-visible{
  outline:2px solid rgba(0,0,0,.7);
  outline-offset:1px;
}

.fr-radek__pozn{
  flex-basis:100%;
  font-size:13px;
  line-height:1.4;
}

.fr-formular .fr-volby{
  display:flex;
  flex-direction:column;
  gap:var(--space-1);
  min-width:0;
  margin:0;
  padding:16px 0;
  border:0;
  border-bottom:2px solid var(--bricks-color-eqcrjq);
}

.fr-formular .fr-volby > legend{
  float:left;
  width:100%;
  margin:0 0 var(--space-1);
}

.fr-formular .fr-volba,
.fr-formular .fr-zaskrtnuti{
  display:flex;
  /* The square stays on the first line when the label wraps. */
  align-items:flex-start;
  gap:10px;
  margin:0;
  padding:0;
  color:var(--bricks-color-eqcrjq);
  font-size:1em;
  font-weight:400;
  line-height:1.3;
  cursor:pointer;
}

.fr-formular .fr-volba input[type="radio"],
.fr-formular .fr-zaskrtnuti input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  flex-shrink:0;
  width:16px;
  min-width:16px;
  height:16px;
  margin:calc((1.3em - 16px) / 2) 0 0;
  padding:0;
  border:2px solid var(--bricks-color-eqcrjq);
  border-radius:0;
  background:var(--bricks-color-ygrnej);
  box-shadow:none;
  cursor:pointer;
}

.fr-formular .fr-volba input[type="radio"]:checked,
.fr-formular .fr-zaskrtnuti input[type="checkbox"]:checked{
  background:var(--bricks-color-eqcrjq);
  box-shadow:inset 0 0 0 2px var(--bricks-color-ygrnej);
}

.fr-pole--osloveni{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  align-items:end;
}

.fr-formular .fr-pole--osloveni .fr-zaskrtnuti{
  grid-column:2;
  align-items:center;
  min-height:42px;
  font-size:13px;
}

.fr-formular .fr-pole--osloveni .fr-zaskrtnuti input[type="checkbox"]{
  margin-top:0;
}

.fr-formular .fr-radek--celkem{
  margin-top:24px;
  border-top:2px solid var(--bricks-color-eqcrjq);
  border-bottom:0;
}

.fr-formular .fr-radek--celkem .kurzy-row__value{
  font-size:1.5em;
}

.fr-oznameni{
  margin:0 0 var(--space-2);
}

/* WooCommerce focuses the message, the focus ring then hugged the text. */
.fr-oznameni .woocommerce-message,
.fr-oznameni .woocommerce-error{
  margin:0;
  padding:var(--space-1) var(--space-2);
  background:var(--bricks-color-jxhqau, #f8f7fa);
  list-style:none;
}

.fr-oznameni .woocommerce-message:focus,
.fr-oznameni .woocommerce-error:focus{
  outline:none;
}

.fr-oznameni .wc-forward{
  margin-left:.3em;
  color:inherit;
  font-weight:700;
  text-decoration:underline;
}

/* Lesson configurator on the Individuální lekce page: own container in the section
   with the two tiles, spaced like a section of its own. */
.lekce-sekce{
  margin-top:120px;
}

/* Inquiry and gift buttons side by side under the price, each opens its part below. */
.lekce-tlacitka{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}

.fr-formular .lekce-tlacitka .fr-tlacitko[aria-expanded="false"]{
  background:var(--bricks-color-ygrnej);
  box-shadow:inset 0 0 0 2px var(--bricks-color-eqcrjq);
  color:var(--bricks-color-eqcrjq);
}

.fr-formular .lekce-tlacitka:not(:has([aria-expanded="true"])) .fr-tlacitko{
  background:var(--bricks-color-eqcrjq);
  box-shadow:none;
  color:var(--bricks-color-ygrnej);
}

/* Places of the chosen group under the Lokalita row, for information only (revision #337). */
.fr-formular .lekce-mista,
.fr-formular .poukaz-kemp{
  margin:0;
  padding:12px 0;
  border-bottom:2px solid var(--bricks-color-eqcrjq);
  color:var(--bricks-color-eqcrjq);
  font-size:.9em;
  line-height:1.55;
  text-align:right;
}

.lekce-cast{
  margin-top:24px;
  border-top:2px solid var(--bricks-color-eqcrjq);
}

/* Inputs on one line even when a label wraps. */
.fr-pole--dole{
  align-items:end;
}

.fr-pole__napoveda{
  opacity:.6;
}

.fr-formular .fr-volby--mrizka{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:var(--space-1) 14px;
}

.fr-formular .fr-volby--mrizka > legend{
  float:none;
  grid-column:1 / -1;
  padding:0;
}

.fr-formular .fr-volby--radek{
  flex-direction:row;
  flex-wrap:wrap;
  column-gap:28px;
}

/* Order form on the hidden page: date and start side by side, attendees as on a camp. */
.fr-formular .lekce-termin{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  border-bottom:2px solid var(--bricks-color-eqcrjq);
}

.lekce-ucastnici + .fr-radek--celkem{
  margin-top:0;
}

@media (max-width:767px){
  .lekce-sekce{
    margin-top:72px;
  }

  .fr-pole,
  .fr-pole--osloveni,
  .fr-formular .fr-volby--mrizka{
    grid-template-columns:minmax(0, 1fr);
  }

  .lekce-tlacitka{
    flex-direction:column;
    align-items:flex-start;
  }

  .fr-formular .fr-pole--osloveni .fr-zaskrtnuti{
    grid-column:1;
    min-height:0;
  }
}

/* Phones: label above the choice, as the term selector of the course form does. */
@media (max-width:520px){
  .fr-formular .fr-radek:has(> .fr-vyber){
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }

  .fr-formular .fr-vyber{
    justify-content:flex-start;
    width:100%;
  }

  .fr-formular .lekce-mista,
  .fr-formular .poukaz-kemp{
    text-align:left;
  }

  /* Every select of a form is as wide as the form, so the chevrons line up on the right. */
  .fr-formular .fr-vyber select{
    width:100%;
    text-align:left;
    text-align-last:left;
  }
}

/* INDIVIDUÁLNÍ LEKCE in the Ceník panel (design: title to the selects kóta 1, between
   the selects and the text inset half of kóta 1, text centred in the white box). */
.lekce-cenik__volby{
  display:grid;
  grid-template-columns:minmax(0, max-content);
  row-gap:calc(var(--space-1) / 2);
  margin-top:var(--space-1);
}

.lekce-cenik .lekce-cenik__pole{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  height:auto;
  margin:0;
  padding:calc(var(--space-1) / 2) calc(var(--space-1) + 12px + var(--space-1) / 2) calc(var(--space-1) / 2) calc(var(--space-1) / 2);
  border:0;
  border-radius:0;
  background:var(--bricks-color-ygrnej) var(--fr-sipka) no-repeat right calc(var(--space-1) / 2) center / 12px 8px;
  box-shadow:none;
  color:var(--bricks-color-eqcrjq);
  font-family:inherit;
  font-size:1.8rem;
  font-weight:400;
  line-height:1.333;
  cursor:pointer;
}

.lekce-cenik .lekce-cenik__pole:focus-visible{
  outline:2px solid var(--bricks-color-eqcrjq);
  outline-offset:1px;
}