/* Dotypay kalkulačky – styly. Převzato z „Další CSS“ webu dotypay.com (pravidla .calculator),
   přeneseno pod kořen .dp-kalkulacka, aby plugin nezávisel na CSS webu a nekolidoval s ním. */

/* Obecné třídy .hr, .btn, .arrow: :where() nepřidává specifičnost, takže stejně jako na webu
   mají přednost styly šablony a Elementoru (barva čáry, tvar tlačítka VÝPOČET). */
:where(.dp-kalkulacka) .hr {
  position: relative;
}

:where(.dp-kalkulacka) .hr hr {
  height: 1px;
  margin: 0;
  position: absolute;
  top: 50%;
  width: 100%;
  border: none;
  background: #eaeaea;
}

:where(.dp-kalkulacka) .btn {
  padding: 16px 61px 17px;
  border-radius: 28px;
  border: none;
  cursor: pointer;
}

:where(.dp-kalkulacka) .btn.green {
  background: #2ea836;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  text-transform: uppercase;
  position: relative;
}

:where(.dp-kalkulacka) .btn.green span {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, -50%);
  width: 26px;
  height: 26px;
  background: #2ea836;
  border-radius: 50%;
  border: 3px solid #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
}

:where(.dp-kalkulacka) .btn.center {
  display: block;
  margin: 0 auto;
}

:where(.dp-kalkulacka) .arrow {
  border: solid #FFFFFF;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  margin-top: -2.5px;
}

:where(.dp-kalkulacka) .arrow.right {
  transform: rotate(-45deg);
}

:where(.dp-kalkulacka) .arrow.left {
  transform: rotate(135deg);
}

:where(.dp-kalkulacka) .arrow.up {
  transform: rotate(-135deg);
}

:where(.dp-kalkulacka) .arrow.down {
  transform: rotate(45deg);
}

.dp-kalkulacka {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 50px;
}

.dp-kalkulacka * {
  font-family: "arial", Sans-serif;
  box-sizing: border-box;
  outline: none;
}

.dp-kalkulacka p {
  margin: 0;
  padding: 0;
}

.dp-kalkulacka .calculator-content {
  width: 100%;
  display: none;
}

.dp-kalkulacka .calculator-content.visible {
  display: block;
}

.dp-kalkulacka .calculator-header {
  width: 100%;
  display: none;
}

.dp-kalkulacka .calculator-header.visible {
  display: block;
}

.dp-kalkulacka .calculator-header > p {
  font-weight: bold;
  color: #3f4858;
  text-align: center;
  font-size: 42px;
  line-height: 55px;
}

.dp-kalkulacka .calculator-header > p.white {
  color: white;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header > p {
    border-radius: 0;
    font-size: 30px;
    line-height: 37px;
    text-align: left;
  }
}

.dp-kalkulacka .calculator-header .wrapper {
  background: #f8f8f8;
  display: flex;
  flex-direction: row;
  margin-top: 50px;
}

.dp-kalkulacka .calculator-header .wrapper .controls {
  margin-top: 0;
}

.dp-kalkulacka .calculator-header .wrapper.round {
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
  padding: 30px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .wrapper.round {
    padding: 15px;
    flex-direction: column;
  }
}

.dp-kalkulacka .calculator-header .wrapper.round .controls {
  width: 100%;
}

.dp-kalkulacka .calculator-header .wrapper.round .controls.multiple label {
  flex-wrap: wrap;
  max-width: 100%;
  justify-content: flex-start;
}

.dp-kalkulacka .calculator-header .wrapper.round .controls.multiple label > .default {
  width: 100%;
  margin-bottom: 11px;
}

.dp-kalkulacka .calculator-header .wrapper.round .slider-wrapper {
  width: 100%;
}

.dp-kalkulacka .calculator-header .wrapper.round .slider-wrapper input[type=range] {
  width: 100%;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .wrapper.round .slider-wrapper input[type=range] {
    width: 100%;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .wrapper {
    padding: 30px 22px;
  }
}

.dp-kalkulacka .calculator-header .controls {
  display: flex;
  flex-direction: column;
  margin-top: 57px;
  position: relative;
  justify-content: center;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls {
    margin-top: 30px;
  }
}

.dp-kalkulacka .calculator-header .controls label {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  flex-shrink: 0;
  flex-wrap: wrap;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label {
    width: 100%;
    flex-direction: column;
  }
  .dp-kalkulacka .calculator-header .controls label.tripple {
    width: 30%;
  }
}

.dp-kalkulacka .calculator-header .controls label p {
  text-align: center;
  color: #3f4858;
  font-weight: bold;
  font-size: 20px;
  line-height: 24px;
  font-family: "Montserrat", sans-serif;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label p {
    font-size: 16px;
    line-height: 19px;
  }
}

.dp-kalkulacka .calculator-header .controls label p.default {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.dp-kalkulacka .calculator-header .controls label p span {
  display: block;
  color: #2ea836;
  font-family: "Montserrat", sans-serif;
}

.dp-kalkulacka .calculator-header .controls label p span:not(.main) {
  background-color: #2ea836;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  color: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  flex-shrink: 0;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label p span:not(.main) {
    width: 35px;
    height: 35px;
  }
}

.dp-kalkulacka .calculator-header .controls label p span.main {
  color: inherit;
  font-size: 20px;
  width: 400px;
  text-align: left;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label p span.main {
    width: auto;
    font-size: 14px;
  }
}

.dp-kalkulacka .calculator-header .controls label p span.main * {
  font-size: 20px;
}

.dp-kalkulacka .calculator-header .controls label p span.mobile {
  display: block;
  color: inherit;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label p span.mobile {
    display: inline-block;
  }
}

.dp-kalkulacka .calculator-header .controls label .input-hover {
  display: flex;
  align-items: center;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label .input-hover {
    width: 100%;
    order: 2;
    margin-top: 15px;
  }
  .dp-kalkulacka .calculator-header .controls label .input-hover .input-wapper {
    width: 100%;
  }
  .dp-kalkulacka .calculator-header .controls label .input-hover .hover {
    width: auto !important;
  }
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper {
  position: relative;
  margin-right: 40px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label .slider-wrapper {
    width: 100%;
    margin: 15px 0 0;
    order: 3;
  }
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper div.info {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 5px;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper div.info p {
  color: #abaeb5;
  font-size: 16px;
  font-weight: normal;
  height: auto !important;
  min-height: auto !important;
  white-space: nowrap;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper div.info p:last-child {
  width: auto !important;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input {
  width: 300px;
  -webkit-appearance: none;
  height: 4px;
  background: #eaeaea;
  background-image: linear-gradient(#2ea836, #2ea836);
  background-size: 70% 100%;
  background-repeat: no-repeat;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label .slider-wrapper input {
    display: inline-block;
    width: 100%;
  }
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-webkit-slider-thumb {
  /* barva okraje nezávisle na barvách šablony (Astra jinak přidá okraj v barvě motivu) */
  border-color: #2ea836;
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #2ea836;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background 0.3s ease-in-out;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-moz-range-thumb {
  /* barva okraje nezávisle na barvách šablony (Astra jinak přidá okraj v barvě motivu) */
  border-color: #2ea836;
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #2ea836;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background 0.3s ease-in-out;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-ms-thumb {
  /* barva okraje nezávisle na barvách šablony (Astra jinak přidá okraj v barvě motivu) */
  border-color: #2ea836;
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #2ea836;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background 0.3s ease-in-out;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-webkit-slider-thumb:hover {
  background: #2ea836;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-moz-range-thumb:hover {
  background: #2ea836;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-ms-thumb:hover {
  background: #2ea836;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-webkit-slider-runnable-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-moz-range-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

.dp-kalkulacka .calculator-header .controls label .slider-wrapper input::-ms-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

.dp-kalkulacka .calculator-header .controls label .input-wapper {
  text-align: center;
  border-radius: 50px;
  box-shadow: inset 0px 0px 0px 2px #2ea836;
  width: 200px;
  cursor: pointer;
}

.dp-kalkulacka .calculator-header .controls label .input-wapper.error {
  box-shadow: inset 0px 0px 0px 2px red;
}

.dp-kalkulacka .calculator-header .controls label .input-wapper input {
  width: 75px;
  box-shadow: none;
}

.dp-kalkulacka .calculator-header .controls label .slider-input-wrapper {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label .slider-input-wrapper {
    flex-direction: column;
  }
}

.dp-kalkulacka .calculator-header .controls label span, .dp-kalkulacka .calculator-header .controls label input {
  font-weight: bold;
  color: #2ea836;
  font-size: 26px;
  background: transparent;
  text-align: right;
  padding: 0;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label span, .dp-kalkulacka .calculator-header .controls label input {
    font-size: 20px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label:first-child {
    margin-right: 20px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls label:last-child {
    margin-left: 20px;
  }
}

.dp-kalkulacka .calculator-header .controls.default label .slider-input-wrapper {
  width: auto;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls.default label .slider-input-wrapper {
    width: 100%;
  }
}

.dp-kalkulacka .calculator-header .controls.multiple {
  justify-content: space-evenly;
}

.dp-kalkulacka .calculator-header .controls.multiple.default label {
  max-width: 100% !important;
}

.dp-kalkulacka .calculator-header .controls.multiple label {
  max-width: 330px;
  margin: 0;
}

.dp-kalkulacka .calculator-header .controls.multiple label:not(:last-child) {
  margin-bottom: 40px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls.multiple label {
    max-width: 100%;
    align-items: flex-start;
  }
}

.dp-kalkulacka .calculator-header .controls.multiple label p {
  min-height: 85px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls.multiple label p:not(.dp-kalkulacka .calculator-header .controls.multiple label p.default) {
    display: flex;
    text-align: left;
    flex-direction: row;
    width: 100%;
    min-height: auto;
    height: auto;
  }
  .dp-kalkulacka .calculator-header .controls.multiple label p:not(.dp-kalkulacka .calculator-header .controls.multiple label p.default) span {
    margin-right: 8px;
  }
}

.dp-kalkulacka .calculator-header .controls.multiple label p.default {
  min-height: auto;
}

@media (max-width: 1144px) {
  .dp-kalkulacka .calculator-header .controls.multiple label p.default {
    min-height: 85px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls.multiple label p.default {
    min-height: auto;
  }
}

.dp-kalkulacka .calculator-header .controls.multiple label p.hover {
  min-height: auto;
  margin-right: 0;
}

.dp-kalkulacka .calculator-header .controls.multiple label p.hover span {
  background-color: #eaeaea;
  width: 35px;
  height: 35px;
  flex-shrink: 0;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  color: #3f4858;
  font-size: 18px;
  font-weight: normal;
  position: relative;
  cursor: pointer;
  margin-left: 15px;
  font-weight: bold;
  margin-right: 0 !important;
}

.dp-kalkulacka .calculator-header .controls.multiple label p.hover span:hover span {
  display: block;
}

.dp-kalkulacka .calculator-header .controls.multiple label p.hover span span {
  position: absolute;
  bottom: 100%;
  margin-bottom: 1em;
  display: none;
  width: 283px;
  height: 74px;
  padding: 10px 10px 0.5px;
  border-radius: 10px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
  background-color: #FFFFFF;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.29;
  color: #3f4858;
  text-align: left;
  right: 0;
}

.dp-kalkulacka .calculator-header .controls.multiple label p.hover span span:before {
  position: absolute;
  content: " ";
  width: 10px;
  height: 10px;
  background: white;
  border-right: 1px solid rgba(0, 0, 0, 0.07);
  bottom: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
  right: 0;
  margin: 0px 0px -2px 0px;
  transform: rotate(45deg) translate(-50%, 100%);
}

.dp-kalkulacka .calculator-header .controls.multiple input {
  border: none;
  margin: 3px 0;
  -webkit-appearance: none;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-header .controls.under {
    flex-direction: column;
  }
  .dp-kalkulacka .calculator-header .controls.under label {
    width: 100%;
  }
}

.dp-kalkulacka .calculator-summary {
  width: 100%;
  padding: 3em 0;
  background: #2ea836;
  text-align: center;
}

.dp-kalkulacka .calculator-summary.round {
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}

.dp-kalkulacka .calculator-summary.box {
  width: 35%;
  flex-shrink: 0;
  padding: 0;
  border-radius: 10px;
  margin-left: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 346px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-summary.box {
    max-width: 100%;
  }
}

.dp-kalkulacka .calculator-summary.box > div {
  padding-top: 100%;
  position: relative;
  width: 100%;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-summary.box > div {
    padding-top: 0;
  }
}

.dp-kalkulacka .calculator-summary.box > div p {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-summary.box > div p {
    transform: none;
    left: initial;
    right: initial;
    position: relative;
    padding: 25px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-summary.box {
    margin-top: 30px;
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-summary {
    padding: 36px 0;
  }
}

.dp-kalkulacka .calculator-summary p {
  color: #FFFFFF;
  font-size: 20px;
  line-height: 24px;
  font-weight: bold;
}

.dp-kalkulacka .calculator-summary p span {
  display: block;
  font-weight: bold;
  font-size: 50px;
  line-height: 61px;
  margin-top: 9px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-summary p span {
    font-size: 40px;
    line-height: 49px;
  }
}

.dp-kalkulacka .calculator-tables {
  width: 100%;
}

.dp-kalkulacka .calculator-tables .table {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.dp-kalkulacka .calculator-tables .table > .table-header {
  position: relative;
  margin-bottom: -2px;
}

.dp-kalkulacka .calculator-tables .table > .table-header button {
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  height: 100%;
  padding: 0 1.5em;
  background: transparent;
  border: none;
  outline: none;
  cursor: pointer;
}

.dp-kalkulacka .calculator-tables .table > .table-header button.left {
  left: 0;
}

.dp-kalkulacka .calculator-tables .table > .table-header button.left svg {
  transform: rotate(180deg);
}

.dp-kalkulacka .calculator-tables .table > .table-header button.right {
  right: 0;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-header button {
    display: block;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-header {
    width: 100%;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-header ul {
  list-style: none;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  padding: 0;
}

.dp-kalkulacka .calculator-tables .table > .table-header ul li {
  padding: 16px 37px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  background: #f4f4f4;
  border: none;
  font-weight: 500;
  color: rgba(63, 72, 88, 0.5);
  cursor: pointer;
  font-size: 35px;
  white-space: nowrap;
}

@media (max-width: 992px) and (min-width: 763px) {
  .dp-kalkulacka .calculator-tables .table > .table-header ul li {
    padding: 16px 25px;
    font-size: 25px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-header ul li {
    font-size: 25px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-header ul li.selected {
  border: 2px solid #E6E7EB;
  background: #FFFFFF;
  color: #3f4858;
  border-bottom-color: #FFFFFF;
  z-index: 1;
  font-weight: bold;
}

.dp-kalkulacka .calculator-tables .table > .table-header ul li:not(:last-child) {
  margin-right: 2px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-header ul li:not(.selected) {
    display: none;
  }
  .dp-kalkulacka .calculator-tables .table > .table-header ul li.selected {
    width: 100%;
    margin: 0;
    text-align: center;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-header.full {
  width: 100%;
}

.dp-kalkulacka .calculator-tables .table > .table-header.full ul {
  width: 100%;
}

.dp-kalkulacka .calculator-tables .table > .table-header.full ul li {
  width: 100%;
  text-align: center;
  padding: 14px 37px 10px;
  font-weight: bold;
  font-size: 26px;
  line-height: 26px;
}

.dp-kalkulacka .calculator-tables .table > .table-header.full ul li small {
  font-size: 16px;
  display: block;
  line-height: 26px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-header.full ul li {
    font-size: 20px;
  }
  .dp-kalkulacka .calculator-tables .table > .table-header.full ul li small {
    font-size: 14px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body {
  width: 100%;
  padding: 2em 1em;
  border: 2px solid #E6E7EB;
  border-radius: 20px;
}

.dp-kalkulacka .calculator-tables .table > .table-body .tab {
  display: none;
}

.dp-kalkulacka .calculator-tables .table > .table-body .tab.visible {
  display: block;
}

.dp-kalkulacka .calculator-tables .table > .table-body.full {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body {
    padding: 0em 8px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .nav.hidden {
  display: none;
}

.dp-kalkulacka .calculator-tables .table > .table-body .nav ul {
  display: flex;
  padding: 0;
  list-style: none;
  width: 100%;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 0;
  margin-bottom: 44px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .nav ul {
    flex-direction: row;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .nav ul li {
  padding: 15px 27px 13px;
  border-radius: 10px;
  border: solid 2px #0084f4;
  font-size: 20px;
  font-weight: bold;
  color: #0084f4;
  cursor: pointer;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .nav ul li {
    padding: 11px 9px;
    font-size: 14px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .nav ul li {
    width: 100%;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .nav ul li:not(:last-child) {
  margin-right: 4px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .nav ul li {
    text-align: center !important;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .nav ul li span.mobile {
    display: block;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .nav ul li.selected {
  color: #FFFFFF;
  background: #0084f4;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body {
  display: none;
  flex-direction: row;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body.visible {
  display: flex;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column:not(:last-child) {
  margin-right: 20px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column:not(:last-child) {
    margin-right: 0px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.cards {
  width: 60px;
  flex-shrink: 0;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.cards {
    width: 80px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.cards .row:not(:last-child) svg {
  width: 60px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.cards .row:not(:last-child) svg {
    width: 50px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types {
  border-radius: 10px;
  width: 100%;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child {
  position: relative;
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
  font-size: 19px;
  line-height: 24px;
  display: flex;
  flex-direction: column;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child {
    border-radius: 0;
    font-size: 14px;
    line-height: 18px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child span.desktop {
  display: block;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child span.desktop {
    display: none;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child span.mobile {
  display: none;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child span.mobile {
    display: block;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child .icon {
  position: absolute;
  display: flex;
  top: 0;
  transform: translate(-50%, -50%);
  width: auto;
  left: 50%;
  border-radius: 50%;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child .icon svg {
  width: auto;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child .icon svg {
    height: 25px;
    width: 25px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:last-child {
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  font-size: 16px;
  line-height: 19px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:last-child {
    font-size: 14px;
    line-height: 18px;
    border-radius: 0;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:first-child, .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:last-child {
  background: #242933;
  color: #FFFFFF;
  font-weight: bold;
  text-align: center;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:not(:first-child):not(:last-child) {
  border-bottom: 1px solid rgba(36, 41, 51, 0.1);
  background: #E6E7EB;
  margin: 0;
  width: 100%;
  font-size: 16px;
  line-height: 19px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column.types .row:not(:first-child):not(:last-child) {
    font-size: 14px;
    line-height: 18px;
    background: transparent;
    width: 100%;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column:first-child .row:first-child {
    border-top-left-radius: 10px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column:first-child .row:last-child {
  font-weight: bold;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column:first-child .row:last-child {
    border-bottom-left-radius: 10px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column:last-child .row:first-child {
    border-top-right-radius: 10px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column:last-child .row:last-child {
    border-bottom-right-radius: 10px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column .row {
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  color: #242933;
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column .row:first-child {
  padding: 20px 10px 10px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column .row:first-child {
    height: 100px;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body .body .column .row:last-child {
  height: 50px;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column .row:last-child {
    font-size: 14px;
    line-height: 18px;
  }
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body .body .column .row:first-child, .dp-kalkulacka .calculator-tables .table > .table-body .body .column .row:last-child {
    background: #242933;
    color: #FFFFFF;
    font-weight: bold;
    text-align: center;
    border-radius: 0;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body > .table-footer {
  display: none;
  margin: 1em 0 1em;
}

@media (max-width: 762px) {
  .dp-kalkulacka .calculator-tables .table > .table-body > .table-footer {
    display: block;
  }
}

.dp-kalkulacka .calculator-tables .table > .table-body > .table-footer ul {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}

.dp-kalkulacka .calculator-tables .table > .table-body > .table-footer ul li {
  cursor: pointer;
}

.dp-kalkulacka .calculator-tables .table > .table-body > .table-footer ul li:not(:last-child) {
  margin-right: 6px;
}

.dp-kalkulacka .calculator-tables .table > .table-body > .table-footer ul li svg {
  fill: #242933;
  opacity: 40%;
}

.dp-kalkulacka .calculator-tables .table > .table-body > .table-footer ul li.selected svg {
  opacity: 1;
}