/**
 * Webcast Styles - Momentummedia Template
 * 
 * Custom CSS styles for webcast pages including Mautic forms,
 * responsive layouts, and component-specific styling.
 * 
 * Breakpoints (from webcast.css):
 * - xs: 480px
 * - sm: 576px
 * - md: 768px
 * - lg: 992px
 * - xl: 1200px
 */

/* ==========================================================================
   Mautic Form Styles
   ========================================================================== */

/* Mautic form button styling */
.mauticform-button {
    border: 0 !important;
    border-radius: 0 !important;
    padding: 10px !important;
    font-family: Poppins;
    font-size: 16px !important;
    font-weight: 500;
    outline: none !important;
    width: 100% !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
}

/* Mautic form inputs and textareas */
.mauticform-selectbox,
.mauticform-input,
.mauticform-textarea {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    border-bottom: 1px solid #fff !important;
    color: #fff !important;
}

.mauticform-input:focus,
#email:focus {
    outline: none;
}

/* Radio group labels */
.mauticform-radiogrp label {
    color: #fff !important;
    font: normal normal normal 16px / 22px Poppins;
    white-space: normal;
}

@media (min-width: 768px) {
    .mauticform-radiogrp label {
        white-space: nowrap;
    }
}
/* Radio group row */
.mauticform-radiogrp-row {
    display: inline-block;
    width: max-content;
    float: left;
    margin-right: 25px;
    margin-top: 15px;
}

.mauticform-selectbox option {
    color: #000;
}

/* Checkbox group styles */
.mauticform-checkboxgrp-row label {
    color: #fff !important;
    font: normal normal normal 12px / 18px Poppins;
}

.mauticform-checkboxgrp-row input {
    display: none;
}

.mauticform-checkboxgrp-row {
    position: relative;
}

.mauticform-checkboxgrp-label {
    width: 90%;
    color: white;
    font-size: 12px;
    text-align: left;
    margin-left: 35px;
    line-height: 24px;
    font-weight: 700 !important;
    margin-top: -3px;
}

/* Custom checkbox checkmark */
.mauticform-checkboxgrp-row .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    width: 24px;
    background-color: transparent;
    border: 1px solid white;
}

.mauticform-checkboxgrp-label a {
    color: #00BFF3;
}

/* Checkbox checked state */
.mauticform-checkboxgrp-row input:checked ~ .mauticform-checkboxgrp-label .checkmark {
    background-color: #2196F3;
}

.mauticform-checkboxgrp-row input:hover,
.mauticform-checkboxgrp-row label:hover ~ .mauticform-checkboxgrp-label .checkmark {
    background-color: #2196F3;
}

.mauticform-checkboxgrp-label:hover {
    cursor: pointer;
}

/* Checkmark indicator (hidden when not checked) */
.mauticform-checkboxgrp-label .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show checkmark when checked */
.mauticform-checkboxgrp-row input:checked ~ .mauticform-checkboxgrp-label .checkmark:after {
    display: block;
}

/* Style the checkmark */
.mauticform-checkboxgrp-label .checkmark:after {
    left: 8px;
    top: 4px;
    width: 7px;
    height: 13px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* Error message styling */
.mauticform-errormsg {
    display: none;
    color: red;
    margin-top: -1px !important;
    border-top: 1px solid #a94442;
    content: "";
    font-size: 0;
    z-index: 0;
    position: relative;
}

.mauticform-radiogrp .mauticform-errormsg {
    border: 0 !important;
    font-size: unset;
}

/* ==========================================================================
   Registration & Login Buttons
   ========================================================================== */

.registered-btn,
.register-btn {
    text-align: right;
    cursor: pointer;
    font-weight: normal;
    margin-bottom: 10px;
    color: #fff;
    margin-top: 20px;
    text-decoration: underline;
    font: normal normal normal 14px / 22px Poppins;
}

span.error-loginmessage {
    float: left;
    width: 100%;
    margin-top: 10px;
    color: red;
    background: #ffc7c7;
}

/* ==========================================================================
   Content Sections
   ========================================================================== */

.bot-html-left p {
    font-family: Poppins;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 15px;
}

speakers,
schedule,
partners {
    border-radius: 0 0 19px 0;
    float: left;
    width: auto;
    font: normal normal 600 18px / 25px Poppins;
}

.header__middle-wrapper {
    padding-bottom: 0 !important;
}

/* ==========================================================================
   Video & Media Elements
   ========================================================================== */

/* Vimeo player responsive heights */
#vimeo {
    height: 250px;
    margin-bottom: 20px;
}

@media (min-width: 576px) {
    #vimeo {
        height: 300px;
        margin-bottom: 10px;
    }
}

@media (min-width: 768px) {
    #vimeo {
        height: 455px;
    }
}

/* Livestream slido spacing */
.livestream.slido {
    margin-bottom: 20px;
}

@media (min-width: 992px) {
    .livestream.slido {
        margin-bottom: 0;
    }
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

.inside-element {
    display: none;
}

.mauticform_wrapper {
    width: 100% !important;
    max-width: unset !important;
}

.\!font-bold {
    font-weight: bold;
}

.lg\:\!flex {
    display: flex !important;
}

@media (max-width: 991px) {
    .lg\:\!flex {
        display: block !important;
    }
}

/* Inside left content lists */
.inside-left ul {
    list-style: disc !important;
    padding-inline-start: 40px;
    font-size: 16px;
    font-family: Poppins, 'Roboto', 'sans-serif';
    margin-bottom: 15px;
}

/* ==========================================================================
   Category & Navigation Overrides
   ========================================================================== */

.com-content-category.category-list a:hover {
    text-decoration: none;
}

/* Remove after pseudo-element for header menu items beyond 11th */
.b-rebheader-bottom-menu__item:nth-child(n+11) .b-rebheader-bottom-menu__item__link:after {
    display: none;
}