@charset "UTF-8"!important;
/* =========================================================
   iBrill.sk – Objednávkový formulár na svadobné obrúčky
   stránka: body.page-22 (#form_user, form theForm53)
   ========================================================= */

body.page-22 #form_user {
  --ib-gold: #d4a34d!important;
  --ib-gold-dark: #b98a36!important;
  --ib-gold-soft: #fbf6ea!important;
  --ib-line: #e9e1d0!important;
  --ib-text: #1d1d1b!important;
  --ib-muted: #6f6a60!important;
  text-align: left!important;
}

/* nadpis na střed */
html body.page-22 #page #incenterpage .title_page {
  display: block!important;
  text-align: center !important;
}

/* omezení šířky – na střed */
html body.page-22 #page #form_user {
  max-width: 780px!important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* karta */
html body.page-22 #page #form_user .spc {
  position: relative!important;
  background: #fff!important;
  border: 1px solid var(--ib-line)!important;
  border-top: 3px solid var(--ib-gold)!important;
  border-radius: 10px!important;
  padding: 36px 40px 40px!important;
  box-shadow: 0 10px 30px rgba(120, 90, 30, .06)!important;
  box-sizing: border-box!important;
}

html body.page-22 #page #form_user form {
  margin: 0!important;
}

/* tabulka -> mřížka */
html body.page-22 #page #form_user table.comments,
html body.page-22 #page #form_user table.comments tbody,
html body.page-22 #page #form_user table.comments tr,
html body.page-22 #page #form_user table.comments td {
  display: block!important;
  float: none!important;
  width: auto!important;
  padding: 0!important;
  margin: 0!important;
  border: 0!important;
  background: none!important;
  text-align: left!important;
}

html body.page-22 #page #form_user table.comments {
  width: 100%!important;
  border-collapse: separate!important;
}

html body.page-22 #page #form_user table.comments tbody {
  display: grid!important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr)!important;
  gap: 22px 24px!important;
}

html body.page-22 #page #form_user table.comments tr {
  grid-column: 1 / -1!important;
}

/* dvojice vedle sebe: pánska + dámska, PSČ + mesto, email + telefón */
html body.page-22 #page #form_user table.comments tr:has([name="pole2"]),
html body.page-22 #page #form_user table.comments tr:has([name="pole3"]),
html body.page-22 #page #form_user table.comments tr:has([name="pole6"]),
html body.page-22 #page #form_user table.comments tr:has([name="pole7"]),
html body.page-22 #page #form_user table.comments tr:has([name="pole8"]),
html body.page-22 #page #form_user table.comments tr:has([name="pole9"]) {
  grid-column: auto!important;
  display: flex!important;
  flex-direction: column!important;
  align-items: stretch!important;
}

/* pole v páru vždy na jedné rovině (popisek zabere zbytek výšky) */
html body.page-22 #page #form_user table.comments tr:has([name="pole2"]) > td:first-child,
html body.page-22 #page #form_user table.comments tr:has([name="pole3"]) > td:first-child,
html body.page-22 #page #form_user table.comments tr:has([name="pole6"]) > td:first-child,
html body.page-22 #page #form_user table.comments tr:has([name="pole7"]) > td:first-child,
html body.page-22 #page #form_user table.comments tr:has([name="pole8"]) > td:first-child,
html body.page-22 #page #form_user table.comments tr:has([name="pole9"]) > td:first-child {
  flex: 1 0 auto!important;
}

/* prázdné buňky */
html body.page-22 #page #form_user table.comments td:empty,
html body.page-22 #page #form_user tr.gdpr-custom-form > td:first-child,
html body.page-22 #page #form_user table.comments tr:last-of-type > td:first-child {
  display: none!important;
}

/* popisky */
html body.page-22 #page #form_user table.comments tr > td:first-child {
  font-size: 14px!important;
  font-weight: 500!important;
  line-height: 1.4!important;
  color: var(--ib-text)!important;
  margin-bottom: 8px!important;
}

/* textová pole */
html body.page-22 #page #form_user input[type="text"] {
  display: block!important;
  width: 100%!important;
  max-width: none!important;
  height: 50px!important;
  padding: 0 16px!important;
  margin: 0!important;
  font-family: inherit!important;
  font-size: 15px!important;
  color: var(--ib-text)!important;
  background: #fff!important;
  border: 1px solid var(--ib-line)!important;
  border-radius: 6px!important;
  box-shadow: none!important;
  box-sizing: border-box!important;
  transition: border-color .2s, box-shadow .2s!important;
}

html body.page-22 #page #form_user textarea {
  display: block!important;
  width: 100%!important;
  max-width: none!important;
  min-height: 110px!important;
  padding: 12px 16px!important;
  margin: 0!important;
  font-family: inherit!important;
  font-size: 15px!important;
  line-height: 1.5!important;
  color: var(--ib-text)!important;
  background: #fff!important;
  border: 1px solid var(--ib-line)!important;
  border-radius: 6px!important;
  box-shadow: none!important;
  box-sizing: border-box!important;
  resize: vertical!important;
  transition: border-color .2s, box-shadow .2s!important;
}

html body.page-22 #page #form_user textarea[name="pole5"] {
  min-height: 80px!important;
  height: 80px!important;
}

html body.page-22 #page #form_user input[type="text"]:hover,
html body.page-22 #page #form_user textarea:hover {
  border-color: #d9cdb3!important;
}

html body.page-22 #page #form_user textarea:focus,
html body.page-22 #page #form_user input[type="text"]:focus {
  outline: none!important;
  border-color: var(--ib-gold)!important;
  box-shadow: 0 0 0 3px rgba(212, 163, 77, .18)!important;
}

/* ---------- GDPR souhlasy ---------- */
html body.page-22 #page #form_user tr.gdpr-custom-form {
  margin-top: -8px!important;
}

html body.page-22 #page #form_user tr:not(.gdpr-custom-form) + tr.gdpr-custom-form {
  padding-top: 22px!important;
  border-top: 1px solid var(--ib-line)!important;
  margin-top: 0!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form > td:last-child {
  display: flex!important;
  align-items: flex-start!important;
  gap: 12px!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form input[type="checkbox"] {
  -webkit-appearance: none!important;
  appearance: none!important;
  flex: 0 0 20px!important;
  align-self: flex-start!important;
  width: 20px !important;
  min-width: 20px!important;
  height: 20px !important;
  min-height: 0!important;
  padding: 0!important;
  margin: 1px 0 0!important;
  border: 1.5px solid #cdbf9f!important;
  border-radius: 4px!important;
  background: #fff center / 12px no-repeat!important;
  cursor: pointer!important;
  transition: background-color .2s, border-color .2s!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form input[type="checkbox"]:hover {
  border-color: var(--ib-gold)!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form input[type="checkbox"]:checked {
  background-color: var(--ib-gold)!important;
  border-color: var(--ib-gold)!important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 5.2 4.3 8.5 11 1.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form input[type="checkbox"]:focus-visible {
  outline: none!important;
  box-shadow: 0 0 0 3px rgba(212, 163, 77, .25)!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form label {
  margin: 0!important;
  font-size: 13.5px!important;
  font-weight: 400!important;
  line-height: 1.55!important;
  text-align: left!important;
  color: var(--ib-muted)!important;
  cursor: pointer!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form label a {
  font-weight: 500!important;
  color: var(--ib-text)!important;
  text-decoration: underline!important;
  text-decoration-color: var(--ib-gold)!important;
  text-underline-offset: 3px!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form label a:hover {
  color: var(--ib-gold-dark)!important;
}

html body.page-22 #page #form_user tr.gdpr-custom-form label strong {
  font-weight: 500!important;
  color: var(--ib-text)!important;
}

html body.page-22 #page #form_user .tip-content {
  display: none!important;
}

/* ---------- Captcha ---------- */
html body.page-22 #page #form_user tr:has(input[name^="captcha"]) {
  padding: 20px 22px!important;
  background: var(--ib-gold-soft)!important;
  border-radius: 8px!important;
}

html body.page-22 #page #form_user tr:has(input[name^="captcha"]) > td:last-child {
  display: flex!important;
  flex-wrap: wrap!important;
  align-items: center!important;
  gap: 12px 16px!important;
}

html body.page-22 #page #form_user tr:has(input[name^="captcha"]) > td:last-child > div {
  float: none !important;
  padding: 0 !important;
}

html body.page-22 #page #form_user tr:has(input[name^="captcha"]) > td:last-child > div:first-child {
  order: 2!important;
  flex: 0 1 220px!important;
}

html body.page-22 #page #form_user tr:has(input[name^="captcha"]) > td:last-child > div:last-child {
  order: 1!important;
  display: flex!important;
  flex-wrap: wrap!important;
  align-items: center!important;
  gap: 10px 14px!important;
  min-width: 0!important;
}

html body.page-22 #page #form_user tr:has(input[name^="captcha"]) br {
  display: none!important;
}

html body.page-22 #page #form_user img[id^="captcha_"] {
  display: block!important;
  height: 50px!important;
  width: auto!important;
  max-width: 100%!important;
  object-fit: contain!important;
  border-radius: 6px!important;
}

html body.page-22 #page #form_user a[id$="_redraw"] {
  display: inline-flex!important;
  align-items: center!important;
  gap: 6px!important;
  font-size: 13px!important;
  font-weight: 500!important;
  color: var(--ib-gold-dark)!important;
  text-decoration: none!important;
  white-space: nowrap!important;
}

html body.page-22 #page #form_user a[id$="_redraw"]::before {
  content: "\f021"!important;
  font-family: FontAwesome!important;
  font-weight: normal!important;
  font-size: 13px!important;
}

html body.page-22 #page #form_user a[id$="_redraw"]:hover {
  color: var(--ib-text)!important;
}

html body.page-22 #page #form_user tr:has(input[name^="captcha"]) input[type="text"] {
  background: #fff!important;
}

/* ---------- Odoslať ---------- */
html body.page-22 #page #form_user table.comments tr:last-of-type {
  padding-top: 4px!important;
}

html body.page-22 #page #form_user #send_btn {
  display: inline-block!important;
  min-width: 220px!important;
  height: auto!important;
  padding: 15px 40px!important;
  margin: 0!important;
  font-family: inherit!important;
  font-size: 15px!important;
  font-weight: 600!important;
  letter-spacing: .04em!important;
  text-transform: uppercase!important;
  color: #fff!important;
  background: var(--ib-gold)!important;
  border: 0!important;
  border-radius: 6px!important;
  box-shadow: 0 6px 16px rgba(212, 163, 77, .3)!important;
  cursor: pointer!important;
  opacity: 1!important;
  transition: background-color .2s, transform .2s, box-shadow .2s!important;
}

html body.page-22 #page #form_user #send_btn:hover {
  background: var(--ib-gold-dark)!important;
  box-shadow: 0 8px 20px rgba(185, 138, 54, .35)!important;
  transform: translateY(-1px)!important;
}

/* ---------- Mobil ---------- */
@media (max-width: 767px) {
  html body.page-22 #page #form_user .spc {
    padding: 24px 18px 26px!important;
    border-radius: 8px!important;
  }

  html body.page-22 #page #form_user table.comments tbody {
    grid-template-columns: minmax(0, 1fr)!important;
    gap: 18px!important;
  }

  html body.page-22 #page #form_user tr:has(input[name^="captcha"]) {
    padding: 16px!important;
  }

  html body.page-22 #page #form_user tr:has(input[name^="captcha"]) > td:last-child > div:first-child {
    flex: 1 1 100%!important;
  }

  html body.page-22 #page #form_user #send_btn {
    width: 100% !important;
    min-width: 0!important;
    padding: 15px 20px !important;
    font-size: 15px !important;
  }
}

/* =========================================================
   Ikonky v polích (maska = barva se mění při focusu)
   ========================================================= */
html body.page-22 #page #form_user tr:has([name^="pole"]) > td:last-child {
  position: relative!important;
}

html body.page-22 #page #form_user tr:has([name^="pole"]) > td:last-child::before {
  content: ""!important;
  position: absolute!important;
  left: 15px!important;
  top: 15px!important;
  width: 20px!important;
  height: 20px!important;
  background-color: #b8ab8f!important;
  -webkit-mask: var(--ib-icon) center / contain no-repeat!important;
  mask: var(--ib-icon) center / contain no-repeat!important;
  pointer-events: none!important;
  transition: background-color .2s!important;
}

html body.page-22 #page #form_user tr:has([name^="pole"]):focus-within > td:last-child::before {
  background-color: var(--ib-gold)!important;
}

html body.page-22 #page #form_user tr:has([name^="pole"]) input[type="text"],
html body.page-22 #page #form_user tr:has([name^="pole"]) textarea {
  padding-left: 46px!important;
}

html body.page-22 #page #form_user input[type="text"]::placeholder,
html body.page-22 #page #form_user textarea::placeholder {
  color: #b5ab97!important;
  opacity: 1!important;
}

html body.page-22 #page #form_user tr:has([name="pole1"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12l4 6-10 12L2 9z'/%3E%3Cpath d='M2 9h20'/%3E%3Cpath d='M12 21 8 9l4-6 4 6z'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole2"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='15' r='6'/%3E%3Cpath d='M9.5 5.5 12 3l2.5 2.5L12 8z'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole3"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='15' r='6'/%3E%3Cpath d='M9.5 5.5 12 3l2.5 2.5L12 8z'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole4"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-6 8-6s8 2 8 6'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole5"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9v12h14V9'/%3E%3Cpath d='M10 21v-6h4v6'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole6"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-12a7 7 0 0 1 14 0c0 5.8-7 12-7 12z'/%3E%3Ccircle cx='12' cy='9' r='2.5'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole7"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='10' height='18' rx='1'/%3E%3Cpath d='M14 9h5a1 1 0 0 1 1 1v11h-6'/%3E%3Cpath d='M7.5 7h3M7.5 11h3M7.5 15h3'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole8"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole9"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")!important; }
html body.page-22 #page #form_user tr:has([name="pole10"]) { --ib-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E")!important; }

/* =========================================================
   Sekce formuláře
   ========================================================= */
html body.page-22 #page #form_user tr:has([name="pole1"])::before,
html body.page-22 #page #form_user tr:has([name="pole4"])::before,
html body.page-22 #page #form_user tr:has([name="pole10"])::before {
  display: block!important;
  margin: 0 0 16px!important;
  padding: 0 0 0 30px!important;
  min-height: 20px!important;
  font-size: 13px!important;
  font-weight: 600!important;
  line-height: 20px!important;
  letter-spacing: .08em!important;
  text-transform: uppercase!important;
  color: var(--ib-gold-dark)!important;
  background: left center / 20px 20px no-repeat!important;
}

html body.page-22 #page #form_user tr:has([name="pole1"])::before {
  content: "Obrúčky"!important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4a34d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12l4 6-10 12L2 9z'/%3E%3Cpath d='M2 9h20'/%3E%3Cpath d='M12 21 8 9l4-6 4 6z'/%3E%3C/svg%3E")!important;
}

html body.page-22 #page #form_user tr:has([name="pole4"])::before {
  content: "Kontaktné a doručovacie údaje"!important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4a34d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-6 8-6s8 2 8 6'/%3E%3C/svg%3E")!important;
}

html body.page-22 #page #form_user tr:has([name="pole10"])::before {
  content: "Doplňujúce informácie"!important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4a34d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E")!important;
}

html body.page-22 #page #form_user table.comments tr:has([name="pole4"]),
html body.page-22 #page #form_user table.comments tr:has([name="pole10"]) {
  padding-top: 26px!important;
  border-top: 1px solid var(--ib-line)!important;
}