/* ----------------------------------------------------------------
        Custom CSS

        Add all your Custom Styled CSS here for New Styles or
        Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
/* Define the variable in a root or parent element */
:root {
    --rapidtrivia-pink: #f02cfa;
    --rapidtrivia-white: #fff;
}
.button-pink:not(.button-border) {
    background-color: var(--rapidtrivia-pink)!important;
}
.button-3d.button-pink:hover,
.button-reveal.button-pink:hover,
.button-border.button-pink:hover,
.button-border.button-pink.button-fill::before {
    background-color: var(--rapidtrivia-pink)!important;
}

.button-border.button-pink {
    color: var(--rapidtrivia-pink);
    border-color: var(--rapidtrivia-pink);
}
.content-wrap {
    padding: 5px 0;
}

#pills-tab-settings.nav-tabs .nav-link{
    color: rgba(var(--bs-white-rgb), var(--bs-text-opacity));
}
#pills-tab-settings .nav-link.active{
    color: var(--bs-nav-tabs-link-active-color);
}

.HostpageWrap input.switch-toggle-round:checked + label::before{
    background-color: var(--rapidtrivia-pink);
}
.HostpageWrap input.switch-toggle-round + label{
    background-color: var(--rapidtrivia-pink);
}
.HostpageWrap input.switch-toggle-round + label::before{
    background-color: var(--rapidtrivia-pink);
}
body.dark, .dark #wrapper, .dark #content, .dark .shop-quick-view-ajax, .dark .portfolio-ajax-modal, .dark .ajax-modal-title, .dark .modal-content, .dark .page-transition-wrap, body.dark #side-panel, body #side-panel.dark {
    background-color: #000000;
}
.dark .section, .section.dark{
    background-color: #000000;
}
.dark .section_grey{
    background-color: #282828;
}
.dark #header-wrap {
    background-color: #000000!important;
}
.dark .menu-link.active{
    color: var(--rapidtrivia-pink)!important;
}
.dark,
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6 {
    color: var(--rapidtrivia-white);
}
.canvas_accordion{
    background:none;
    background-color: inherit;
    --bs-accordion-bg: none!important;
}
.border-pink{
    border-color: var(--rapidtrivia-pink)!important;
}
.bg-pink{
    background-color: var(--rapidtrivia-pink)!important;
}
.text-pink{
    color: var(--rapidtrivia-pink)!important;
}
.canvas_item_slider .bg-overlay{
    display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
}
.canvas_item_slider .ccm-image-slider-title{
    background-color: rgba(0, 0, 0, 0.65);
    box-shadow: 0px 0px 4px 4px rgb(0 0 0 / 60%);
    text-shadow: 1px 3px 0px black, 0 0 25px #333333, 0 0 3px #333333;
}
.dark #footer, #footer.dark,.dark .widget_links li a{
    color: var(--rapidtrivia-white)!important;
}
.showDropDown{
    display: block!important;
    z-index: 9999999!important;
}
.footer-widgets-wrap p{
    margin-bottom: 3px;
}
#footer{
    background: linear-gradient(to bottom, #000000, #6a177c);
}
.menu-link {
    font-size: 1.0125rem;
}
.tvFrame{
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    border: 15px solid #000;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 37px 14px rgba(0,0,0,0.8);
    -moz-box-shadow: 0px 0px 37px 14px rgba(0,0,0,0.8);
    box-shadow: 0px 0px 37px 14px rgba(0,0,0,0.8);
    background-color: #111;
}
.tvFrameTiny{
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    border: 8px solid #000;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 37px 14px rgba(0,0,0,0.8);
    -moz-box-shadow: 0px 0px 37px 14px rgba(0,0,0,0.8);
    box-shadow: 0px 0px 37px 14px rgba(0,0,0,0.8);
    background-color: #111;
}
.dark .portfolio-desc span b{
    color: var(--rapidtrivia-white)!important;
}
#rapidPriceModal .success_message p{
    margin-bottom: 1px;
}
div[data-choose="file-manager"] label {
    color: #000!important;
}


div.grecaptcha-badge[data-style="bottomright"] {
    display: none !important;
}
@media (max-width: 575.98px) {
    .rtDownloadPriceBtn {
        font-size: 1rem!important;
        white-space: normal!important;
    }
}
