

/* Start:/local/templates/kr-c/css/bonuses.css?179339697112733*/
/* 30.10.2026 kr-c: бонусы (native/bonus-offers.php, классы kb-*). Подключается из вида через SetAdditionalCSS. */
.kb{margin-top:8px;margin-bottom:32px}
.kb a{text-decoration:none}
.kb [hidden],.kb .bo-over{display:none!important}

/* разделы бонусов: на телефоне — одна прокручиваемая строка */
@media (max-width:767px){
  .kb-nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-left:0;margin-right:0;padding-left:16px;padding-right:16px;scroll-padding-inline:16px}
  .kb-nav::-webkit-scrollbar{display:none}
  .kb-nav .krc-dnav__i{flex:none}
}

/* как сортируем */
.kb-how{margin:0 0 14px;border:1px solid var(--krc-line);border-radius:var(--krc-r-s);background:var(--krc-s1)}
.kb-how>summary{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;font-size:14px;font-weight:600;color:var(--krc-tx);cursor:pointer;list-style:none}
.kb-how>summary::-webkit-details-marker{display:none}
.kb-how>summary::before{content:"i";display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--krc-acc-bg);color:var(--krc-cta);font:700 12px/1 Georgia,serif}
.kb-how>summary::after{content:"";width:8px;height:8px;margin-left:auto;border:solid var(--krc-mut);border-width:0 2px 2px 0;transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.kb-how[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
.kb-how p{margin:0;padding:0 14px 14px 42px;font-size:14px;line-height:1.55;color:var(--krc-mut)}

/* фильтры */
.kb-flt{display:grid;gap:10px;margin:0 0 14px;padding:12px;border:0;border-radius:var(--krc-r);background:var(--krc-s1);box-shadow:var(--krc-sh)}
.kb-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.kb-row__l{margin-right:4px;font-size:13px;font-weight:600;color:var(--krc-mut)}
.kb-chip{display:inline-flex;align-items:center;min-height:34px;padding:0 13px;border:1px solid transparent;border-radius:999px;background:var(--krc-acc-bg);color:var(--krc-cta);font-family:inherit;font-size:14px;font-weight:600;line-height:1;white-space:nowrap;cursor:pointer}
.kb-chip:hover{border-color:var(--krc-cta);color:var(--krc-cta)}
.kb-chip.is-on{border-color:transparent;background:var(--krc-grad);color:#fff}
.kb-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.kb-tg{position:relative;display:inline-flex}
.kb-tg input{position:absolute;opacity:0;pointer-events:none}
.kb-tg span{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 13px 0 10px;border:1px solid transparent;border-radius:999px;background:var(--krc-s2);font-size:14px;font-weight:600;color:var(--krc-tx);cursor:pointer;white-space:nowrap}
.kb-tg span::before{content:"";width:16px;height:16px;border:1.5px solid #9aa4b5;border-radius:5px;background:#fff}
.kb-tg input:checked+span{border-color:var(--krc-ok);background:var(--krc-ok-bg);color:var(--krc-ok)}
.kb-tg input:checked+span::before{border-color:var(--krc-ok);background:var(--krc-ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.kb-tg input:focus-visible+span{outline:2px solid var(--krc-cta);outline-offset:2px}
.kb-bar__end{display:flex;align-items:center;gap:12px;margin-left:auto}
.kb-cnt{font-size:14px;color:var(--krc-mut);white-space:nowrap}
.kb-cnt b{color:var(--krc-tx)}
.kb-sort{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--krc-mut)}
.kb-sort select{min-height:34px;padding:0 30px 0 10px;border:1px solid var(--krc-line);border-radius:8px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%235b667a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") right 9px center/12px no-repeat;color:var(--krc-tx);font-family:inherit;font-size:14px;font-weight:600;line-height:1;appearance:none;cursor:pointer}
@media (max-width:767px){
  .kb-flt{margin-left:-4px;margin-right:-4px;padding:10px}
  .kb-flt .bo-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -10px;padding:0 10px}
  .kb-flt .bo-tabs::-webkit-scrollbar{display:none}
  .kb-flt>*{min-width:0}
  .kb-tg{max-width:100%}
  .kb-tg span{white-space:normal;line-height:1.25;padding-top:6px;padding-bottom:6px}
  .kb-tg span::before{flex:none}
  .kb-bar__end{flex-basis:100%;flex-wrap:wrap;justify-content:space-between;margin-left:0;min-width:0}
  .kb-sort{min-width:0;flex:1 1 180px;justify-content:flex-end}
  .kb-sort select{min-width:0;max-width:100%}
}

/* карточка */
.kb-list{display:grid;gap:12px}
.kb-card{display:grid;grid-template-columns:200px minmax(0,1fr) 220px;border:1px solid var(--krc-line);border-radius:var(--krc-r);background:var(--krc-s1);box-shadow:var(--krc-sh);overflow:hidden;scroll-margin-top:calc(var(--krc-hdr,64px) + 12px)}
.kb-card:target{border-color:var(--krc-cta);box-shadow:0 0 0 2px var(--krc-acc-bg),var(--krc-sh)}

/* предложение: крупная сумма на цветной плашке по выгодности */
.kb-of{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:16px;background:var(--krc-s2);color:var(--krc-tx);text-align:center}
.kb-of--ok{background:var(--krc-ok-bg)}
.kb-of--mid{background:var(--krc-gold-bg)}
.kb-of--bad{background:#fdeeec}
.kb-of__pre,.kb-of__rest{font-size:13px;font-weight:600;line-height:1.3;color:var(--krc-mut)}
.kb-of__big{font:800 34px/1.05 var(--krc-f-h);letter-spacing:-.02em;overflow-wrap:anywhere}
.kb-of__big--long{font-size:26px}
.kb-of__big--tx{font-size:20px;line-height:1.2}
.kb-of--ok .kb-of__big{color:var(--krc-ok)}
.kb-of--mid .kb-of__big{color:var(--krc-gold)}
.kb-of--bad .kb-of__big{color:#b42318}
.kb-of__sub{margin-top:4px;font-size:13px;line-height:1.35;color:var(--krc-tx)}
.kb-of__ty{margin-top:8px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--krc-mut)}

/* бренд, выгодность, условия */
.kb-bd{display:grid;align-content:start;gap:14px;min-width:0;padding:16px 18px}
.kb-hd{display:flex;align-items:center;gap:12px;min-width:0}
.kb-hd__lg{width:72px}
.kb-hd__lg img{width:100%;height:100%;object-fit:contain}
.kb-hd__id{display:grid;gap:4px;min-width:0}
.kb-hd__nm{font:700 17px/1.2 var(--krc-f-h);color:var(--krc-tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-hd__nm:hover{color:var(--krc-cta)}
.kb-hd__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px;color:var(--krc-mut)}
.kb-mt{display:grid;justify-items:end;gap:3px;margin-left:auto;text-align:right}
.kb-mt__l{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--krc-mut)}
.kb-mt__v{display:flex;align-items:center;gap:7px;font-size:13px}
.kb-mt__v b{font-weight:700}
.kb-mt__d{display:flex;gap:3px}
.kb-mt__d i{width:14px;height:6px;border-radius:3px;background:var(--krc-line)}
.kb-mt--ok .kb-mt__d i.on{background:var(--krc-ok)}
.kb-mt--mid .kb-mt__d i.on{background:#e0a100}
.kb-mt--bad .kb-mt__d i.on{background:#d92d20}
.kb-mt--ok b{color:var(--krc-ok)}
.kb-mt--mid b{color:var(--krc-gold)}
.kb-mt--bad b{color:#b42318}
.kb-mt--na b{font-weight:600;color:var(--krc-mut)}
.kb-tl{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin:0;padding:0;list-style:none}
.kb-tl__i{display:grid;align-content:start;gap:2px;min-width:0;padding:9px 11px;border-radius:var(--krc-r-s);background:var(--krc-s2);border-left:3px solid var(--krc-line)}
.kb-tl__i span{font-size:12px;color:var(--krc-mut)}
.kb-tl__i b{font-size:15px;line-height:1.25;color:var(--krc-tx);overflow-wrap:anywhere}
.kb-tl__i small{font-size:11px;line-height:1.3;color:var(--krc-mut)}
.kb-tl__i--ok{border-left-color:var(--krc-ok)}
.kb-tl__i--mid{border-left-color:#e0a100}
.kb-tl__i--bad{border-left-color:#d92d20}
.kb-tl__i--ok b{color:var(--krc-ok)}
.kb-tl__i--bad b{color:#b42318}

/* действие */
.kb-ac{display:flex;flex-direction:column;justify-content:center;gap:10px;min-width:0;padding:16px 18px 16px 0}
.kb-go{width:100%}
.kb-code{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 6px;padding:6px 6px 6px 10px;border:1.5px dashed #b9c2d2;border-radius:var(--krc-r-s);background:var(--krc-bg)}
.kb-code__l{grid-column:1/-1;font-size:11px;color:var(--krc-mut)}
.kb-code code{font:700 14px/1.2 ui-monospace,Consolas,monospace;color:var(--krc-tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-code__b{min-height:30px;padding:0 10px;border:0;border-radius:7px;background:var(--krc-s1);box-shadow:0 0 0 1px var(--krc-line);color:var(--krc-cta);font-family:inherit;font-size:13px;font-weight:600;line-height:1;cursor:pointer}
.kb-chk{font-size:12px;line-height:1.35;color:var(--krc-mut);text-align:center}
.kb-chk::before{content:"✓ ";color:var(--krc-ok);font-weight:700}
.kb-chk b{font-weight:600;color:var(--krc-tx)}
.kb-chk--old{color:var(--krc-gold)}
.kb-chk--old::before{content:"! ";color:var(--krc-gold)}

/* все условия */
.kb-dt{grid-column:1/-1;border-top:1px solid var(--krc-line)}
.kb-dt>summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;font-size:14px;font-weight:600;color:var(--krc-cta);cursor:pointer;list-style:none}
.kb-dt>summary::-webkit-details-marker{display:none}
.kb-dt>summary::after{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 2px 2px 0;flex:none;margin-top:-3px;transform:rotate(45deg);transition:transform .15s}
.kb-dt[open]>summary::after{margin-top:3px;transform:rotate(-135deg)}
.kb-dt__in{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:12px 24px;padding:4px 18px 18px}
.kb-terms,.kb-steps{display:grid;gap:7px;margin:0;padding:0;list-style:none;font-size:14px;line-height:1.45;color:var(--krc-tx)}
.kb-terms li{position:relative;padding-left:24px}
.kb-terms li::before{position:absolute;left:0;top:1px;display:grid;place-items:center;width:17px;height:17px;border-radius:50%;font-size:11px;font-weight:800}
.kb-terms__ok::before{content:"✓";background:var(--krc-ok-bg);color:var(--krc-ok)}
.kb-terms__w::before{content:"!";background:var(--krc-gold-bg);color:var(--krc-gold)}
.kb-steps{counter-reset:kbs}
.kb-steps li{position:relative;padding-left:28px;counter-increment:kbs}
.kb-steps li::before{content:counter(kbs);position:absolute;left:0;top:0;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--krc-acc-bg);color:var(--krc-cta);font-size:12px;font-weight:700}
.kb-dt__note{grid-column:1/-1;margin:0;padding:10px 12px;border-radius:var(--krc-r-s);background:var(--krc-s2);font-size:13px;line-height:1.5;color:var(--krc-mut)}

.kb-more{display:flex;width:100%;max-width:360px;margin:16px auto 0}
.kb-empty{margin:16px 0;padding:24px;border:1px dashed var(--krc-line);border-radius:var(--krc-r);text-align:center;color:var(--krc-mut)}
.kb-all{margin:14px 0 0;text-align:center}
.kb-disc{margin-top:16px}

/* компактный вид (обзор казино): без бренда */
.kb--compact{max-width:none;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
.kb--compact .kb-card{grid-template-columns:170px minmax(0,1fr) 210px}
.kb--compact .kb-hd{justify-content:flex-start}
.kb--compact .kb-mt{justify-items:start;margin-left:0;text-align:left}

/* планшет: плашка + условия, действие строкой ниже */
@media (max-width:1023px){
  .kb-card,.kb--compact .kb-card{grid-template-columns:170px minmax(0,1fr)}
  .kb-ac{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;padding:12px 18px;border-top:1px solid var(--krc-line)}
  .kb-go{width:auto;min-width:200px;margin-left:auto;order:3}
  .kb-chk{order:2;text-align:left}
  .kb-code{order:1}
}
/* телефон: всё в столбик */
@media (max-width:639px){
  .kb-card,.kb--compact .kb-card{grid-template-columns:minmax(0,1fr)}
  .kb-of{align-items:flex-start;padding:12px 14px;text-align:left}
  .kb-of__big{font-size:28px}
  .kb-of__big--long{font-size:22px}
  .kb-of__ty{margin-top:6px}
  .kb-bd{padding:12px 14px;gap:12px}
  .kb-hd{flex-wrap:wrap}
  .kb-hd__lg{width:60px}
  .kb-mt{flex-basis:100%;display:flex;align-items:center;justify-content:space-between;margin:0}
  .kb-tl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kb-ac{flex-direction:column;align-items:stretch;padding:12px 14px}
  .kb-go{width:100%;margin:0;order:2}
  .kb-chk{order:3;text-align:center}
  .kb-dt__in{padding:4px 14px 14px}
}

/* End */
/* /local/templates/kr-c/css/bonuses.css?179339697112733 */
