/* =========================================================
   Калькулятор вилок + блок приложения — копия стилей
   https://www.betburger.com/ru/surebet-calculator (снято 04.11.2026).
   Изменено: путь к стрелке селекта (локальный файл), Poppins → стек
   с Geologica (кириллица), .hidden / .img-responsive / h3 блока
   приложения — значения, вычисленные на исходной странице.
   ========================================================= */
#alone-calculator { font-family: var(--font); }
#alone-calculator .hidden { display: none; }
#alone-calculator .img-responsive { display: block; max-width: 100%; height: auto; }
#alone-calculator .text-right { text-align: right; }
.calculator { border: 1px solid rgb(220, 226, 232); border-radius: 4px; padding: 16px; font-size: 14px; color: rgb(33, 62, 76); background: #fff; }
.calculator select, .calculator input { border: 1px solid rgb(122, 134, 145); border-radius: 4px; height: 40px; width: 100%; color: rgb(122, 134, 145); appearance: none; -webkit-appearance: none; padding: 0px 30px 0px 18px; background: url("../img/calc/arrow_down_red.svg") 90% center / 10px auto no-repeat rgb(255, 255, 255); font-family: inherit; font-size: inherit; }
.calculator input { background: unset; }
.calculator_header__left { margin-bottom: 20px; }
.calculator_header__odds-wrap { display: flex; flex-direction: column; justify-content: space-between; }
.calculator_header__right { font-family: var(--font-latin); }
.calculator_table-wrap { margin-top: 20px; border-radius: 4px; }
.calculator_table { width: 100%; min-width: 900px; }
.calculator_table__header { background: rgb(34, 62, 76); align-items: center; display: grid; padding: 3.5px 10px; gap: 0px 10px; grid-template-columns: 5% 140px 20% 18% 22% 8%; color: rgb(255, 255, 255); line-height: 25px; font-size: 14px; text-align: center; font-family: var(--font-latin); }
.calculator_table__row { display: grid; grid-template-columns: 5% 140px 20% 18% 22% 8%; text-align: center; padding: 10px; gap: 0px 10px; align-items: center; background: rgb(250, 250, 250); }
.calculator_table__row:nth-child(2n) { background: rgb(244, 243, 243); }
.calculator_table__row .bookmaker-odds { max-width: 120px; margin: 0px auto; }
@media only screen and (min-width: 568px){.calculator_header { display: flex; justify-content: space-between; align-items: center; gap: 0px 8px; }}
@media only screen and (min-width: 568px){.calculator_header__left { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0px 8px; width: 80%; max-width: 648px; margin: 0px; }}
@media only screen and (min-width: 568px){.calculator_header__left__odds-wrap { max-width: 200px; }}
@media only screen and (min-width: 568px){.calculator_header__left__odds-wrap select { width: 100%; }}
@media only screen and (min-width: 568px){.calculator_header__right { width: 20%; align-self: end; text-align: right; }}
@media only screen and (min-width: 1024px){.calculator { padding: 32px; font-size: 16px; }}
@media only screen and (min-width: 1024px){.calculator_header__left { width: 100%; gap: 0px 24px; }}
@media only screen and (min-width: 1024px){.calculator_table { min-width: 100%; }}
@media only screen and (min-width: 1024px){.calculator_table__header { font-size: 16px; grid-template-columns: 5% 220px 16% 14% 18% auto; }}
@media only screen and (min-width: 1024px){.calculator_table__row { grid-template-columns: 5% 220px 16% 14% 18% auto; }}
@media only screen and (min-width: 1024px){.calculator_table__row .bookmaker-odds { max-width: 200px; margin: 0px auto; }}
#alone-calculator { text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
#alone-calculator .calculator input { padding: 0px 0px 0px 18px; }
#alone-calculator .body-row { display: grid; grid-template-columns: 53.5% 31% 30px 30px auto; grid-template-rows: auto; padding: 10px; gap: 0px 10px; place-items: center right; background: rgb(244, 243, 243); border-top: 1px solid rgb(220, 226, 232); margin-top: 20px; }
#alone-calculator .f-radio, #alone-calculator .d-checkbox { appearance: auto; -webkit-appearance: auto; width: 18px; height: 18px; margin: 0px; accent-color: rgb(117, 190, 166); background: rgb(255, 255, 255); }
#alone-calculator .result.text-right { font-size: 16px; font-weight: 600; color: rgb(33, 62, 76); }
#alone-calculator input[type="radio"] { appearance: none; -webkit-appearance: none; background-color: rgb(255, 255, 255); margin: 0px; font: inherit; min-width: 18px; border: 1px solid rgb(32, 31, 30); border-radius: 50%; transform: translateY(-0.075em); display: grid; place-content: center; padding: 0px; width: 18px !important; height: 18px !important; }
#alone-calculator input[type="radio"]:focus { outline: none; }
#alone-calculator input[type="radio"]:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
#alone-calculator input[type="radio"]::before { content: ""; width: 8px; height: 8px; border-radius: 50%; transform: scale(0); transition: transform 120ms ease-in-out; background: rgb(117, 190, 166); }
#alone-calculator input[type="radio"]:checked::before { transform: scale(1); }
#alone-calculator .calculator input, #alone-calculator .calculator select { background-color: white; font-weight: 300; border: 1px solid rgb(33, 62, 76); transition: border-color 0.2s, box-shadow 0.2s; }
#alone-calculator .calculator input:focus, #alone-calculator .calculator select:focus { outline: none; border-color: rgb(117, 190, 166); box-shadow: rgba(117, 190, 166, 0.25) 0px 0px 0px 3px; }
#alone-calculator .bookmaker-odds { width: 112px; }
#alone-calculator .calculator_table { min-width: 100%; font-weight: 500; }
#alone-calculator .calculator_table__header { grid-template-columns: 1% 16% 20% 12% 10% 13% 8% 30px 30px auto; gap: 0px 10px; line-height: 25px; }
#alone-calculator .calculator_table__header span { text-align: center; white-space: nowrap; }
#alone-calculator .calculator_table__row { place-items: center; grid-template-columns: 7% 10% 20% 14% 31% 30px 30px auto; }
#alone-calculator .calculator input { background-color: white; font-weight: 300; }
#alone-calculator .commission { display: grid; gap: 10px; grid-template-columns: auto auto; align-items: end; }
#alone-calculator .commission .commission-input { width: 88px; }
#alone-calculator .commission .commission-type { font-weight: 300; width: 88px; }
@media (max-width: 768px){#alone-calculator .commission { grid-template-columns: minmax(75px, auto) auto; gap: 0px 2px; }}
@media (max-width: 650px){#alone-calculator .commission { gap: 0px 1px; grid-template-columns: auto auto; }}
@media (max-width: 450px){#alone-calculator .commission { grid-template-columns: auto; }}
@media (max-width: 450px){#alone-calculator .commission .commission-type { display: none; }}
#alone-calculator .stake { display: grid; gap: 0px 10px; grid-template-columns: minmax(130px, auto) minmax(60px, auto) auto; }
#alone-calculator .stake .stake-currency { width: 84px; }
#alone-calculator .stake .round { width: 80px; }
#alone-calculator .stake label { font-weight: 400; }
@media (max-width: 1200px){#alone-calculator .stake { grid-template-columns: minmax(100px, auto) minmax(55px, auto) auto; }}
@media (max-width: 991px){#alone-calculator .stake { grid-template-columns: minmax(90px, auto) minmax(55px, auto) auto; }}
@media (max-width: 768px){#alone-calculator .stake { gap: 0px 1px; grid-template-columns: auto minmax(55px, auto) auto; }}
@media (max-width: 768px) and (max-width: 650px){#alone-calculator .stake { grid-template-columns: minmax(70px, auto) minmax(45px, auto) auto; }}
@media (max-width: 768px) and (max-width: 450px){#alone-calculator .stake { grid-template-columns: minmax(70px, auto) minmax(35px, auto); }}
#alone-calculator .body-row .stake .js-stake:disabled { background-color: rgb(238, 238, 238); color: rgb(138, 143, 152); border-color: rgb(207, 214, 221); cursor: not-allowed; }
@media (max-width: 450px){#alone-calculator .round { display: none; }}
#alone-calculator .stake-cash input { max-width: inherit; }
@media (max-width: 768px){#alone-calculator .calculator { font-size: 14px !important; }}
@media (max-width: 768px){#alone-calculator .calculator_header__right .result { font-size: 14px !important; line-height: 1.2; }}
@media (max-width: 768px){#alone-calculator .calculator_table__header span { line-height: 1.2; white-space: normal; word-break: break-word; font-size: 12px !important; }}
@media (max-width: 768px){#alone-calculator .calculator_table__row .bet-label, #alone-calculator .calculator_table__row .profit { font-size: 12px !important; line-height: 1.2; }}
@media (max-width: 768px){#alone-calculator .calculator input:not([type="radio"]):not([type="checkbox"]), #alone-calculator .calculator select { line-height: 1.2; padding: 6px 10px; font-size: 15px !important; }}
@media (max-width: 450px){#alone-calculator .calculator { font-size: 13px !important; }}
@media (max-width: 450px){#alone-calculator .calculator_header__right .result { font-size: 13px !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__header span { font-size: 11px !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .bet-label, #alone-calculator .calculator_table__row .profit { font-size: 11px !important; }}
@media (max-width: 450px){#alone-calculator .calculator input:not([type="radio"]):not([type="checkbox"]), #alone-calculator .calculator select { padding: 6px 8px; font-size: 14px !important; }}
@media (max-width: 768px){#alone-calculator .body-row { grid-template-columns: calc(32% + 8px) 1fr 20px 20px 14% !important; gap: 0px 8px !important; }}
@media (max-width: 768px){#alone-calculator .bookmaker-odds, #alone-calculator .stake .stake-currency { width: 60px; }}
@media (max-width: 768px){#alone-calculator .calculator_table__row .commission, #alone-calculator .calculator_table__row .odds-with-commission, #alone-calculator .calculator_table__header .th-commission, #alone-calculator .calculator_table__header .th-odd-with-commission { display: none !important; }}
@media (max-width: 768px){#alone-calculator .calculator_table__header .th-round { display: none !important; }}
@media (max-width: 768px){#alone-calculator .stake .round, #alone-calculator .body-row .round { display: none !important; }}
@media (max-width: 768px){#alone-calculator .stake { grid-template-columns: minmax(60px, 1.35fr) minmax(50px, 1fr) !important; }}
@media (max-width: 768px){#alone-calculator .calculator_table__header { grid-template-columns: 10% 18% 1fr 8% 20px 20px 14% !important; gap: 0px 8px !important; }}
@media (max-width: 768px){#alone-calculator .calculator_table__row { grid-template-columns: 12% 20% 1fr 20px 20px 14% !important; gap: 0px 8px !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__header .th-round { display: none !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__header { grid-template-columns: 12% 20% 1fr 8% 20px 20px auto !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row { grid-template-columns: 5% 22% 1fr 20px 20px auto !important; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .calculator_table__header { grid-template-columns: 1% 14% 20% 10% 12% 11% 8% 20px 20px auto; gap: 0px 6px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .calculator_table__header span { font-size: 13px; white-space: normal; word-break: break-word; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .calculator_table__row { grid-template-columns: 6% 10% 20% 10% calc(30% + 12px) 20px 20px auto; gap: 0px 6px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .body-row { grid-template-columns: calc(46% + 18px) calc(30% + 12px) 20px 20px auto; gap: 0px 6px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .calculator input:not([type="radio"]):not([type="checkbox"]) { padding: 0px 8px 0px 10px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .calculator select { padding: 0px 22px 0px 10px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .bookmaker-odds { width: 100%; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .commission { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 0px 6px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .commission .commission-type, #alone-calculator .commission .commission-input { width: 100%; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .stake { grid-template-columns: minmax(0px, 1.05fr) minmax(0px, 1fr) minmax(0px, 0.8fr); gap: 0px 6px; }}
@media (min-width: 769px) and (max-width: 1200px){#alone-calculator .stake .stake-currency, #alone-calculator .stake .round { width: 100%; }}
@media (max-width: 450px){#alone-calculator .calculator_table__header { grid-template-columns: 54px minmax(0px, 1fr) 20px 20px !important; gap: 0px 6px !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__header .th-blank, #alone-calculator .calculator_table__header .th-currency, #alone-calculator .calculator_table__header .th-rev { display: none !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row { grid-template-columns: 54px minmax(0px, 1fr) 20px 20px !important; gap: 2px 6px !important; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .bet-label { grid-area: 1 / 1 / 2 / 3; justify-self: start; text-align: left; font-weight: 600; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .profit { grid-area: 1 / 3 / 2 / -1; justify-self: end; white-space: nowrap; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .profit::before { content: attr(data-label) ": "; font-weight: 400; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .bookmaker-odds { grid-area: 2 / 1; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .stake { grid-area: 2 / 2; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .f-radio { grid-area: 2 / 3; }}
@media (max-width: 450px){#alone-calculator .calculator_table__row .d-checkbox { grid-area: 2 / 4; }}
@media (max-width: 450px){#alone-calculator .body-row { grid-template-columns: 54px minmax(0px, 1fr) 20px 20px !important; gap: 0px 6px !important; }}
@media (max-width: 450px){#alone-calculator .bookmaker-odds { width: 100% !important; }}
@media (max-width: 450px){#alone-calculator .stake { grid-template-columns: minmax(0px, 1.25fr) minmax(0px, 1fr) !important; gap: 0px 6px !important; }}
@media (max-width: 450px){#alone-calculator .stake .stake-currency { width: 100% !important; }}
#alone-calculator .input-error { border-color: rgb(239, 64, 89) !important; }

/* блок мобильного приложения */
.app-info { margin-top: 32px; padding: 20px; border: 2px solid rgb(220, 241, 250); display: flex; border-radius: 8px; flex-direction: column; color: rgb(34, 62, 76); background: #fff; }
.app-info_store { margin-right: 10px; }
@media only screen and (min-width: 768px){.app-info_store { margin-right: 20px; }}
.app-info_store:last-child { margin-right: 0px; }
.app-info_left { display: flex; margin: 0px auto; order: 2; }
.app-info_left a { border-radius: 5px; display: block; overflow: hidden; width: 120px; height: 40px; }
.app-info_left a img { width: 100%; height: auto; }
.app-info_qr { margin: 0px auto 10px; }
.app-info_qr img { max-width: 120px; border: 1px solid rgb(220, 242, 250); border-radius: 8px; }
.app-info_center { order: 1; margin-bottom: 10px; }
.app-info_center h3 { margin: 20px 0 10px; font-weight: 700; font-size: 40px; line-height: 1.2; color: rgb(34, 62, 76); }
.app-info_center p { font-weight: 400; font-size: 18px; line-height: 1.5; }
.app-info_right { margin: 0px auto 10px; }
.app-info_right img { width: 288px; }
@media only screen and (min-width: 1024px){.app-info { flex-direction: row; justify-content: space-between; align-items: center; overflow: hidden; padding: 20px 20px 0px; }}
@media only screen and (min-width: 1024px){.app-info_left { margin: 0px 36px 0px 0px; order: 1; padding-bottom: 20px; }}
@media only screen and (min-width: 1024px){.app-info_qr { margin: 0px auto 32px; }}
@media only screen and (min-width: 1024px){.app-info_center { order: 2; margin-bottom: 0px; max-width: 352px; padding-bottom: 20px; }}
@media only screen and (min-width: 1024px){.app-info_right { order: 3; margin: 0px; align-self: flex-end; }}
@media only screen and (min-width: 1266px){.app-info { padding: 32px 32px 0px; }}
@media only screen and (min-width: 1266px){.app-info_left { margin: 0px 52px 0px 0px; }}
@media only screen and (min-width: 1266px){.app-info_left, .app-info_center { padding-bottom: 32px; }}
@media (max-width: 1023px){.app-info_center h3 { font-size: 24px; } .app-info_center p { font-size: 16px; }}
/* таблица калькулятора на узких экранах не выходит за колонку */
#alone-calculator .calculator_table-wrap { overflow-x: auto; }
