/*Fonts*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    /*Font family*/
    --theme-font-family: "Poppins", sans-serif;
    /*Primary colors*/
    --theme-primary-50: #fff;
    --theme-primary-100: #ffe0cf;
    --theme-primary-200: #ffc0a1;
    --theme-primary-300: #ffa073;
    --theme-primary-400: #ff7e46;
    --theme-primary-500: #CE4412;
    --theme-primary-600: #c74814;
    --theme-primary-700: #933813;
    --theme-primary-800: #612811;
    --theme-primary-900: #1f2232;
    --theme-primary-A100: #000000;
    --theme-primary-A200: #a65959;
    --theme-primary-A400: #ff7e46;
    --theme-primary-A700: #933813;
    --theme-primary-contrast-50: #333;
    --theme-primary-contrast-100: #333;
    --theme-primary-contrast-200: #333;
    --theme-primary-contrast-300: #333;
    --theme-primary-contrast-400: #FFFFFF;
    --theme-primary-contrast-500: #FFFFFF;
    --theme-primary-contrast-600: #FFFFFF;
    --theme-primary-contrast-700: #FFFFFF;
    --theme-primary-contrast-800: #FFFFFF;
    --theme-primary-contrast-900: #FFFFFF;
    --theme-primary-contrast-A100: #fff;
    --theme-primary-contrast-A200: #FFFFFF;
    --theme-primary-contrast-A400: #FFFFFF;
    --theme-primary-contrast-A700: #FFFFFF;

    /*Force font weight*/
    --theme-headline-5-font-weight: 300;
    --theme-headline-6-font-weight: 300;
    --theme-subtitle-1-font-weight: 300;
    --theme-body-1-font-weight: 300;
    --theme-body-2-font-weight: 300;
    --theme-caption-font-weight: 300;
    --theme-headline-1-font-weight: 600;
    --theme-headline-2-font-weight: 600;
    --theme-headline-3-font-weight: 600;
    --theme-headline-4-font-weight: 600;
    --theme-button-font-weight: 600;
    /*Obfooter: logo filter*/
    --ob-custom-logo-filter: brightness(20);
}

/*=================================================================================================
    INDEX
    1) Appends an Apple Pay & Google Pay logo badge after the payment method label
    2) Top bar
    3) Buttons
    4) Billboard
    5) OB Footer
==================================================================================================*/

/*------------------------------------------------------------------------------------------------
    1) Appends an Apple Pay & Google Pay logo badge after only the payment method redsys label
-------------------------------------------------------------------------------------------------*/

.checkout ob-payment-methods mat-radio-button[id^="payment-method-redsys-"] .label-container>div::after {
    content: "";
    display: inline-block;
    width: 80px;
    height: 24px;
    background-image: url('https://client-dists-resources.s3.eu-west-1.amazonaws.com/channels-client/tarracoarena/assets/icons/appelpay_googlepay.png');
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 8px;
}


/*------------------------------------------------------------------------------------------------
    2) Top bar
-------------------------------------------------------------------------------------------------*/
/*cart with dark color*/
mat-toolbar .mat-mdc-unelevated-button:disabled {
    color: #FFFFFF61;
    background: #FFFFFF1F;
}

/*Navbar*/
mat-toolbar.mat-toolbar.ob-top-bar.mat-toolbar-single-row {
    background-color: #B93700;
}

.mat-toolbar .mat-mdc-button-base.mat-mdc-button-base.mat-unthemed {
    color: #fff;
}

/*Logo adaptado*/
img.logo {
    height: 3.5rem;
}

/*------------------------------------------------------------------------------------------------
    3) Buttons
-------------------------------------------------------------------------------------------------*/

/*General button*/
button.mdc-button {
    border-radius: 50px !important;
}

button.mdc-button:hover {
    background-color: #dbd9d9;
}

/*------------------------------------------------------------------------------------------------
    4) Billboard
-------------------------------------------------------------------------------------------------*/

/*Background only in initial billboard*/
body ob-page-events {
    background: url("https://client-dists-resources.s3.amazonaws.com/channels-client/tarracoarena/assets/bg.png") center/cover no-repeat;
    /*background-attachment: fixed;*/
}

ob-page-events .main-container {
    margin: 2rem 0 !important;
    background-color: rgb(13 11 11 / 50%);
    border-radius: 5px;
}

ob-catalog-card .flex.items-start.flex-col.content-container span.title,
ob-catalog-card .flex.items-start.flex-col.content-container .min-price-label,
ob-catalog-card .flex.items-start.flex-col.content-container span.subtitle.vertical-subtitle {
    color: #fff;
}

/*Text only only in initial billboard*/
body ob-page-events .ob-catalog-card {
    color: #F75511 !important;
}

body ob-page-events .ob-catalog-card .dates,
body ob-page-events .ob-catalog-card ob-event-location-venue {
    color: #F75511 !important;
}

/*Search filter*/
ob-page-events .filter-container {
    background-color: #c74714c5 !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

.search-container.flex {
    border-radius: 5px;
    color: #1f2232;
}

/*Links*/
.events button.flex.view-more-info.ob-link {
    color: #fff;
}
/*------------------------------------------------------------------------------------------------
    5) OB Footer
-------------------------------------------------------------------------------------------------*/

/*Dark version subfooter*/
ob-footer.main-footer {
    background-color: #211d2e !important;
}

/*Color links subfooter & copyright*/
ob-footer.main-footer,
ob-footer.main-footer a,
ob-footer.main-footer span.footer-copyright,
ob-footer.main-footer span.justify-end {
    color: #ffffff !important;
}

/*Button language links subfooter*/
/*Language & icon */
ob-footer.main-footer span.mdc-button__label,
ob-footer.main-footer mat-icon.mat-icon {
    color: #FFFFFF !important;
    font-weight: 400;
}

/*Border*/
ob-footer.main-footer ob-button>.mat-mdc-outlined-button {
    border: 1px solid#FFFFFF !important;
}

/*Text powered by*/
ob-footer.main-footer section.items-center {
    color: #FFFFFF;
}