@import '_content/Blazorise.RichTextEdit/Blazorise.RichTextEdit.ujcws5bfym.bundle.scp.css';

/* _content/SkyCentral.App.SelfService/Components/Email-builder.razor.rz.scp.css */

/* _content/SkyCentral.App.SelfService/Components/StripoEditor.razor.rz.scp.css */
html[b-w8d5a1nyqw], body[b-w8d5a1nyqw] {
    min-width: 1200px;
    height: 100%;
}

#stripoEditorContainer[b-w8d5a1nyqw] {
    height: calc(100% - 48px);
}

#externalSystemContainer[b-w8d5a1nyqw] {
    background-color: darkgrey;
    padding: 5px 20px;
    display: flex;
    justify-content: space-between;
}

.control-button[b-w8d5a1nyqw] {
    border-radius: 17px;
    padding: 5px 10px;
    border-color: grey;
    cursor: pointer;
}

#exportButton[b-w8d5a1nyqw],
#saveButton[b-w8d5a1nyqw] {
    background: #b5e8b5;
}

.btn-group button[b-w8d5a1nyqw] {
    padding: 5px 10px;
    cursor: pointer;
    float: left;
}

    .btn-group button.rounded-left[b-w8d5a1nyqw] {
        border-radius: 17px 0 0 17px;
    }

    .btn-group button.rounded-right[b-w8d5a1nyqw] {
        border-radius: 0 17px 17px 0;
    }

    .btn-group button.active[b-w8d5a1nyqw] {
        background-color: darkgrey;
    }

.avatar-preview[b-w8d5a1nyqw] {
    width: 34px;
    height: 34px;
    border-radius: 15px;
    background-size: cover;
    display: inline-block;
    margin-left: 5px;
}
/* Notifications styles */
.notification-zone[b-w8d5a1nyqw] {
    position: fixed;
    width: 400px;
    z-index: 99999;
    right: 30px;
    bottom: 80px;
}

.alert-success[b-w8d5a1nyqw] {
    color: #046904;
    background: #b5e8b5;
    padding: 5px 10px;
    border: 2px solid #046904;
    border-radius: 15px;
}

.alert-info[b-w8d5a1nyqw] {
    color: hsla(215, 32%, 56%, 1);
    background: hsla(215, 87%, 94%, 1);
    padding: 5px 10px;
    border: 2px solid #046904;
    border-radius: 15px;
}
/* _content/SkyCentral.App.SelfService/Components/Wizard.razor.rz.scp.css */
.wizard[b-hnom1oo3a8] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 200px);
    max-height: calc(100vh - 200px);
}

.wizard-steps[b-hnom1oo3a8] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    position: relative;
}
.wizard-step-container[b-hnom1oo3a8] {
    display: flex;
    overflow: auto;
    align-items: center;
    flex-direction: column;
    position: relative;
    flex: 1;
}
.wizard-step[b-hnom1oo3a8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
    flex: 1;
}

.step-circle[b-hnom1oo3a8] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #ddd;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 8px;
    transition: background-color 0.3s, color 0.3s;
}

    .step-circle i[b-hnom1oo3a8] {
        font-size: 18px;
        color: inherit;
    }

.wizard-step.active .step-circle[b-hnom1oo3a8] {
    background-color: #007bff;
    color: #fff;
}

.step-title[b-hnom1oo3a8] {
    font-size: 14px;
    text-align: center;
    color: #333;
}

.step-line[b-hnom1oo3a8] {
    width: 100%;
    height: 4px;
    background-color: #ddd;
    margin-top: 8px;
    transition: background-color 0.3s;
}

    .step-line.active[b-hnom1oo3a8] {
        background-color: #007bff;
    }

.wizard-content[b-hnom1oo3a8] {
    flex: 1 1 auto;
    overflow-y: auto; /* Allow scrolling if content overflows */
    padding: 16px;
    background-color: #fff;
}

.wizard-navigation[b-hnom1oo3a8] {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background-color: #f8f9fa;
    flex-wrap: wrap; /* Allow buttons to stack on small screens */
    gap: 8px;
    border-top: 1px solid #ddd;
}

.wizard-navigation-left[b-hnom1oo3a8] {
    flex: 1;
    display: flex;
    justify-content: flex-start;
}

.wizard-navigation-right[b-hnom1oo3a8] {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 16px; /* Adds spacing between Next and Finish buttons */
}
/* _content/SkyCentral.App.SelfService/Pages/MessageBuilder/MainEditor.razor.rz.scp.css */
/* _content/SkyCentral.App.SelfService/Pages/Nps/NpsDashboard.razor.rz.scp.css */
.wizard[b-6inm9n7kxh] {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
    height: calc(100vh - var(--mud-appbar-height) - 75px);
    overflow: hidden;
    position: relative;
}

.wizard-content[b-6inm9n7kxh] {
    flex: 1; /* This ensures content takes up the remaining space above the navigation */
    overflow-y: auto; /* Allow scrolling if content overflows */
    padding: 16px;
    height: calc(100vh - var(--mud-appbar-height) - 195px);
    background-color: #fff;
}

.wizard-navigation[b-6inm9n7kxh] {
    flex-shrink: 0; /* Prevent shrinking */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background-color: #f8f9fa;
    border-top: 1px solid #ddd;
    gap: 8px; /* Space between buttons */
    position: sticky; /* Stick the navigation to the bottom of its parent */
    bottom: 0; /* Anchor it to the bottom */
}

.wizard-navigation-left[b-6inm9n7kxh] {
    flex: 1;
    display: flex;
    justify-content: flex-start;
}

.wizard-navigation-right[b-6inm9n7kxh] {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 16px; /* Adds spacing between Next and Finish buttons */
}

.custom-drawer .mud-drawer-content[b-6inm9n7kxh] {
    height: calc(100vh - var(--mud-appbar-height) - 195px);
    max-height: calc(100vh - var(--mud-appbar-height) - 195px);
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Components/InteractiveChapterView.razor.rz.scp.css */
.leftContainer[b-ce316x5jn2] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    zoom: 55%;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-ce316x5jn2] {
        float: left;
        width: 414px;
    }

.moduleContainer[b-ce316x5jn2] {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    height: 896px;

}

.header[b-ce316x5jn2] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    z-index: 500;
}

.content[b-ce316x5jn2] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-ce316x5jn2] {
    border-color: blue;
}

.guidecontent[b-ce316x5jn2] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.wrapper[b-ce316x5jn2] {
    margin: 0 auto;
    max-width: 1000px;
    height: 100vh;
    overflow: hidden !important;
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.img[b-ce316x5jn2] {
    border-radius: 25px;
}

.mud-grid-item img[b-ce316x5jn2] {
    width: 100%!important;
}

.viewcontent[b-ce316x5jn2] {
    color: #424242;
    border: solid;
    margin: 0.25rem;
    border-color: #e13c27;
    border-radius: 25px;
    border-width: 1px;
    height: 100%;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-x: hidden;
    width: 400px;
    height: 760px;
}

.mud-dialog .mud-dialog-content[b-ce316x5jn2] {
    padding: 2px 2px !important;
}

.mud-paper[b-ce316x5jn2] {
    background-color: transparent!important;
}

[b-ce316x5jn2]::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* make scrollbar transparent */
}

.orana-dialog-container[b-ce316x5jn2] {
    height: auto;
    min-height: 30vh;
    max-height: 90vh;
    overflow-y: scroll;
    padding-bottom: 10vh;
}

.float-bottom-right[b-ce316x5jn2] {
    position: fixed;
    bottom: 75px;
    right: 5px;
    opacity: 0.6;
    color: #FFF;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Components/InteractiveGalleryContent.razor.rz.scp.css */
.leftContainer[b-zovv7vxfqf] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-zovv7vxfqf] {
        float: left;
        width: 414px;
    }

.header[b-zovv7vxfqf] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-zovv7vxfqf] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-zovv7vxfqf] {
    height: 100% !important;
}

.mainContent[b-zovv7vxfqf] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-zovv7vxfqf] {
    border-color: blue;
}

.guidecontent[b-zovv7vxfqf] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}

.img[b-zovv7vxfqf] {
    border-radius: 25px !important;
}

figure[b-zovv7vxfqf] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}

figcaption[b-zovv7vxfqf] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}

img[b-zovv7vxfqf] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Components/InteractiveGalleryView.razor.rz.scp.css */
.leftContainer[b-lz0j0tmyfd] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-lz0j0tmyfd] {
        float: left;
        width: 414px;
    }

.header[b-lz0j0tmyfd] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-lz0j0tmyfd] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-lz0j0tmyfd] {
    height: 100% !important;
}

.mainContent[b-lz0j0tmyfd] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-lz0j0tmyfd] {
    border-color: blue;
}

.guidecontent[b-lz0j0tmyfd] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}

.img[b-lz0j0tmyfd] {
    border-radius: 25px !important;
}

figure[b-lz0j0tmyfd] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}

figcaption[b-lz0j0tmyfd] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}

img[b-lz0j0tmyfd] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Components/InteractivePageContent.razor.rz.scp.css */
.leftContainer[b-6k7oo6tklq] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    zoom: 55%;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-6k7oo6tklq] {
        float: left;
        width: 414px;
    }

.moduleContainer[b-6k7oo6tklq] {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    height: 896px;
}

.header[b-6k7oo6tklq] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    z-index: 500;
}

.content[b-6k7oo6tklq] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-6k7oo6tklq] {
    border-color: blue;
}

.guidecontent[b-6k7oo6tklq] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}

.wrapper[b-6k7oo6tklq] {
    margin: 0 auto;
    max-width: 1000px;
    height: 100vh;
    overflow: hidden !important;
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.img[b-6k7oo6tklq] {
    border-radius: 25px;
}

.mud-grid-item img[b-6k7oo6tklq] {
    width: 100%!important;
}

.viewcontent[b-6k7oo6tklq] {
    color: #424242;
    border: solid;
    margin: 0.25rem;
    border-color: #e13c27;
    border-radius: 25px;
    border-width: 1px;
    height: 100%;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-x: hidden;
    width: 400px;
    height: 760px;
}

.mud-dialog .mud-dialog-content[b-6k7oo6tklq] {
    padding: 2px 2px !important;
}

.mud-paper[b-6k7oo6tklq] {
    background-color: transparent!important;
}

[b-6k7oo6tklq]::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* make scrollbar transparent */
}

.orana-dialog-container[b-6k7oo6tklq] {
    height: auto;
    min-height: 30vh;
    max-height: 90vh;
    overflow-y: scroll;
    padding-bottom: 10vh;
}

.float-bottom-right[b-6k7oo6tklq] {
    position: fixed;
    bottom: 75px;
    right: 5px;
    opacity: 0.6;
    color: #FFF;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Components/InteractivePhoneView.razor.rz.scp.css */
.leftContainer[b-qntq0fy6k5] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-qntq0fy6k5] {
        float: left;
        width: 414px;
    }

.header[b-qntq0fy6k5] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-qntq0fy6k5] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-qntq0fy6k5] {
    height: 100% !important;
}

.mainContent[b-qntq0fy6k5] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-qntq0fy6k5] {
    border-color: blue;
}

.guidecontent[b-qntq0fy6k5] {
    width: 414px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 35px;
}

.img[b-qntq0fy6k5] {
    border-radius: 25px !important;
}

figure[b-qntq0fy6k5] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}
    figure img[b-qntq0fy6k5] {
        width: 100%;
        height: 100px;
        object-fit: cover;
    }

    figure figcaption[b-qntq0fy6k5] {
        background-color: #222;
        color: #fff;
        font: italic smaller sans-serif;
        padding: 3px;
        text-align: center;
    }

/*img {
    width: 100%;
    height: 100px;
    object-fit: cover;
}*/
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Components/ProgressBarLoading.razor.rz.scp.css */
/*.center-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}*/
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Dashboards/CommunicationManager.razor.rz.scp.css */
/* Outer container to center the box */
.outer-container[b-3ove65rinu] {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    height: 100%; /* Full viewport height */
}

/* Content box to contain the layout */
.content-box[b-3ove65rinu] {
    width: 100%; /* Adjust width as needed */
    height: 85vh; /* Stops before the bottom of the screen */
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden; /* Ensure content stays within bounds */
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Dashboards/Components/Inserts/ListingUnifiedMessages.razor.rz.scp.css */
/* -------------------------------------------- */
/* 1) Ensure the chat container fills its parent */
/* -------------------------------------------- */
.chat-container[b-uemekttnhz] {
    display: flex;
    flex-direction: column;
    height: 100%; /* Fill all of “.middle-column” */
    overflow: hidden; /* Prevent outer overflow—only inner scroll */
}

/* -------------------------------------------- */
/* 2) Scrollable list of message bubbles        */
/* -------------------------------------------- */
.chat-messages[b-uemekttnhz] {
    flex: 1; /* Take all space above the reply bar */
    overflow-y: auto; /* Vertical scrolling if content exceeds */
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px; /* Spacing between each bubble */
    background-color: #FAFAFA; /* Very light gray behind the bubbles */
}

/* -------------------------------------------- */
/* 3) Bubble wrappers: justify left or right    */
/* -------------------------------------------- */
.incoming-message[b-uemekttnhz],
.outgoing-message[b-uemekttnhz],
.internal-message[b-uemekttnhz] {
    display: flex;
    position: relative;
}

.incoming-message[b-uemekttnhz] {
    justify-content: flex-start; /* Guest‐sent messages on left */
}

.outgoing-message[b-uemekttnhz] {
    justify-content: flex-end; /* Host‐sent messages on right */
}

.internal-message[b-uemekttnhz] {
    justify-content: flex-start; /* Host‐sent messages on right */
}
/* -------------------------------------------- */
/* 4) The “bubble” itself                       */
/* -------------------------------------------- */
.message-bubble[b-uemekttnhz] {
    max-width: 70%; /* Never exceed 70% of width */
    padding: 10px 14px;
    border-radius: 16px;
    word-wrap: break-word;
    line-height: 1.4;
    position: relative;
    min-width: 50%;
}

/* Incoming vs. outgoing background & corner styling */
.incoming-message .message-bubble[b-uemekttnhz] {
    background-color: #FFFFFF; /* White for guest messages */
    border: 1px solid #E0E0E0; /* Subtle border so it stands out */
    border-bottom-left-radius: 0; /* Flat corner on bottom-left */
    text-align: left;
}

.outgoing-message .message-bubble[b-uemekttnhz] {
    background-color: #DCF8C6; /* Light green for host messages */
    border-bottom-right-radius: 0; /* Flat corner on bottom-right */
    text-align: right;
}

.internal-message .message-bubble[b-uemekttnhz] {
    background-color: darkgreen; /* Light green for host messages */
    border-bottom-right-radius: 0; /* Flat corner on bottom-right */
    text-align: right;
}

/* -------------------------------------------- */
/* 4b) NEW: Unread differentiator                */
/* -------------------------------------------- */
.incoming-message.unread .message-bubble[b-uemekttnhz] {
    background-color: #FFF3CD; /* Pale yellow for unread */
    border-left: 4px solid #FFC107; /* Gold‐tone accent on the left */
}

/* -------------------------------------------- */
/* 5) Timestamp styling                         */
/* -------------------------------------------- */
.time-date[b-uemekttnhz] {
    font-size: 10px;
    color: #666;
    margin-top: 5px;
    display: block;
    text-align: right;
}

/* -------------------------------------------- */
/* 6) Message actions (for incoming)            */
/* -------------------------------------------- */
.message-actions[b-uemekttnhz] {
    display: flex;
    gap: 5px;
    position: absolute;
    bottom: 5px; /* Float inside the bubble, bottom-left */
    left: 8px;
}

.action-button[b-uemekttnhz] {
    background: none;
    border: none;
    font-size: 16px;
    cursor: pointer;
    padding: 5px;
    color: #555;
    transition: color 0.3s ease;
}

    .action-button:hover[b-uemekttnhz] {
        color: #007BFF; /* Blue on hover */
    }

/* -------------------------------------------- */
/* 7) “No messages” placeholder                 */
/* -------------------------------------------- */
.no-messages[b-uemekttnhz] {
    margin: auto;
    color: #666;
    font-style: italic;
}

/* -------------------------------------------- */
/* 8) Reply bar pinned at bottom                */
/* -------------------------------------------- */
.chat-reply[b-uemekttnhz] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background-color: #FFF;
    border-top: 1px solid #DDD;
    flex-shrink: 0; /* Never shrink—always visible */
}

/* “Reply type” dropdowns (Email/SMS/WhatsApp/Chat/Airbnb) */
.reply-type[b-uemekttnhz] {
    padding: 5px;
    border: 1px solid #CCC;
    border-radius: 5px;
    font-size: 14px;
    min-width: 100px;
}

/* Text area for typing reply */
.reply-input[b-uemekttnhz] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    resize: vertical; /* let user expand vertically */
    font-family: inherit;
    font-size: 0.95rem;
}

/* Send button styling */
.send-button[b-uemekttnhz] {
    background-color: #007BFF;
    color: #FFF;
    border: none;
    padding: 8px 12px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .send-button:hover[b-uemekttnhz] {
        background-color: #0056B3;
    }

.editor-wrapper[b-uemekttnhz] {
    display: flex;
    align-items: stretch;
    width: 100%;
    /* adjust height as needed */
    /* e.g. you might want a fixed height, or let it grow/shrink */
}

.tab‐box[b-uemekttnhz] {
    display: flex;
    flex-direction: column;
    width: 48px; /* very narrow so it’s just a “tab” strip */
    border: 1px solid #ccc;
    border-right: none;
    background-color: #f5f5f5;
}

.tab‐button[b-uemekttnhz] {
    writing-mode: vertical-rl; /* rotate text vertically */
    text-orientation: mixed; /* keep letters upright */
    padding: 8px 4px;
    cursor: pointer;
    user-select: none;
    text-align: center;
    border-bottom: 1px solid #ddd;
    font-size: 0.85rem;
}

    .tab‐button:last-child[b-uemekttnhz] {
        border-bottom: none;
    }

    .tab‐button.active[b-uemekttnhz] {
        background-color: white;
        font-weight: bold;
        border-left: 3px solid #0078d4; /* highlight the active tab */
    }

.editor‐content[b-uemekttnhz] {
    flex: 1;
    border: 1px solid #ccc;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
}

.reply‐input[b-uemekttnhz] {
    flex: 1;
    resize: vertical;
    padding: 0.5rem;
    font-size: 1rem;
}

.reply-input .ql-container[b-uemekttnhz] {
    resize: vertical; /* allow vertical resizing */
    overflow: auto; /* must be auto/scroll for resize to work */
    min-height: 150px; /* you can adjust this to taste */
}

.reply-input .ql-editor[b-uemekttnhz] {
    min-height: 120px; /* initial height of the editable area */
}

.reply-input .ql-container[b-uemekttnhz]::after {
    content: "";
    display: block;
    width: 100%;
    height: 8px;
    cursor: ns-resize; /* show the resize cursor across the bottom edge */
    background: transparent;
    position: absolute;
    bottom: 0;
    left: 0;
}

.button‐row[b-uemekttnhz] {
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.refresh-icon[b-uemekttnhz] {
    cursor: pointer;
    color: #32e70d;
}
/* Container around both toolbar + template dropdown */
.toolbar-container[b-uemekttnhz] {
    width: 100%;
    max-width: 33%; /* never wider than one‐third */
    min-width: 200px; /* optional: ensure it doesn’t get too small */
    margin-bottom: 1rem; /* spacing below toolbar */
    align-self: flex-start;
}

/* The toolbar itself: flex to push items to opposite sides */
.toolbar[b-uemekttnhz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.25rem 0.5rem;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* Refresh button styling */
.refresh-button[b-uemekttnhz] {
    background: none;
    border: none;
    font-size: 1.25rem; /* make the ⟳ icon a bit larger */
    cursor: pointer;
    color: #333; /* dark gray icon */
}

    .refresh-button:hover[b-uemekttnhz] {
        color: #000; /* darker on hover */
    }

/* The select for “type” */
.reply-type[b-uemekttnhz] {
    font-size: 0.9rem;
    padding: 0.3rem 0.5rem;
}

/* When the template‐select is shown, we put it in its own block,
       and match its width exactly to the toolbar above by also using width:100% */
.template-container[b-uemekttnhz] {
    width: 100%;
    padding: 0.5rem 1rem; /* same left/right padding as .toolbar so they align perfectly */
    background-color: #fff; /* if you want it to have its own background */
    box-sizing: border-box;
    border-bottom: 1px solid #ccc; /* optional, if you want to separate it from content below */
}

    /* If you want the template dropdown itself to fill the entire toolbar width,
       you can add: */
    .template-container .reply-type[b-uemekttnhz] {
        width: 100%;
        box-sizing: border-box;
    }

.message-bubble[b-uemekttnhz] {
    position: relative;
    padding: 10px;
    border-radius: 8px;
    background: #f0f0f0;
}

.message-icon[b-uemekttnhz] {
    position: absolute;
    font-size: 0.9rem;
    color: #888;
}

.from-guest .message-icon[b-uemekttnhz] {
    top: 6px;
    right: 6px;
}

.to-guest .message-icon[b-uemekttnhz] {
    top: 6px;
    left: 6px;
}

.to-staff .message-icon[b-uemekttnhz] {
    top: 6px;
    left: 6px;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Dashboards/Components/IntegrationPlatformBookingCommunication.razor.rz.scp.css */
.status-container[b-ntwhvmavt1] {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 16px;
    width: 100%;
    overflow: auto;
}

.status-item[b-ntwhvmavt1] {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

    .status-item .icon[b-ntwhvmavt1] {
        font-size: 24px;
        margin-right: 8px;
    }

.sms-icon[b-ntwhvmavt1] {
    color: #6c757d; /* Secondary color */
}

.email-icon[b-ntwhvmavt1] {
    color: #007bff; /* Primary color */
}

.read-icon[b-ntwhvmavt1] {
    color: #28a745; /* Success color */
}

.scheduled-icon[b-ntwhvmavt1] {
    color: #6c757d; /* Secondary color */
}

.rescheduled-icon[b-ntwhvmavt1],
.delayed-icon[b-ntwhvmavt1] {
    color: #ffc107; /* Warning color */
}

.cancelled-icon[b-ntwhvmavt1],
.bounced-icon[b-ntwhvmavt1] {
    color: #dc3545; /* Error color */
}

.complete-icon[b-ntwhvmavt1],
.opened-icon[b-ntwhvmavt1] {
    color: #28a745; /* Success color */
}

.sent-icon[b-ntwhvmavt1] {
    color: #17a2b8; /* Info color */
}

.status-text[b-ntwhvmavt1] {
    font-size: 14px;
}

.status-scheduled-block[b-ntwhvmavt1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
    .status-scheduled-block .status-text[b-ntwhvmavt1] {
        flex-grow: 1;
        margin-left: 8px;
        font-size: 14px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
.cancel-button[b-ntwhvmavt1] {
    margin-left: 8px;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Dashboards/Components/IntegrationPlatformBookingUpsell.razor.rz.scp.css */
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Dashboards/Components/IntegrationPlatformUnifiedInbox.razor.rz.scp.css */
/* ---------------------- */
/* General layout        */
/* ---------------------- */

/* Three-column layout */
.three-column-layout[b-7c2xjn1v9k] {
    display: flex;
    flex: 1;
    gap: 10px; /* Space between columns */
    overflow: hidden; /* Prevent overflow */
    height: 100%;
}
/* Columns */
.left-column[b-7c2xjn1v9k],
.middle-column[b-7c2xjn1v9k],
.right-column[b-7c2xjn1v9k] {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 10px;
    box-sizing: border-box;
}

/* Left Column */
.left-column[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    height: 100%; /* Full height of the container */
    overflow: hidden; /* Prevent double scroll at top level */
}

/* Right Column */
.right-column[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow-y: auto; /* Only this column scrolls vertically */
    max-height: 100%;
}

/* Ensure left and right columns do not exceed 25% of screen width */
.left-column[b-7c2xjn1v9k],
.right-column[b-7c2xjn1v9k] {
    flex: 0 0 25%; /* Fixed at 25% of the container width */
    max-width: 25%; /* Prevent columns from exceeding 25% of the screen width */
    min-width: 200px; /* Ensure a minimum width for readability */
}

/* Middle column to occupy remaining space */
.middle-column[b-7c2xjn1v9k] {
    flex: 1; /* Take up remaining available space */
    min-width: 300px; /* Ensure a minimum width for the middle column */
    display: flex;
    flex-direction: column;
    height: 100%; /* Full height of the middle column */
    overflow: hidden; /* Prevent overflow */
    border: 1px solid #ddd;
    border-radius: 5px;
}

/* ---------------------- */
/* Expansion Panel (shared by left & right) */
/* ---------------------- */
.expansion-panel[b-7c2xjn1v9k] {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    /* Make each panel a flex‐column so header + content stack */
    display: flex;
    flex-direction: column;
    margin-bottom: 10px; /* Space between panels (especially in left column) */
}

/* Panel Title */
.panel-title[b-7c2xjn1v9k] {
    padding: 10px;
    background: #f4f4f4;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    display: flex;
    align-items: center;
}

/* Icon + Text in panel header */
.icon-text[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    gap: 5px;
}

    .icon-text i[b-7c2xjn1v9k] {
        font-size: 18px;
        color: #555;
    }

/* Panel Content (reverted to a normal block, so “Filters & Sort” shows up) */
.panel-content[b-7c2xjn1v9k] {
    padding: 10px;
    font-size: 14px;
    color: #333;
    /* Removed flex:1 / display:flex so that small panels (e.g. Filters) size to content */
}

/* ---------------------- */
/* Right Column Details   */
/* ---------------------- */

/* Property and Inquiry Info */
.property-info[b-7c2xjn1v9k],
.inquiry-info[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

/* Badges (No Messages / Messages:X) */
.badge[b-7c2xjn1v9k] {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
}

    .badge.success[b-7c2xjn1v9k] {
        background: #c8e6c9;
        color: #2e7d32;
    }

    .badge.error[b-7c2xjn1v9k] {
        background: #ffcdd2;
        color: #c62828;
    }

/* New CSS for property‐info / inquiry‐info “rows” */
.info-row[b-7c2xjn1v9k] {
    display: flex;
    justify-content: space-between;
    gap: 8px; /* space between label and value */
    padding: 4px 0; /* vertical padding */
}

.info-label[b-7c2xjn1v9k] {
    font-weight: 600;
    color: #333;
    flex-shrink: 0; /* never shrink label text */
    min-width: 80px; /* consistent label width */
    font-size: 14px;
}

.info-value[b-7c2xjn1v9k] {
    color: #555;
    text-align: right;
    word-break: break-word; /* wrap long URLs/text */
    flex: 1; /* fill remaining space */
    font-size: 14px;
}

.link[b-7c2xjn1v9k] {
    color: #007bff; /* hyperlink color */
    text-decoration: none;
}

    .link:hover[b-7c2xjn1v9k] {
        text-decoration: underline;
    }

/* ---------------------- */
/* Left Column Details    */
/* ---------------------- */

/* Toolbar (Filters & Sort) */
.left-column .toolbar[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #f8f9fa; /* same as panel‐title background */
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
    flex-wrap: nowrap;
    overflow: hidden; /* Prevent toolbar content from overflowing */
}

/* Button Group (Filters & Sort) */
.left-column .button-group[b-7c2xjn1v9k] {
    display: flex;
    gap: 5px;
    flex-wrap: nowrap;
    overflow: hidden;
    align-items: center;
}

.left-column .button-container[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 1;
    min-width: 20px;
    max-width: 60px;
}

.left-column .btn[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 50%;
    cursor: pointer;
    width: 35px; /* Fixed button size */
    height: 35px;
    font-size: 16px; /* Icon size */
    transition: all 0.3s ease;
    flex-shrink: 0; /* Prevent buttons from shrinking */
}

    .left-column .btn:hover[b-7c2xjn1v9k] {
        background-color: #f0f0f0;
    }

.left-column .button-label[b-7c2xjn1v9k] {
    margin-top: 3px;
    font-size: 8px; /* Smaller text size */
    color: #555;
    text-align: center;
    white-space: nowrap; /* Prevent wrapping */
    overflow: hidden; /* Prevent text overflow */
    text-overflow: ellipsis; /* Ellipsis for overflow text */
}

.left-column .separator[b-7c2xjn1v9k] {
    font-size: 14px;
    color: #aaa;
    margin: 0 10px; /* Space around the separator */
    align-self: center;
    flex-shrink: 0; /* Prevent the separator from shrinking */
}

.left-column .expansion-panel[b-7c2xjn1v9k] {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}
.left-column .panel-title[b-7c2xjn1v9k] {
    padding: 10px;
    background: #f4f4f4;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    display: flex;
    align-items: center;
}
.left-column .panel-content[b-7c2xjn1v9k] {
    padding: 10px;
    font-size: 14px;
    color: #333;
}

/* Icons + text in the header should match right‐column exactly */
.left-column .icon-text[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    gap: 5px;
}

    .left-column .icon-text i[b-7c2xjn1v9k] {
        font-size: 18px;
        color: #555;
    }

/* Bookings panel: make its content area flex so the booking-container can scroll */
.left-column .expansion-panel.bookings-panel[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    flex: 1; /* push everything else (toolbar + title) above, and fill the rest */
}
    .left-column .expansion-panel.bookings-panel .panel-content[b-7c2xjn1v9k] {
        display: flex;
        flex-direction: column;
        flex: 1; /* fill the interior of the Bookings panel */
        padding: 10px;
        overflow: hidden; /* let only the inner container scroll */
    }

/* Make the Bookings panel’s container scrollable (and fill remaining space) */
    .left-column .expansion-panel.bookings-panel .booking-container[b-7c2xjn1v9k] {
        flex: 1; /* take up all available height inside panel-content */
        overflow-y: auto; /* scroll only here */
        margin-top: 10px;
    }

/* Remove any scrolling from day-grid itself—day-grid merely lays out blocks */
.left-column .day-grid[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    gap: 8px; /* Space between each day-block */
    /* overflow-y: scroll;  <– removed */
    /* max-height: 70vh;    <– removed */
}

/* Day-block “mini-card” styling */
.left-column .day-block[b-7c2xjn1v9k] {
    background-color: #fff; /* white card background */
    border: 1px solid #ddd; /* lighter border */
    border-radius: 8px; /* match panel’s rounding */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); /* subtle shadow */
    padding: 8px; /* consistent padding */
    display: flex;
    flex-direction: column;
    transition: all 0.2s ease;
    cursor: pointer;
    position: relative;
    height: auto; /* let it grow naturally */
}

    .left-column .day-block.selected[b-7c2xjn1v9k] {
        border-color: #007bff;
        border-width: 2px;
    }

    .left-column .day-block.unread[b-7c2xjn1v9k] {
        background-color: #ffe5e5; /* light-red “unread” highlight */
    }

/* Top-Right Section for Booking Source and Message Count */
.left-column .top-right[b-7c2xjn1v9k] {
    position: absolute;
    top: 5px;
    right: 5px;
    text-align: center;
}

.left-column .booking-source-icon[b-7c2xjn1v9k] {
    font-size: 18px;
    color: #007bff; /* Accent color */
    display: block;
}

/* Dates text */
.left-column .dates p[b-7c2xjn1v9k] {
    margin: 0;
    font-size: 12px;
    color: #666;
    text-align: left;
}

/* Avatar & Guest Info */
.left-column .avatar-row[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    gap: 10px; /* Space between avatar and name */
    margin-top: 5px;
}

.left-column .avatar[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem;
    border-radius: 50%;
    color: #fff;
    width: 1.8rem; /* Larger size */
    height: 1.8rem;
    font-size: 0.9rem; /* Increased font size */
}

.left-column .avatar-info[b-7c2xjn1v9k] {
    background-color: #17a2b8;
}

.left-column .avatar-error[b-7c2xjn1v9k] {
    background-color: #dc3545;
}

.left-column .avatar-warning[b-7c2xjn1v9k] {
    background-color: #ffc107;
}

.left-column .guest-info[b-7c2xjn1v9k] {
    display: flex;
    flex-direction: column;
    margin-left: 10px; /* Align with avatar */
}

.left-column .guest-name[b-7c2xjn1v9k] {
    font-size: 14px;
    font-weight: bold;
    color: #333;
    line-height: 1.2; /* Adjust line spacing */
}

.left-column .reservation-id[b-7c2xjn1v9k] {
    font-size: 8px;
    color: #666;
    margin-top: 2px; /* Small gap below guest name */
}

/* Pagination (left column) */
.left-column .pagination[b-7c2xjn1v9k] {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 10px;
}

.left-column .pagination-btn[b-7c2xjn1v9k] {
    padding: 5px 10px;
    border: 1px solid #ddd;
    background-color: #fff;
    cursor: pointer;
    border-radius: 5px;
    transition: background-color 0.3s;
}

    .left-column .pagination-btn:hover[b-7c2xjn1v9k] {
        background-color: #f0f0f0;
    }

    .left-column .pagination-btn.active[b-7c2xjn1v9k] {
        background-color: #007bff;
        color: #fff;
        border-color: #007bff;
    }

/* ---------------------- */
/* Right‐Column Panels    */
/* ---------------------- */

/* Re-repeat the panel styling for right‐column to match left‐column exactly */
.right-column .expansion-panel[b-7c2xjn1v9k] {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    margin-bottom: 10px; /* Space between panels */
}

.right-column .panel-title[b-7c2xjn1v9k] {
    padding: 10px;
    background: #f4f4f4;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.right-column .panel-content[b-7c2xjn1v9k] {
    padding: 10px;
    font-size: 14px;
    color: #333;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Re-use the same icon-text rules inside right-column */
.right-column .icon-text[b-7c2xjn1v9k] {
    display: flex;
    align-items: center;
    gap: 5px;
}

    .right-column .icon-text i[b-7c2xjn1v9k] {
        font-size: 18px;
        color: #555;
    }
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Dashboards/UpsellManager.razor.rz.scp.css */
/* Outer container to center the box */
.outer-container[b-061j4kfdtp] {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    height: 100%; /* Full viewport height */
}

/* Content box to contain the layout */
.content-box[b-061j4kfdtp] {
    width: 100%; /* Adjust width as needed */
    height: 85vh; /* Stops before the bottom of the screen */
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden; /* Ensure content stays within bounds */
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Gallery.razor.rz.scp.css */
body[b-qdphz0to5b] {
}
.leftContainer[b-qdphz0to5b] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-qdphz0to5b] {
        float: left;
        width: 414px;
    }

.rightContainer[b-qdphz0to5b] {
    float: left;
    width: 100%;
    height: 100%;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.header[b-qdphz0to5b] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-qdphz0to5b] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-qdphz0to5b]
{
    height: 100%!important;
}

.mainContent[b-qdphz0to5b] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-qdphz0to5b] {
    border-color: blue;
}

.guidecontent[b-qdphz0to5b] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.img[b-qdphz0to5b] {
    border-radius: 25px !important;
}

figure[b-qdphz0to5b] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}

figcaption[b-qdphz0to5b] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}
img[b-qdphz0to5b] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Guidebook.razor.rz.scp.css */
.leftContainer[b-h7jx2ymeyj] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-h7jx2ymeyj] {
        float: left;
        width: 414px;
    }

.rightContainer[b-h7jx2ymeyj] {
    float: left;
    width: 100%;
    height: 100%;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.header[b-h7jx2ymeyj] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-h7jx2ymeyj] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-h7jx2ymeyj] {
    height: 100% !important;
}

.mainContent[b-h7jx2ymeyj] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-h7jx2ymeyj] {
    border-color: blue;
}

.guidecontent[b-h7jx2ymeyj] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}

.img[b-h7jx2ymeyj] {
    border-radius: 25px !important;
}

figure[b-h7jx2ymeyj] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}

figcaption[b-h7jx2ymeyj] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}

img[b-h7jx2ymeyj] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/Components/DayControlComponent.razor.rz.scp.css */
.container[b-3sjnhmgzew] {
    max-width: 100%;
    margin: auto;
}

.navigation[b-3sjnhmgzew] {
    text-align: center;
    margin-bottom: 10px;
}

    .navigation button[b-3sjnhmgzew] {
        padding: 10px 20px;
        font-size: 16px;
        margin: 0 10px;
        cursor: pointer;
        background-color: #007bff;
        color: white;
        border: none;
        border-radius: 5px;
    }

        .navigation button:hover[b-3sjnhmgzew] {
            background-color: #0056b3;
        }

.day-grid[b-3sjnhmgzew] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
}

.day-block[b-3sjnhmgzew] {
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    position: relative;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .day-block h3[b-3sjnhmgzew] {
        margin: 0;
        font-size: 18px;
    }

    .day-block p[b-3sjnhmgzew] {
        margin: 5px 0;
        font-size: 14px;
    }

    .day-block.selected[b-3sjnhmgzew] {
        border-color: #007bff;
        border-width: 2px;
    }

        .day-block.selected h3[b-3sjnhmgzew]::after {
            content: "";
            display: block;
            width: 100%;
            height: 4px;
            background-color: #007bff;
            position: absolute;
            bottom: -10px;
            left: 0;
        }

.date-picker[b-3sjnhmgzew] {
    margin: 0 10px;
    padding: 5px;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/Components/MobileChapterView.razor.rz.scp.css */
.leftContainer[b-eqgkc6k5ly] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    zoom: 55%;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-eqgkc6k5ly] {
        float: left;
        width: 414px;
    }

.moduleContainer[b-eqgkc6k5ly] {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    height: 896px;

}

.header[b-eqgkc6k5ly] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    z-index: 500;
}

.content[b-eqgkc6k5ly] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-eqgkc6k5ly] {
    border-color: blue;
}

.guidecontent[b-eqgkc6k5ly] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.wrapper[b-eqgkc6k5ly] {
    margin: 0 auto;
    max-width: 1000px;
    height: 100vh;
    overflow: hidden !important;
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.img[b-eqgkc6k5ly] {
    border-radius: 25px;
}

.mud-grid-item img[b-eqgkc6k5ly] {
    width: 100%!important;
}

.viewcontent[b-eqgkc6k5ly] {
    color: #424242;
    border: solid;
    margin: 0.25rem;
    border-color: #e13c27;
    border-radius: 25px;
    border-width: 1px;
    height: 100%;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-x: hidden;
    width: 400px;
    height: 760px;
}

.mud-dialog .mud-dialog-content[b-eqgkc6k5ly] {
    padding: 2px 2px !important;
}

.mud-paper[b-eqgkc6k5ly] {
    background-color: transparent!important;
}

[b-eqgkc6k5ly]::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* make scrollbar transparent */
}

.orana-dialog-container[b-eqgkc6k5ly] {
    height: auto;
    min-height: 30vh;
    max-height: 90vh;
    overflow-y: scroll;
    padding-bottom: 10vh;
}

.float-bottom-right[b-eqgkc6k5ly] {
    position: fixed;
    bottom: 75px;
    right: 5px;
    opacity: 0.6;
    color: #FFF;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/Components/SelectedBookingArrivalComponent.razor.rz.scp.css */
.table[b-onbs6c9547] {
    width: 100%;
    border-collapse: collapse;
}

    .table th[b-onbs6c9547], .table td[b-onbs6c9547] {
        padding: 10px;
        border-bottom: 1px solid #ddd;
        text-align: left;
        cursor: pointer;
    }

        .table th:hover[b-onbs6c9547] {
            background-color: #f0f0f0;
        }

    .table tbody tr:hover[b-onbs6c9547] {
        background-color: #f9f9f9;
    }

.filter-input[b-onbs6c9547] {
    margin-bottom: 10px;
    padding: 8px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #ccc;
}

td button[b-onbs6c9547] {
    background-color: transparent;
    border: none;
    cursor: pointer;
    margin-left: 5px;
}

    td button i[b-onbs6c9547] {
        font-size: 16px;
        color: #007bff;
    }

    td button:hover i[b-onbs6c9547] {
        color: #0056b3;
    }


.icon[b-onbs6c9547] {
    font-size: 24px; /* Match the Airbnb icon size */
    width: 24px; /* Set the image width */
    height: 24px; /* Set the image height */
    object-fit: cover; /* Ensure the image retains its aspect ratio while fitting within the bounds */
    vertical-align: middle; /* Align with the text/icon baseline */
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/Components/SelectedBookingDepartureComponent.razor.rz.scp.css */
.table[b-0v9vd27wg5] {
    width: 100%;
    border-collapse: collapse;
}

    .table th[b-0v9vd27wg5], .table td[b-0v9vd27wg5] {
        padding: 10px;
        border-bottom: 1px solid #ddd;
        text-align: left;
        cursor: pointer;
    }

        .table th:hover[b-0v9vd27wg5] {
            background-color: #f0f0f0;
        }

    .table tbody tr:hover[b-0v9vd27wg5] {
        background-color: #f9f9f9;
    }

.filter-input[b-0v9vd27wg5] {
    margin-bottom: 10px;
    padding: 8px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #ccc;
}

td button[b-0v9vd27wg5] {
    background-color: transparent;
    border: none;
    cursor: pointer;
    margin-left: 5px;
}

    td button i[b-0v9vd27wg5] {
        font-size: 16px;
        color: #007bff;
    }

    td button:hover i[b-0v9vd27wg5] {
        color: #0056b3;
    }
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/Components/SelectedBookingTableComponent.razor.rz.scp.css */
.table[b-2d7uxlvmrf] {
    width: 100%;
    border-collapse: collapse;
}

    .table th[b-2d7uxlvmrf], .table td[b-2d7uxlvmrf] {
        padding: 10px;
        border-bottom: 1px solid #ddd;
        text-align: left;
        cursor: pointer;
    }

        .table th:hover[b-2d7uxlvmrf] {
            background-color: #f0f0f0;
        }

    .table tbody tr:hover[b-2d7uxlvmrf] {
        background-color: #f9f9f9;
    }

.filter-input[b-2d7uxlvmrf] {
    margin-bottom: 10px;
    padding: 8px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #ccc;
}

td button[b-2d7uxlvmrf] {
    background-color: transparent;
    border: none;
    cursor: pointer;
    margin-left: 5px;
}

    td button i[b-2d7uxlvmrf] {
        font-size: 16px;
        color: #007bff;
    }

    td button:hover i[b-2d7uxlvmrf] {
        color: #0056b3;
    }
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/Components/SelectedDayInformationComponent.razor.rz.scp.css */
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/ContentScreenView.razor.rz.scp.css */
.container[b-m400wbcmvy] {
    display: flex;
    height: 90vh; /* Full height of the viewport */
    max-width: 100vw; /* Ensure the container takes up the full viewport width */
    margin: 0 auto; /* Center the container */
}

.dataContainer[b-m400wbcmvy] {
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: start;
    color: white;
}

.leftContainer[b-m400wbcmvy] {
    flex: 1; /* This takes up 1 part of 3 (1/3 of the container) */
}

.rightContainer[b-m400wbcmvy] {
    flex: 2; /* This takes up 2 parts of 3 (2/3 of the container) */
}

@media (max-width: 1200px) {
    .container[b-m400wbcmvy] {
        padding: 0 20px;
    }
}

@media (max-width: 768px) {
    .container[b-m400wbcmvy] {
        flex-direction: column;
    }

    .dataContainer[b-m400wbcmvy] {
        flex: none;
        width: 100%;
    }
}

@media (min-width: 1600px) {
    .container[b-m400wbcmvy] {
        height: 90vh; /* Maintain full screen height */
    }
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/MainScreenView.razor.rz.scp.css */
.leftContainer[b-qjvmq1ehn1] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    zoom: 75%;
}

    .leftContainer.bottomContainer[b-qjvmq1ehn1] {
        float: left;
        width: 414px;
    }

.header[b-qjvmq1ehn1] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-qjvmq1ehn1] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-qjvmq1ehn1] {
    height: 100% !important;
}

.mainContent[b-qjvmq1ehn1] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-qjvmq1ehn1] {
    border-color: blue;
}

.guidecontent[b-qjvmq1ehn1] {
    width: 414px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 35px;
}

.img[b-qjvmq1ehn1] {
    border-radius: 25px !important;
}

figure[b-qjvmq1ehn1] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}
    figure img[b-qjvmq1ehn1] {
        width: 100%;
        height: 100px;
        object-fit: cover;
    }

    figure figcaption[b-qjvmq1ehn1] {
        background-color: #222;
        color: #fff;
        font: italic smaller sans-serif;
        padding: 3px;
        text-align: center;
    }
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuidebookScreens/SubContentScreenView.razor.rz.scp.css */
*[b-amr9jfpoc0] {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body[b-amr9jfpoc0], html[b-amr9jfpoc0] {
    height: 100%;
    width: 100%;
    font-family: Arial, sans-serif;
}

.container[b-amr9jfpoc0] {
    display: flex;
    height: 90vh; /* Full height of the viewport */
    max-width: 100vw; /* Ensure the container takes up the full viewport width */
    margin: 0 auto; /* Center the container */
}

.dataContainer[b-amr9jfpoc0] {
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: start;
    color: white;
}

.leftContainer[b-amr9jfpoc0] {
    flex: 1; /* This takes up 1 part of 3 (1/3 of the container) */
}

.rightContainer[b-amr9jfpoc0] {
    flex: 2; /* This takes up 2 parts of 3 (2/3 of the container) */
}

@media (max-width: 1200px) {
    .container[b-amr9jfpoc0] {
        padding: 0 20px;
    }
}

@media (max-width: 768px) {
    .container[b-amr9jfpoc0] {
        flex-direction: column;
    }

    .dataContainer[b-amr9jfpoc0] {
        flex: none;
        width: 100%;
    }
}

@media (min-width: 1600px) {
    .container[b-amr9jfpoc0] {
        height: 90vh; /* Maintain full screen height */
    }

    .dataContainer[b-amr9jfpoc0] {
        /*font-size: 32px;*/ /* Further increase font size for very large screens */
    }
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuideStructure.razor.rz.scp.css */
.leftContainer[b-gchwa5xs2f]
{
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
    .leftContainer.bottomContainer[b-gchwa5xs2f] {
        float: left;
        width: 414px;
    }
.rightContainer[b-gchwa5xs2f] {
    float: left;
    width: 100%;
    height: 100%;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
.header[b-gchwa5xs2f] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}
.content[b-gchwa5xs2f] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}
.contentContainer[b-gchwa5xs2f]
{
    height: 100%!important;
}
.mainContent[b-gchwa5xs2f] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}
.footer[b-gchwa5xs2f] {
    border-color: blue;
}
.guidecontent[b-gchwa5xs2f] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.img[b-gchwa5xs2f] {
    border-radius: 25px !important;
}
figure[b-gchwa5xs2f] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}
figcaption[b-gchwa5xs2f] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}
img[b-gchwa5xs2f] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuideStructureContent.razor.rz.scp.css */
.leftContainer[b-naprf9h7wq] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-naprf9h7wq] {
        float: left;
        width: 414px;
    }

.rightContainer[b-naprf9h7wq] {
    float: left;
    width: 100%;
    height: 100%;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.header[b-naprf9h7wq] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-naprf9h7wq] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-naprf9h7wq]
{
    height: 100%!important;
}

.mainContent[b-naprf9h7wq] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-naprf9h7wq] {
    border-color: blue;
}

.guidecontent[b-naprf9h7wq] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.img[b-naprf9h7wq] {
    border-radius: 25px !important;
}

figure[b-naprf9h7wq] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}

figcaption[b-naprf9h7wq] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}
img[b-naprf9h7wq] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/GuideStructureSubContent.razor.rz.scp.css */
.leftContainer[b-vsjabove0r] {
    float: left;
    width: 414px;
    height: 950px;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

    .leftContainer.bottomContainer[b-vsjabove0r] {
        float: left;
        width: 414px;
    }

.rightContainer[b-vsjabove0r] {
    float: left;
    width: 100%;
    height: 100%;
    overflow: auto;
    border-color: black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.header[b-vsjabove0r] {
    border-color: red;
    height: 55px;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.content[b-vsjabove0r] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.contentContainer[b-vsjabove0r]
{
    height: 100%!important;
}

.mainContent[b-vsjabove0r] {
    /*overflow-y: hidden;*/
    overflow-x: hidden;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}

.footer[b-vsjabove0r] {
    border-color: blue;
}

.guidecontent[b-vsjabove0r] {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.img[b-vsjabove0r] {
    border-radius: 25px !important;
}

figure[b-vsjabove0r] {
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 100%;
    margin: auto;
}

figcaption[b-vsjabove0r] {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
}
img[b-vsjabove0r] {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandBusinessInfo.razor.rz.scp.css */
.center-screen[b-93w71gdg7b] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-93w71gdg7b] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandCommunications.razor.rz.scp.css */
.center-screen[b-puqhq8502y] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-puqhq8502y] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandIcons.razor.rz.scp.css */
.center-screen[b-2ts08im2ny] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-2ts08im2ny] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandImages.razor.rz.scp.css */
.center-screen[b-vv56nmcamz] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-vv56nmcamz] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandPaymentMethods.razor.rz.scp.css */
.center-screen[b-hzoywb6qz9] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-hzoywb6qz9] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandSettings.razor.rz.scp.css */
.center-screen[b-w8or5toeel] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-w8or5toeel] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandStatistics.razor.rz.scp.css */
.center-screen[b-1uz47y2417] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-1uz47y2417] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Components/BrandTheme.razor.rz.scp.css */
.center-screen[b-f2u6w0zz41] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    max-width: 100vw;
}
.compress-screen[b-f2u6w0zz41] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 25vh;
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/GuideTemplateData.razor.rz.scp.css */
.wizard[b-mg7z3pbtju] {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
    height: calc(100vh - var(--mud-appbar-height) - 75px);
    overflow: hidden;
    position: relative;
}

.wizard-content[b-mg7z3pbtju] {
    flex: 1; /* This ensures content takes up the remaining space above the navigation */
    overflow-y: auto; /* Allow scrolling if content overflows */
    padding: 16px;
    height: calc(100vh - var(--mud-appbar-height) - 195px);
    background-color: #fff;
}

.wizard-navigation[b-mg7z3pbtju] {
    flex-shrink: 0; /* Prevent shrinking */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background-color: #f8f9fa;
    border-top: 1px solid #ddd;
    gap: 8px; /* Space between buttons */
    position: sticky; /* Stick the navigation to the bottom of its parent */
    bottom: 0; /* Anchor it to the bottom */
}

.wizard-navigation-left[b-mg7z3pbtju] {
    flex: 1;
    display: flex;
    justify-content: flex-start;
}

.wizard-navigation-right[b-mg7z3pbtju] {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 16px; /* Adds spacing between Next and Finish buttons */
}

.custom-drawer .mud-drawer-content[b-mg7z3pbtju] {
    height: calc(100vh - var(--mud-appbar-height) - 195px);
    max-height: calc(100vh - var(--mud-appbar-height) - 195px);
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/MessageSendTemplates.razor.rz.scp.css */
.wizard[b-qagvakqzjb] {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
    height: calc(100vh - var(--mud-appbar-height) - 58px);
    overflow: hidden;
    position: relative;
}

.wizard-content[b-qagvakqzjb] {
    flex: 1; /* This ensures content takes up the remaining space above the navigation */
    overflow-y: auto; /* Allow scrolling if content overflows */
    padding: 16px;
    height: calc(100vh - var(--mud-appbar-height) - 58px);
    background-color: #fff;
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 75px;
}

.wizard-navigation[b-qagvakqzjb] {
    flex-shrink: 0; /* Prevent shrinking */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background-color: #f8f9fa;
    border-top: 1px solid #ddd;
    gap: 8px; /* Space between buttons */
    position: sticky; /* Stick the navigation to the bottom of its parent */
    bottom: 0; /* Anchor it to the bottom */
}

.wizard-navigation-left[b-qagvakqzjb] {
    flex: 1;
    display: flex;
    justify-content: flex-start;
}

.wizard-navigation-right[b-qagvakqzjb] {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 16px; /* Adds spacing between Next and Finish buttons */
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/PolicyDocuments.razor.rz.scp.css */
.wizard[b-93irkturtb] {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
    height: calc(100vh - var(--mud-appbar-height) - 58px);
    overflow: hidden;
    position: relative;
}

.wizard-content[b-93irkturtb] {
    flex: 1; /* This ensures content takes up the remaining space above the navigation */
    overflow-y: auto; /* Allow scrolling if content overflows */
    padding: 16px;
    height: calc(100vh - var(--mud-appbar-height) - 58px);
    background-color: #fff;
}

.wizard-navigation[b-93irkturtb] {
    flex-shrink: 0; /* Prevent shrinking */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background-color: #f8f9fa;
    border-top: 1px solid #ddd;
    gap: 8px; /* Space between buttons */
    position: sticky; /* Stick the navigation to the bottom of its parent */
    bottom: 0; /* Anchor it to the bottom */
}

.wizard-navigation-left[b-93irkturtb] {
    flex: 1;
    display: flex;
    justify-content: flex-start;
}

.wizard-navigation-right[b-93irkturtb] {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 16px; /* Adds spacing between Next and Finish buttons */
}
/* _content/SkyCentral.App.SelfService/Pages/OranaStay/Settings/Users/StayUsers.razor.rz.scp.css */
.single-column-layout[b-mb8swh09g2] {
    display: flex;
    flex: 1;
    gap: 10px; /* Space between columns */
    overflow: hidden; /* Prevent overflow */
    height: 100%;
}
/* Columns */
.single-column[b-mb8swh09g2] {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 10px;
    box-sizing: border-box;
}

/* Middle column to occupy remaining space */
.single-column[b-mb8swh09g2] {
    flex: 1; /* Take up remaining available space */
    min-width: 300px; /* Ensure a minimum width for the middle column */
    display: flex;
    flex-direction: column;
    height: 100%; /* Full height of the middle column */
    overflow: auto; /* Prevent overflow */
    border: 1px solid #ddd;
    border-radius: 5px;
}

.user-container[b-mb8swh09g2] {
    display: flex;
    flex-direction: column;
    height: 100%; /* Fill all of “.middle-column” */
    overflow: hidden; /* Prevent outer overflow—only inner scroll */
}
/* _content/SkyCentral.App.SelfService/Pages/StayLite/MaintainStayLite.razor.rz.scp.css */
body[b-u92uwnmfgo] {
}
.center-screen[b-u92uwnmfgo] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
}
/* _content/SkyCentral.App.SelfService/Pages/StayLite/Wizard/InstructionWizard.razor.rz.scp.css */
*[b-jbuoeozz6p] {
    margin: 0;
    padding: 0;
    font-family: 'Poppins', sans-serif;
}

.container[b-jbuoeozz6p] {
    height: 75vh;
    width: 100%;
    background-image: url(images/bg.png);
    background-position: center;
    background-size: cover;
    padding-right: 3%;
    padding-left: 5%;
    box-sizing: border-box;
    position: relative;
    max-width: 1920px;
    max-height: 1080px;
}

.header[b-jbuoeozz6p] {
    width: 100%;
    height: 15vh;
    margin: auto;
    display: flex;
    align-items: center;
}

.logo[b-jbuoeozz6p] {
    width: 150px;
    margin-top: 10px;
    cursor: pointer;
}

nav[b-jbuoeozz6p] {
    flex: 1;
    padding-left: 450px;
}

    nav ul li[b-jbuoeozz6p] {
        display: inline-block;
        list-style: none;
        margin: 0 15px;
    }

        nav ul li a[b-jbuoeozz6p] {
            text-decoration: none;
            color: #fff;
            font-family: 'Poppins', sans-serif;
            text-transform: uppercase;
            font-size: 15px;
            font-weight: 600;
        }

#btn1[b-jbuoeozz6p] {
    text-transform: uppercase;
    background: linear-gradient(to bottom, #378de5 3%, #48789b 100%);
    border-radius: 30px;
    border: 1px solid #5e97d1;
    cursor: pointer;
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 17px;
    font-weight: 700;
    padding: 12px 20px;
    margin: 10px;
    text-decoration: none;
    box-shadow: 1px 4px 12px rgba(94,28,68,.15);
    text-shadow: 0px 1px 0px #528ecc;
}

#btn2[b-jbuoeozz6p] {
    text-transform: uppercase;
    background: linear-gradient(to bottom, #cbcbcb 2%, #fff 100%);
    border-radius: 30px;
    border: 1px solid #cbcbcb;
    cursor: pointer;
    color: #5e97d1;
    font-family: 'Poppins', sans-serif;
    font-size: 17px;
    font-weight: 700;
    padding: 12px 20px;
    margin: 10px;
    text-decoration: none;
    box-shadow: 1px 4px 12px rgba(94,28,68,.15);
    text-shadow: 0px 1px 0px #cbcbcb;
}

.btn:hover[b-jbuoeozz6p] {
    box-shadow: 3px 8px 22px rgba(94,28,68,.15);
    transform: scale(1.1);
    transition: .2s ease-in-out;
}

.content[b-jbuoeozz6p] {
    position: relative;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

    .content .text[b-jbuoeozz6p] {
        position: relative;
        max-width: 600px;
    }

        .content .text h1[b-jbuoeozz6p] {
            font-family: 'Poppins', sans-serif;
            text-transform: uppercase;
            font-weight: 800;
            margin-top: 80px;
            line-height: 1.5em;
            letter-spacing: .1em;
            font-size: 40px;
            color: #fff;
        }

            .content .text h1 span[b-jbuoeozz6p] {
                font-size: 50px;
            }

        .content .text p[b-jbuoeozz6p] {
            font-size: 17px;
            font-weight: 600;
            letter-spacing: .1em;
            margin-top: 40px;
            color: #e7e3e3;
        }

.btn3[b-jbuoeozz6p] {
    background: linear-gradient(to bottom, #cbcbcb 2%, #fff 100%);
    margin-top: 60px;
    margin-left: 140px;
    padding: 15px 30px;
    text-align: center;
    transition: .5s;
    border: none;
    outline: none;
    text-transform: uppercase;
    color: #1b1b1b;
    font-size: 20px;
    font-weight: 700;
    border-radius: 30px;
    box-shadow: 1px 4px 12px rgba(94,28,68,.15);
}

.pepsi[b-jbuoeozz6p] {
    display: flex;
    height: 100%;
    position: absolute;
    width: 100%;
    margin-top: 80px;
    padding-left: 440px;
    justify-content: flex-end;
}
/* _content/SkyCentral.App.SelfService/Shared/OranaLayout.razor.rz.scp.css */
body[b-t3gc0cscsq] {
}

.center-screen[b-t3gc0cscsq] {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
}