﻿@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    font-family: "DM Sans", sans-serif;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

hr {
    margin: 0;
    padding: 0;
    height: 3px;
    width: 100%;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

/*.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}*/

.checkbox-input {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 10px;
}

/*.invalid, .invalid > .rz-calendar {
    outline: 1px solid red;
    border-radius: 4px;
}*/

.validation-message {
    color: red;
    display: block;
    font-size: 0.85rem;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}

.loading-progress circle {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 0.6rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}

.loading-progress circle:last-child {
    stroke: #1b6ec2;
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Loading");
}

.responsive-row{
    display: flex !important;
    width:  100% !important;
    flex-direction: row !important;
}

@media screen and (max-width: 1020px) {
    .responsive-row {
        flex-direction: column !important;
    }
}

.notification-box .rz-button-box{
    width: 100% !important;
}

/*#region TROX */
:root {
    /*Neutras*/
    --viking-white: #F8FAFF;
    --viking-grey-50: #F1F5F9;
    --viking-grey-100: #E0E0E0;
    --viking-grey-200: #C6C6C6;
    --viking-grey-300: #A8A8A8;
    --viking-grey-400: #8D8D8D;
    --viking-grey-500: #6F6F6F;
    --viking-grey-600: #525252;
    --viking-grey-700: #393939;
    --viking-grey-800: #1E1E1E;
    --viking-grey-900: #121212;
    /*Prim�ria oxford*/
    --viking-oxford-50: #F4F5F7;
    --viking-oxford-100: #E9EBEF;
    --viking-oxford-200: #D1DBE5;
    --viking-oxford-300: #A6AEBE;
    --viking-oxford-400: #79859D;
    --viking-oxford-500: #506C96;
    --viking-oxford-600: #23507C;
    --viking-oxford-700: #20345C;
    --viking-oxford-800: #1B2C4E;
    --viking-oxford-900: #162440;
    --viking-oxford-950: #121D33;
    /*Prim�ria turquesa*/
    --viking-turq-50: #EFFEFD;
    --viking-turq-100: #C7FFFA;
    --viking-turq-200: #90FFF5;
    --viking-turq-300: #51F7EF;
    --viking-turq-400: #1DE4E0;
    --viking-turq-500: #04C8C7;
    --viking-turq-600: #009EA1;
    --viking-turq-700: #057D80;
    --viking-turq-800: #0A6165;
    --viking-turq-900: #0D5154;
    --viking-turq-950: #002F33;
    /*Secund�rias*/
    --viking-secondary-50: #FFFFEA;
    --viking-secondary-100: #FFFBC5;
    --viking-secondary-200: #FFF885;
    --viking-secondary-300: #FFEE46;
    --viking-secondary-400: #FFDF1B;
    --viking-secondary-500: #FFC107;
    --viking-secondary-600: #E29400;
    --viking-secondary-700: #BB6902;
    --viking-secondary-800: #985108;
    --viking-secondary-900: #7C420B;
    --viking-secondary-950: #482200;
    /*Info*/
    --viking-info-100: #DAEFFF;
    --viking-info-200: #3BA7F9;
    --viking-info-300: #057AD4;
    --viking-info-400: #0067B7;
    --viking-info-500: #004479;
    /*Danger*/
    --viking-danger-50: #FFEEEB;
    --viking-danger-100: #FF8064;
    --viking-danger-200: #E54522;
    --viking-danger-300: #C02300;
    --viking-danger-500: #8A1900;
    /*Warning*/
    --viking-warning-100: #FFF6DA;
    --viking-warning-200: #FFDD78;
    --viking-warning-300: #F2B808;
    --viking-warning-400: #D8A409;
    --viking-warning-500: #AF8300;
    /*Success*/
    --viking-success-100: #DCFFDE;
    --viking-success-200: #A7ECAB;
    --viking-success-300: #55B55B;
    --viking-success-400: #3A8340;
    --viking-success-500: #1E5F23;
    /*RADZEN RESET*/
    --rz-danger: #e81d1d;
    --rz-grid-header-cell-border: none;
    --rz-grid-filter-border: none;
    --rz-grid-filter-buttons-border: none;
    --rz-grid-cell-border: none;
    --rz-grid-right-cell-border: none;
    --rz-grid-bottom-cell-border: none;
    --rz-grid-bottom-cell-border: none;
    /*prim�rios*/
    --rz-primary: var(--viking-oxford-600);
    --rz-primary-lighter: #006fff21;
    --rz-on-primary-lighter: #00215d;
    --rz-primary-light: #bcd8ff;
    --rz-on-primary-light: #00215d;
    --rz-primary-dark: #375a8b;
    --rz-on-primary-dark: white;
    --rz-primary-darker: #00215d;
    --rz-on-primary: white;
    /*secund�rios*/
    --rz-secondary: #5b6471;
    --rz-secondary-lighter: #006fff21;
    --rz-on-secondary-lighter: #19212b;
    --rz-secondary-light: #c2cddc;
    --rz-on-secondary-light: #19212b;
    --rz-secondary-dark: #444c58;
    --rz-on-secondary-dark: white;
    --rz-secondary-darker: #19212b;
    --rz-on-secondary-darker: #c2cddc;
    --rz-border-width: 2px;
    --rz-on-secondary: white;
    --rz-on-info: #FFF;
    --rz-notification-success-background-color: #2CC87C;
    --rz-form-field-label-focus-color: var(--viking-grey-700);
    --rz-radio-label-margin: 0 1.5rem 0 0.5rem;
    --page-side-spacing: 32px;
    --rz-tooltip-background-color: var(--viking-grey-800);
    --rz-grid-header-cell-border-bottom: 1px solid var(--viking-grey-100);
    --rz-button-border-radius: 8px;
    --rz-success: #55B55B;
    --rz-danger: #E54522;
    --rz-notification-success-color: var(--viking-white);
    --rz-notification-success-icon-color: var(--viking-white);
    --rz-header-background-color: var(--viking-white);
    --rz-profile-menu-top-item-background-color: var(--viking-white);
    --rz-profile-menu-toggle-button-color: var(--viking-grey-500);
    --rz-panel-menu-item-active-background-color: var(--viking-oxford-900);
    --rz-panel-menu-item-background-color: var(--viking-oxford-900);
    --rz-panel-menu-item-active-color: var(--viking-white);
    --rz-panel-menu-item-color: var(--viking-white);
    --rz-panel-menu-icon-color: var(--viking-white);
    --rz-panel-menu-item-2nd-level-color: var(--viking-white);
    --rz-panel-menu-item-2nd-level-hover-background-color: var(--viking-oxford-600);
    --rz-panel-menu-item-2nd-level-active-background-color: var(--viking-oxford-500);
    --rz-panel-menu-item-2nd-level-hover-color: var(--viking-white);
    --rz-panel-menu-item-hover-color: var(--viking-grey-100);
    --rz-panel-menu-item-2nd-level-background-color: var(--viking-oxford-900);
    --rz-selectbar-border: 1px solid #e0e0e0;
    --rz-datepicker-calendar-header-color: var(--viking-white);
    --rz-custom-modal-reservations: #f5f5f5;
    --rz-dialog-background-color: var(--rz-custom-modal-reservations);
    --rz-header-background-color: #fff;
    --rz-profile-menu-top-item-background-color: var(--rz-header-background-color);
    --rz-panel-menu-item-2nd-level-font-weight: 700;
    --rz-panel-menu-font-weight: 700;
    --rz-panel-menu-item-2nd-level-active-font-weight: 700;
    --viking-shadow-card: 1px 1px 15px #0000003b;
    --rz-layout-background-color: var(--viking-grey-50);
    --rz-carousel-pager-button-background-color: #3E3E40;
    --rz-carousel-pager-button-active-background-color: var(--rz-primary);
    --rz-panel-menu-item-hover-background-color: var(--viking-oxford-600);
    --rz-panel-menu-item-active-background-color: var(--viking-oxford-600);
    --viking-allow-access-clr: #55B55b;
    --viking-allow-access-bg: #55B55b;
    --viking-denied-access-clr: #e52b2b;
    --viking-denied-access-bg: #e52b2b;
    --viking-dependent-clr: #009EA1;
    --viking-border-default: 1px solid var(--viking-grey-100);
    /* TABLE */
    --viking-color-table: #3F51B5;
    --viking-color-table-secondary: rgba(63, 81, 181, 0.12);
    /* STAGE */
    --viking-color-stage: #E91E63;
    --viking-color-stage-secondary: rgba(233, 30, 99, 0.12);
    /* EVENT FLOOR */
    --viking-color-eventfloor: #009688;
    --viking-color-eventfloor-secondary: rgba(0, 150, 136, 0.12);
    /* ENTRANCE */
    --viking-color-entrance: #FF9800;
    --viking-color-entrance-secondary: rgba(255, 152, 0, 0.12);
    /* BATHROOM */
    --viking-color-bathroom: #9C27B0;
    --viking-color-bathroom-secondary: rgba(156, 39, 176, 0.12);
    /* VIP */
    --viking-color-vip: #C62828;
    --viking-color-vip-secondary: rgba(198, 40, 40, 0.12);
    /* BAR */
    --viking-color-bar: #2E7D32;
    --viking-color-bar-secondary: rgba(46, 125, 50, 0.12);
    --viking-tutorial-number-bg: var(--viking-grey-200);
    --viking-tutorial-stack-bg: var(--viking-white);
    --viking-tutorial-highlight-text: var(--viking-grey-900);
}

button:focus {
    outline: none !important;
}



.rz-layout .rz-body {
    scrollbar-gutter: stable;
}
/*Header*/
.rz-layout .rz-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.btn-custon-search {
    background-color: var(--viking-turq-500) !important;
}

.btn-custon-search .rz-button-text {
    text-shadow: 1px 1px 0px #00000078;
}


.auth-scrollable-container {
    padding: 1rem !important;
}

ul.rz-profile-menu .item-text {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.item-text {
    color: var(--viking-grey-500);
}

.img-logo {
    width: 130px;
    height: auto;
    padding: .5rem .5rem .5rem 1.5rem;
}

.header-text-clr {
    color: var(--viking-oxford-600);
}

.icon-notification {
    color: var(--viking-grey-500);
    cursor: pointer;
}

.logout-button {
    border-radius: 0 !important;
}

.logout-button .rz-button-text {
    font-size: 1rem !important;
}

.nav-profile-picture {
    min-width: 32px;
    height: 32px;
    border: 1px solid var(--viking-grey-100);
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu-collapsed .rz-navigation-menu {
    display:none;
}

.menu-collapsed .rz-panel-menu .rz-navigation-item-icon-children.rz-state-collapsed {
    display: none !important;
}

.rz-selectbutton.rz-selectbutton-horizontal .rz-state-active .rz-button-text {
    color: var(--viking-white) !important;
}

.rz-selectbutton.rz-selectbutton-horizontal .rz-button.rz-button-md:last-child,
.rz-selectbutton.rz-selectbutton-horizontal .rz-button.rz-button-md:first-child {
    width: 100%;
    padding: 1.5rem;
}

.rz-navigation-menu .rz-selectbutton.rz-selectbutton-horizontal {
    flex-direction: column;
}

.rz-navigation-menu .rz-selectbutton.rz-selectbutton-horizontal .rz-state-active .rz-button-text {
    color: var(--viking-grey-500) !important;
}

ul.rz-profile-menu .rz-navigation-menu {
    right: 10%;
    padding-block: 0;
}

.roles-container .rz-selectbutton .rz-button.rz-button-md.rz-state-active {
    background-color: var(--viking-oxford-50);

}

.rz-selectbutton .rz-button.rz-button-md {
    color: var(--viking-grey-500) !important;
}

.rz-panel-menu {
    margin-top: 4rem;
}

.rz-panel-menu .rz-navigation-item {
    border-block-end: none;
}

.rz-panel-menu .rz-navigation-item-wrapper {
    border-radius: 4px;
}

.rz-panel-menu .rz-navigation-menu .rz-navigation-item .rz-navigation-item-link {
    color: var(--rz-panel-menu-item-color) !important;
}

.rz-panel-menu .rz-navigation-item-link:not(.rz-state-disabled):active {
    background-color: var(--rz-panel-menu-item-2nd-level-hover-background-color);
}

.rz-panel-menu .rz-navigation-item-link {
    background: radial-gradient(circle, transparent 1%, var(--rz-panel-menu-item-2nd-level-hover-background-color) 1%) center / 15000%;
    padding-inline: 0;
    padding: .7rem;
}

.menu-collapsed .rz-panel-menu .rz-navigation-item-icon {
    margin: 0;
}

.menu-collapsed .rz-navigation-item-icon-children.rz-state-expanded {
    display: none;
}

.pollysoft-logo {
    position: sticky !important;
    top: 90%;
    display: block;
    margin-inline: auto;
}

.version-menu {
    position: sticky !important;
    top: 94.5%;
    display: none;
    margin-inline: auto;
    color: var(--viking-grey-300) !important;
    font-size: 12px !important;
}

.sidebar-expanded .version-menu {
    display: block !important;
}

.rz-button.rz-primary.rz-shade-default {
    transition: .3s !important;
}

.rz-button-lg {
    text-transform: none;
}

.rz-button.rz-primary:not(.rz-disabled):not(.rz-button.rz-primary.rz-variant-text):hover {
    background-color: #2a649d;
    color: var(--viking-white) !important;
}


.rz-button:not(:disabled):not(.rz-disabled) {
    cursor: pointer;
}

.toggle-sidebar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--viking-oxford-400) !important;
    color: white;
    position: absolute;
    right: -15px;
    top: 12px;
    min-width: unset;
    min-height: unset;
    padding: 0;
    z-index: 1;
}
.sidebar-container {
    background-color: var(--viking-oxford-900);
    margin: 1rem;
    border-radius: 8px;
    position: relative;
    padding: 0 12px;
}

.sidebar-container.sidebar-expanded {
    width: 230px;
}

.rz-navigation-menu .rz-button.rz-variant-text.rz-dark {
    width: 100%;
    text-align: start;
}

.rz-navigation-item-icon {
    font-weight: 300 !important;
}

@media(max-width: 768px) {
    .rz-stack:has(.header-buttons) {
        margin-top: 1rem;
        gap: 1rem
    }
    .header-buttons .rz-button.rz-primary.rz-shade-default {
        padding: 0.5rem;
        height: 35px;
        min-height: 25px;
    }
}
@media(max-width: 576px) {
    .header-buttons {
        display: flex;
        justify-content: flex-end !important;
        align-items: flex-end;
        flex-direction: column;
        gap: 1rem
    }
    .rz-stack:has(.header-buttons) {
        justify-content: flex-end !important;
        align-items: center;
        gap: 1rem !important;
    }


}


/*Fim Header*/
/*Home*/
@media(max-width: 992px) {
    .quick-action-container {
        flex-direction: column !important;
    }
}

/*Fim Home*/
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.main-card {
    background-color: white;
    border-radius: 8px;
    padding: 24px;
}

.w-fit {
    width: fit-content;
}

p, h1, h2, h3, h4, h5, h6, label
.rz-text-body1, .rz-text-body2,
.rz-text-h1, .rz-text-h2, .rz-text-h3, .rz-text-h4, .rz-text-h5, .rz-text-h6,
.rz-text-display-h1, .rz-text-display-h2, .rz-text-display-h3, .rz-text-display-h4, .rz-text-display-h5, .rz-text-display-h6 {
    font-family: "DM Sans", sans-serif;
    margin: 0;
}

.rz-link {
    font-weight: 600;
    color: var(--viking-oxford-600);
}

body:has(#app > .login-layout) {
    overflow-y: hidden;
}

form, .rz-stack, .rz-row {
    width: 100%;
}

.password-login > div {
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

.password-login button {
   width: 130px !important;
}
/*#region RadzenText */
.rz-text-body1, .rz-text-caption,
.rz-text-h3 {
    margin: 0;
}

.rz-text-body1, .rz-text-caption {
    color: var(--viking-grey-500);
}

.rz-text-body1 {
    font-size: 16px;
}

.rz-text-caption {
    font-weight: 500;
}

.rz-text-h3 {
    font-size: 20px;
    color: var(--viking-oxford-950);
}

.text-bold.rz-typography,
.text-bold.rz-typography-body1,
.text-bold {
    font-weight: bold !important;
}

/*#endregion */

/*#region RadzenDatePicker */

/**.rz-datepicker:not(.rz-datepicker-inline) {
    border-radius: 8px;
    overflow: hidden;
}

.rz-datepicker-trigger .rzi-calendar:before {
    content: "";
    background-color: red;
    background-image: url("../images/Logo.png");
}

.rz-datepicker-trigger.rz-calendar-button.rz-button.rz-button-icon-only {
    width: 100%;
    height: 100%;
    left: 0;
    right: unset;
    z-index: 5;    
}*/

/*.rz-calendar.rz-state-disabled > input {
    color: var(--viking-grey-200);
}
/*#endregion */

/*#region RadzenButton */
.rz-button-md {
    height: 40px;
    min-height: 40px;
    min-width: 40px;
    font-size: 16px;
    padding: 0 16px;
    text-transform: none;
}

.rz-button {
    width: fit-content;
}

.rz-button-md .rz-button-box {
    font-size: 13px;
}

.roles-container .rz-button-md .rz-button-box {
    font-size: 16px !important;   
}


.rz-frozen-cell.rz-frozen-cell-right.rz-frozen-cell-right-end .rz-button-md:has(img) {
    padding: 0 12px;
}

.custom-reservation-button {
    text-transform: none !important;
    min-height: 32px !important;
    border: 3px solid var(--viking-oxford-600);
    color: var(--viking-oxford-600);
    font-weight: bold;
    border-radius: 8px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

.custom-add-guests-button{
    text-transform: none !important;
    min-height: 32px !important;
    border: 3px solid var(--viking-oxford-600);
    color: var(--viking-oxford-600) !important;
    font-weight: bold;
    border-radius: 8px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: transparent !important;
}

.guest-button-registration {
    background: var(--viking-oxford-300) !important;
    color: var(--viking-oxford-600) !important;
    font-weight: 700 !important;
    border-radius: 24px !important;
    padding: 8px 24px !important;
    min-width: 120px !important;
} 

.text-guest-associate {
    color: var(--viking-grey-700) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    margin-bottom: 8px !important;
}

.text-detail-event {
    font-weight: 400 !important;
    font-size: 12px !important;
    color: var(--viking-grey-400) !important;
}

.ticket-text-reservation {
    font-weight: 700 !important;
    color: var(--viking-grey-700) !important;
    font-size: 16px !important;
}

.ticket-text-choose {
    height: 100% !important;
    min-height: 60px !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    color: var(--viking-grey-500) !important;
}

.card-increment-decrement-buttons {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 1rem !important;
    box-shadow: none !important;
    border: var(--viking-border-default);
}

.increment-decrement-buttons-remove {
    height: 10px !important;
    width: 10px !important;
}

.increment-decrement-buttons-stack {
    height: 100% !important;
    max-height: 12px !important;
}

.button-icon {
    color: var(--viking-oxford-600);
}

.custom-reservation-button .rz-button-icon-left, .custom-reservation-button .rz-button-text {
    color: var(--viking-oxford-600);
}

.custom-upload-btn .rz-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 5px;
    text-transform: none !important;
    background-color: var(--viking-oxford-600);
    height: 40px !important;
    min-height: 40px !important;
    color: var(--viking-white);
    padding: 10px 16px;
    border-radius: 8px;
    border: none;
}

.custom-upload-btn .rz-button .rz-button-text {
    font-size: 13px !important;
    color: var(--viking-white);
}

.custom-upload-btn .rz-fileupload-buttonbar {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.custom-upload-btn .rz-button:hover,
.custom-upload-btn .rz-button.rz-state-hover,
.custom-upload-btn .rz-button:focus {
    background-color: var(--viking-oxford-600) !important;
    color: var(--viking-white) !important;
}

.ticket-icon {
    color: var(--rz-primary);
    background-color: var(--viking-grey-100);
    border-radius: 50%;
    padding: 1.5rem;
}

.card-ticket-reservation {
    box-shadow: none !important;
    border: var(--viking-border-default);
}

.buttons-increment {
    display: flex;
    align-items: center;
    gap: .5rem;
    box-shadow: none;
    margin-top: .5rem;

}
/*#endregion */
/*#region RadzenInputs */
/*Inputs*/
.rz-colorpicker {
    max-width: 100px;
}

.rz-form-field-content, .rz-colorpicker, .rz-lookup-search input,
.rz-spinner, .rz-calendar, .rz-multiselect, .rz-dropdown,
.mask, .rz-textarea, .rz-textbox {
    border: none;
    box-shadow: 0 0 0 1px var(--viking-grey-400);
    transition: 0.2s;
}

.rz-chkbox-box{
    border-color: var(--viking-oxford-300) !important;
    border-radius: 5px !important;
    border: solid 2px;
}

/*Hover*/
.rz-multiselect:not(:disabled):not(.rz-state-disabled):hover, .rz-dropdown:not(:disabled):not(.rz-state-disabled):hover,
.mask:not(:disabled):not(.rz-state-disabled):hover, .rz-textarea:not(:disabled):not(.rz-state-disabled):hover,
.rz-radiobutton-box:hover:not(.rz-state-disabled), .rz-chkbox-box:hover:not(.rz-state-disabled),
.rz-form-field:hover .rz-form-field-content, .rz-autocomplete:hover:not(.rz-state-disabled),
.rz-calendar, .rz-lookup-search input:not(:disabled):not(.rz-state-disabled):hover,
.rz-colorpicker:not(:disabled):not(.rz-state-disabled):hover,
.rz-spinner:not(:disabled):not(.rz-state-disabled):hover,
.rz-textbox:not(:disabled):not(.rz-state-disabled):hover {
    box-shadow: 0 0 0 2px var(--viking-grey-500);
    transition: 0.2s;
    border: none;
}

/*Focus*/
.rz-form-field.rz-state-focused .rz-form-field-content, .rz-spinner:focus-within:not(.rz-state-disabled),
.rz-autocomplete:focus-within:not(.rz-state-disabled), .rz-colorpicker:not(:disabled):not(.rz-state-disabled):focus,
.rz-lookup-search input:not(:disabled):not(.rz-state-disabled):focus, .rz-spinner:not(:disabled):not(.rz-state-disabled):focus,
.rz-calendar .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus, .rz-multiselect:not(:disabled):not(.rz-state-disabled):focus,
.rz-dropdown:not(:disabled):not(.rz-state-disabled):focus, .mask:not(:disabled):not(.rz-state-disabled):focus,
.rz-textarea:not(:disabled):not(.rz-state-disabled):focus, .rz-textbox:not(:disabled):not(.rz-state-disabled):focus {
    box-shadow: 0 0 0 2px var(--viking-oxford-600);
    border: unset;
    outline: unset;
    outline-offset: unset;
    transition: 0.2s;
}

.rz-dropdown-chips {
    height: 40px;
}

.rz-dropdown-chips .rz-chip {
    padding: 0 0 0 8px;
    font-weight: 600;
}

.rz-textarea {
    min-width: 40px;
}
/*#endregion */

/*#region RadzenNotification */
.rz-notification-success {
    color: #ffffff !important; /* Cor do texto */
}

.rz-growl-message-success .rz-growl-item,
.rz-growl-image.rzi-check {
    color: white;
}
/*#endregion */

/*#region RadzenDataGrid */

tr {
    height: 60px;
}

.rz-data-grid {
    border-radius: 8px;
    border: 1px solid var(--viking-grey-200);
}

thead tr, .rz-grid-table thead,
.rz-grid-table thead th:not(:last-child),
.rz-grid-table thead th > div:not(.rz-cell-filter),
.rz-grid-table-fixed thead .rz-frozen-cell-right.rz-frozen-cell-right-end {
    background-color: var(--viking-oxford-900);
    border-bottom: 1px solid var(--viking-oxford-900);
}

.grid-no-header .rz-grid-table thead th > div:not(.rz-cell-filter),
.grid-no-header th.rz-unselectable-text.rz-text-align-left,
.grid-no-header .rz-grid-table thead th:not(:last-child),
.grid-no-header thead tr,
.grid-no-header .rz-grid-table thead {
    background-color: var(--viking-oxford-900);
    border: 1px solid var(--viking-oxford-900);
}


.rz-datepicker-calendar thead tr {
    background: transparent;
    border: none;
}

.rz-grid-table-fixed thead .rz-frozen-cell-right.rz-frozen-cell-right-end {
    border-bottom: 1px solid var(--viking-oxford-900) !important;
}

.rz-grid-table-striped tbody > tr > :first-child {
    border-left: none;
}

.rz-grid-table tr td:last-child:not(.rz-composite-cell) {
    border-right: none;
   /* padding: 0 16px 16px !important;*/
}

.rz-sortable-column .rzi-sort.rzi-sort-asc:before {
    content: "filter_list";
    color: white;
}

.rz-sortable-column .rzi-sort-asc {
    transform: rotateZ(180deg);
}

.rz-sortable-column .rzi-sort.rzi-sort-desc:before {
    content: "filter_list";
    color: white;
}

.rz-grid-table thead th .rz-column-title {
    color: white;
}



/*.rz-grid-table-striped tbody > tr:not(.rz-expanded-row-content):nth-child(odd) > td,
.rz-grid-table-striped tbody > tr:not(.rz-expanded-row-content):nth-child(even) > td {
    padding: 0 16px !important;
}*/

.rz-rowgroup-header .fa, .rz-row-toggler {
    cursor: pointer;
}

.rz-data-grid-data .rz-grid-filter-icon {
    background: url(/images/icons/filter.png) no-repeat 0 0;
    content: "";
    width: 16px;
    height: 16px;
    background-size: 100%;
    color: transparent;
}

.rz-data-grid-data .rz-grid-filter-active {
    background: url(/images/icons/filter-active.png) no-repeat 0 0;
    color: transparent !important;
    width: 16px;
    height: 16px;
    background-size: 100%;
}

.rz-datatable-emptymessage {
    height: 44px;
}

/*Paginator*/
.rz-paginator {
    border: 1px solid var(--viking-grey-100);
    border-radius: 0 0 8px 8px;
}

.entrance-report-grid .rz-paginator {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 0.75rem;
}

.entrance-report-grid .rz-paginator-summary {
    margin-right: auto;
}

.entrance-report-grid .rz-paginator .rz-dropdown {
    min-width: 76px;
}

/*.rz-grid-table-striped tbody > tr:not(.rz-expanded-row-content):nth-child(odd) > td:has(.rzi-chevron-circle-down) {
    padding: 0 10px;
}


.rz-grid-table-striped tbody > tr:not(.rz-expanded-row-content):nth-child(odd) > td:has(.rzi-chevron-circle-right) {
    padding: 0 10px;
}*/
/*#endregion */
/*#region RadzenSteps */
.rz-steps [role=tablist] {
    align-items: flex-start;
    width: 90%;
    margin: 0 auto;
    padding: 24px 0;
}

.rz-steps .rz-steps-item {
    position: relative;
}

.rz-steps .rz-menuitem-link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

.rz-steps-title {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: var(--viking-oxford-600);
}

.rz-steps-number {
    background: var(--viking-oxford-600);
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: Lexend, sans-serif;
}

.rz-steps .rz-state-disabled .rz-menuitem-link {
    color: var(--viking-oxford-300);
}

.rz-steps .rz-state-disabled .rz-menuitem-link .rz-steps-number {
    background-color: var(--viking-oxford-300);
}

.rz-steps .rz-state-highlight .rz-steps-number {
    background: white;
    color: var(--viking-oxford-600);
    box-shadow: 0 0 0px 3px inset var(--viking-oxford-600);
}

.rz-steps .rz-state-highlight .rz-steps-title {
    color: var(--viking-oxford-600);
}

.rz-steps .rz-steps-item:not(:last-child):after {
    height: 4px;
    position: absolute;
    top: 18px;
    left: 20px;
    width: 100%;
    z-index: -1;
    background-color: var(--viking-oxford-600);
}

.rz-steps .rz-steps-item.rz-state-disabled:not(:last-child):after {
    background-color: var(--viking-oxford-300);
}

.grid-action-buttons {
    padding: 10px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}
/*#endregion */

/*#region RadzenBreadCrumb */
.rz-breadcrumb  {
    margin: 1rem 0;
}

.rz-breadcrumb > :first-child {
    color: var(--viking-oxford-600);
    gap: .5rem;
}

.rz-breadcrumb > :last-child {
    font-weight: 600;
    color: var(--viking-grey-600);
}

.rz-breadcrumb-item + .rz-breadcrumb-item::before {
    content: "navigate_next";
    font-family: "Material Icons";
}

.rz-breadcrumb-item img {
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

/*#endregion */

/*#region RadzenSwitch */
.rz-switch {
    height: 18px;
    width: 32px;
}

.rz-switch .rz-switch-circle {
    background-color: white;
    border: 2px solid var(--viking-oxford-600);
}

.rz-switch .rz-switch-circle:before {
    width: 12px;
    height: 12px;
    margin-top: -6px;
    left: 2px;
    box-shadow: unset;
    background-color: var(--viking-oxford-600);
}


.rz-switch.rz-switch-checked .rz-switch-circle:before {
    width: 12px;
    height: 12px;
    margin-top: -6px;
    transform: translateX(18px);
    background-color: white;
}

.rz-switch.rz-switch-checked .rz-switch-circle {
    background-color: var(--viking-oxford-600);
}

.rz-switch.rz-switch-checked .rz-switch-circle.rz-disabled {
    border: 1px solid var(--viking-grey-400);
    background-color: var(--viking-grey-400);
}

.rz-switch .rz-switch-circle.rz-disabled {
    background-color: white;
    border: 2px solid var(--viking-grey-400);
}

.rz-switch.rz-switch-checked .rz-switch-circle.rz-disabled:before {
    background-color: white;
}

.rz-switch .rz-switch-circle.rz-disabled:before {
    background-color: var(--viking-grey-400);
}
/*#endregion */

/*#region RadzenBadge */
.rz-badge {
    padding: 0.125rem 0.75rem;
    width: 70px;
}

/*#endregion */

/*#region RadzenCard */
.rz-card {
    border-radius: 8px;
}

/*#endregion */

/*#region RadzenSelectBar */
.rz-selectbutton .rz-button.rz-button-md {
    display: flex;
    align-items: center;
    color: var(--viking-oxford-600);
}

.rz-selectbutton .rz-button.rz-button-md:first-child {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.rz-selectbutton .rz-button.rz-button-md:last-child {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.rz-selectbutton .rz-button.rz-button-md.rz-state-active {
    background-color: var(--viking-oxford-600);
}

.rz-selectbutton .rz-button.rz-button-md.rz-state-active span {
    color: white;
}
/*#endregion */

/*#region RadzenValidator */
.rz-messages-error {
    color: red;
    position: absolute;
    top: 100%;
    font-size: 14px;
    padding: unset;
}

/*#endregion */

/* #region ModalReservas */
.rz-dialog-titlebar {
    padding: 20px;
    min-height: 30px;
    background-color: var(--rz-custom-modal-reservations);
    border-left: 2px solid var(--viking-grey-100);
    border-bottom: 2px solid var(--viking-grey-100);
    font-family: "DM Sans", sans-serif !important;
}

.rz-dialog-titlebar .rz-dialog-title {
    font-weight: 700;
    margin-left: 10px;
}

.rz-dialog-titlebar .rz-dialog-titlebar-close{
    cursor: pointer !important;
}

.rz-dialog-content {
    border-left: 2px solid var(--viking-grey-100);

}

.dialog-extracts .rz-dialog-content{
    padding: 1rem 0 0 0;
}


.custom-modal-image {
    width: 460px;
    height: 320px;
    object-fit: cover;
    border-radius: 8px;
}

.custom-modal-small-image {
    width: 103px;
    height: auto;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 4px;
    cursor: pointer;
}

.thumbnail-stack {
    gap: 10px;
    display: flex;
    flex-direction: column;
}

.status-modal-reservations {
    min-height: 32px;
    padding: 5px 15px;
    background-color: var(--viking-info-300);
    color: white;
    border-radius: 5px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    font-size: 15px;
    white-space: nowrap;
}

.value-modal {
    font-weight: 700 !important;
    color: var(--viking-grey-900);
}

.warning-modal-container{
    background-color: var(--viking-oxford-100);
    border-radius: 8px;
    padding: 16px 8px;
}

.warning-modal-reservations {
    display: flex;
    flex-wrap: wrap;
    text-align: start;
    margin: 10px 30px;
    font-weight: 700;
    font-size: 14px;
    color: var(--viking-grey-900);
}

.description-modal-reservations {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding-bottom: 5rem;
}

.footer-modal-reservations {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 10;
    background-color: var(--rz-custom-modal-reservations);
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px;
    height: 60px;
    padding: 20px;
    border-top: 2px solid var(--viking-grey-100);
    border-left: 2px solid var(--viking-grey-100);
}

.modal-label-event {
    color: var(--viking-grey-500);
    font-weight: 700;
    font-size: 14px
}

.modal-text-event {
    color: var(--viking-grey-500);
    font-size: 12px
}

.modal-description-event {
    width: 100%;
    color: var(--viking-grey-500);
    font-size: 12px;
    max-height: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.modal-cancel {
    width: 100% !important;
    background-color: var(--viking-danger-200) !important;
    font-weight: 700 !important;
}

.modal-reserve {
    width: 100% !important;
    background-color: var(--viking-oxford-600) !important;
    font-weight: 700 !important;
}

.rz-button.modal-waiting-list {
    width: 100% !important;
    background-color: var(--viking-warning-300) !important;
    border: 1px solid var(--viking-warning-300) !important;
    color: var(--viking-white) !important;
    font-weight: 900 !important;
}

.rz-button.modal-waiting-list .rz-button-text {
    color: var(--viking-white) !important;
}

.rz-button.modal-waiting-list:hover,
.rz-button.modal-waiting-list.rz-state-hover,
.rz-button.modal-waiting-list:focus {
    background-color: var(--viking-warning-300) !important;
    border-color: var(--viking-warning-300) !important;
    color: var(--viking-white) !important;
    opacity: 0.85;
}

.rz-button.modal-waiting-list:hover .rz-button-text,
.rz-button.modal-waiting-list.rz-state-hover .rz-button-text,
.rz-button.modal-waiting-list:focus .rz-button-text {
    color: var(--viking-white) !important;
}

.modal-back {
    width: 100% !important;
    font-weight: 700 !important;
}

.modal-back:hover {
    color: var(--viking-white) !important;
}

.text-modal-date {
    font-size: 1.2rem;
    font-weight: 700;
}

/* endregion */

/* #region RadzenDialog */

.custom-dialog-class{
    width: 500px !important;
    min-width: 500px;
    background-color: var(--rz-custom-modal-reservations);
    border-radius: 10px;
}

.custom-dialog-class .rz-dialog-title{
    color: var(--viking-grey-500);
}

.custom-dialog-class .rz-dialog-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    background-color: var(--rz-custom-modal-reservations);
}

.custom-confirm-dialog {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 400px;
    min-height: 243px;
    height: auto !important;
    margin: 16px 0px;
    border-radius: 10px;
    background-color: var(--viking-white);
    padding: 24px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.custom-dialog-content-card{
    display: flex;
    flex-direction: column !important;
    align-items: center;
    justify-content: center;
}

.custom-dialog-content-card div{
    display: flex;
    flex-direction: row !important;
    justify-content: space-between !important;
}

.custom-dialog-card-bold{
    font-weight: 700 !important;
    color: var(--viking-grey-900);
}

.custom-dialog-room-title{
    color: var(--viking-grey-500);
    font-weight: 700;
}

.custom-dialog-select {
    box-shadow: 0px 0px 2px var(--viking-grey-300);
}

.custom-dialog-select:hover, .custom-dialog-select:active {
    box-shadow: 0px 0px 2px var(--viking-grey-300);
}

.custom-dialog-hours-buttons {
    width: 40px !important;
    height: 28px !important;
    padding: 2px;
    border-radius: 4px !important;
    box-shadow: 0px 0px 0px 2px var(--viking-oxford-500) !important;
}

.custom-dialog-hours-buttons::after{
    background-color: var(--viking-oxford-500) !important;
}

.custom-dialog-hours-buttons .rz-button-text{
    font-size: 12px !important;
    margin: 0 !important;
}

.custom-dialog-hours-buttons .rz-button-box{
    font-size: 8px !important;
    margin: 0 !important;
}
.custom-dialog-container-buttons{
    display: flex !imporant;
    flex-direction: row;
    justify-content: end !important;
    padding: 20px;
    margin-top: 10px;
    border-top: 1px solid var(--viking-grey-100);
}

.custom-dialog-confirm {
    width: 126px !important;
    background-color: var(--viking-oxford-600) !important;
    font-weight: 700 !important;
}

.custom-dialog-back {
    width: 126px !important;
    background-color: transparent !important;
    color: var(--viking-grey-400) !important;
    font-weight: 700 !important;
    border: 2px solid var(--viking-grey-200);
}

.custom-message-validation{
    color: var(--rz-danger);
    font-size: 12px;
}

.custom-image-danger {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 95px;
    height: 95px;
    background-color: var(--viking-danger-50);
    border-radius: 15px;
}

.custom-image-danger img{
    width: 57px;
    height: 57px;
}

.dialog-error-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
    min-height: 50px;
    height: auto;
    background-color: var(--viking-danger-50);
    border-radius: 10px;
}

.dialog-error-container p{
    color: var(--rz-danger);
}

.custom-waiting-list-text-container {
    display: flex !important;
    flex-wrap: wrap !important;
    text-align: center;
    background-color: var(--viking-warning-100);
    border-radius: 8px;
    padding: 16px;
}

.info-danger-dialog{
    background-color: var(--viking-danger-50);
    border-radius: 8px;
    padding: 16px;
    text-align: center;
}

.info_cancel_out_of_deadline{
    color: var(--rz-danger);
    font-size: 12px;
    font-weight: 700;
}

.info-cancel-exist-reservation {
    align-items: center !important;
    justify-content: center !important;
    width: 279px;
    padding: 16px 24px;
    border: 2px solid var(--viking-grey-100);
    border-radius: 8px;
    box-shadow: 0px 0px 3px var(--viking-grey-100);
}

.custom-info-after-hours{
    display: flex !important;
    gap: 8px;
    background-color: var(--viking-oxford-50);
    justify-content: center !important;
    align-items: center !important;
    text-align: center;
    padding: 16px;
    border-radius: 8px;
}

.after-hours-container p{
    font-size: 16px;
    font-weight: 700;
}

.after-hours-info-container p{
    font-size: 16px;
}

.font-bold-info{
    font-weight: 500 !important;
}

/* endregion */
/*#region RadzenPanel */
.rz-panel {
    box-shadow: unset;
}

.rz-panel-titlebar {
    padding-bottom: 24px;
}

/*#endregion */

.uppercase-input {
    text-transform: uppercase;
}

.rz-grid-table th:last-child {
    background: var(--viking-oxford-900);
    border-bottom: 1px var(--viking-oxford-900);
}

.rz-tooltip-content {
    max-width: 500px;
    white-space: normal;
    word-wrap: break-word;
}


/*Carousel*/
.carousel-component .rz-carousel-pager-button {
    width: 60px;
    height: 8px;
    border-radius: 50px !important;
}

.reservation-modal .carousel-component .rz-carousel-pager-button,
.event-modal .carousel-component .rz-carousel-pager-button {
    width: 35px !important;
    height: 5px !important;
}

.reservation-modal .rz-carousel-pager-overlay .rz-carousel-pager,
.event-modal .rz-carousel-pager-overlay .rz-carousel-pager {
    justify-content: center !important;
}

.rz-carousel-pager-overlay .rz-carousel-pager {
    opacity: 1 !important;
    justify-content: flex-start !important;
    padding-left: 2%;
    padding-bottom: 2rem;
}
.rz-carousel-item img {
    width: 100%;
    object-fit: cover;
    border-radius: 8px;
    filter: brightness(.6);
}

.rz-carousel-item .text-container {
    position: absolute;
    left: 2%;
    bottom: 15%;
    z-index:999;
}

.rz-carousel-item .text-container .rz-text-h3 {
    font-weight: 600;
    font-size: 1.5rem;
    color: var(--viking-warning-400);
}
.rz-carousel-item .text-container .rz-text-body1 {
    font-size: 1rem;
    color: var(--viking-white);
}

.rz-carousel-pager {
    align-items: flex-end !important;
    height: 50%;
    padding-bottom: 1rem;
    background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 30%, rgba(0, 0, 0, 0.95) 72%);
}

.reservation-modal .rz-carousel-pager,
.event-modal .rz-carousel-pager {
    background: none;
    height: 20%;
}
    /*Fim Carousel*/
    /*Braeakpoints*/
    @media(max-width: 768px) {
        .rz-header, .rz-footer, .rz-body {
            width: 100%;
        }

        .rz-body {
            padding: .5rem;
        }

        .sidebar-container {
            margin-right: 0;
        }

        .rz-pager {
            display: flex;
        }

        .main-card {
            padding: .5rem;
        }

        .hide-header-text,
        .hide-header-text .rz-button-text {
            display: none;
        }
    }

    .nav-profile-picture {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.profile-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.alert-text-title, .alert-text {
    display: block;
    text-align: center;
}

.alert-text {
    font-size: 15px;
}

.card-associate-family {
    width: 100%;
    height: 82px;
    box-shadow: none !important;
    border: var(--viking-border-default);
}
/*Reservations*/
.reservation-page .rz-dropdown {
    overflow: visible;
}

.reservation-page .rz-dropdown-chips{
    height: auto !important;
}

.reservation-page .rz-dropdown-trigger{
    align-items: start !important;
}

.card-title-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    width: 100%;
    max-width: 200px; 
    font-weight: bold;
    color: var(--viking-grey-700);
    margin-top: 1rem;
}


.reservation-page .rz-dropdown-chips .rz-chip {
    background-color: var(--viking-grey-900);
    color: white;
}

.reservation-page .rz-dropdown-chips .rz-chip .rz-button {
    background-color: var(--viking-grey-900);
    color: white;
}
.reservation-page .rz-dropdown:not(:disabled):not(.rz-state-disabled),
.reservation-page .rz-dropdown:not(:disabled):not(.rz-state-disabled):hover,
.reservation-page .rz-dropdown:not(:disabled):not(.rz-state-disabled):focus {
    border: solid 1px var(--viking-grey-400) !important;
    box-shadow: none !important;
    outline: none !important;
}

.reservation-page .rz-datepicker > .rz-inputtext {
    border: solid 1px var(--viking-grey-400) !important;
}
.reservation-page .rz-datepicker > .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus{
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

body {
}

.grid-cards{
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    height: 100% !important;
    width: 100% !important;
    gap: 24px !important;

}

.section-reservation {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 1rem;
}



@media (max-width: 1024px) {
    .grid-cards {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}


@media (max-width: 768px) {
    .grid-cards {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}


@media (max-width: 480px) {
    .grid-cards {
        grid-template-columns: repeat(1, 1fr) !important;
    }
}


/* Css roomcard reservation */
.room-card {
    border-radius: 6px;
    position: relative;
    background-color: #fff;
    cursor: pointer !important;
    max-width: 350px !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.room-card > .tag {
    border-radius: 6px 0 6px 0;
    padding: 6px 24px;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    color: white;
    font-size: 12px;
    font-weight: 600;
}

img {
    border-radius: 6px;
}

.status {
    border-radius: 6px;
    padding: 6px 24px;
    text-align: center;
    color: white;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.info-container {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.superior-row{
    display: flex;
    align-items: center;
    gap: 1.5rem;
}
.superior-col{
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: .5rem;
}

.info-item > img,
.info-item > img{
    width: 16px;
    height: 16px;
}

.info-item {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: .5rem;
    font-size: 14px;

}


reservation-dialog{
    padding: 1rem !important;
}


/*#region MainLayout */



/*MainLayoutcss*/

/*fix selector*/


/* Sidebar responsiva */
@media (max-width: 768px) {
    .sidebar-responsive {
        z-index: 999999 !important;
        position: fixed !important;
        top: 68px !important;
        height: 89%;
    }
    .rz-header, .rz-footer, .rz-body {
        width: 100% !important;
    }
}
/* Fim da sidebar responsiva */

/* Error Boundary */


.error-container{
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding-top: 2rem;
}


/* Fim do Error Boundary */



>>>>>>> Stashed changes



/* ANIMAÇÃO SLIDER RIGHT TO LEFT */
@keyframes slideInFromRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideOutToRight {
    from {
        transform: translateX(0);
        opacity: 1;
    }
    to {
        transform: translateX(100%);
        opacity: 0;
    }
}

.panel-enter {
    animation: slideInFromRight 0.5s ease;
}

.panel-exit {
    animation: slideOutToRight 0.5s ease;
}

/* notification */
.card-notification {
    display: flex;
    align-items: start;
    justify-content: space-between;
    border: var(--viking-border-default) !important;
    box-shadow: none !important;
}
.circle-notification{
    width: 10px!important;
    height: 10px!important;
    border-radius: 50%!important;;
    background-color: red!important;;
    display: flex!important;;
    align-items: start!important;;
    justify-content: start!important;;
}

.spacing-notification{
    gap: .5rem !important;
}

/* My profile */

.left-side-profile {
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 1rem;
    width: 100%;
    max-width: 300px;
    height: 100%;
    max-height: 300px;
    flex-direction: column;
}

.container-image-myprofile {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1rem;
}

.associate-img {
    width: 100%;
    height: 100%;
    max-height: 200px
}

.clr-oxford-100 {
    color: var(--viking-oxford-100) !important;
}

.clr-oxford-200 {
    color: var(--viking-oxford-200) !important;
}

.clr-oxford-300 {
    color: var(--viking-oxford-300) !important;
}

.clr-oxford-400 {
    color: var(--viking-oxford-400) !important;
}

.clr-oxford-500 {
    color: var(--viking-oxford-500) !important;
}

.clr-oxford-600 {
    color: var(--viking-oxford-600) !important;
}

.clr-oxford-700 {
    color: var(--viking-oxford-700) !important;
}

.clr-oxford-800 {
    color: var(--viking-oxford-800) !important;
}

.clr-oxford-900 {
    color: var(--viking-oxford-900) !important;
}

.clr-grey-100 {
    color: var(--viking-grey-100) !important;
}

.clr-grey-200 {
    color: var(--viking-grey-200) !important;
}

.clr-grey-300 {
    color: var(--viking-grey-300) !important;
}

.clr-grey-400 {
    color: var(--viking-grey-400) !important;
}

.clr-grey-500 {
    color: var(--viking-grey-500) !important;
}

.clr-grey-600 {
    color: var(--viking-grey-600) !important;
}

.clr-grey-700 {
    color: var(--viking-grey-700) !important;
}

.clr-grey-800 {
    color: var(--viking-grey-800) !important;
}

.clr-grey-900 {
    color: var(--viking-grey-900) !important;
}

.fw-100 {
    font-weight: 100 !important;
}

.fw-200 {
    font-weight: 200 !important;
}

.fw-300 {
    font-weight: 300 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-700 {
    font-weight: 700 !important;
}

.fw-800 {
    font-weight: 800 !important;
}

.fw-900 {
    font-weight: 900 !important;
}

.text-guest {
    font-weight: 700 !important;
    font-size: 1.5rem !important;
    color: white !important;
}

.text-reservation-stack {
    color: var(--viking-grey-700);
    font-weight: bold
}

.guest-card-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100% !important;
    max-height: 12px !important;

}

.text-secondary-guest {
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--viking-grey-600);
}

.icon-forward {
    background-color: transparent;
    color: var(--viking-grey-600);
    box-shadow: none;
    pointer-events: none;
}


.loading-container {
    width: 100%;
    height: 100%;
    max-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.container-image-myprofile > img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.rz-fileupload-buttonbar{
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
.custom-upload-image-btn .rz-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 5px;
    text-transform: none !important;
    background-color: transparent;
    height: 40px !important;
    min-height: 40px !important;
    color: var(--viking-oxford-600);
    padding: 10px 16px;
    border-radius: 8px;
    border: 3px solid var(--viking-oxford-600);
}

/* Extracts */

.container-extracts{
    padding: 0 3rem 3rem 3rem;
}
.card-extracts{
    height: 100%;
    max-height: 600px;
}

.extracts-button{
    padding: 1rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border-top: 2px solid var(--viking-grey-100);
    gap: 1rem;
}

/*Ajuste datepicker modal*/
.rz-datepicker-popup-container {
    top: 30% !important;
}

/*Ajuste card form*/
.card-form {
    box-shadow: var(--viking-shadow-card) !important;
}
/*
.text-no-break label{
    resize: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}*/

/* Reservation filter spacing  */
.grid-cards {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 320px)) !important;
    height: 100% !important;
    width: 100% !important;
    gap: 24px !important;
}

.associate-cards .room-card {
    cursor: default !important;
}

.container-dates-reservation {
    width: 100%;
    max-width: 150px !important;
}
.container-dates-my-reservation{
    width: 100%;
}



.buttons-filter {
    width: 100%;
    max-width: 100px;
    align-self: center;
}

.dates{
    width: 100% !important;
}

.dates input {
    border: solid 1px var(--viking-grey-400) !important;
}


@media (max-width: 1024px) {
    .grid-cards {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .left-side-profile {
        max-width: 100%;
    }
}


@media (max-width: 1280px) {
    .grid-cards {
        grid-template-columns: repeat(2, 1fr) !important;
    }


    .container-dates-reservation{
        width: 100%  !important;
        max-width: 100% !important;
    }


    .divider {
        display: none !important;
    }

    .reservation-page .rz-stack {
        flex-direction: column !important;
    }

    .reservation-page .buttons-filter {
        align-self: end !important;
        flex-direction: row !important;
    }

    .reservation-page .rz-stack.container-dates-my-reservation {
        flex-direction: row !important;
    }
}

@media(max-width: 576px) {
    .reservation-page .rz-stack.container-dates-my-reservation {
        flex-direction: column !important;
    }

    .rz-header .rz-button.rz-primary.rz-shade-default {
        display: none;
    }
}

/* SupplierCard Region */

.custom-dialog-supplier{
    width: 600px !important;
    height:  700px !important;
    border-radius: 8px !important;
}



/* EndRegion */

@media (max-width: 480px) {
    .grid-cards {
        grid-template-columns: repeat(1, 1fr) !important;
    }
}



.card-guest {
    background-image: url("../images/bg_guest.png");
    background-size: contain;
    background-position: right top;
    background-repeat: no-repeat;
    background-color: var(--viking-oxford-500);
    width: 100%;
    overflow: auto;
}

@media(max-width: 992px) {
    .card-guest-mobile {
        flex-direction: column;
    }
}

.progress-bar {
    display: flex !important;
    height: 10px !important;
    border-radius: 5px !important;
    overflow: hidden !important;
    width: 100% !important;
    background-color: transparent !important;
    margin-top: 8px !important;
}

.segment {
    height: 100% !important;
}


.buttons-modal-guests{
    width: 100%;
    max-width: 60px !important;
}

.increment-decrement-buttons{
    height: 10px !important;
    width: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    padding: 0 !important;
    background-color: var(--viking-grey-100) !important;
    transition: background-color 0.3s ease; 

}

.increment-decrement-buttons:hover {
    background-color: var(--viking-oxford-600) !important;
}

.custom-dialog > .rz-dialog-content {
    padding: 0 !important;
}

.event-guest-form-modal > .rz-dialog-content {
    padding: 1rem 1.25rem 1.25rem !important;
}

.custom-size-dialog{
    height: 700px !important;
    overflow: auto !important;
}

.custom-size-dialog #supplier-form {
    height: 97% !important;
}

.custom-size-dialog form {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.custom-size-dialog .rz-dialog-content, .custom-size-dialog .rz-dialog-content > .rz-stack {
    height: 100%;
}
/* detail events */
.next-button {
    width: 100% !important;
    max-width: 160px !important;
    height: 40px !important;
    background-color: var(--viking-oxford-600) !important;
    font-weight: 700 !important;
}

.back-button {
    width: 100% !important;
    max-width: 160px !important;
    height: 40px !important;
    background-color: transparent !important;
    color: var(--viking-danger-200) !important;
    border: 2px solid var(--viking-danger-200) !important;
    font-weight: 700 !important;
}


.event-card-image {
    width: 100%;
    height: 200px;
    background-color: #CBCBCB;
 
}

.default-event-card-container {
    display: flex;
    flex-direction: column;
}


.default-event-card-content {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: space-between;
    gap: 8px;
}

    .default-event-card-content h6{
        min-height: 48px !important;
    }

    .finished-label {
        margin-top: 30px;
    }


@media screen {
    
}

.guest-button{
    background-color: transparent !important;
    color: var(--viking-oxford-500);
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    padding: 0;
    border-radius: 9999px !important;
    border: none;
    box-shadow: none;
    min-width: 0 !important;
    min-height: 0 !important;
}
@media (hover: hover) and (pointer: fine) {
    .rz-pager-element:not(.rz-state-disabled):not(:active):hover, .rz-button:not(.rz-state-disabled):not(:active):hover {
         text-decoration: none; 
         background-image: none; 
         background-size: 0; 
         box-shadow: none; 
    }
}

.Ticket-page .rz-dropdown-chips .rz-chip {
    background-color: var(--viking-oxford-200);
    color: var(--viking-oxford-500);
}


.Ticket-page .rz-dropdown-chips .rz-chip .rz-button {
    background-color: var(--viking-oxford-200);
    color: var(--viking-oxford-500);
}
.Ticket-page .rz-dropdown:not(:disabled):not(.rz-state-disabled),
.Ticket-page .rz-dropdown:not(:disabled):not(.rz-state-disabled):hover,
.Ticket-page .rz-dropdown:not(:disabled):not(.rz-state-disabled):focus {
    /*border: none !important;*/
    box-shadow: none !important;
    outline: none !important;
}

.Ticket-page .rz-datepicker > .rz-inputtext {
    border: none !important;
}
.Ticket-page .rz-datepicker > .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus{
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

.Ticket-page .rz-chip {
    background-color: var(--viking-oxford-200);
    color: var(--viking-oxford-500);
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: var(--rz-chip-gap);
    padding-block: var(--rz-chip-padding-block);
    padding-inline: var(--rz-chip-padding-inline);
    border-radius: var(--rz-chip-border-radius);
    font-size: var(--rz-chip-font-size);
    font-weight: 600;
}

.Ticket-page .rz-chip .rz-button-md{
    color: var(--viking-oxford-500) !important;
    font-size: 1rem !important;
    padding: .3rem;
    height: auto;
}


.Ticket-page .rz-chip .rz-button-md .rzi {
    color: var(--viking-oxford-500) !important;
    font-size: 1rem !important;
    padding: .3rem;
  
}

/*.Ticket-page .rz-multiselect-header{*/
/*    display: none !important;*/
/*}*/

body:has(.Ticket-page) .rz-multiselect-header{
    display: none !important;
}

/*Layout Event*/
.layout-event {
    position: relative;
    width: 284px;
    height: 595px;
    border: 2px solid var(--viking-oxford-300);
    background-color: #f9f9f9;
    overflow: hidden;
}

.modal-ticket-layout-event {
    margin-inline: auto;
}

.event-title {
    font-size: 1.5rem !important;
    font-weight: 600;
}

.event-date-danger {
    color: var(--viking-danger-200);
}

.period-event-date {
    font-weight: 700;
    color: var(--viking-grey-800);
}

.event-info-container {
    border: solid 1px var(--viking-grey-200);
    border-radius: 8px;
    padding: 1rem;
}

.info-container-text-primary {
    font-size: 14px;
    font-weight: 700;
    color: var(--viking-grey-800);
}

.info-container-text-secondary {
    font-size: 12px;
    font-weight: 500;
    color: var(--viking-grey-600);
}


.layout-item {
    position: absolute;
    cursor: grab;
    padding: 10px;
    background-color: var(--viking-oxford-200);
    color: var(--viking-oxford-400);
    border: solid 1px var(--viking-oxford-500);
    font-weight: 500;
    border-radius: 8px;
    box-sizing: border-box;
    user-select: none;
    display: grid;
    place-items: center;
    text-align: center;
    font-size: .8rem;
}

.layout-item.item-table {
    border-color: var(--viking-color-table);
    background-color: var(--viking-color-table-secondary);
    color: var(--viking-color-table) !important;
}

.layout-item.item-stage {
    border-color: var(--viking-color-stage);
    background-color: var(--viking-color-stage-secondary);
    color: var(--viking-color-stage) !important;
}

.layout-item.item-eventfloor {
    border-color: var(--viking-color-eventfloor);
    background-color: var(--viking-color-eventfloor-secondary);
    color: var(--viking-color-eventfloor) !important;
}

.layout-item.item-entrance {
    border-color: var(--viking-color-entrance);
    background-color: var(--viking-color-entrance-secondary);
    color: var(--viking-color-entrance) !important;
}

.layout-item.item-vip {
    border-color: var(--viking-color-vip);
    background-color: var(--viking-color-vip-secondary);
    color: var(--viking-color-vip) !important;
}

.layout-item.item-bathroom {
    color: var(--viking-color-bathroom) !important;
}

.layout-item.item-bar {
    color: var(--viking-color-bar) !important;
}

.layout-item .item-table-icon {
    display: none
}

.layout-item.item-table .item-table-icon {
    display: block;
    font-size: .9rem;
}

.item-table .resize-icon {
    display: none;
}

.item-table {
    padding: 3px;
}

.resize-icon {
    position: absolute;
    right: 0px;
    bottom: 0px;
    transform: rotate(270deg);
    font-size: 1rem;
    z-index: 5;
    cursor: move;
}

.resize-icon .rzi {
    font-size: 1rem;
}

.item-stage {
    background-color: transparent;
    color: var(--viking-grey-500);
    border-color: var(--viking-grey-500);
}

.item-text {
    background-color: transparent;
    border: none;
    color: var(--viking-grey-500);
    height: auto;
    width: fit-content;
    font-size: .7rem;
    padding: 0;
}

.item-text .resize-icon {
    display: none;
}

.item-right::after {
    content: "➤";
    position: absolute;
    right: -1px;
    top: 3px;
}

.item-left::after {
    content: "➤";
    position: absolute;
    left: -1px;
    top: 3px;
    transform: rotate(180deg);
}

.tablelayout-top-container {
    flex-direction: column;
    justify-content: center !important;
    align-items: center !important;
    gap: 0;
    margin: 1rem 0;
}

.layout-subtitle {
    font-size: 1.1rem;
}
.itens-controler {
    display: flex;
    flex-direction: column;
    gap: .7rem;
}

.tablelayout-top-column {
    display: grid;
    grid-template-columns: 25px 185px 35px 25px;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.itens-controler .tablelayout-add-remove,
.itens-controler .stagelayout-add-remove,
.itens-controler .eventfloorlayout-add-remove,
.itens-controler .entrancelayout-add-remove,
.itens-controler .bathroomlayout-add-remove,
.itens-controler .viplayout-add-remove,
.itens-controler .barlayout-add-remove {
    padding: 1rem;
    border: solid 1px;
    border-radius: 8px;
    min-height: 75px;
    width: 320px;
}

.tablelayout-add-remove {
    border-color: var(--viking-color-table);
    background-color: var(--viking-color-table-secondary);
}

.tablelayout-add-remove p,
.tablelayout-add-remove {
    color: var(--viking-color-table) !important;
}

.tablelayout-add-remove .rz-button.rz-primary,
.tablelayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-table) !important;
}

/*.tablelayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.tablelayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-table) !important;
    color: white !important;
}*/


/* STAGE */
.stagelayout-add-remove {
    border-color: var(--viking-color-stage);
    background-color: var(--viking-color-stage-secondary);
}

.stagelayout-add-remove p,
.stagelayout-add-remove {
    color: var(--viking-color-stage) !important;
}

.stagelayout-add-remove .rz-button.rz-primary,
.stagelayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-stage) !important;
}

.stagelayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.stagelayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-stage) !important;
    color: white !important;
}


/* EVENT FLOOR */
.eventfloorlayout-add-remove {
    border-color: var(--viking-color-eventfloor);
    background-color: var(--viking-color-eventfloor-secondary);
}

.eventfloorlayout-add-remove p,
.eventfloorlayout-add-remove {
    color: var(--viking-color-eventfloor) !important;
}

.eventfloorlayout-add-remove .rz-button.rz-primary,
.eventfloorlayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-eventfloor) !important;
}

.eventfloorlayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.eventfloorlayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-eventfloor) !important;
    color: white !important;
}


/* ENTRANCE */
.entrancelayout-add-remove {
    border-color: var(--viking-color-entrance);
    background-color: var(--viking-color-entrance-secondary);
}

.entrancelayout-add-remove p,
.entrancelayout-add-remove {
    color: var(--viking-color-entrance) !important;
}

.entrancelayout-add-remove .rz-button.rz-primary,
.entrancelayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-entrance) !important;
}

.entrancelayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.entrancelayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-entrance) !important;
    color: white !important;
}

/* BATHROOM */
.itens-controler .bathroomlayout-add-remove {
    border-color: var(--viking-color-bathroom);
    background-color: var(--viking-color-bathroom-secondary);
}

.bathroomlayout-add-remove p,
.bathroomlayout-add-remove {
    color: var(--viking-color-bathroom) !important;
}

.bathroomlayout-add-remove .rz-button.rz-primary,
.bathroomlayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-bathroom) !important;
}

.bathroomlayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.bathroomlayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-bathroom) !important;
    color: white !important;
}


/* VIP */
.viplayout-add-remove {
    border-color: var(--viking-color-vip);
    background-color: var(--viking-color-vip-secondary);
}

.viplayout-add-remove p,
.viplayout-add-remove {
    color: var(--viking-color-vip) !important;
}

.viplayout-add-remove .rz-button.rz-primary,
.viplayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-vip) !important;
}

.viplayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.viplayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-vip) !important;
    color: white !important;
}


/* BAR */
.itens-controler .barlayout-add-remove {
    border-color: var(--viking-color-bar);
    background-color: var(--viking-color-bar-secondary);
}

.barlayout-add-remove p,
.barlayout-add-remove {
    color: var(--viking-color-bar) !important;
}

.barlayout-add-remove .rz-button.rz-primary,
.barlayout-add-remove .rz-button.rz-danger.rz-shade-default {
    background-color: transparent !important;
    color: var(--viking-color-bar) !important;
}

.barlayout-add-remove .rz-button.rz-primary:not(.rz-button.rz-primary.rz-variant-text):hover,
.barlayout-add-remove .rz-button.rz-danger.rz-shade-default:hover {
    background-color: var(--viking-color-bar) !important;
    color: white !important;
}

.add-remover {
    min-width: 25px !important;
    min-height: 25px !important;
    width: 25px;
    height: 25px;
    border-radius: 50% !important;
    padding: 2px !important;
}

.item-table-select {
    min-width: 28px;
    padding: 0;
    background-color: transparent;
    border: 0;
}

    .item-table-select .rz-chkbox-box.rz-state-disabled:before {
        content: "X";
        display: flex;
        align-items: center;
        justify-content: center;
    }

.item-table-select .rz-chkbox-box.rz-state-disabled {
    background-color: var(--viking-grey-100);
    color: var(--viking-grey-300);
    border: none;
}

    .item-table-select .rz-chkbox-box.rz-state-active {
        background-color: var(--viking-color-table);
        color: var(--viking-color-table);
        border: solid 2px var(--viking-turq-500);
        box-shadow: inset 0 0 0 1px var(--viking-white);
    }

.item-table-select .rz-chkbox-box .rzi-check:before {
    content: "";
}

.rz-chkbox-box .rz-state-disabled .rzi-check:before {
    content: "x";
    font-weight: 900;
}

.select-table-modal .rz-dialog-titlebar {
    padding: 1rem;
}

.select-table-modal .rz-dialog-content {
   padding: 1rem;
}

.selected-tables-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.8rem 1rem;
}

@media (max-width: 300px) {
    .selected-tables-info{
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    
    .container-selected-table{
        padding: 0.2rem 1rem !important;
        margin: 1rem 0 !important;
        box-shadow: none !important;
        background-color: transparent !important;
        border: solid 1px var(--viking-oxford-100) !important;
        width: 100% !important;
        max-width :280px !important;
    }

}

.selected-tables-info p {
    margin: 0;
}

.selected-tables-info p:last-child {
    color: var(--rz-primary);
    font-weight: 600;
}

.selected-table-buttons {
    flex-wrap: nowrap !important;
    padding: 0 .5rem;
}

.selected-table-buttons button{
    width: 100%;
   
}


.picker-date-verify .rz-inputtext {
    padding-left: 2.4rem !important;
}

.status-label {
    color: white !important;
    padding: 10px 6px !important;
    border-radius: 8px !important;
    font-weight: bold !important;
    font-size: 0.8rem;
    width: 100%;
    text-align: center;
    background-color: var(--viking-info-300);
    margin-top: 1rem;
}



/*Fim Layout Event*/


/*INVITE RESERVATION PAGE */

.hidden-responsive-image{
    display: block;
}


.spacing-initial-section{
    padding: 2rem;
}

.spacing-initial-rightsection {
    margin-top: 2rem;
    padding: 2rem;
}

.buble-right{
    position: absolute; 
    top:0;
    right: 0;
}

.buble-left {
    position: absolute;
    bottom: 0 ;
    left: 0;
}

.image-buble-left{
    height: 400px !important;
    width: 400px !important;
}

.title-text {
    color: var(--viking-oxford-950);
    font-weight: 700;
    font-size: 38px;
}

.subtitle-text {
    color: var(--viking-oxford-950);
    font-weight: 700;
    font-size: 20px;
}

.attention-invite {
    width: 100%;
    background-color: var(--viking-warning-100);
    padding: 1.5rem;
}

.attention-text {
    color: var(--viking-warning-500);
    text-align: center;
}



.reject-button {
    text-transform: none !important;
    min-height: 32px !important;
    border: 3px solid var(--viking-danger-200);
    color: var(--viking-danger-200) !important;
    font-weight: bold;
    border-radius: 8px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: transparent !important;
}

    .reject-button :hover {
        background-color: #edededa8 !important;
    }

.about-viking {
    margin-top: 2.5rem;
}

@media screen and (max-width: 1020px) {

    .hidden-responsive-image {
        display: none;
    }

    .responsive-location{
        display: flex !important;
        flex-direction: column !important;
        align-items: start !important;
        justify-content: start !important;
    }

    .about-viking {
        margin-top: 1rem;
    }

}



/*   END   */



.text-bold {
    font-weight: 700 !important;
}

.remove-bg-button{
    background-color: transparent !important;
    box-shadow: none;
    border: 0;
}

/*Modal confirmação/Cancelamento*/
.confirm-cancel-modal {
    border-radius: 8px;
}

.confirm-cancel-modal .rz-dialog-content {
    padding: 0;
}

.confirm-cancel-modal .rz-dialog-titlebar-icon {
    display: none;
}

.confirm-cancel-modal .confirm-cancel-btn {
    padding: 1rem;
}

.confirm-cancel-modal .rz-button {
    width: 100%;
}

.confirm-cancel-icon div {
    padding: 1.2rem;
    border-radius: 25px;
    display: flex;
}

.container-confirm div {
    background-color: var(--viking-info-100);
}

.container-cancel div {
    background-color: #e81d1d30;
}



.confirm-cancel-stack {
    padding: 2rem 1rem;
}

.confirm-cancel-icon div .rzi {
    font-size: 3rem;
}

.confirm-cancel-text {
    font-weight: 800;
    font-size: 1.2rem;
    text-align: center;
    width: 250px;
    color: var(--viking-grey-700) !important
}

.confirm-cancel-btn {
    border-top: solid 1px var(--viking-grey-200);
}

.component-class .rz-row {
    gap: 0 !important;
}

.secondary-guests-report{ 
    padding: 1rem; 
}

.custom-dialog-secondary-guests{
    min-width: 1200px !important;
    min-height: 600px !important;
}

.search-button{
    display: flex !important;
    align-items: center !important;
    justify-content: end !important;
    height: 100% !important;
    margin-top: 2rem !important;
}

.spacing-top{ 
    margin-top: 1rem;
}
}

.spacing-top-1rem { 
    margin-top: 1rem;
}

/*Loading Logo*/
.loading-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.loading-logo {
    width: 120px; /* ajuste se quiser */
    animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
    0% {
        opacity: 0.4;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0.4;
    }
}


/*Notification Modal*/
.notification-modal .rz-dialog-content {
    padding: .3rem !important;
}

/*Associate*/
.associate-grid .rz-data-row {
    cursor: pointer !important;
}
/* Lobby */
.content-pages {
    width: 100%;
    max-width: 1054px;
    margin-inline: auto;
}
.card-lobby {
    background-color: var(--viking-white);
    border: 1px solid var(--viking-grey-200);
    border-radius: 8px;
    padding: 1rem;
    cursor: pointer;
    transition: .4s;
}

.card-lobby:hover {
    transform: scale(1.01);
}

.card-lobby .rz-text-h2 {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: .5rem;
}

.card-lobby .rz-text-body1 {
    color: var(--rz-primary);
    font-weight: 800;
}

.guest-box {
    border: 1px solid var(--viking-grey-200);
    border-radius: 8px;
    padding: 1rem;
    display: flex !important;
    align-items: flex-start !important;
    height: 157px;
    overflow: auto;
    background-color: #fff;
}

.guest-pill {
    padding: 6px 16px;
    border-radius: 999px; /* pill */
    border: 1px solid var(--rz-primary);
    color: var(--rz-primary);
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    user-select: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.guest-pill:hover {
    background-color: rgba(var(--rz-primary-rgb), 0.08);
}

.guest-pill.active {
    background-color: var(--rz-primary);
    color: var(--viking-white);
}

.card-member {
    position: relative;
    border: 1px solid var(--viking-grey-100);
    box-shadow: 1px 1px 7px #E0E0E0;
    border-radius: 8px;
    width: 440px;
}

.modal-associate .card-member {
    width: 100%;
}

.card-member-header.premium-member {
    background-color: #E29400;
}

.card-member-header.regular-member {
    background-color: var(--rz-primary);
}

.card-member-header {
    border-radius: 8px 8px 0 0;
}

.card-member-header .rz-text-body1 {
    color: var(--viking-white);
}

.card-member-header {
    padding: 1.5rem 1rem;
}

.card-member-body {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 1rem;
}

.card-member-body .rz-label {
    font-size: 12px;
    color: var(--viking-grey-500);
}

.card-member-body .rz-text-body1 {
    font-size: 12px;
    color: var(--viking-grey-900);
    font-weight: 700;
}

.card-member .member-name {
    font-weight: 700;
    font-size: 1rem;
    max-width: 230px;
}

.member-profile-picture {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 150px;
    height: 150px;
    border: solid 4px var(--viking-white);
    border-radius: 8px;
    object-fit: cover;
}

/*Guest*/
.lobby-guest-title {
    font-size: 1.8rem;
    font-weight: 700;
}

.guest-label {
    font-size: .9rem;
    color: var(--viking-grey-700);

}

.guest-label-title {
    font-size: 1rem;
    color: var(--viking-grey-600);
}

.guest-info {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rz-primary);
}

.guest-access {
    border-radius: 8px;
    color: var(--viking-white);
    padding: .5rem 1.5rem;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
    width: 100%;
    max-width: 300px;
    min-width: 150px;
    margin-inline: auto;
}

.guest-access.access-allowed {
    background-color: var(--rz-success);
}

.guest-access.access-denied {
    background-color: var(--rz-danger);
}

.vertial-divider {
    height: 100%;
    width: 1px;
    border-right: var(--viking-border-default);
}
/*Supplier*/
.column-supllier {
    display: flex;
    flex-direction: column;
}

.visitor-item {
    display: grid;
    grid-template-columns: 50px 1fr auto;
    gap: 1rem;
    padding: 1rem;
    place-items: center;
    border: solid 1px var(--viking-grey-200);
    border-radius: 8px;
    transition: .3s;
}

.visitor-item:hover {
    transform: scale(1.01)
}

.visitor-item-content {
    width: 100%;
}

.visitor-name {
    font-size: 1rem;
    color: var(--rz-primary);
    font-weight: 700;
}

.visitor-observation {
    font-size: 0.875rem;
    color: var(--viking-grey-600);
    display: block;
    margin-top: 0.2rem;
}

.visitor-time {
    font-size: 1rem;
    color: var(--rz-primary);
    font-weight: 600;
}

.visitor-item .rz-radiobutton-label, .rz-radiobutton-template {
    display: none;
}

.visitor-item-actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.visitor-item-actions .rz-button {
    min-width: 36px;
    width: 36px;
    height: 36px;
}

.event-card-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(450px, 1fr));
}

.add-phone {
    position: absolute !important;
    right: 0;
    top: -1.5rem;
}

.guest-card {
    border: solid 1px var(--viking-grey-200);
    padding: 1rem;
    border-radius: 8px;
    position: relative;
    gap: .2rem !important;
}

.guest-card-grid {
    display: grid !important;
    grid-template-columns: 180px 5px 1fr 5px 170px;
}

.guest-card-buttons {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
}

.guest-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.events-card-lobby-txt {
    color: var(--viking-grey-900);
}

.guest-allow-access {
    width: 100% !important;
}

.see-access-modal .rz-dialog-content {
    padding: 0 !important;
}

.see-access-modal .access-container-modal {
    padding: 20px;
}

.access-allowed-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    flex-wrap: wrap;
}

.invites-guest {
    border-radius: 50px;
    padding: 0.1rem .5rem;
    background-color: var(--viking-allow-access-bg);
    align-items: center;
    white-space: nowrap;
}

.invites-guest p,
.invites-guest label {
    color: var(--viking-white) !important;
}

.invites-guest.absent {
    background-color: var(--viking-grey-100);
}

.invites-guest.absent p {
    color: var(--viking-grey-700) !important;
}

.add-guest .invites-guest.absent:hover,
.add-guest .invites-guest.absent.selected {
    background-color: var(--rz-primary);
    color: var(--viking-white);
    transform: scale(1.03);
}

.add-guest .invites-guest.absent p:hover,
.add-guest .invites-guest.absent.selected p {
    color: var(--viking-white) !important;
}

.guests-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    flex-wrap: wrap !important;
}

allow-access-modal{}

.invited-container-modal .invites-guest {
    display: flex;
    gap: .5rem;
}
.invited-container-modal {
    padding: 1rem;
    border: var(--viking-border-default);
    border-radius: 8px;
    gap: .5rem;
}

.invited-container-modal.guest-invited-container {
    max-height:105px;
    overflow-y: auto;
}

    .invited-container-modal .absent {
        border: 2px solid var(--viking-grey-200) !important;
        background-color: var(--viking-grey-50);
        padding: .1rem 1rem !important;
    }

.invited-container-modal .absent p,
.invited-container-modal .absent i {
    color: var(--viking-grey-200) !important;
    font-weight: 700;
}

.invited-container-modal .absent.selected {
    background-color: var(--viking-oxford-200) !important;
    border: 2px solid var(--viking-oxford-200) !important;
}

.invited-container-modal .absent.selected p,
.invited-container-modal .absent.selected i {
    color: var(--viking-oxford-600) !important;
}

.access-container-stack {
    display: flex !important;
    flex-direction: column !important;
}

.allow-access-tag,
.denied-access-tag {
    display: inline-block;
    border-radius: 4px;
    font-weight: 800;
    /*border: solid 1px;*/
    font-size: .8rem;
    padding: .5rem 1rem
}

.allow-access-tag {
    border-color: var(--viking-allow-access-clr);
    color: var(--viking-white);
    background-color: var(--viking-allow-access-bg);
}

.denied-access-tag {
    border-color: var(--viking-denied-access-clr);
    color: var(--viking-white);
    background-color: var(--viking-denied-access-bg);
}

.dependent-grid thead tr,
.dependent-grid .rz-grid-table thead,
.dependent-grid .rz-grid-table thead th:not(:last-child),
.dependent-grid .rz-grid-table thead th > div:not(.rz-cell-filter),
.dependent-grid .rz-grid-table-fixed thead .rz-frozen-cell-right.rz-frozen-cell-right-end,
.dependent-grid .rz-grid-table th:last-child {
    background-color: var(--viking-dependent-clr) !important;
    border-color: var(--viking-dependent-clr) !important;
}

.lobby-actions i.rzi {
    bottom: 24px !important;
}

.lobby-event-tabs .rz-tabview-nav {
    justify-content: space-between !important;
    flex-wrap: wrap;
}

.lobby-event-tabs .card-lobby {
    cursor: default !important;
}

.lobby-event-tabs .card-lobby:hover {
    transform: scale(1);
}

.contact-phone {
    display: grid !important;
    grid-template-columns: 1fr 50px;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--viking-grey-200);
    border-radius: 8px;
}

.lobby-contact-card {
    width: 100%;
}

.label-phone {
    font-weight: 800;
    color: var(--viking-grey-900);
}

.status-access {
    display: block;
    text-align: center;
    margin: .5rem 0;
}

.supplier-guest-list {
    padding: .5rem;
    border: solid 1px var(--viking-grey-200);
    border-radius: 8px;
    min-height: 100px;
    overflow: auto;
    align-items: flex-start !important;
    gap: .5rem !important;
}

.check-invited {
    border-radius: 50%;
}

.label-form {
    font-weight: 700;
    color: var(--viking-grey-600);
}

.supplier-info {
    text-align: center;
}

.associate-visitor-container {
    max-height: 115px;
    overflow: auto;
}

.visitor-input input:not(:hover){
    border: none !important;
    box-shadow: 0 0 0 1px var(--viking-grey-400) !important;
}

.visitor-modal-input .rz-dropdown,
.visitor-modal-input .rz-form-field.rz-state-disabled.rz-variant-outlined .rz-form-field-content{
    box-shadow: none !important;
}

.visitor-modal-input .rz-form-field-content {
    margin: 0 !important;
}

.roles-container .rz-stack {
    width: unset !important;
}

.roles-container {
    border: none !important;
    box-shadow: none !important;
}

.notification-container {
    position: relative;
}

.btn-clear-notification {
    position: absolute;
    top: .4rem;
    right: .7rem;
}

.notification-box {
    transition: .3s !important;
}

.notification-box:hover {
    transform: scale(1.04) !important;
}

.notification-box,
.notification-box:focus,
.notification-box:active {
    outline: none !important;
    box-shadow: none !important;
}

    .notification-box .rz-button {
        box-shadow: none !important;
    }

    .notification-box::after,
    .notification-box::before {
        display: none !important;
    }


.page-title {
    font-size: 1.4rem !important;
    font-weight: 500 !important;
    margin-bottom: 1rem !important;
}

.category-item {
    border: solid 1px var(--viking-grey-400);
    border-radius: 70px;
    padding: 0.5rem 1rem;
    cursor: pointer;
    transition: .2s;
    font-size: 14px !important;
    background-color: #fff;
}

.category-item:hover {
    background-color: var(--viking-grey-50);
}

.category-item.category-selected{
    background-color: #000000;
    color: var(--viking-white);
}

.category-row {
    gap: .5rem !important;
}

.dates-filter {
    width: 160px !important;
}

.dates-filter input{
    border-radius: 50px !important;

}

.filter-buttons {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.input-pill {
    border-radius: 50px;
}

.status-pill {
    width: 155px !important;
}

body:has(.status-pill) .rz-dropdown-panel {
    width: 250px !important;
}

.label-font-size {
    font-size: 1rem !important;
    font-weight: 600 !important;
}

.rz-grid-table thead th .rz-column-title-content {
    font-size: 1rem;
}

.visitor-modal :not(.rz-form-field-content) > .rz-textbox:disabled,
.visitor-modal .rz-form-field.rz-state-disabled :not(.rz-button):disabled,
.visitor-modal .rz-form-field.rz-state-disabled .rz-form-field-content,
.visitor-modal .rz-form-field.rz-state-disabled :not(.rz-button).rz-state-disabled.rz-dropdown {
    background: #0000000f !important;
    color: #adadad !important;
}

.visitor-modal .rz-form-field.rz-state-disabled :not(.rz-button).rz-state-disabled,
.visitor-modal .rz-form-field.rz-state-disabled .rz-form-field-content {
    background-color: transparent !important;
}


.rz-datepicker > .rz-inputtext:not(:disabled):not(.rz-state-disabled):hover {
    border: none !important;
    box-shadow: 0 0 0 2px var(--viking-grey-500)
}
.rz-datepicker > .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus {
    box-shadow: 0 0 0 2px var(--viking-oxford-600) !important;
}


@media(max-width: 720px) {
    .rz-dialog:not(.rz-dialog-confirm):not(.rz-dialog-alert) {
        width: 100% !important;
        max-width: 97% !important;
        inset-block-start: initial !important;
        border-radius: 0;
    }

    .rz-dialog-wrapper {
        padding: .5rem !important
    }
}

.vehicle-tree .rz-treenode-children {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: .5rem;
    margin-top: .2rem;
}

.vehicle-tree .rz-treenode-children .rz-treenode {
    padding: 0 !important;
    padding-inline-start: 0 !important;
}

.vehicle-tree .rz-treenode-children .rz-treenode-content .rz-treenode-label {
    padding: 0 !important;
}

.vehicle-tree .rz-treenode-content label {
    margin: 0!important;
}

.card-default {
    box-shadow: none !important;
    border: var(--viking-border-default) !important;
}

.guest-input {
    margin-top: .5rem !important;
}

.guest-input .component-class:has( .rz-chkbox-box) {
    flex-direction: row-reverse !important;
    gap: .5rem;
}

    .guest-input .component-class:has( .rz-chkbox-box) .input-container {
        width: auto;
    }



/* FORMULÁRIO DE RESTRIÇÃO - ADMIN */

.custom-datepicker input {
    color: transparent !important;
}

.full-width {
    width: 100%;
}

.datepicker-wrapper {
    position: relative;
}

.datepicker-overlay-text {
    position: absolute;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
    pointer-events: none;
    color: #555;
}

.datepicker-actions {
    margin-top: 5px;
}

.validation-text {
    color: red;
    font-size: 12px;
}


/* MODAL  DE RESTRIÇÃO - ADMIN */
.date-list {
    width: 100%;
}

.date-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
}

.date-text {
    font-size: 14px;
}

.date-icon {
    font-size: 20px;
    color: var(--rz-text-secondary-color);
}



.CustomDatesModal{
    max-height: 600px !important;
}


.danger-text {
    color: var(--viking-danger-200);
    align-items: center;
    display: flex;
    gap: .5rem;
}

.event-registered-edit-card{
    width: 100%; 
    max-width: 1200px;
}

.event-registered-edit-alert-container{
    background: var(--viking-danger-50);
    width: auto;
    border-radius: 2rem;
    padding: 1rem;
}

.event-registered-edit-alert-text{
    color: var(--viking-danger-500) !important;
}

/*Tutorial*/
.tutorial-menu-container {
    position: relative;
}

.sidebar-container .tutorial-menu-window {
    display: none;
}

.sidebar-container.sidebar-expanded .tutorial-menu-window {
    display: block;
}

.tutorial-menu-window {
    position: absolute;
    top: 6px;
    right: 14px;
    color: #fff !important;
}

.tutorial-alert.rz-alert.rz-warning.rz-shade-lighter {
    background-color: var(--rz-warning-lighter);
}

.tutorial-alert .rz-alert .rz-alert-item .rz-alert-icon {
    display: block !important;
}

.tutorial-menu-window .rz-link-text {
    font-size: 20px !important;
}

.tutorial-container .rz-row {
    width: 800px;
    margin-inline: auto;
}

.tutorial-empty h2, .tutorial-empty p {
    color: var(--viking-grey-600) !important;
    text-align: center;
    margin: 0 !important;
}

.tutorial-empty h2 {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: -.5rem !important;
}

.tutorial-empty p {
    font-size: 1.2rem;
}

.tutorial-container .rz-card {
    height: auto;
    aspect-ratio: 1/1;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    justify-content: center;
    align-items: center;
    transition: transform 0.4s, border 0.4s;
    cursor: pointer;
    border: 2px solid transparent;
    position: relative;
    z-index: 0;
}

.tutorial-container .rz-card::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border: 2px solid var(--rz-primary);
    z-index: -1;
    border-radius: inherit;
    opacity: 0;
    transform: scale(0.95);
    transition: transform 0.4s, opacity 0.4s;
}

.tutorial-container .rz-card:hover {
    transform: scale(1.04);
}

.tutorial-container .rz-card:hover::before {
    opacity: 1;
    transform: scale(1);
}

.tutorial-accordion .rz-link {
    flex-direction: row;
    padding-left: 1rem;
}

.tutorial-title {
    font-size: 30px !important;
    font-weight: 700 !important;
}

.tutorial-page-line {
    width: 100%;
    height: 1px;
    border: none;
    border-bottom: solid 1px var(--viking-grey-100);
    opacity: 1;
    margin-bottom: 1rem;
}

.img-tutorial {
    display: block;
    margin-inline: auto;
    max-width: 800px;
    width: 100%;
    margin-bottom: 1rem;
}

.img-tutorial-mobile {
    max-width: 350px;
}

.aside-tutorial-menu {
    position: sticky;
    top: .5rem;
    height: calc(95vh - 106px);
    overflow: hidden;
    padding-bottom: 5rem;
    padding-right: 1rem;
    border-right: solid 1px var(--viking-grey-100);
}

.aside-tutorial-menu .rz-textbox {
    box-shadow: none;
    border: var(--viking-border-default) !important;
}

.aside-tutorial-menu .rz-textbox:not(:disabled):not(.rz-state-disabled):hover,
.aside-tutorial-menu .rz-textbox:not(:disabled):not(.rz-state-disabled):focus {
    box-shadow: none;
    border: solid 1px var(--rz-primary) !important;
}

.aside-tutorial-menu .rz-treenode-content-selected .rz-treenode-label {
    color: var(--viking-primary) !important;
    background-color: transparent !important;
}

.content-tutorial-menu {
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    justify-content: center;
}

.content-tutorial-menu .rz-stack {
    max-width: 800px;
}

.tutorial-inicial-text {
    margin-bottom: 1.5rem;
}

.tutorial-step-block {
    background-color: var(--viking-tutorial-stack-bg);
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 2rem;
}

.tutorial-step-block ul {
    padding-left: 2rem;
}

.tutorial-step-block li {
    list-style: disc !important;
}

.tutorial-step-text {
    font-size: 1rem !important;
    font-weight: 700 !important;
    margin-bottom: 1rem;
}

.tutorial-step-text strong {
    font-weight: 900;
    color: var(--viking-tutorial-highlight-text);
}

.tutorial-step-number {
    background-color: var(--viking-tutorial-number-bg);
    color: var(--rz-primary);
    font-weight: 700;
    padding: .5rem;
    border-radius: 50%;
    display: inline-block;
    padding: .5rem 1rem;
}

.aside-tutorial-menu .rz-tree-container label {
    margin: 0 !important;
}

@media(max-width: 1200px) {
    .aside-tutorial-menu .rz-treenode {
        padding-inline-start: 1rem;
    }

    .aside-tutorial-menu .rz-tree-container > .rz-treenode {
        padding: 0 !important;
    }

    .aside-tutorial-menu .rz-tree-toggler {
        left: 0;
        margin: 0 !important;
    }
}
/*End Tutorial*/