/* 
Theme Name:   bootsrap-coach-child
Theme URI:    
Description:  
Author:       
Author URI:   
Template:     bootstrap-coach
Version:      1.0
/* == Add your own styles below this line ==
--------------------------------------------*/

:root{
	--primary: rgba(var(--primary-color), 1);
	--secondary: rgba(var(--secondary-color), 1);
    --accent: var(--secondary);
	--table-border: rgba(var(--secondary-color), 0.5);
	--bonus: var(--secondary);
	--cta-bg: var(--primary);
	--rev-btn-border: #C1C1C1;
    --rev-btn-hover-bg: var(--secondary);
	--dark-color: color: rgba(var(--dark-color), 1);
	--dark-text-color: color: rgba(var(--dark-color), 0.8);
}

.light-bg { background: rgba(var(--primary-color), 0.1); }
.dark-bg { background: rgba(var(--secondary-color), 1); color: #ffffff; }

p { color: var(--dark-text-color); }
hr { background: var(--primary); }
.banner-section { height: 250px; background: center / cover no-repeat url('/images/banner.jpg'); }
.banner-section h1 { margin: 0 }
.inside-page { padding: 30px 0; min-height: calc(100vh - 308px); }
.breadcrumb_last { color: #aaa;}
h3 { color: rgba(var(--dark-color), .8); }

.detail-content ul li { list-style: unset; }

:is(ul, ol).two-col {columns: 2;}
:is(ul, ol).three-col {columns: 3;}
:is(ul, ol):is(.two-col, .three-col) li { break-inside: avoid-column; margin-left: 5px; }
@media (width < 992px) {
	:is(ul, ol):is(.two-col, .three-col) { columns: 1;}
	.site-logo img { max-width: 200px; }
}

.simple-table th { white-space: nowrap; }
.simple-table td { vertical-align: middle; }

.regulator-btns [class*="icon-"] { display: block; text-indent: -9999px; background-repeat: no-repeat; background-size: contain; background-position: center center; width: 100%; height: 40px; }
.regulator-btns .icon { height: 100%; padding: 15px; }

.icon-mga { background-image: var(--logo-mga); }
.icon-ecogra { background-image: var(--logo-ecogra); }
.icon-gamble-aware { background-image: var(--logo-gamble-aware); }

#contactForm { color: #ffffff; }
.contacts-banner { background: var(--primary); color: #ffffff; position: relative; }
.contacts-banner :is(h2, h3, p) { color: #ffffff; }
@media (width > 991px) {
	.contacts-banner::after { content: ""; position: absolute; bottom: 0; left: 0; width: 350px; height: 330px; background: url('/images/customer-support.png'); background-repeat: no-repeat; }
}

[class*=logo-] { width: 130px; margin: 0 auto; display: block; text-indent: -9999px; background-size: contain; background-position: center center; background-repeat: no-repeat; max-width: 100%; height: 100%; }

.cta-btn { font-weight: 600; font-size: 14px; padding: 10px 5px; text-align: center; border-radius: 6px; text-transform: uppercase; text-decoration: none; background: var(--primary); color: #fff; }
.cta-btn:hover { opacity: .8; color: #fff; text-decoration: none; }
.cta-btn.single { max-width: 100%; min-width: 280px; color: #fff; }

.primary-table .table-row { border: 1px solid var(--secondary); border-radius: 6px; background: rgba(var(--secondary-color), 0.03);}
.primary-table:not(.popup-box .primary-table) .table-row:first-child { background: rgba(var(--secondary-color), 0.08); border: 2px solid var(--table-border); }
.primary-table .brand-logo { border-radius: 4px 0 0 4px; }
.primary-table .brand-rating, .operator-highlight .brand-bonus { border-right: 1px solid #C4C4C4; }
.brand-rating :is(h3, .brand-score, .brand-name) { color: var(--dark-text-color); font-size: 16px; text-transform: uppercase; font-weight: 100; }
.brand-rating h3::before { all: unset; }
.brand-score { gap: 5px; }
.rating-star { width: 17px; height: 16px; background: center / contain no-repeat var(--icon-rating-star); position: relative; top: -1px; }
.brand-bonus { color: var(--bonus); font-weight: 600; line-height: 1.2; min-height: 90px; }
.bonus-amount { font-size: 27px; }
.bonus-before { font-size: 22px; }
.bonus-after { font-size: 18px; }
.bonus-after.bonus-code { font-size: 16px; }
.top-brand .bonus-after.bonus-code { font-size: 14px; }
.primary-table .brand-cta { gap: 8px; }
.primary-table .cta-btn { background: var(--secondary); }
.cta-btn.review-btn { background: none; border: 1px solid var(--rev-btn-border); color: var(--primary); font-weight: 100; }
.cta-btn.review-btn:hover:not(.not-active) { background: #fff; }
.cta-btn.review-btn.not-active { border: 1px solid var(--rev-btn-border); color: var(--dark-text-color); }
.special-terms {padding: 0 10px 20px; margin-top: -10px; font-size: 10px; color: var(--dark-text-color);}
.dark-bg .special-terms {color: #fff;}
@media screen and (min-width: 768px) and (max-width: 991px) {
	.primary-table .table-row { height: 130px; }
}
@media screen and (min-width: 992px) {
	.primary-table .table-row { height: 110px; }
}
@media screen and (max-width:767px) {
	.primary-table { max-width: 350px; }
	.primary-table .brand-logo { border-radius: 4px 4px 0 0; display: block; height: 65px;}
	.primary-table .brand-rating { border-right: none; border-bottom: 1px solid #C4C4C4; padding: 12px 0;}
	.primary-table .brand-bonus { padding: 12px 0; }
	.primary-table .brand-cta { gap: 12px; }
	.primary-table :is(.brand-rating, .brand-bonus, .brand-cta) {max-width: 300px;}
}
#show-more { display: none; }
#show-more ~ #hide-btn { display: none; }
#show-more:checked ~ #show-btn { display: none; }
#show-more:checked ~ #hide-btn { display: inline-block; }
#show-more:checked ~ #hide-btn, label[for=show-more] { cursor: pointer; margin-bottom: 2rem; left: 50%; transform: translateX(-50%); position: relative; display: inline-block; }
.primary-table ~ #show-btn, .primary-table ~ #show-btn ~ #hide-btn { width: 285px; padding: 10px 0; border-radius: 6px; border: 2px solid var(--accent); background: none; color: var(--dark-text-color); font-weight: 100; font-size: 14px; text-align: center; }
.primary-table ~ #show-btn:hover, .primary-table ~ #show-btn ~ #hide-btn:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.primary-table ~ #show-btn span, .primary-table ~ #show-btn ~ #hide-btn span { position: relative; }
.primary-table ~ #show-btn span::after, .primary-table ~ #show-btn ~ #hide-btn span::after { content: ""; position: absolute; width: 14px; height: 7px; top: 50%; transform: translateY(-50%); right: -20px; }
.primary-table ~ #show-btn span::after { background: center / contain no-repeat var(--icon-arrow-down); }
.primary-table ~ #show-btn ~ #hide-btn span::after { background: center / contain no-repeat var(--icon-arrow-up); }
.primary-table .row-hidden { display: none; }
#show-more:checked + .primary-table .row-hidden { display: flex; }

.pros-cons { list-style-type: none; }
.pros-cons li { font-style: italic;position: relative;padding: 5px 5px 5px 40px; }
.pros-cons li:before { content: ''; display: inline-block; position: absolute; width: 15px; height: 15px; left: 10px; top: 50%; transform: translateY(-50%); }
.pros-cons.pros li:before { background: var(--icon-check) center no-repeat; }
.pros-cons.cons li:before { background: var(--icon-cross) center no-repeat; }
.bg-pros { background: rgb(247 255 247); }
.bg-cons { background: rgb(255 246 246); }

.accordion-button, .accordion-button:not(.collapsed) { background: var(--secondary); color: #fff; }
.accordion-button::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}
.accordion-button:not(.collapsed)::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");transform: rotate(-180deg);}

.footer ul li { margin: 0; }
.footer ul li a { color: var(--secondary); }
@media ( width < 576px ) {
	.footer { padding: 30px 0 0; }
}

#btn-back-to-top { position: fixed; bottom: 20px; right: 20px; display: none; width: 50px; height: 50px; background: var(--primary); }
