/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#AngelSign * ,
#AngelSign *::before,
#AngelSign *::after {
    box-sizing: border-box;
}
#AngelSign {
    --angel-sign-window-width:0px;
    --angel-sign-window-height:0px;
    width: 100%; 
    height: 100%;
    display: block;
    overflow: hidden;
    background-color: lightgray;
    --angel-sign-header-height:70px;
}

#AngelSignContent{
    width:100%;
    height:100%;
    display: block;
    overflow: hidden;
}

@font-face {
    font-family: "Satisfy";
    src: local("Satisfy"),
        url(https://www.swmc.com/angelai/static/media/Satisfy-Regular.32a6713537cf5e1e82f2.ttf) format("truetype");
}

@font-face {
    font-family: "Honey Script";
    src: url(https://www.swmc.com/angelai/static/media/HoneyScript.813e998927776cfcffec.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
}
  
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#SigningPage{
    width:100%;
    height: 100%;
    display: block;
    overflow: hidden;
}
#SigningPageHeader{
    width: 100%;
    height:var(--angel-sign-header-height);
    display: block;
    position: relative;
    background-color:#083f88;
    z-index: 1100;
}
#SigningPageBody{
    width: 100%;
    height: calc(100% - var(--angel-sign-header-height)) ;
    display: block;
    overflow: hidden;
    position: relative;
}
#SigningPageHeadbarWrapper{
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
    padding-top: 20px;
    padding-left: 5px;
    padding-right: 5px;
}
#SigningPagePDFViewer{
    width:100%;
    height:100%;
    display: block;
    overflow: hidden;
    opacity: 1;
}
#SigningPagePDFViewer.dark{
    opacity: 0.2;
    /*pointer-events: none;*/
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#PDFViewer {
    width:100%;
    height:100%;
    display: block;
    position: relative;
    overflow: hidden;
    --scale-factor:1;
    --pdfviewer-toolbar-height:50px;
}

#PDFViewerToolbarWrapper {
    width: 100%;
    height: var(--pdfviewer-toolbar-height);
    padding: 5px 4px;
    min-width: 320px;
    position: relative;
    display: block;
    background-color: lightgray;
    border-bottom: none;
    z-index: 999;
}

#PDFViewerMainWrapper {
    width:100%;
    height:calc(100% - var(--pdfviewer-toolbar-height));
    display: block;
    position: relative;
    overflow: hidden;
    padding-top:10px;
    padding-left:5px;
}

#PDFViewerMain {
    width: 100%;
    height:100%;
    display: block;
    position: relative;
    overflow: auto;
}

#PDFViewerPages {
    --scale-round-x: 2px;
    --scale-round-y: 2px;
    --page-margin: 1px auto 10px;
}

.PDFViewerPage {
    position: relative;
    background-clip: content-box;
    background-color: white;
    width:  calc(var(--scale-factor)* 612px);
    height: calc(var(--scale-factor)* 792px);
    margin: var(--page-margin);
}

.PDFViewerCoverPage {
    margin: auto;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
}

.PDFViewerCanvasWrapper {
    margin: auto;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
}

:is(.pdfViewer .canvasWrapper) canvas {
    margin: 0;
    display: block;
}

.PDFViewerCanvas {
    margin: 0;
    width: 100%;
    height: 100%;
    display: block;
}


/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.textAnchorWrapper {
    position: absolute;
    width: calc(var(--scale-factor) * 150px);
    height: calc(var(--scale-factor) * 27px);
    border: 2px solid lightblue;
    border-radius: 5px;
    z-index: 30;
    touch-action: none;
    transform: scale(var(--scale-factor));
    transform-origin: top left;
    box-sizing: border-box;
}

.textAnchorWrapper.Required {
    border-color: #FEC830;
}

.textAnchorWrapper:focus {
    border-color: blue;
}

.textAnchorWrapper.disabled {
    pointer-events: none;
    opacity: 0.5;
    border-color: lightgray;
}
.textAnchorWrapper.zoom {
    transform: scale(2); /* Zoom effect */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3); /* Optional shadow for emphasis */
    transform-origin: top left;
    z-index: 31;
}

.textAnchor {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    color: black;
    background-color: white;
    cursor: pointer;
    border: none;
    resize: none;
    outline: none;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.signatureAnchorWrapper {
    position: absolute;
    width: calc(var(--scale-factor) * 100px);
    height: calc(var(--scale-factor) * 27px);
    border:3px solid lightblue;
    border-radius: 5px;
    z-index: 30;
    touch-action: none;
    transform: scale(var(--scale-factor));
    transform-origin: top left;
    box-sizing: border-box;
}
.signatureAnchorWrapper:focus {
    border-color: blue;
}
.signatureAnchorWrapper.Required {
    border-color: #FEC830;
}
.signatureAnchorWrapper.Required:focus {
    border-color: blue;
}

.signatureAnchorButton {
    position: absolute;
    width: 90%;
    height: 80%;
    top:10%;
    left:5%;
    border:0px;
    border-radius: 5px;
    color: #083f88;
    background-color: lightgray;
    font-weight: 700;
    cursor: pointer;
    padding-inline:0;
    padding-block: 0;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
.signatureAnchorButton.Required {
    background-color: #FEC830;
    border-color: #FEC830;
}

.signatureAnchorImage {
    position: absolute;
    width: 90%;
    height: 80%;
    top:10%;
    left:5%;
    border: 1px solid lightgray;
    border-radius: 5px;
    cursor: pointer;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.checkboxAnchorWrapper {
    position: absolute;
    width: calc(var(--scale-factor) * 18px);
    height: calc(var(--scale-factor) * 18px);
    border: 3px solid lightblue;
    border-radius: 5px;
    background-color: rgb(207, 231, 239);
    align-content: center;
    z-index: 30;
    transform: scale(var(--scale-factor));
    transform-origin: top left;
    box-sizing: border-box;
}
.checkboxAnchorWrapper:focus {
    border-color: blue;
}
.checkboxAnchorWrapper.Required {
    border-color: #FEC830;
    background-color: #FEC830;
}
.checkboxAnchorWrapper.Required:focus {
    border-color: blue;
}
.checkboxAnchorWrapper.disabled{
    border-color:  lightgray;
}

.checkboxAnchor {
    position: absolute;
    width: 90%;
    height: 90%;
    top:5%;
    left:5%;
    cursor: pointer;
    border: 1px solid lightgray;
    border-radius: 5px;
    margin: 0;
}

.checkboxAnchor.Required {
    background-color: #FEC830;
}
.checkboxAnchor.Required:focus  {
    border:1px solid blue;
}
.checkboxAnchor:focus  {
    border:1px solid blue;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.radioAnchorWrapper {
    position: absolute;
    width: calc(var(--scale-factor) * 20px);
    height: calc(var(--scale-factor) * 20px);
    border: 3px solid lightblue;
    border-radius: 5px;
    z-index: 30;
    transform: scale(var(--scale-factor));
    transform-origin: top left;
    box-sizing: border-box;
}
.radioAnchorWrapper:focus{
    border-color:  blue;
}
.radioAnchorWrapper.Required {
    border-color: #FEC830;
    background-color: #FEC830;
}
.radioAnchorWrapper.Required:focus {
    border-color:  blue;
}
.radioAnchorWrapper.disabled{
    border-color:  lightgray;
}

.radioAnchor {
    position: absolute;
    width: 80%;
    height: 80%;
    top:10%;
    left:10%;
    cursor: pointer;
    margin: 0;
    background-color: transparent;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.initialAnchorWrapper {
    position: absolute;
    width: calc(var(--scale-factor) * 25px);
    height: calc(var(--scale-factor) * 25px);
    border: 3px solid lightblue;
    border-radius: 4px;
    z-index: 30;
    touch-action: none;
    transform: scale(var(--scale-factor));
    transform-origin: top left;
    box-sizing: border-box;
}
.initialAnchorWrapper:focus {
    border-color: blue;
}
.initialAnchorWrapper.Required {
    border-color: #FEC830;
}
.initialAnchorWrapper.Required:focus {
    border-color: blue;
}
.initialAnchorWrapper.disabled{
    border-color:  lightgray;
}

.initialAnchorButton {
    position: absolute;
    width: 90%;
    height: 90%;
    top:5%;
    left:5%;
    font-weight: 700;
    padding-inline:0;
    padding-block: 0;
    cursor: pointer;
    border-radius: 0px;
    border: 1px solid lightgray;
    color: #083f88;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

.initialAnchorButton.Required {
    background-color: #FEC830;
    border-color: #FEC830;
    font-weight: 700;
}

.initialAnchorImage {
    position: absolute;
    width: 90%;
    height: 90%;
    top:5%;
    left:5%;
    cursor: pointer;
    border-radius: 0px;
    border: 1px solid lightgray;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#PDFViewerToolbar{
    width: 100%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background-color:lightgray;
    z-index: 999;
    border-radius: 5px;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
#PDFViewerToolbar.mini{
    justify-content:flex-start;
}
.PDFViewerToolbarItems{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-content: center;
    width:130px;
    min-width: 120px;
    height: 30px;
    padding:0px 5px 0px 5px;
}
.PDFViewerToolbarItems.mini{
    width:100px;
    min-width: 100px;
    height: 25px;
    padding:0px 2px 0px 2px;
}
.PDFViewerToolbarItemWrapper{
    width: 30%;
    min-width: 25px;
    height: 100%;
    min-height: 25px;
    display: block;
    margin:1px;
}
.PDFViewerToolbarButton{
    width: 100%;
    height:100%;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    color:rgba(0, 0, 0, 0.87);
    background-color:rgb(233, 233, 233);
    border-radius: 4px;
    cursor: pointer;
    border:0;
    padding-inline: 0;
    padding-block: 0;
}
.PDFViewerToolbarButton:hover{
    border:1px solid blue;
}
.PDFViewerToolbarButton:disabled{
    cursor:progress;
}
.PDFViewerToolbarButton.anchor {
    background-color: #FEC830;
}

.PDFViewerToolbarDisplay{
    width: 100%;
    height:100%;
    color: black;
    background-color: white;
    border-radius: 5px;
    text-align: center;
    padding-inline: 0;
    padding-block: 0;
    border:0;
    font-size: 0.9rem;
}
.PDFViewerToolbarDisplay.mini{
    font-size: 0.7rem;
}
.PDFViewerToolbarItemWrapperIcon{
    width: 100%;
    height:100%;
    display: block;
    background-color: white;
    border-radius: 5px;
    text-align: center;
    padding-inline: 0;
    padding-block: 0;
    border:0;
}


/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#SigningPageHeadbar {
    position: relative;
    height: 100%;
    width: 100%;
    background-color: #083f88;
    display: flex;
    flex-direction: row;
    position: relative;
}
#SigningPageHeadbarMenuLogo{
    width: 70%;
    height: 100%;
    min-width: 200px;
    display:flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
#SigningPageHeadbarButtons {
    width: 30%;
    height: 100%;
    min-width: 100px;
    display:flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
#SigningPageHeadbarMenuWrapper {
    width: 35px;
    height: 30px;
    min-width: 35px;
    min-height: 30px;
    margin-right: 5px;
    display:block;
}
#SigningPageHeadbarMenuIcon {
    width: 100%;
    height: 100%;
    color:blue;
    background-color: #083f88;
    border-radius: 7px;
    border: 1px solid #FEC830;
    padding: 3px;
    cursor: pointer;
}
#SigningPageHeadbarMenuIcon.disabled {
    border-color: darkgray;    
}
#SigningPageHeadbarLogoWrapper{
    display: flex;
    flex-grow: 1;
    height:100%;
    max-width: 320px;
    min-width: 150px;
    padding-left: 10px;
}
#SigningPageHeadbarLogo{
    height: 100%;
    width: 100%;
}
#SigningPageHeadbarSubmitWrapper{
    width: 100px;
    height:30px;
    display: flex;
    flex-direction: row;
    justify-content: center;
}
#SigningPageHeadbarSubmitWrapper.mini{
    width: 80px;
    height:27px;
}
.SigningPageHeadbarButton {
    width: 100px;
    height: 30px;
    font-size: 1rem;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    text-transform: uppercase;
    border: 1px solid lightgray;
    border-radius: 5px;
    text-align: center;
    padding-inline: 0px;
    padding-block: 0px;
    color: #083f88;
    background-color: #FEC830;
    cursor: pointer;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2),
        0px 2px 2px 0px rgba(0, 0, 0, 0.14),
        0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
.SigningPageHeadbarButton.mini {
    width: 60px;
    height:27px;
    font-size: 0.9rem;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.LoadingButtonWrapper{
    width:100%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border:1px solid lightgray;
    border-radius: 5px; 
    cursor: pointer;
    font-size: 1rem;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
.LoadingButtonWrapper.loading{
    width:100%;
}
.LoadingButton{
    width:80%;
    height:100%;
    cursor: pointer; 
    border: 0px;
    border-radius: 5px;
    text-transform: uppercase;
    font-family: "Poppins", sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    padding-inline: 0;
    padding-block: 0;
}
.LoadingButton.loading{
    font-size: 0.7rem;
}
.LoadingButtonWrapper svg{
    animation: progress 1s infinite;
}
@keyframes progress {
    to {
      transform: rotate(360deg);
    }
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#SigningPageSidebar {
    position: absolute;
    top:0;
    left:0;
    width: 160px;
    height:220px;
    max-height: 90%;
    padding:0px 3px ;
    display: block;
    z-index: 100;
    background-color: #f8f8f8;
    border:1px solid #083f88;
    border-radius: 5px;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2),
        0px 2px 2px 0px rgba(0, 0, 0, 0.14),
        0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    overflow-y: auto;
    --item-height:30px;
}
#SigningPageSidebar.mini {
    width: 120px;
}
#SigningPageSidebarContent {
    width: 100%;
    height:100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    padding-top: 10px;
}

.sidebarItemWrapper {
    width: 95%;
    height: var(--item-height);
    min-height: 20px;
    padding-bottom: 5px;
    align-content: center;
}
.sidebarItem {
    width: 100%;
    height: 100%;
    color: #083f88;
    background-color: #f8f8f8;
    border:0;
    line-height: 1.5;
    font-size: 1rem;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    padding-inline: 0px;
    text-align: center;
    align-items: center;
    align-content: center;
    box-shadow: none;
    cursor: pointer;
}
.sidebarItem:hover {
    color: #083f88;
    background-color: rgb(222, 222, 222);
    border: 1px solid rgb(222, 222, 222);
    border-radius: 5px;
}
.sidebarItem:disabled {
    color: gray;
}
.sidebarDividerWrapper{
    width: 95%;
    height:10px;
    align-content: center;
}
.sidebarDividerItem{
    background-color: #ccc;
    height: 1px;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

/* AngelAI Color Palette */
:root {
    --angelai-primary: #FF4103;
    --angelai-secondary: #FF7400;
    --angelai-accent: #3183FF;
    --angelai-light: #F8D8C3;
    --angelai-white: #FFFFFF;
    --angelai-black: #000000;
}

#SignaturePage {
    width:100%;
    height:100%;
    padding: 10px 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-image: url(https://www.swmc.com/angelai/static/media/BackgroundExtended.37302d3bcc714729c04c.jpg);
    background-size: auto;
    background-position: center;
    background-repeat: repeat;
    align-content: center;
    overflow: auto;
    -webkit-user-select: none;
    user-select: none;
}
#SignaturePageContent {
    width: 100%;
    height: 80%;
    max-width: 500px;
    max-height: 380px;
    min-width: 310px;
    min-height: 320px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: rgba(255, 255, 255, 0.95);
    margin:auto;
    border: none;
    border-radius: 10px;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.3); 
    overflow: hidden;
}
#SignaturePageHeader{
    width: 100%;
    height: 50px;
    min-height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
    background: linear-gradient(135deg, #FF4103 0%, #FF7400 100%);
    background: linear-gradient(135deg, var(--angelai-primary) 0%, var(--angelai-secondary) 100%);
    border-radius: 10px 10px 0 0;
    position: relative;
}
#SignaturePageCloseIcon{
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
#SignaturePageCloseIcon img {
    width: 20px;
    height: 20px;
    filter: brightness(0) invert(1);
}
#SignaturePageTitle{
    width: 250px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    font-weight: 600;
    color: #FFFFFF;
    color: var(--angelai-white);
    white-space: nowrap;
}
#SignaturePageBody {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding:0px 5px; 
    margin-bottom: 5px;
    background-color: #FFFFFF;
    background-color: var(--angelai-white);
}
#SignaturePageUserWrapper{
    width: 100%;
    height: 60px;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 5px 0px;
    align-items: center;
}
#SignaturePageUserNameWrapper{
    width:100%;
    height:100%;
    display: block;
    padding-left: 20px;
    padding-right: 20px;
}
#SignaturePageUserName{
    width:100%;
    height:30px;
    font-size: 1rem;
    font-weight: 500;
    color: #000000;
    color: var(--angelai-black);
    border: 2px solid #F8D8C3;
    border: 2px solid var(--angelai-light);
    border-radius: 5px;
    background-color: #FAFAFA;
    padding: 0 10px;
    transition: border-color 0.2s;
}
#SignaturePageUserName:focus {
    outline: none;
    border-color: #3183FF;
    border-color: var(--angelai-accent);
}

#SignaturePageSignaturePadWrapper{
    width: 80%;
    height:115px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin:auto;
}
#SignaturePageSignaturePadWrapper.mini{
    width: 75%;
    height:140px;
}
#SignaturePagePadWrapper{
    width:100%;
    height:115px;
    padding:3px;
    border:2px solid #F8D8C3;
    border:2px solid var(--angelai-light);
    border-radius: 5px;
    display: block;
    background-color: white;
    transition: border-color 0.2s;
}
#SignaturePagePadWrapper:hover {
    border-color: #3183FF;
    border-color: var(--angelai-accent);
}
#SignaturePagePadWrapper.mini{
    height:100px;
}
#SignaturePageMessageWrapper{
    width:100%;
    height:20px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}
.signatureMessage{
    color: #FF7400;
    color: var(--angelai-secondary);
    font-size: 0.9rem;
    font-weight: 500;
}
#SignaturePageFooter{
    width: 100%;
    height:60px;
    display: flex;
    flex-direction: row;
    padding:10px;
    background-color: #FAFAFA;
    border-top: 1px solid #F8D8C3;
    border-top: 1px solid var(--angelai-light);
    border-radius: 0 0 10px 10px;
}
#SignaturePageButtons{
    width: 100%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.signaturePageButtonWrapper{
    width: 150px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.signaturePageButton{
    width: 150px;
    height: 100%;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    font-family: "Poppins", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    line-height: 1;
}
.signaturePageButton:not(:disabled) {
    background: linear-gradient(135deg, #FF4103 0%, #FF7400 100%);
    background: linear-gradient(135deg, var(--angelai-primary) 0%, var(--angelai-secondary) 100%);
    color: #FFFFFF;
    color: var(--angelai-white);
}
.signaturePageButton:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0px 4px 8px rgba(255, 65, 3, 0.4);
}
@media (hover: none) {
    .signaturePageButton:hover:not(:disabled) {
        transform: none;
        box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                    0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                    0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    }
}
.signaturePageButton:disabled{
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHwAAAAnCAYAAADNVyyKAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAtlSURBVHgB7VtBbxvHFf6GkoKkaeB1D0UA2dUIKNCjmP4Br9FLb6Ibuwh6Mf0DitDnHkT/AtG/QDTQQ4GmEdVzAa0PRY+mD0Z70xqpg+bQioLrIqlITubtzNMOhzPUUpYjOvYnDHY5+2bmzXtv3rx5uwLe4i3e4vsBdfMnLXXryqduXQ1v8T3GuAGFJt4gSF32dXmky228IVCffCj1yt5Vv1pt+s8E5keiS12X1N4T1nTZ06WLxcIBjNJz+3sdbwDUzdWuVq0x8LG6Iz5/1uVny6gOqUsLRrkPdenoMnCe7epyTZc7WAw0Yfjas/eHFdtRmxTGqC859U916evSw8KjtqnVbm7HKxnmBK3iLZjV0ppBl+JklIUAuXHip2l/n8Yb0e1bugylwTBIDjT/A69+oaBurTbVzSvKlKuHerVP6Oy0FS5hVi5N9gaMhccwQLniLxq87RD63tUH0dEcJcyWRG4/D9DR3Doo44LF3B6UKGOVMe5C1FL38awoXcJMjK7XERdYYkuKxXF3rGxSEvFN/B0F6Eg4j1AaNG1HOWZD2sLxC8mItosWLhgUrMHowaCmcojxhN5I4US067WlOlb2aUIggdGESXj3sBhghT92fvsGK2FWLIEMuoqxNnTZtH0NUO73iX12sRgutU/ulehCKKnD8swlIYUTka8oVvZ9zBZEgnI/e4DTV8d3BWmvvMWkwOTEYeZN/Hcxe6ti0AregZnjDVuXO20zXDREETTbe/VAu/S6+OOzibnRHk4W23Tq6F7CTKaD2ZDOfRWhfVfYsFfmiQThz2XTXh/O6IdWrbS05CXuY/J0QvgICwAdpKU63JTmh9CuXMeeqjalEw7ayNJ5Elv2Sqs+j/RP9JSyc93YeQVsddtXjrOD99ccRmECcf42MBs5qu3tMUjLzyteEKp5klZRWncCW+LzL677VDXLyLZlrIly1WYeLT/fsYVWxgPnee7c+3sateVjUiy4oRjg0NLRNtKGMT7aXjYD9DQGrbYD2++28+yyw1OKcEKIFdBCaeQ+erbkkecpTPzTDDyrW94O7Pg8zi4mZRCSFc8pRQWYYM2Jzmt671aj+zF63scObVH2umOZIwX0LU0T5eoh9Cy98hjmfjh42nfoQjFBwz47cNo0nDbSo5eWdsfrn+mUM34XYXAfyhm75Yx/GhKnbRro+9B7Jj2+YJ8xHcvV5WkHFTB59r7SUx9frdQu8QZKMXn8CIGZPYj007SlC7MaOanhQqKcZNOp7wT6ZjC9tL/bCCs8xWyhScub8gobUwPx+bsGmUT4azt1LUwvjjomjXoLZt77mEfhN688KhW+2tUKb8Roa97gDHLVGYwrG0TaEn1IGC49Pb8No8gs8JyQogwSu049761PPXoOpB6idLX1SN8UZ8w6KuaWN0qi3EEZwElbTx7u0F5Tr62b2HHHbaI0vG6A3qV17yXK9DXz4c99Cnp110/6pmBN1XoYLUXjhVjiJcfpSBE3BmaUlMb7PBuHn9PmvSfz6mOutRmgp3G6lh/XCKsGf7ltn8JEPnTsco+ZZGS06nac/pk/XympvboGyTwyTwjc0+r2jTMm3xJqIh7IxJ++6IlensfIXYVL5z7awAEpau8UmhSllbOgYgJy+4p5D8I1e2Ur3rK097xxgLMngnqYXPm5rac6drOXPD4YG04fLkIG7CpUOOMkgedhuGfv2vj+aeTzvC1zIWGYyjD7PXPmtSG4k3CFkHv1OaaDNdcQcjs2Wfh1hI00VOdDYvrtGKVhuyiD1QxlMoq3lJhSXFfPSDHtfXx0PZ4I+Qx6FHu1Ukzb95MsIbgrvB8YMIY2Zh9XGO6xLSSgJDJ+irD3cOnpGLZui9s2RzWkMErsojzi3bGlFejTXT0S5dHP34cRqE8xKQtGbP6XUAWCzt4WY3Hq6ia4KzxHmBEfEuZc/NEM+jV77QfqBjPaMWjCGWbDdbXzgMakIIxWIrn8TsV2/kqmWGQt0HeI/pod69MIPdG6slq31xwRqIZMIEYbeoWbivFShgpY9hik/ZUmUUc8M0Ru9L7DDLuqBNMBSWgPcoUiA89ThKNTqt+M9INInxKTQmvAeAZqO+sNICLjw/aXwfDoxxpJhJ8jTCtPoky4PMbpINreya/lYQtjlRX3QjydFai58KP0rr1uRuglTODirorcXhPvmnttQ0rc9PombFs+cvubDJCPRa7bqiOMNNAn0/N777uYX9kcq7Brzu3VVXLTG4/QxnQA17W0vCBC3gOY5H9SJ0Ld1opuFkWJynPxFd6xg3Ng4oJ+k8BuYJJBPjOm9soC8N8/c5u605/bDyua2vkTIAW1Ua4uQixYZA/k8kRoOePNo2w2FG7Xdu75OUHCJEt4DJ7PNUwHZF2U8yH4R9XHDi2hCeclj0ml6hcjgs7dIqejGF4CDUymOUmBKUyKtRGgTy19x/t9EKE7QHmulZhMu3LGKUWZrcoi/YRSmnREa6JMbR5aGto7d5yxWqiGFspsor/XJ84Yddu/DMyn6dW7cmkinG7memrDsjqBTrYc6Kzaofp4dUfdkjFPNxckykwblQ5mR+40CZo47+X0O2R11A9NhIyHGa077UnApLQuSsPLAv00UBoErT5WZtuj6Tv8JyjTuDyWDPSdoPx2jcdPEUbdGYONSDpjtG09B4m+wlPE3y/0nPElV6qbV7edvLmymbbKEDgfkHB3UR7V3KCuKkjQpDhyZ22nzz3EvyZJUQqDxh6gGpqYPHvnDg8kE1JiNmefIZBbv2zHo7H4RdSZ3qGbDxLFtuFJ7RVvyIbL61UDNsJE4kW7iA5GL9qiN5h3kiQYPr/SBHPMBxI0rVBSbtupIxzOaJfhbOji1X9DT8ZLxtO0v2OxTXUsr/QwHG7rgG1Qfqw4n64mM21CM7X8/r5qvHtD9P6VYz50cXYhksvNMemSpb0+rdCezqUSS9/UIWqy+PKjJtbsFyC0GhIMX1w/gyFHxkq08nSh8Wq1RI+TgL82EWLw5y//t/mP5yP5m6s/eHDlvaWOluvgL199vfHXf/8fP3qntvbbn/6wrYMuzcs4MdeR7nSc675yHL/IY3yKP+S5duOZVrb2FkIrHXvzzmnKpesO2/owr0N+7ZaHo94ZFD8vmjCuj9xc7tST16CjyA17H1eqonnoo4mgrzR1wUofx9SXlsXyBzomUEfis3+2MQeKsZaHsvgQcGxdv9B/ShgB11QfY62s2pJWEgaOW2XXve7Np43yBUk7Oh5q9cIAIIwxqOPCEDhtWuhHiA0cL92dx5Uzgnu4+kQPPhy19R0pvqcN4GEh0OF/++e1ShxQEENn23axclbel/q+fu/J861kRchffvhu/2cfrBBXl4ujiNIKJWFbpepJR/nRwqFt4p5WdhaloTGX3kuNEdU29EGVVuuRHmdQdRwPNGaO6f/AofoUJuGToSKKjNrysF4YwnikeaqlGC615uBnAjODtkLxo1GqMzp6VZHlassy7+/79kM57W61YLTLKn7P7GyUFO6vuBdauCr56hu19vfnx42NZGVw+R29csbiiAzry6+H+N2To9vHY+S///mPr5/FkosXC2IsxWfPOsVvx5iKFUvbF6Uhzq7YEHh1k7fqe8/4FEMxznkvmsqYO0o/sTilXY5Q5khACiwEqJJwIzYGaxyF2wV+/bf/3H5yNBRPfrHa8ATdgInQuzjj/6pZPne1Qh9rFygLVywoIzXWnmq5/5KKjYGMi7ahda+eDWHWieONAAmhHajvAsFv2RYd5LZ7gfouUP2jxFeJGi4WlwN1EtMvaF4n+MdIiTK9muENB382xOAsHf+/1+sGcun7Xh1tTTQnibc4SUO2UaYzOQ36OoINloyY5kPKz7BAyj6v1OrLIrVXimwvLII9R1CQRspfuPl8C/SrGbF+3si4AAAAAElFTkSuQmCC);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
    pointer-events: none;
}
#SignaturePagePreSelectButton{
    width: 150px;
    height: 100%;
    color: #FFFFFF;
    color: var(--angelai-white);
    background: linear-gradient(135deg, #3183FF 0%, #2670E8 100%);
    background: linear-gradient(135deg, var(--angelai-accent) 0%, #2670E8 100%);
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    text-align: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
    line-height: 1;
}
#SignaturePagePreSelectButton.clear {
    font-size: 1rem;
}
.preSelectIcon {
    width: 18px;
    height: 18px;
    filter: brightness(0) invert(1);
}
#SignaturePagePreSelectButton:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0px 4px 8px rgba(49, 131, 255, 0.4);
}
@media (hover: none) {
    #SignaturePagePreSelectButton:hover:not(:disabled) {
        transform: none;
        box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                    0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                    0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    }
}
#SignaturePagePreSelectButton.mini{
    width: 150px;
    font-size: 1rem;
}
#SignaturePagePreSelectButton.mini.clear {
    font-size: 1rem;
}
#SignaturePagePreSelectButton:disabled{
    background: #E0E0E0;
    color: #999999;
    cursor: not-allowed;
    box-shadow: none;
}

.signaturePageBoldLabel{
    display: block;
    font-weight: 600;
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 4px;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#CaptureSignaturePad{
    width: 100%;
    height: 100%;
    background-color:inherit;
    -webkit-user-select: none;
    user-select: none;
}

#CaptureSignaturePad canvas{
    width:100%;
    height:100%;
    -webkit-user-select: none;
    user-select: none;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

/* AngelAI Color Palette */
:root {
    --angelai-primary: #FF4103;
    --angelai-secondary: #FF7400;
    --angelai-accent: #3183FF;
    --angelai-light: #F8D8C3;
    --angelai-white: #FFFFFF;
    --angelai-black: #000000;
}

#InitialPage {
    width:100%;
    height:100%;
    padding: 10px 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-image: url(https://www.swmc.com/angelai/static/media/BackgroundExtended.37302d3bcc714729c04c.jpg);
    background-size: auto;
    background-position: center;
    background-repeat: repeat;
    align-content: center;
    overflow: auto;
    -webkit-user-select: none;
    user-select: none;
}
#InitialPageContent {
    width: 100%;
    height: 80%;
    max-width: 500px;
    max-height: 400px;
    min-width: 310px;
    min-height: 320px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: rgba(255, 255, 255, 0.95);
    margin:auto;
    border: none;
    border-radius: 10px;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.3); 
    overflow: hidden;
}
#InitialPageHeader{
    width: 100%;
    height: 45px;
    min-height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 3px;
    background: linear-gradient(135deg, #FF4103 0%, #FF7400 100%);
    background: linear-gradient(135deg, var(--angelai-primary) 0%, var(--angelai-secondary) 100%);
    border-radius: 10px 10px 0 0;
    position: relative;
}
#InitialPageCloseIcon{
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
#InitialPageCloseIcon img {
    width: 20px;
    height: 20px;
    filter: brightness(0) invert(1);
}
#InitialPageTitle{
    width: 250px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    font-weight: 600;
    color: #FFFFFF;
    color: var(--angelai-white);
    white-space: nowrap;
}
#InitialPageBody {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding:0px 5px; 
    margin-bottom: 3px;
    background-color: #FFFFFF;
    background-color: var(--angelai-white);
}
#InitialPageUserWrapper{
    width: 100%;
    height: 50px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 3px 0px;
    align-items: center;
}
#InitialPageUserInitialWrapper{
    width: 15%;
    max-width: 200px;
    height:100%;
    display: block;
}
#InitialPageUserInitial{
    width:100%;
    height:30px;
    font-size: 1rem;
    font-weight: 500;
    color: #000000;
    color: var(--angelai-black);
    border: 1px solid #F8D8C3;
    border: 1px solid var(--angelai-light);
    border-radius: 5px;
    background-color: #FAFAFA;
    padding: 0;
    text-align: center;
    transition: border-color 0.2s;
}
#InitialPageUserInitial:focus {
    outline: none;
    border-color: #3183FF;
    border-color: var(--angelai-accent);
}

#InitialPageInitialPadWrapper{
    width: 80%;
    height:135px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin:auto;
}
#InitialPagePadWrapper{
    width:100%;
    height:115px;
    padding:3px;
    border:2px solid #F8D8C3;
    border:2px solid var(--angelai-light);
    border-radius: 5px;
    display: block;
    background-color: white;
    transition: border-color 0.2s;
}
#InitialPagePadWrapper:hover {
    border-color: #3183FF;
    border-color: var(--angelai-accent);
}
#InitialPageMessageWrapper{
    width:100%;
    height:20px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}
.initialMessage{
    color: #FF7400;
    color: var(--angelai-secondary);
    font-size: 0.9rem;
    font-weight: 500;
}
#InitialPageFooter{
    width: 100%;
    height:50px;
    display: flex;
    flex-direction: row;
    padding:8px 10px;
    background-color: #FAFAFA;
    border-top: 1px solid #F8D8C3;
    border-top: 1px solid var(--angelai-light);
    border-radius: 0 0 10px 10px;
}
#InitialPageButtons{
    width: 100%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.initialPageButtonWrapper{
    width: 150px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.initialPageButton{
    width: 150px;
    height: 100%;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    font-family: "Poppins", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    line-height: 1;
}
.initialPageButton:not(:disabled) {
    background: linear-gradient(135deg, #FF4103 0%, #FF7400 100%);
    background: linear-gradient(135deg, var(--angelai-primary) 0%, var(--angelai-secondary) 100%);
    color: #FFFFFF;
    color: var(--angelai-white);
}
.initialPageButton:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0px 4px 8px rgba(255, 65, 3, 0.4);
}
@media (hover: none) {
    .initialPageButton:hover:not(:disabled) {
        transform: none;
        box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                    0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                    0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    }
}
.initialPageButton:disabled{
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHwAAAAnCAYAAADNVyyKAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAtlSURBVHgB7VtBbxvHFf6GkoKkaeB1D0UA2dUIKNCjmP4Br9FLb6Ibuwh6Mf0DitDnHkT/AtG/QDTQQ4GmEdVzAa0PRY+mD0Z70xqpg+bQioLrIqlITubtzNMOhzPUUpYjOvYnDHY5+2bmzXtv3rx5uwLe4i3e4vsBdfMnLXXryqduXQ1v8T3GuAGFJt4gSF32dXmky228IVCffCj1yt5Vv1pt+s8E5keiS12X1N4T1nTZ06WLxcIBjNJz+3sdbwDUzdWuVq0x8LG6Iz5/1uVny6gOqUsLRrkPdenoMnCe7epyTZc7WAw0Yfjas/eHFdtRmxTGqC859U916evSw8KjtqnVbm7HKxnmBK3iLZjV0ppBl+JklIUAuXHip2l/n8Yb0e1bugylwTBIDjT/A69+oaBurTbVzSvKlKuHerVP6Oy0FS5hVi5N9gaMhccwQLniLxq87RD63tUH0dEcJcyWRG4/D9DR3Doo44LF3B6UKGOVMe5C1FL38awoXcJMjK7XERdYYkuKxXF3rGxSEvFN/B0F6Eg4j1AaNG1HOWZD2sLxC8mItosWLhgUrMHowaCmcojxhN5I4US067WlOlb2aUIggdGESXj3sBhghT92fvsGK2FWLIEMuoqxNnTZtH0NUO73iX12sRgutU/ulehCKKnD8swlIYUTka8oVvZ9zBZEgnI/e4DTV8d3BWmvvMWkwOTEYeZN/Hcxe6ti0AregZnjDVuXO20zXDREETTbe/VAu/S6+OOzibnRHk4W23Tq6F7CTKaD2ZDOfRWhfVfYsFfmiQThz2XTXh/O6IdWrbS05CXuY/J0QvgICwAdpKU63JTmh9CuXMeeqjalEw7ayNJ5Elv2Sqs+j/RP9JSyc93YeQVsddtXjrOD99ccRmECcf42MBs5qu3tMUjLzyteEKp5klZRWncCW+LzL677VDXLyLZlrIly1WYeLT/fsYVWxgPnee7c+3sateVjUiy4oRjg0NLRNtKGMT7aXjYD9DQGrbYD2++28+yyw1OKcEKIFdBCaeQ+erbkkecpTPzTDDyrW94O7Pg8zi4mZRCSFc8pRQWYYM2Jzmt671aj+zF63scObVH2umOZIwX0LU0T5eoh9Cy98hjmfjh42nfoQjFBwz47cNo0nDbSo5eWdsfrn+mUM34XYXAfyhm75Yx/GhKnbRro+9B7Jj2+YJ8xHcvV5WkHFTB59r7SUx9frdQu8QZKMXn8CIGZPYj007SlC7MaOanhQqKcZNOp7wT6ZjC9tL/bCCs8xWyhScub8gobUwPx+bsGmUT4azt1LUwvjjomjXoLZt77mEfhN688KhW+2tUKb8Roa97gDHLVGYwrG0TaEn1IGC49Pb8No8gs8JyQogwSu049761PPXoOpB6idLX1SN8UZ8w6KuaWN0qi3EEZwElbTx7u0F5Tr62b2HHHbaI0vG6A3qV17yXK9DXz4c99Cnp110/6pmBN1XoYLUXjhVjiJcfpSBE3BmaUlMb7PBuHn9PmvSfz6mOutRmgp3G6lh/XCKsGf7ltn8JEPnTsco+ZZGS06nac/pk/XympvboGyTwyTwjc0+r2jTMm3xJqIh7IxJ++6IlensfIXYVL5z7awAEpau8UmhSllbOgYgJy+4p5D8I1e2Ur3rK097xxgLMngnqYXPm5rac6drOXPD4YG04fLkIG7CpUOOMkgedhuGfv2vj+aeTzvC1zIWGYyjD7PXPmtSG4k3CFkHv1OaaDNdcQcjs2Wfh1hI00VOdDYvrtGKVhuyiD1QxlMoq3lJhSXFfPSDHtfXx0PZ4I+Qx6FHu1Ukzb95MsIbgrvB8YMIY2Zh9XGO6xLSSgJDJ+irD3cOnpGLZui9s2RzWkMErsojzi3bGlFejTXT0S5dHP34cRqE8xKQtGbP6XUAWCzt4WY3Hq6ia4KzxHmBEfEuZc/NEM+jV77QfqBjPaMWjCGWbDdbXzgMakIIxWIrn8TsV2/kqmWGQt0HeI/pod69MIPdG6slq31xwRqIZMIEYbeoWbivFShgpY9hik/ZUmUUc8M0Ru9L7DDLuqBNMBSWgPcoUiA89ThKNTqt+M9INInxKTQmvAeAZqO+sNICLjw/aXwfDoxxpJhJ8jTCtPoky4PMbpINreya/lYQtjlRX3QjydFai58KP0rr1uRuglTODirorcXhPvmnttQ0rc9PombFs+cvubDJCPRa7bqiOMNNAn0/N777uYX9kcq7Brzu3VVXLTG4/QxnQA17W0vCBC3gOY5H9SJ0Ld1opuFkWJynPxFd6xg3Ng4oJ+k8BuYJJBPjOm9soC8N8/c5u605/bDyua2vkTIAW1Ua4uQixYZA/k8kRoOePNo2w2FG7Xdu75OUHCJEt4DJ7PNUwHZF2U8yH4R9XHDi2hCeclj0ml6hcjgs7dIqejGF4CDUymOUmBKUyKtRGgTy19x/t9EKE7QHmulZhMu3LGKUWZrcoi/YRSmnREa6JMbR5aGto7d5yxWqiGFspsor/XJ84Yddu/DMyn6dW7cmkinG7memrDsjqBTrYc6Kzaofp4dUfdkjFPNxckykwblQ5mR+40CZo47+X0O2R11A9NhIyHGa077UnApLQuSsPLAv00UBoErT5WZtuj6Tv8JyjTuDyWDPSdoPx2jcdPEUbdGYONSDpjtG09B4m+wlPE3y/0nPElV6qbV7edvLmymbbKEDgfkHB3UR7V3KCuKkjQpDhyZ22nzz3EvyZJUQqDxh6gGpqYPHvnDg8kE1JiNmefIZBbv2zHo7H4RdSZ3qGbDxLFtuFJ7RVvyIbL61UDNsJE4kW7iA5GL9qiN5h3kiQYPr/SBHPMBxI0rVBSbtupIxzOaJfhbOji1X9DT8ZLxtO0v2OxTXUsr/QwHG7rgG1Qfqw4n64mM21CM7X8/r5qvHtD9P6VYz50cXYhksvNMemSpb0+rdCezqUSS9/UIWqy+PKjJtbsFyC0GhIMX1w/gyFHxkq08nSh8Wq1RI+TgL82EWLw5y//t/mP5yP5m6s/eHDlvaWOluvgL199vfHXf/8fP3qntvbbn/6wrYMuzcs4MdeR7nSc675yHL/IY3yKP+S5duOZVrb2FkIrHXvzzmnKpesO2/owr0N+7ZaHo94ZFD8vmjCuj9xc7tST16CjyA17H1eqonnoo4mgrzR1wUofx9SXlsXyBzomUEfis3+2MQeKsZaHsvgQcGxdv9B/ShgB11QfY62s2pJWEgaOW2XXve7Np43yBUk7Oh5q9cIAIIwxqOPCEDhtWuhHiA0cL92dx5Uzgnu4+kQPPhy19R0pvqcN4GEh0OF/++e1ShxQEENn23axclbel/q+fu/J861kRchffvhu/2cfrBBXl4ujiNIKJWFbpepJR/nRwqFt4p5WdhaloTGX3kuNEdU29EGVVuuRHmdQdRwPNGaO6f/AofoUJuGToSKKjNrysF4YwnikeaqlGC615uBnAjODtkLxo1GqMzp6VZHlassy7+/79kM57W61YLTLKn7P7GyUFO6vuBdauCr56hu19vfnx42NZGVw+R29csbiiAzry6+H+N2To9vHY+S///mPr5/FkosXC2IsxWfPOsVvx5iKFUvbF6Uhzq7YEHh1k7fqe8/4FEMxznkvmsqYO0o/sTilXY5Q5khACiwEqJJwIzYGaxyF2wV+/bf/3H5yNBRPfrHa8ATdgInQuzjj/6pZPne1Qh9rFygLVywoIzXWnmq5/5KKjYGMi7ahda+eDWHWieONAAmhHajvAsFv2RYd5LZ7gfouUP2jxFeJGi4WlwN1EtMvaF4n+MdIiTK9muENB382xOAsHf+/1+sGcun7Xh1tTTQnibc4SUO2UaYzOQ36OoINloyY5kPKz7BAyj6v1OrLIrVXimwvLII9R1CQRspfuPl8C/SrGbF+3si4AAAAAElFTkSuQmCC);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
    pointer-events: none;
}
#InitialPagePreSelectButton{
    width: 150px;
    height: 100%;
    color: #FFFFFF;
    color: var(--angelai-white);
    background: linear-gradient(135deg, #3183FF 0%, #2670E8 100%);
    background: linear-gradient(135deg, var(--angelai-accent) 0%, #2670E8 100%);
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    text-align: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
    line-height: 1;
}
#InitialPagePreSelectButton.clear {
    font-size: 1rem;
}
.preSelectIcon {
    width: 18px;
    height: 18px;
    filter: brightness(0) invert(1);
}
#InitialPagePreSelectButton:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0px 4px 8px rgba(49, 131, 255, 0.4);
}
@media (hover: none) {
    #InitialPagePreSelectButton:hover:not(:disabled) {
        transform: none;
        box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                    0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                    0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    }
}
#InitialPagePreSelectButton.mini{
    width: 150px;
    font-size: 1rem;
}
#InitialPagePreSelectButton.mini.clear {
    font-size: 1rem;
}
#InitialPagePreSelectButton:disabled{
    background: #E0E0E0;
    color: #999999;
    cursor: not-allowed;
    box-shadow: none;
}

.initialPageBoldLabel{
    display: block;
    font-weight: 600;
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 4px;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#DeclinePage {
    width:100%;
    height:100%;
    padding: 10px 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: lightgray;
    align-content: center;
    overflow: auto;
}
#DeclinePageContent {
    width: 100%;
    height:90%;
    max-width: 500px;
    min-width: 310px;
    max-height: 600px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: #f5f5f5;
    border: 1px solid #083f88;
    border-radius: 10px;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.3); 
    margin:auto;
    overflow: auto;
}
#DeclinePageContent.mini {
    height: 80%;
}
#DeclinePageHeader{
    width: 100%;
    height: 10%;
    min-height: 50px;
    display: flex;
    justify-content: center;
    margin-bottom: 5px;
}
#DeclinePageTitle{
    width: 200px;
    height: 100%;
    display: flex;
    justify-content: center;
    font-size: 2rem;
    font-weight: 600;
    color:#083f88;
}
#DeclinePageBody {
    width: 100%;
    height: 70%;
    min-height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding:0px 5px; 
    margin: auto;
}
#DeclinePageInputWrapper{
    width: 90%;
    height:60%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin:auto;

}
#DeclinePageInputReason{
    width:100%;
    display: flex;
    flex-grow: 1;
    resize: none;
    font-size: 1rem;
    font-weight: 500;
    color: black;
    border: 1px solid #083f88;
    border-radius: 5px;
    background-color:white;
    
}
#DeclinePageInputWrapper label{
    display: block;
    font-weight: 700;
    color: #083f88;
}

#DeclinePageMessageWrapper{
    width: 90%;
    height:40%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin:auto;
}
#DeclinePageMessage{
    color:rgb(234, 175, 151); 
    font-size: 1rem;
    font-weight: 500;
}

#DeclinePageFooter{
    width: 100%;
    height: 10%;
    min-height: 50px;
    display: flex;
    flex-direction: row;
    padding:10px;
}
#DeclinePageButtons{
    width: 100%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.declinePageButtonWrapper{
    width: 100px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#DeclinePageCancelButton{
    width: 80px;
    height: 100%;
    font-size: 1rem;
    font-weight: 700;
    color: #083f88;
    background-color: #f8f8f8;
    cursor: pointer;
    border:1px solid rgb(255, 77, 7);
    border-radius: 7px;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}


/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#AgreementPage {
    width:100%;
    height:100%;
    padding: 10px 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: lightgray;
    align-content: center;
    overflow-y: auto;
}
#AgreementPageContent {
    width: 100%;
    max-height: 80%;
    max-width: 900px;
    min-height: 350px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: #f5f5f5;
    margin:auto;
    border: 1px solid #083f88;
    border-radius: 10px;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.3); 
    overflow-y: auto;
}
#AgreementPageContent.mini {
    max-height: 80%;
}
#AgreementPageHeader{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 5px;
    margin:auto;
}
#AgreementPageTitle{
    width: 100%;
    max-height: 70px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 1.6rem;
    font-weight: 700;
    color:#083f88;
}
#AgreementPageTitle.mini{
    font-size: 1.4rem;
    font-weight: 600;
    height: 50px;
}
#AgreementPageTitleMessage{
    width: 95%;
    display: block;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    color:gray;
    margin: auto;
}
#AgreementPageTitleMessage.mini{
    font-size: 1rem;
    font-weight: 600;
}
#AgreementPageBody {
    width: 95%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding:5px; 
    margin:auto;
    overflow: auto;
}
#AgreementPageDisplay{
    width:100%;
    height:100%;
    display: block;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 1.2rem;
    font-weight: 500;
    color: gray;
    background-color: #f8f8f8;
    border-radius: 8px; 
    overflow-y:auto ;
    resize: none;
    margin-bottom: 10px;
}
#AgreementPageDisplay.mini{
    font-size: 1rem;
}
#AgreementPageDisplay ul{
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 1em;
            margin-block-start: 1em;
    -webkit-margin-after: 1em;
            margin-block-end: 1em;
    -webkit-margin-start: 0px;
            margin-inline-start: 0px;
    -webkit-margin-end: 0px;
            margin-inline-end: 0px;
    -webkit-padding-start: 40px;
            padding-inline-start: 40px;
    unicode-bidi: isolate;
}
#AgreementPageFooter{
    width: 100%;
    height:60px;
    display: flex;
    flex-direction: row;
    padding:10px;
}
#AgreementPageButtons{
    width: 90%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: auto;
}
.argreementPageBtnWrapper{
    width: 130px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.argreementPageBtnWrapper.mini{
    width: 100px;
    height: 30px;
}
#AgreementPageAgreeButton{
    width: 100%;
    height: 100%;
    font-size: 1.3rem;
    font-weight: 700;
    color: white;
    background-color: rgb(255, 77, 7);
    cursor: pointer;
    border:1px solid white;
    border-radius: 7px;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
#AgreementPageAgreeButton.mini{
    font-size: 1rem;
}
#AgreementPageDeclineButton{
    width: 100%;
    height: 100%;
    font-size: 1.3rem;
    font-weight: 700;
    color: #083f88;
    background-color: #f8f8f8;
    cursor: pointer;
    border:1px solid rgb(255, 77, 7);
    border-radius: 7px;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
#AgreementPageDeclineButton.mini{
    font-size: 1rem;
}
#AgreementPageDownloadBtnWrapper{
    width: 90%;
    height: 35px;
    display: flex;
    flex-direction: row;
    justify-content:flex-end;
    align-items: center;
    margin-bottom: 10px;
}
#AgreementPageDownloadButton{
    font-size: 1.1rem;
    font-weight: 700;
    color: #083f88;
    border-radius: 5px;
}
#AgreementPageDownloadButton.mini{
    font-size: 0.8rem;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#SigningMessage {
    width:100%;
    height:100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding:20px;
    background-color: lightgray;
    margin: auto;
    overflow: auto;
}
#SigningMessageWrapper{
    width:300px;
    height:200px;
    display: block;
    border:1px solid white;
    border-radius: 10px;
    background-color: white;
    color:#083f88;
    text-align: center;
    padding:10px;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#AngelSignNotification{
    padding: 10px 20px;
    background-color: #4caf50; 
    color: white;
    border-radius: 5px;
    position: absolute;
    top: 5px;
    right: 20px;
    z-index: 1000;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
/*
calc(var(--angel-sign-header-height) + 5px);
*/
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */
 #AuthenticationPage {
    width:100%;
    height: 100%;
    display: block;
 }
 #AuthenticationPageBody {
    width:100%;
    height:calc(100% - var(--angel-sign-header-height));
    display: flex;
    justify-content: center;
    padding:20px;
    background-color: lightgray;
    overflow: hidden;
}

#AuthenticationPageContent {
    width:100%;
    height:-webkit-fit-content;
    height:fit-content;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding:10px;
    background-color:  #f5f5f5;
    margin: auto;
    overflow: auto;
    border: 2px solid darkgray;
    border-radius: 10px;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 
                0px 2px 2px 0px rgba(0, 0, 0, 0.14), 
                0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
.authItemsWrapper{
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 10px;
}

.boldLabel{
    display: block;
    font-weight: 700;
    color: #083f88;
}
.authMessagesWrapper{
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: auto;
}
.authMessageHeader{
    font-size: 1.2rem;
    font-weight: 600;
}
.authMessageBody{
    color: gray;
}
.authPasswordWrapper{
    width:60%;
    max-width: 300px;
    display: flex;
    justify-content: center;
}
.authButtonWrapper{
    width: 100px;
    height: 30px;
}
.authAlertWrapper{

}
.authAlertMessage{

}
.authAlertMessage.error{
    color:red;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

.InputPassword{
    width:100%;
    height:100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    min-width: 200px;
    min-height: 30px;
    border:1px solid;
    border-radius: 5px; 
    cursor: pointer;
    background-color: white;
    color:black;
}
.InputPassword.disabled{
    background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));
}
.InputPassword input{
    width:80%;
    height:100%;
    cursor: pointer; 
    border: 0px;
    font-size: 1.1rem;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    padding-inline: 0;
    padding-block: 0;
    outline: none;
    background-color: inherit;
    color:black;
}


.InputPasswordButtons{
    width:25px;
    height: 25px;
    display: block;
}

.InputPasswordButton{
    width: 100%;
    height:100%;
    border: 0px;
    padding-inline: 0;
    padding-block: 0;
    cursor: pointer;
    background-color: inherit;
}
/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#PageHeader{
    width: 100%;
    height: var(--angel-sign-header-height);
    position: -webkit-sticky;
    position: sticky;
    top:0;
    left:0;
    background-color: #083f88;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    padding-left: 20px;
    padding-top: 20px;
}

#PageHeaderLogoWrapper{
    width: 100%;
    min-width: 250px;
    max-width:300px;
    height: 100%;
    display: block;
}

#PageHeaderLogo{
    height: 100%;
    width: 100%;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

#ViewerPage{
    width:100%;
    height: 100%;
    display: block;
    overflow: hidden;
}
#ViewerPageHeader{
    width: 100%;
    height:var(--angel-sign-header-height);
    display: block;
    position: relative;
    background-color:#083f88;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    z-index: 2;
}
#ViewerPageBody{
    width: 100%;
    height:calc(100% - var(--angel-sign-header-height)) ;
    display: block;
    overflow: hidden;
    position: relative;
}
#ViewerPagePDFViewer{
    width:100%;
    height:100%;
    display: block;
    overflow: hidden;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */

 #ViewerPageHeadbar {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #083f88;
    display: flex;
    flex-direction: row;
    z-index: 2;
}
#ViewerPageHeadbarMenuLogo {
    width: 70%;
    height: 100%;
    min-width: 200px;
    display:flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
#ViewerPageHeadbarButtons {
    width: 30%;
    height: 100%;
    min-width: 100px;
    display:flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
#ViewerPageHeadbarMenuWrapper {
    width: 35px;
    height: 30px;
    min-width: 35px;
    min-height: 30px;
    margin-right: 5px;
    display:none;
}
#ViewerPageHeadbarMenuIcon {
    width: 100%;
    height: 100%;
    color:blue;
    background-color: #083f88;
    border-radius: 7px;
    border: 1px solid #FEC830;
    padding: 3px;
    cursor: pointer;
}
#ViewerPageHeadbarMenuIcon.disabled {
    border-color: darkgray;   
}
#ViewerPageHeadbarLogoWrapper{
    display: flex;
    flex-grow: 1;
    height:100%;
    max-width: 320px;
    min-width: 150px;
    padding-left: 10px;
}
#ViewerPageHeadbarLogo{
    height: 100%;
    width: 100%;
}

.viewerPageHeadbarButton {
    width: 100px;
    height: 30px;
    font-size: 0.9rem;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    text-transform: uppercase;
    border: 1px solid lightgray;
    border-radius: 5px;
    text-align: center;
    padding-inline: 0px;
    padding-block: 0px;
    color: #083f88;
    background-color: #FEC830;
    cursor: pointer;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2),
        0px 2px 2px 0px rgba(0, 0, 0, 0.14),
        0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}
.viewerPageHeadbarButton.mini {
    width: 75px;
    height:25px;
    font-size: 0.7rem;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */
#MessagePage{
    width: 100%;
    height:100%;
    display: block;
}

#MessagePageBody {
    width:100%;
    height:calc(100% - var(--angel-sign-header-height));
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding:20px;
    background-color: lightgray;
    margin: auto;
    overflow: auto;
}
#MessagePageMessageWrapper{
    width:300px;
    height:200px;
    display: block;
    border:1px solid white;
    border-radius: 10px;
    background-color: white;
    color:#083f88;
    text-align: center;
    padding:10px;
}

/* 
 
 Copyright© Celligence International, LLC - 2023
 
 This software program is protected by copyright laws and is the property of
 Celligence International, LLC (Celligence). Any unauthorized reproduction,
 distribution, modification, or public display of this program, without the
 explicit permission of Celligence is strictly prohibited. If you have gained
 access to this program without the expressed approval of Celligence report
 the incident to legal@celligence.com.
 
 */
 #LoadingPage {
  width:100%;
  height: 100%;
  display: block;
}
#LoadingPageBody {
  width:100%;
  height:calc(100% - var(--angel-sign-header-height));
  display: flex;
  justify-content: center;
  padding:20px;
  background-color: lightgray;
  overflow: hidden;
}
#LoadingPageContent {
  width:100%;
  height:100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding:20px;
  background-color: lightgray;
  margin: auto;
  overflow: auto;
}
.loadingText{
    font-size: 1.5em;
    font-weight: bold; 
    color: #E9E9E9 ;
}

.loadingSpinner-section{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 1;
}

.loadingSpinner-wrapper{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.spinner {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 50%;
  }

.spinner:before,
.spinner:after {
  content: "";
  position: absolute;
  border-radius: inherit;
}

.spinner:before {
  width: 100%;
  height: 100%;
  background-image: linear-gradient(0deg, #f2942a 0%, #0b55a0 100%);
  animation: spin 1s infinite linear;
}

.spinner:after {
  width: 85%;
  height: 85%;
  background-color: #e9e9e9;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* 

Copyright© Celligence International, LLC - 2023

This software program is protected by copyright laws and is the property of
Celligence International, LLC (Celligence). Any unauthorized reproduction,
distribution, modification, or public display of this program, without the
explicit permission of Celligence is strictly prohibited. If you have gained
access to this program without the expressed approval of Celligence report
the incident to legal@celligence.com.

*/

@font-face {
  font-family: "Honey Script";
  src: url(https://www.swmc.com/angelai/static/media/HoneyScript.813e998927776cfcffec.ttf) format("truetype");
  font-weight: normal;
  font-style: normal;
}

body {
  margin: 0;
}

#angelSignAdmin * {
  font-family: 'Poppins', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: 0.00938em;
}

#angelSignAdmin .MuiTableSortLabel-root.Mui-active {
  color: #fff !important;
  box-shadow: 0 0 8px #fff;
  border-radius: 10px;
  padding: 0 10px;
}

#angelSignAdmin .MuiTableSortLabel-icon {
  color: #fff !important;
}

#angelSignAdmin .MuiTableSortLabel-root:hover {
  color: #ccc !important;
}

#angelSignAdmin::-webkit-scrollbar, #angelSignAdmin *::-webkit-scrollbar {
  width: 1em !important;
}

#angelSignAdmin::-webkit-scrollbar-track, #angelSignAdmin *::-webkit-scrollbar-track {
  background-color: white !important;
  box-shadow: inset 0 0 6px #00000000 !important;
  -webkit-box-shadow: inset 0 0 6px #00000000 !important;
}

#angelSignAdmin::-webkit-scrollbar-thumb, #angelSignAdmin *::-webkit-scrollbar-thumb {
  background-color: #0000000A !important;
  border: 4px solid transparent !important;
  outline: 1px solid slategray !important;
  outline-offset: -4px !important;
  background-clip: padding-box !important;
  border-radius: 1em !important;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
    monospace;
}

.spinner {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
}

.spinner:before,
.spinner:after {
  content: "";
  position: absolute;
  border-radius: inherit;
}

.spinner:before {
  width: 100%;
  height: 100%;
  background-image: linear-gradient(0deg, #f2942a 0%, #0b55a0 100%);
  animation: spin 1s infinite linear;
}

.spinner:after {
  width: 85%;
  height: 85%;
  background-color: #e9e9e9;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.arrow {
  border: solid white;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 2px;
}

/* Centers the textlayer of the pdf to the center of the viewer div */
#viewer.pdfViewer > div > .textLayer {
  opacity: 1 !important;
}

/* Below layers are generated from the library we are using and we do not need these.
   Ideally we can not render them at all instead of setting display to none.
*/
#viewer.pdfViewer > div > .annotationLayer {
  display: none !important;
}

#viewer.pdfViewer > div > .annotationEditorLayer {
  display: none !important;
}

@media screen and (max-width: 768px) {
  #AngelSignAdmin {
    max-width: 100%;
    overflow-x: auto;
  }
}

.ACHPaymentWindow_componentContainer__AzsH7 {
  --ach-payment-footer-input-border-radius: 24px;
  --ach-payment-footer-submit-hover: #ec501c;
  --ach-payment-footer-form-gap: 12px;
}

.ACHPaymentWindow_componentContainer__AzsH7 {
  position: relative;
  width: -webkit-fit-content;
  width: fit-content;
  min-width: 300px;
  max-width: 88vw;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ACHPaymentWindow_footer__qx07a {
  background: transparent;
  border: var(--borderWidth000);
  border-radius: 24px;
  font-family: 'Poppins', sans-serif !important;
  position: relative;
  overflow: hidden;
  width: 100%;
  z-index: 1;
}

.ACHPaymentWindow_footer__qx07a:has(.ACHPaymentWindow_orderSummary__jLL7o.ACHPaymentWindow_slideIn__NZMkw) {
  border: var(--borderWidth000);
}

.ACHPaymentWindow_slideContainer__KfBJw {
  width: 100%;
  transition: transform 0.3s ease-in-out;
}

.ACHPaymentWindow_slideContainer__KfBJw.ACHPaymentWindow_slideLeft__71J4z {
  transform: translateX(-100%);
}

.ACHPaymentWindow_orderSummary__jLL7o {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100%;
  height: auto;
  background: transparent;
  border: var(--borderWidth000);
  border-radius: 24px;
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
  display: flex;
  flex-direction: column;
}

.ACHPaymentWindow_orderSummary__jLL7o .ACHPaymentWindow_container__iZDDd {
  display: flex;
  flex-direction: column;
  height: 100%;
  flex: 1 1;
}

.ACHPaymentWindow_orderSummary__jLL7o.ACHPaymentWindow_slideIn__NZMkw {
  transform: translateX(0);
}

.ACHPaymentWindow_summaryContent__Q-NxJ {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1;
  justify-content: center;
}

.ACHPaymentWindow_bulletPoint__60n4w {
  color: #1F1F1F !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  margin: 4px 0 !important;
}

.ACHPaymentWindow_summaryRow__EuNdS {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: var(--borderWidth100) solid rgba(31, 31, 31, 0.1);
}

.ACHPaymentWindow_summaryLabel__BuiFB {
  color: #1F1F1FB2 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

.ACHPaymentWindow_summaryValue__D\+WXL {
  color: #1F1F1F !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.ACHPaymentWindow_summaryButton__1saNs {
  border: var(--borderWidth091) solid #f4f4f4 !important;
  color: #FF541C !important;
  -webkit-backdrop-filter: blur(18px) !important;
          backdrop-filter: blur(18px) !important;
  background: linear-gradient(146.59deg, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.5) 90%) !important;
  border-radius: 27.39px !important;
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  height: 38px !important;
  text-transform: none !important;
  font-family: 'Poppins' !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  line-height: 14px !important;
  letter-spacing: 0% !important;
  vertical-align: middle !important;
  padding: 0 16px !important;
  display: flex !important;
  align-items: center !important;
  align-self: center !important;
  position: relative !important;
}

.ACHPaymentWindow_summaryButton__1saNs img {
  position: absolute !important;
  left: 5px !important;
}

.ACHPaymentWindow_summaryButton__1saNs span {
  flex: 1 1 !important;
  text-align: center !important;
  margin-left: 24px !important;
}

.ACHPaymentWindow_summaryButton__1saNs:hover {
  background: rgba(255, 84, 28, 0.1) !important;
}

.ACHPaymentWindow_payButton__oVMFK {
  width: 135px !important;
  height: 38px !important;
  border-radius: 27.39px !important;
  opacity: 1 !important;
  border: var(--borderWidth091) solid #FFFFFF !important;
  -webkit-backdrop-filter: blur(18px) !important;
          backdrop-filter: blur(18px) !important;
  background: linear-gradient(146.59deg, rgba(255, 255, 255, 0.2) 16.66%, rgba(255, 255, 255, 0.5) 80.13%) !important;
  color: #FF541C !important;
  text-transform: none !important;
  font-family: 'Poppins' !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  line-height: 100% !important;
  letter-spacing: 0% !important;
  vertical-align: middle !important;
  padding: 0 !important;
  min-width: 0 !important;
  min-width: initial !important;
  display: flex !important;
  align-items: center !important;
  position: relative !important;
}

.ACHPaymentWindow_payButton__oVMFK:hover {
  border: var(--borderWidth191) solid #FFFFFF !important;
}

.ACHPaymentWindow_payButton__oVMFK:disabled {
  background: rgba(223, 223, 223, 0.2) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
  opacity: 0.6 !important;
}

.ACHPaymentWindow_achIcon__tTxux {
  width: 30.5px;
  height: 30.5px;
  background-color: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 4px;
}

.ACHPaymentWindow_payButtonText__2iaYD {
  flex: 1 1;
  margin-left: 22px;
}

.ACHPaymentWindow_achIcon__tTxux svg {
  width: 20px;
  height: 20px;
  fill: #FF541C !important;
}

.ACHPaymentWindow_achIcon__tTxux svg path {
  fill: #FF541C !important;
}

@keyframes ACHPaymentWindow_float__PTL4t {
  0%,
  100% {
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
  25% {
    transform: translate(-30px, -15px) rotate(90deg) scale(1.05);
  }
  50% {
    transform: translate(20px, -20px) rotate(180deg) scale(0.95);
  }
  75% {
    transform: translate(30px, 15px) rotate(270deg) scale(1.02);
  }
}


.ACHPaymentWindow_secureIcon__Yi8HN {
  display: none;
}

@keyframes ACHPaymentWindow_secureGlow__vc6-c {
  0%,
  100% {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  }
  50% {
    box-shadow: 0 12px 40px rgba(76, 175, 80, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.4),
      inset 0 -1px 0 rgba(0, 0, 0, 0.05);
    transform: scale(1.05);
  }
}

.ACHPaymentWindow_infoIcon__XsxB8 {
  width: 24px;
  height: 24px;
  color: #FF4103 !important;
  margin-top: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 4px;
}

.ACHPaymentWindow_infoIcon__XsxB8:hover {
  color: #FF4103 !important;
  transform: scale(1.1);
}

.ACHPaymentWindow_infoPopup__YvNon {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  border-radius: 24px;
  background: #FFFFFFDD;
  overflow: hidden;
  scrollbar-width: none;
}

.ACHPaymentWindow_infoPopup__YvNon[data-closing="false"] {
  animation: ACHPaymentWindow_infoPopupOpen__AEGv5 500ms ease-in-out forwards;
}

.ACHPaymentWindow_infoPopup__YvNon[data-closing="true"] {
  animation: ACHPaymentWindow_infoPopupClose__250oh 500ms ease-in-out forwards;
}

@keyframes ACHPaymentWindow_infoPopupOpen__AEGv5 {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes ACHPaymentWindow_infoPopupClose__250oh {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

.ACHPaymentWindow_infoPopupContent__sQ6D1 {
  background: #FFFFFF99;
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
  padding: 24px;
  max-width: 350px;
  margin: 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  height: 95%;
  scrollbar-width: none;
  overflow-y: auto;
}

.ACHPaymentWindow_infoPopupHeader__k8I9x {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.ACHPaymentWindow_infoPopupTitle__3tDNU {
  color: #FF4103 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-shadow: none;
}

.ACHPaymentWindow_closeIcon__rKPch {
  color: #1F1F1FB2 !important;
  padding: 4px !important;
  transition: all 0.3s ease;
  margin-bottom: 2px;
}

.ACHPaymentWindow_closeIcon__rKPch:hover {
  color: #1F1F1F !important;
  transform: scale(1.1);
}

.ACHPaymentWindow_infoPopupText__KmhkK {
  color: #1F1F1FB2 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
  text-shadow: none;
}

.ACHPaymentWindow_container__iZDDd::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  transition: left 0.5s;
}

.ACHPaymentWindow_container__iZDDd:hover::before {
  left: 100%;
}

.ACHPaymentWindow_container__iZDDd {
  padding: 24px;
  position: relative;
  overflow: hidden;
}

.ACHPaymentWindow_header__rl\+f1 {
  justify-content: center;
  display: flex;
  gap: 10px;
}

@media (max-width: 480px) {
  .ACHPaymentWindow_header__rl\+f1 {
    padding-top: 15px;
  }
}

.ACHPaymentWindow_title__zcNTV {
  color: #FF4103;
  font-family: 'Poppins', sans-serif;
  font-size: 19.34px;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: 0%;
  text-align: center;
  margin: 8px 0 8px 0;
}

.ACHPaymentWindow_orderSummary__jLL7o .ACHPaymentWindow_title__zcNTV {
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 20px;
  line-height: 14.75px;
  letter-spacing: 0%;
  vertical-align: middle;
}

.ACHPaymentWindow_subtitle__rDcyD {
  color: rgba(255, 255, 255, 0.95);
  font-size: 14px;
  margin: 0;
  font-weight: 400;
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.7);
}

.ACHPaymentWindow_form__RXh1y {
  display: flex;
  flex-direction: column;
  gap: var(--ach-payment-footer-form-gap);
}

.ACHPaymentWindow_row__SX-JY {
  display: flex;
  gap: var(--ach-payment-footer-form-gap);
  flex-wrap: wrap;
}

.ACHPaymentWindow_row__SX-JY > * {
  flex: 1 1;
  min-width: 200px;
}

.ACHPaymentWindow_label__uasZK {
  color: #1F1F1FB2 !important;
  font-size: 16px;
  font-weight: 300;
  text-shadow: none;
}

/* MUI Label overrides */
.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiInputLabel-root__T9wgl {
  color: #1F1F1FB2 !important;
  font-weight: 300 !important;
  text-shadow: none !important;
}

.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiInputLabel-root__T9wgl.ACHPaymentWindow_Mui-focused__ZRGqZ {
  color: #1F1F1FB2 !important;
  font-weight: 300 !important;
  text-shadow: none !important;
}

.ACHPaymentWindow_input__o2gcK {
  background: transparent;
  font-size: 16px;
  border: var(--borderWidth000);
  border-bottom: var(--borderWidth100) solid #E2E2E2;
  border-radius: 0;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
}

.ACHPaymentWindow_invalidInput__PTdDs {
  border-bottom: var(--borderWidth100) solid transparent !important;
}

/* MUI TextField overrides */
.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiOutlinedInput-root__tBWh8 {
  background: transparent !important;
  border: var(--borderWidth000) !important;
  border-bottom: 1px solid #E2E2E2 !important;
  border-radius: 0 !important;
}

.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiOutlinedInput-root__tBWh8 .ACHPaymentWindow_MuiOutlinedInput-notchedOutline__bspF8 {
  border: var(--borderWidth000) !important;
}

.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiOutlinedInput-root__tBWh8:hover {
  background: transparent !important;
  border-bottom: var(--borderWidth100) solid #E2E2E2 !important;
}

.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiOutlinedInput-root__tBWh8.ACHPaymentWindow_Mui-focused__ZRGqZ {
  background: transparent !important;
  border-bottom: var(--borderWidth100) solid #E2E2E2 !important;
  box-shadow: none !important;
}

.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiInputBase-input__GeMfQ {
  color: #1F1F1F !important;
  font-weight: 500 !important;
  padding: 4px 0 !important;
}

.ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiOutlinedInput-input__qTczo::placeholder {
  color: #1F1F1FB2;
  opacity: 1;
}

.ACHPaymentWindow_input__o2gcK::placeholder {
  color: #1F1F1FB2;
}

/* Hide the little arrows that come up for number inputs */
.ACHPaymentWindow_footer__qx07a input[type='number']::-webkit-outer-spin-button,
.ACHPaymentWindow_footer__qx07a input[type='number']::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.ACHPaymentWindow_footer__qx07a input[type='number'] {
  -webkit-appearance: textfield;
          appearance: textfield;
  -moz-appearance: textfield;
}

/* Height-constrained screens */
@media (max-height: 730px) {
  .ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiOutlinedInput-root__tBWh8 {
    padding: 2px 6px !important;
  }

  .ACHPaymentWindow_input__o2gcK .ACHPaymentWindow_MuiInputBase-input__GeMfQ {
    padding: 2px 0 !important;
  }

  .ACHPaymentWindow_accountTypeButton__lmSRY {
    padding: 2px 6px;
  }

  .ACHPaymentWindow_componentContainer__AzsH7 {
    --ach-payment-footer-form-gap: 8px;
  }
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .ACHPaymentWindow_container__iZDDd {
    padding: 20px 16px;
  }

  .ACHPaymentWindow_title__zcNTV {
    font-size: 20px;
  }

  .ACHPaymentWindow_subtitle__rDcyD {
    font-size: 13px;
  }

  .ACHPaymentWindow_row__SX-JY > * {
    flex: 1 1 100%;
  }

  .ACHPaymentWindow_summaryButton__1saNs {
    width: 90px !important;
  }
}

@media (max-width: 480px) {
  .ACHPaymentWindow_container__iZDDd {
    padding: 16px 12px;
  }

  .ACHPaymentWindow_title__zcNTV {
    font-size: 18px;
  }

  .ACHPaymentWindow_accountTypeLabel__W8zjg {
    font-size: 14px !important;
  }

  .ACHPaymentWindow_checkboxLabel__0SEjs {
    font-size: 12px !important;
  }

  .ACHPaymentWindow_label__uasZK {
    font-size: 14px !important;
  }
}

@media (max-width: 360px) {
  .ACHPaymentWindow_accountTypeLabel__W8zjg {
    font-size: 12px !important;
  }

  .ACHPaymentWindow_checkboxLabel__0SEjs {
    font-size: 12px !important;
  }

  .ACHPaymentWindow_label__uasZK {
    font-size: 12px !important;
  }
}

.ACHPaymentWindow_paymentIcon__WLQmc {
  font-size: 48px;
  margin-bottom: 12px;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));
  animation: ACHPaymentWindow_pulse__1EszL 2s infinite;
}

@keyframes ACHPaymentWindow_pulse__1EszL {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

.ACHPaymentWindow_accountTypeSelector__yEUkp {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ACHPaymentWindow_accountTypeLabel__W8zjg {
  color: #1F1F1F !important;
  font-size: 16px;
  font-weight: 300;
  text-shadow: none;
  white-space: nowrap;
  padding-left: 21px;
}

.ACHPaymentWindow_checkboxGroup__cL01z {
  display: flex;
  flex: 1 1;
  justify-content: space-evenly;
  align-items: center;
}

.ACHPaymentWindow_checkboxContainer__KJjCO {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ACHPaymentWindow_checkbox__libll {
  width: 18px;
  height: 18px;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: var(--borderWidth200) solid #000000;
  border-radius: 0;
  cursor: pointer;
  position: relative;
  transition: all 0.3s ease;
}

.ACHPaymentWindow_checkbox__libll:hover {
  border-color: #000000;
  background: transparent;
}

.ACHPaymentWindow_checkbox__libll:checked {
  background: transparent;
  border-color: #000000;
}

.ACHPaymentWindow_checkbox__libll:checked::after {
  content: '✓';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #000000;
  font-size: 12px;
  font-weight: bold;
}

.ACHPaymentWindow_checkboxLabel__0SEjs {
  color: #1F1F1F;
  font-size: 16px;
  font-weight: 300;
  cursor: pointer;
  text-shadow: none;
  transition: color 0.3s ease;
}

.ACHPaymentWindow_checkboxLabel__0SEjs:hover {
  color: #1F1F1F;
}

.ACHPaymentWindow_buttonContainer__1rWvB {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 16px;
  margin-bottom: 8px;
}

.ACHPaymentWindow_orderSummary__jLL7o .ACHPaymentWindow_buttonContainer__1rWvB {
  justify-content: space-between;
  margin-top: auto;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .ACHPaymentWindow_footer__qx07a::before {
    animation: none;
  }
  .ACHPaymentWindow_paymentIcon__WLQmc {
    animation: none;
  }
  .ACHPaymentWindow_accountTypeButton__lmSRY {
    transform: none !important;
  }
}
.ACHPaymentWindow_totalSection__O5MYP {
  text-align: center;
  flex: 1 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 160px;
  overflow: hidden;
  min-width: 0;
}

.ACHPaymentWindow_grandTotalLabel__DKq94 {
  font-family: 'Poppins' !important;
  font-weight: 500 !important;
  font-size: 13.47px !important;
  line-height: 14px !important;
  letter-spacing: 0% !important;
  vertical-align: middle !important;
  color: #1F1F1F !important;
  margin: 0 !important;
}

.ACHPaymentWindow_grandTotalAmount__cx5\+W {
  font-family: 'Poppins' !important;
  font-weight: 600 !important;
  font-size: clamp(14px, 3vw, 29.47px) !important;
  line-height: 1.1 !important;
  letter-spacing: 0% !important;
  vertical-align: middle !important;
  color: #FF541C !important;
  margin: 5px 0 0 0 !important;
  white-space: nowrap !important;
}

.CreditCardPaymentWindow_paymentContainer__z4WX5 {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: visible;
}

.CreditCardPaymentWindow_receiptBox__5eXON {
    background-color: none;
    border-radius: 10px;
    width: 50%;
    padding: 2vw;
    padding-bottom: 0px;
    z-index: 10;
    display: flex;
    flex-direction: column;
    overflow: visible;
    margin-top: 25px;
}

@media (max-width: 768px) {
    .CreditCardPaymentWindow_receiptBox__5eXON {
        width: 90%;
    }
}

@media (min-width: 900px) {
    .CreditCardPaymentWindow_receiptBox__5eXON {
        min-width: 430px;
    }
}

.CreditCardPaymentWindow_receiptButtonsWrapper__jakN6 {
    width: 100%;
    display: flex;
    justify-content: center;
    border-top: var(--borderWidth200) solid rgba(255, 255, 255, 0.8);
    padding-top: 10px;
}

.CreditCardPaymentWindow_receiptButtons__wax6E {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    width: 45%;
    margin-bottom: 10px;
}

@media (max-width: 768px) {
    .CreditCardPaymentWindow_receiptButtons__wax6E {
        width: 85%;
    }
}

@media (min-width: 900px) {
    .CreditCardPaymentWindow_receiptButtons__wax6E {
        min-width: 400px;
    }
    
}

.CreditCardPaymentWindow_cardBox__fSFXP {
    background-color: var(--gray850);
    border-radius: 10px;
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translate(-50%, -100%);
    min-width: 30vw;
    max-width: 50vw;
    padding: 2vw;
    transition: top 0.3s ease;
}

.CreditCardPaymentWindow_label__E2hLk {
    position: absolute;
    color: black;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
}

.CreditCardPaymentWindow_backButtonLabel__gva2o {
    position: absolute;
    color: var(--gray000);
    font-weight: bold;
    text-transform: uppercase;
    font-size: inherit;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    text-align: center;
}

.CreditCardPaymentWindow_inputField__oYV6X {
    font-size: 16px !important;
    position: absolute;
    background: transparent;
    border: var(--borderWidth100) solid var(--gray060);
    border-radius: 8px;
    padding: 4px;
    text-align: center;
    outline: none;
}

.CreditCardPaymentWindow_select__qMfe9 {
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--gray000) !important;
    background-repeat: no-repeat !important;
    background-position: calc(100% - 4px) !important;
    left: 10% !important;
    bottom: 7%;
    width: 17% !important;
    text-align: left !important;
}

.CreditCardPaymentWindow_zipInput__5c9rz {
    background-color: var(--gray000);
    bottom: 7%;
    left: 30%;
    width: 30%;
}

.CreditCardPaymentWindow_streetAddress__72J5w {
    background-color: var(--gray000);
    top: 36%;
    left: 10%;
    width: 80%;
}

.CreditCardPaymentWindow_city__tJ2\+h {
    background-color: var(--gray000);
    top: 58%;
    left: 10%;
    width: 80%;
}

.CreditCardPaymentWindow_backButton__SA3ye {
    width: 28%;
    height: 14%;
    background-color: transparent;
    border: var(--borderWidth200) solid var(--gray000);
    border-radius: 10px;
    position: absolute;
    right: 2%;
    top: 15%;
    cursor: pointer;
}

.CreditCardPaymentWindow_backButtonReverse__-JJ2A {
    width: 28%;
    height: 14%;
    background-color: transparent;
    border: var(--borderWidth200) solid var(--gray000);
    border-radius: 10px;
    position: absolute;
    left: 2%;
    top: 15%;
    cursor: pointer;

    display: flex;
    justify-content: center;
    align-items: center;

    font-size: 0.6em;
}

.CreditCardPaymentWindow_flipContainer__4-Gaq.CreditCardPaymentWindow_flip__5wTRP .CreditCardPaymentWindow_flipper__IT3u0 {
    transform: rotateY(180deg);
}

.CreditCardPaymentWindow_flipContainer__4-Gaq.CreditCardPaymentWindow_flip__5wTRP .CreditCardPaymentWindow_back__HlEA- {
    z-index: 2;
}

.CreditCardPaymentWindow_flipContainer__4-Gaq.CreditCardPaymentWindow_flip__5wTRP .CreditCardPaymentWindow_front__mZPXg {
    z-index: 0;
}


.CreditCardPaymentWindow_flipContainer__4-Gaq {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
}

.CreditCardPaymentWindow_flipper__IT3u0 {
    transition: 0.6s;
    transform-style: preserve-3d;
    position: relative;
    width: 100%;
    transform-origin: center center;
}

.CreditCardPaymentWindow_front__mZPXg,
.CreditCardPaymentWindow_back__HlEA- {
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.CreditCardPaymentWindow_front__mZPXg {
    position: relative;
    z-index: 0;
}

.CreditCardPaymentWindow_back__HlEA- {
    position: absolute;
    top: 0;
    left: 0;
    transform: rotateY(180deg);
    z-index: 1;
}

.CreditCardPaymentWindow_optionsList__kFYGo {
    border: var(--borderWidth100) solid var(--gray060);
    border-radius: 4px;
    max-height: 200px;
    overflow-y: auto;
    position: absolute;
    width: 100%;
    z-index: 1;
    transform: translateY(-100%);
    background-color: var(--gray000);
    top: 36%;
    left: 4%;
    width: 80%;
}

.CreditCardPaymentWindow_optionsList__kFYGo li {
    padding: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    border-bottom: var(--borderWidth100) solid var(--gray060);
}

.CreditCardPaymentWindow_optionsList__kFYGo li:last-child {
    border-bottom: var(--borderWidth000);
}

.CreditCardPaymentWindow_cvcInput__y068e {
    -moz-appearance: textfield;
    -webkit-appearance: none;
    background-color: var(--gray000);
    top: 15%;
    right: 2%;
    width: 15%;
}

.CreditCardPaymentWindow_eyeMovement__WLmOf {
    width: 80px;
    left: 7%;
    position: absolute;
    top: -30px;
}

.CreditCardPaymentWindow_eyeMovementBack__VR1Qj {
    width: 80px;
    right: 7%;
    position: absolute;
    top: -30px;
}

.CreditCardPaymentWindow_cardTypeImage__ZpBIu {
    max-width: 60px;
    left: 37%;
    position: absolute;
    top: 15px;
}

.CreditCardPaymentWindow_cardNumberInput__y0bt- {
    -moz-appearance: textfield;
    -webkit-appearance: none;
    margin: 0;
    background-color: var(--gray000);
    width: 17%;
    top: 48%;
}

.CreditCardPaymentWindow_cardHolderInput__JIjVA {
    background-color: var(--gray000);
    bottom: 10%;
    left: 12%;
    max-width: 50%;
}

.CreditCardPaymentWindow_validThruInput__Jfejr {
    -moz-appearance: textfield;
    -webkit-appearance: none;
    background-color: var(--gray000);
    bottom: 10%;
    right: 10%;
    width: 25%
}

.CreditCardPaymentWindow_CreditCardImage__mpPPN {
    width: 100%;
    height: auto;
}

.CreditCardPaymentWindow_CreditCard__vpvgq {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 10px;
    position: relative;
    transform: translate(0px, 8px);

    transition: top 0.3s ease;
    z-index: 2000;
}

.CreditCardPaymentWindow_valid__14DVL {
    border: var(--borderWidth100) solid green;
}

.CreditCardPaymentWindow_invalid__WTl2E {
    border: var(--borderWidth100) solid red;
}

.CreditCardPaymentWindow_error__06ED9 {
    border: var(--borderWidth100) solid red;
}

.CreditCardPaymentWindow_orderSummary__H2ORz {
    font-family: Poppins;
    font-weight: 500;
    font-size: 20px;
    line-height: 14.75px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #FF541C;
    text-align: center;
    margin-bottom: 20px;
    padding: 10px;
    border-radius: 5px;
}

.CreditCardPaymentWindow_paymentInformation__lP731 {
    font-family: Poppins;
    font-weight: 500;
    font-size: 20px;
    line-height: 14.75px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #FF541C;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.CreditCardPaymentWindow_lineItems__qVeHo {
    color: black;
    flex: 1 1;
    overflow: visible;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 20px;
}

.CreditCardPaymentWindow_lineItem__whkwe {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
    position: relative;
}

.CreditCardPaymentWindow_itemDetails__YqGEs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.CreditCardPaymentWindow_itemName__kp5PM {
    flex: 1 1;
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: auto;
            hyphens: auto;
}

.CreditCardPaymentWindow_priceContainer__hONcM {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: -webkit-fit-content;
    min-width: fit-content;
    flex-shrink: 0;
}

.CreditCardPaymentWindow_itemPrice__D4lDS {
    font-weight: 600;
    color: #FF541C;
}

.CreditCardPaymentWindow_underline__Suvdi {
    background-color: var(--gray000);
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: 0;
    bottom: -6px;
}


.CreditCardPaymentWindow_terms__7DX1p {
    text-align: center;
    font-size: 0.8rem;
    color: var(--gray000);
}

.CreditCardPaymentWindow_slideDown__WdfFU {
    top: 0;
}

.CreditCardPaymentWindow_signing__ozYYa {
    position: relative;
    top: -20px;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: CreditCardPaymentWindow_shakingHands__0HLg7;
    animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1);
}

.CreditCardPaymentWindow_grandTotalContainer__iSrSz {
    transform: translate(0px, -30%);
    text-align: center;
    display: flex;
    margin-top: 20px;
    color: var(--gray000);
}

.CreditCardPaymentWindow_grandTotalPrice__rmWFS {
    font-size: 120%;
    display: block;
    width: 20%;
}

.CreditCardPaymentWindow_grandTotalText__0XKvA {
    font-size: 1rem;
    display: block;
}

@keyframes CreditCardPaymentWindow_shakingHands__0HLg7 {
    0% {
        transform: scale(1, 1) translateY(1px);
    }

    10% {
        transform: scale(1, 1) translateY(0);
    }

    50% {
        transform: scale(1, 1) translateY(-2px);
    }

    100% {
        transform: scale(1, 1) translateY(1px);
    }
}

.CreditCardPaymentWindow_slideDown__WdfFU {
    animation-duration: 2.5s;
    animation-iteration-count: 1;
    animation-name: CreditCardPaymentWindow_slideDown__WdfFU;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
}

@keyframes CreditCardPaymentWindow_slideDown__WdfFU {
    0% {
        transform: translateY(-30px);
    }

    100% {
        transform: translateY(22px);
    }
}

.CreditCardPaymentWindow_buttonWordsLeftContainer__ZPmFh {
    display: flex;
    flex-direction: column;
}

.CreditCardPaymentWindow_buttonWordsRightContainer__HirUt {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.CreditCardPaymentWindow_offScreenWords__IqIx4 {
    margin-top: 40px;
}

.CreditCardPaymentWindow_onScreenWords__C\+biP {
    top: 7px;
}

.CreditCardPaymentWindow_iconsContainer__Zkjfe {
    display: flex;
    flex-direction: column;
}

.CreditCardPaymentWindow_offScreenIcons__xol9K {
    margin-top: 20px;
}

.CreditCardPaymentWindow_paymentEyeIcon__rIsFB {
    position: absolute;
    top: -45px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 80px;
    z-index: 10;
}

@media (min-width: 768px) {
    .CreditCardPaymentWindow_paymentEyeIcon__rIsFB {
        top: -34px;
    }
}

.CreditCardPaymentWindow_summaryButton__1jIgv {
    border: var(--borderWidth091) solid #f4f4f4 !important;
    color: #FF541C !important;
    -webkit-backdrop-filter: blur(18px) !important;
            backdrop-filter: blur(18px) !important;
    background: linear-gradient(146.59deg, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.5) 90%) !important;
    border-radius: 27.39px !important;
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    height: 38px !important;
    text-transform: none !important;
    font-family: 'Poppins' !important;
    font-weight: 500 !important;
    font-size: 11px !important;
    line-height: 14px !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    position: relative !important;
    cursor: pointer;
    width: 105px;
}

.CreditCardPaymentWindow_summaryButton__1jIgv img {
    position: absolute !important;
    left: 8px !important;
}

.CreditCardPaymentWindow_summaryButton__1jIgv span {
    flex: 1 1 !important;
    text-align: center !important;
    margin-left: 24px !important;
}

.CreditCardPaymentWindow_summaryButton__1jIgv:hover {
    background: rgba(255, 84, 28, 0.1) !important;
}

.CreditCardPaymentWindow_totalSection__2l9LI {
    text-align: center;
    flex: 1 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 160px;
    overflow: hidden;
    min-width: 0;
}

.CreditCardPaymentWindow_grandTotalLabel__nlP34 {
    font-family: 'Poppins' !important;
    font-weight: 500 !important;
    font-size: clamp(12px, 3vw, 16px) !important;
    line-height: 14px !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #1F1F1F !important;
    margin: 0 !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    -webkit-hyphens: auto !important;
            hyphens: auto !important;
}

.CreditCardPaymentWindow_grandTotalAmount__Wjih4 {
    font-family: 'Poppins' !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 3vw, 23px) !important;
    line-height: 1.1 !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #FF541C !important;
    margin: 5px 0 0 0 !important;
    white-space: nowrap !important;
}

.CreditCardPaymentWindow_fieldLabel__VqcrF {
    font-family: 'Poppins' !important;
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    margin-bottom: 10px;
}

.CreditCardPaymentWindow_inputContainer__O4Clg {
    margin-bottom: 10px;
}

.CreditCardPaymentWindow_inputRowContainer__o4LEA {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.CreditCardPaymentWindow_inputHalfContainer__lcanc {
    margin-bottom: 5px;
}

.CreditCardPaymentWindow_glassInput__nb9wR {
    border: var(--borderWidth100) solid rgba(255, 255, 255, 0.3) !important;
    background: #FFFFFF99 !important;
    -webkit-backdrop-filter: blur(10px) !important;
            backdrop-filter: blur(10px) !important;
    border-radius: 4px !important;
    padding: 8px;
    font-size: 14px !important;
    color: #1F1F1F !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.CreditCardPaymentWindow_glassInput__nb9wR::placeholder {
    color: rgba(31, 31, 31, 0.6) !important;
}

.CreditCardPaymentWindow_customDropdown__vK7me {
    position: relative;
}

.CreditCardPaymentWindow_customDropdown__vK7me .CreditCardPaymentWindow_glassInput__nb9wR {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 34.4px !important;
    padding-bottom: 0px;
    padding-top: 0px;
}

.CreditCardPaymentWindow_dropdownArrow__IBBpN {
    font-size: 12px;
    color: #666;
    pointer-events: none;
    margin-left: 8px;
}

.CreditCardPaymentWindow_dropdownOptions__ZLRWL {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 9999;
    border: var(--borderWidth100) solid rgba(255, 255, 255, 1);
    background: rgba(255, 255, 255, 0.9);
    -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    max-height: 140px;
    overflow-y: auto;
    margin-top: 2px;
}

.CreditCardPaymentWindow_dropdownOption__SHLLe {
    padding: 8px;
    cursor: pointer;
    color: #1F1F1F;
    border-bottom: var(--borderWidth100) solid rgba(255, 255, 255, 0.3);
    font-size: 14px;
}

.CreditCardPaymentWindow_dropdownOption__SHLLe:hover {
    background: rgba(255, 255, 255, 0.8);
}

.CreditCardPaymentWindow_dropdownOption__SHLLe:last-child {
    border-bottom: var(--borderWidth000);
}

.CreditCardPaymentWindow_cardNumberInput__y0bt- {
    width: 24% !important;
    text-align: center !important;
}

.CreditCardPaymentWindow_cardBrandIcon__THHuu {
    width: 40px !important;
    height: 25px !important;
    object-fit: contain !important;
    margin-left: 8px !important;
}
.CreditCardPaymentWindow_cardNumberInputNoBrand__bIaFZ {
  width: 24% !important;
  text-align: center !important;
}

.CreditCardPaymentWindow_compactInput__bDkhx {
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.3) !important;
  background: #FFFFFF99 !important;
  -webkit-backdrop-filter: blur(10px) !important;
          backdrop-filter: blur(10px) !important;
  border-radius: 4px !important;
  padding: 3px !important;
  font-size: 14px !important;
  color: #1F1F1F !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  text-align: center !important;
}

.CreditCardPaymentWindow_cvcInput__y068e {
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.3) !important;
  background: rgba(255, 255, 255, 0.6) !important;
  -webkit-backdrop-filter: blur(10px) !important;
          backdrop-filter: blur(10px) !important;
  border-radius: 4px !important;
  padding: 8px !important;
  font-size: 14px !important;
  color: #1F1F1F !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  text-align: center !important;
}

.CreditCardPaymentWindow_compactInput__bDkhx::placeholder {
  color: rgba(31, 31, 31, 0.6) !important;
}

.CreditCardPaymentWindow_creditCardInput__mcTE7 {
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.3) !important;
  background: #FFFFFF99 !important;
  -webkit-backdrop-filter: blur(10px) !important;
          backdrop-filter: blur(10px) !important;
  border-radius: 4px !important;
  padding: 8px !important;
  font-size: 14px !important;
  color: #1F1F1F !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  text-align: center !important;
  letter-spacing: 2.5px !important;
}

.CreditCardPaymentWindow_creditCardInput__mcTE7::placeholder {
  color: #000000 !important;
  letter-spacing: 2px !important;
}

.CreditCardPaymentWindow_compactFieldLabel__O\+3ku {
  font-family: 'Poppins' !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  line-height: 100% !important;
  letter-spacing: 0% !important;
  vertical-align: middle !important;
  margin-bottom: 0 !important;
}

.CreditCardPaymentWindow_addressFieldLabel__NwXah {
  font-family: 'Poppins' !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  line-height: 100% !important;
  letter-spacing: 0% !important;
  vertical-align: middle !important;
  margin-bottom: 3px;
}

.CreditCardPaymentWindow_addressInputContainer__OEeH6 {
  margin-bottom: 10px;
}

.CreditCardPaymentWindow_addressInputRowContainer__RtXwl {
  display: flex;
  gap: 15px;
  margin-bottom: 10px;
}

.CreditCardPaymentWindow_addressInputHalfContainer__heHOx {
  flex: 1 1;
  margin-bottom: 3px;
}

.SongOfTheDay_container__fWNbw {
  background: none;
  width: 100%;
  height: 5px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.SongOfTheDay_buttonContainer__bnhGO {
  display: flex;
  gap: 10px;
  z-index: 10;
}

.SongOfTheDay_iconWrapper__BUJLO {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: linear-gradient(146.59deg, rgba(255, 255, 255, 0.2) 16.66%, rgba(255, 255, 255, 0.5) 80.13%);
  border: 0.96px solid #FFFFFF;
  -webkit-backdrop-filter: blur(19px);
          backdrop-filter: blur(19px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.SongOfTheDay_icon__Z6E1i {
  width: 35px;
  height: 35px;
}

.SongOfTheDay_playWrapper__ha2HY {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #FFFFFF;
  background: #FFFFFF99;
  -webkit-backdrop-filter: blur(18px);
          backdrop-filter: blur(18px);
  border-radius: 28px;
  height: 43px;
  cursor: pointer;
  min-width: 105px;
}

.SongOfTheDay_playIcon__rC8ZO {
  margin-left: 6px;
}

.SongOfTheDay_playText__3I4ul {
  font-family: Poppins;
  font-weight: 500;
  font-style: normal;
  font-size: 14.86px;
  line-height: 100%;
  letter-spacing: 0px;
  color: #FF541C;
  margin-right: 10px;
  width: 100%;
  text-align: center;
}

.SongOfTheDay_controlButtonGradient__Ga51F {
  position: absolute;
  bottom: -160px;
  left: 51%;
  transform: translateX(-50%);
  z-index: -1;
}

.SongOfTheDay_messageGradient__9uHRw {
  position: absolute;
  bottom: -170px;
  z-index: -1;
  pointer-events: none;
}

.SongOfTheDay_bottomGradient__RQWH\+ {
  position: absolute;
  bottom: -415px;
  left: 37%;
  transform: translateX(-50%);
  z-index: -1;
}

.AngelShop_angelShopContainer__Z-6bF {
  display: flex;
  flex-direction: column;
}

.AngelShop_shoppingCartIcon__rFc8H {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 10;
  cursor: pointer;
}

.AngelShop_shoppingCartIcon__rFc8H img {
  width: 24px;
  height: 24px;
  opacity: 0.8;
  transition: opacity 0.2s ease;
}

.AngelShop_shoppingCartIcon__rFc8H:hover img {
  opacity: 1;
}

.AngelShop_cartBadge__UXDfC {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #FF541C;
  color: white;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  font-family: Poppins;
}

.AngelShop_cartSidebar__mw-M\+ {
  position: fixed;
  top: 0;
  right: 0;
  height: 500px;
  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  border-radius: 15px;
  flex-wrap: wrap;
}

.AngelShop_dragHandle__52GkW {
  position: absolute;
  left: -60px;
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  cursor: pointer;
  z-index: 1001;
}

.AngelShop_dragIcon__fR6ap {
  margin-right: 0px;
}

.AngelShop_hiddenDragHandle__30rKF {
  right: -40px;
}

.AngelShop_floatingCartBadge__P3JIj {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #FF541C;
  color: white;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  font-family: Poppins;
  border: 2px solid white;
}

.AngelShop_cartSidebarRainbow__KJ1GM {
  background: radial-gradient(circle at 90% 40%, rgba(48, 83, 252, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 5% 50%, rgba(255, 84, 28, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 95% 40%, rgba(28, 221, 255, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 2% 60%, rgba(157, 28, 255, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 35% 55%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
    radial-gradient(circle at 65% 45%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
    radial-gradient(circle at 75% 40%, rgba(48, 83, 252, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 10% 60%, rgba(255, 84, 28, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 85% 60%, rgba(28, 221, 255, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 15% 65%, rgba(157, 28, 255, 0.2) 2%, transparent 10%),
    radial-gradient(circle at 45% 50%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
    radial-gradient(circle at 55% 40%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
    white;
  background-size: 300% 100%;
}

.AngelShop_cartSidebarRainbow__KJ1GM {
  animation: AngelShop_moveGradient__qx5fo 15s ease-in-out infinite alternate;
}

.AngelShop_cartSidebarOpening__7-PmK.AngelShop_cartSidebarRainbow__KJ1GM {
  animation: AngelShop_slideInFromRight__7BHKm 0.6s ease-out, AngelShop_moveGradient__qx5fo 15s ease-in-out infinite alternate;
}

.AngelShop_cartSidebarClosing__OQ-tN.AngelShop_cartSidebarRainbow__KJ1GM {
  animation: AngelShop_slideOutToRight__tWKlO 0.6s ease-out, AngelShop_moveGradient__qx5fo 15s ease-in-out infinite alternate;
}

@keyframes AngelShop_moveGradient__qx5fo {
  from {
    background-position: 0% 50%;
  }

  to {
    background-position: 100% 50%;
  }
}

.AngelShop_cartOpen__TadVa {
  transform: translateX(0);
  transition: transform 0.6s ease;
}

.AngelShop_cartClosed__uRD6I {
  transform: translateX(100%);
  transition: transform 0.6s ease;
}

.AngelShop_visible__Utv5V{
  visibility: visible;
}

.AngelShop_hidden__x6KO3 {
  visibility: hidden;
}

.AngelShop_cartHeader__vIkqH {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 5px 5px 15px;
  border-bottom: 1px solid #eee;
}

.AngelShop_cartHeader__vIkqH h2 {
  margin: 0;
  color: #FF541C;
  font-family: Poppins;
  font-weight: 600;
  font-size: 20px;
}

.AngelShop_closeCartButton__E7LAl {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.AngelShop_cartItems__Tv7G\+ {
  flex: 1 1;
  overflow-y: auto;
  padding: 0px 15px;
  display: flex;
  overflow-y: scroll;
  flex-direction: column;
}

.AngelShop_emptyCartMessage__U-dv1 {
  flex: 1 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Poppins;
  font-size: 16px;
  color: #666;
  text-align: center;
  padding: 40px 20px;
}

.AngelShop_cartContent__xmbz5 {
  flex: 1 1;
  display: flex;
  gap: 20px;
  padding: 15px;
  max-height: 450px;
}

.AngelShop_cartSize__uBaBX {
  width: 750px;
}

.AngelShop_cartLeft__ZjtNT {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  width: 260px;
}

.AngelShop_totalRow__KgjWc {
  font-weight: 600;
  font-size: 16px;
  color: #333;
  margin-bottom: 20px;
}

.AngelShop_cartItemRight__2dnQk {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding-right: 10px;
}

.AngelShop_cartItemLeft__\+uPp8 {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 10px;
  padding-left: 10px;
}

.AngelShop_cartRight__G0UNb {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  max-width: 280px;
}

.AngelShop_orderSummaryContainer__GqD6a {
  height: -webkit-fit-content;
  height: fit-content;
  margin-top: auto;
}

.AngelShop_summaryRow__zkj5e {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  font-family: Poppins;
  font-size: 14px;
  color: black;
}

.AngelShop_orderSummary__jkl1d {
  background: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(15px);
          backdrop-filter: blur(15px);
  border-radius: 8px;
  padding: 0px 10px;
  display: flex;
  flex-direction: column;
  flex: 1 1;
}

.AngelShop_orderSummaryTitle__pAaqf {
  font-family: Poppins;
  font-weight: 600;
  font-size: 18px;
  color: #333;
  margin: 10px 0 20px 0;
  text-align: center;
  color: var(--orange994);
}

.AngelShop_checkoutLater__LOfgR {
  text-align: right;
}

.AngelShop_summaryDivider__q3\+P9 {
  height: 1px;
  background: #ddd;
  margin: 15px 0;
}

.AngelShop_cartItem__q7nIr {
  padding: 5px 0;
  border-bottom: 1px solid #f0f0f0;
  background: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(15px);
          backdrop-filter: blur(15px);
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin: 2px 0px;
  flex-wrap: wrap;
}

.AngelShop_cartItemThumbnail__vQBFb {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.AngelShop_cartThumbnailImage__pMRLe {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
}

.AngelShop_cartItemInfo__hdi6P {
  flex: 1 1;
}

.AngelShop_trashButton__7oOaH {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.AngelShop_trashIcon__Yr\+ht {
  width: 16px;
  height: 16px;
  opacity: 0.6;
  transition: opacity 0.2s ease;
}

.AngelShop_trashButton__7oOaH:hover .AngelShop_trashIcon__Yr\+ht {
  opacity: 1;
}

.AngelShop_cartItemName__K4JbS {
  font-family: Poppins;
  font-weight: 600;
  font-size: 14px;
  color: #333;
  margin-bottom: 4px;
  color: var(--orange994);
  width: 90px;
}

.AngelShop_cartItemPrice__5l9Fl {
  font-family: Poppins;
  font-weight: 500;
  font-size: 13px;
  color: #FF541C;
  margin: 4px 0px;
  min-width: 80px;
  text-align: center;
}

.AngelShop_cartItemOption__55JKJ {
  font-family: Poppins;
  font-size: 11px;
  color: black;
  margin-bottom: 2px;
  width: 90px;
}

.AngelShop_cartQuantityControls__jg91v {
  display: flex;
  align-items: center;
  gap: 8px;
  border: var(--borderWidth100) solid black;
  border-radius: 15px;
}

.AngelShop_cartQuantityButton__2ZRfh {
  border: none;
  border-radius: 4px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  color: #333;
}

.AngelShop_cartQuantityDisplay__5iBy9 {
  font-family: Poppins;
  font-weight: 500;
  font-size: 12px;
  min-width: 20px;
  text-align: center;
}

.AngelShop_cartQuantityFixed__VmaEF {
  font-family: Poppins;
  font-size: 12px;
  color: #666;
  text-align: center;
  width: 85px;
}

.AngelShop_cartFooter__L72DG {
  padding: 10px 20px;
  border-top: 1px solid #eee;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.AngelShop_cartTotal__0Le5X {
  font-family: Poppins;
  font-weight: 600;
  font-size: 16px;
  color: #333;
  margin-bottom: 10px;
  text-align: center;
}

.AngelShop_buttonGroup__oFaw\+ {
  display: flex;
  gap: 10px;
  margin-top: auto;
  margin-bottom: 10px;
}

.AngelShop_continueShoppingButton__DYdfU {
  flex: 1 1;
  background: transparent;
  color: #FF541C;
  border: 1px solid #FF541C;
  border-radius: 8px;
  padding: 5px 10px;
  font-family: Poppins;
  font-size: 14px;
  cursor: pointer;
}

.AngelShop_checkoutButton__M-icj {
  flex: 1 1;
  background: #FF541C;
  color: white;
  border: none;
  border-radius: 8px;
  padding: 12px 16px;
  font-family: Poppins;
  font-size: 14px;
  cursor: pointer;
}

.AngelShop_angelShopTitle__nEuUE {
  text-align: center;
  margin: 0;
  padding: 12px 12px 6px 12px;
  color: #FF541C;
  border-radius: 15px 15px 0 0;
  font-family: Poppins;
  font-weight: 600;
  font-size: 19.35px;
  line-height: 100%;
  letter-spacing: 0%;
}

.AngelShop_titleContainer__-ceEG {
  display: flex;
  flex-direction: row;
  gap: 10px;
}

.AngelShop_cardGrid__Y4hNI {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  height: 460px;
  overflow-y: auto;
  box-sizing: border-box;
  width: 100%;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

@media (max-width: 500px) {
  .AngelShop_cardGrid__Y4hNI {
    height: 450px;
  }
}

.AngelShop_cardGrid__Y4hNI::-webkit-scrollbar {
  display: none;
}

.AngelShop_cardContainer__3\+R9d {
  height: 225px;
  position: relative;
}

.AngelShop_cardContainer__3\+R9d.AngelShop_flipped__aoUEJ .AngelShop_cardFront__tpqrG {
  transform: rotateY(-180deg);
}

.AngelShop_cardContainer__3\+R9d.AngelShop_flipped__aoUEJ .AngelShop_cardBack__WcsV7 {
  transform: rotateY(0deg);
}

.AngelShop_cardFront__tpqrG,
.AngelShop_cardBack__WcsV7 {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transition: transform 0.6s;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: 6px 3px 0px 3px;
  font-weight: 400;
}

.AngelShop_cardContent__lC80P {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  justify-content: flex-end;
  border-radius: 12px;
}

.AngelShop_cardContentBack__iZ5zp {
  margin: 2px 8px;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.AngelShop_cardFront__tpqrG .AngelShop_cardContent__lC80P {
  justify-content: space-between;
  align-items: stretch;
}

.AngelShop_imageContainer__Sxxxm {
  flex: 1 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 12px 12px 0px 0px;
  background-color: white;
}

.AngelShop_cardImage__MRJEB {
  width: 100%;
  object-fit: cover;
  object-position: top;
}

.AngelShop_quantityControls__i2c3Z {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: 5px;
}

.AngelShop_quantityButton__-W62H {
  background: rgba(132, 132, 132, 1);
  color: white;
  border: var(--borderWidth100) solid transparent;
  border-radius: 4px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
}

.AngelShop_quantityDisplay__\+L5Oc {
  font-family: Poppins;
  font-weight: 500;
  font-size: 12px;
  min-width: 20px;
  text-align: center;
}

.AngelShop_quantityInput__xYTLA {
  background: transparent;
  border: none;
  font-family: Poppins;
  font-weight: 500;
  font-size: 12px;
  line-height: 13.4px;
  letter-spacing: 0%;
  color: inherit;
  text-align: right;
  width: 40px;
}

.AngelShop_quantityInput__xYTLA:focus {
  outline: none;
}

.AngelShop_bottomSection__-3dt8 {
  margin-top: auto;
}

.AngelShop_cardBack__WcsV7 {
  transform: rotateY(180deg);
}

.AngelShop_colorTitle__bZ\+RB {
  font-family: Poppins;
  font-weight: 500;
  font-style: normal;
  font-size: 12px;
  line-height: 13.4px;
  letter-spacing: 0%;
  vertical-align: middle;
  margin: 4px 0;
}

.AngelShop_colorButtons__kHx4d {
  display: flex;
  margin: 2px 0;
  padding: 1px;
  gap: 8px;
}

.AngelShop_colorButton__5uvhX {
  width: 21px;
  height: 21px;
  border-radius: 50%;
  border: 1px solid #ccc;
  cursor: pointer;
  box-sizing: content-box;
}

.AngelShop_colorButton__5uvhX.AngelShop_selectedColor__8jHhi {
  border: none;
  box-shadow: 0 0 0 2px white, 0 0 0 4px #FF541C;
}

.AngelShop_quantityText__QPBcC,
.AngelShop_amountText__3t5-g {
  font-family: Poppins;
  font-weight: 500;
  font-style: normal;
  font-size: 12px;
  line-height: 13.4px;
  letter-spacing: 0%;
  vertical-align: middle;
  margin: 7px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.AngelShop_dividerLine__KTyhN {
  width: 100%;
  height: 1px;
  background-color: #ddd;
  margin: 4px 0;
}

.AngelShop_closeButton__MTHSX {
  position: absolute;
  top: 4px;
  right: -2px;
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: #666;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

@media (max-width: 500px) {
  .AngelShop_closeButton__MTHSX {
    top: 1px;
  }
}

.AngelShop_itemInfoContainer__IhHb4 {
  background: white;
  border-radius: 0px 0px 12px 12px;
}

.AngelShop_itemInfoBoxWrapper__KmAbu {
  background: rgba(0, 0, 0, 0.08);
  margin: 0px 5px 5px 5px;
  padding: 1px 0px;
  border-radius: 10px;
}

.AngelShop_confirmButton__NGNjN {
  background: rgba(255, 84, 28, 1);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 6px 12px;
  font-family: Poppins;
  font-weight: 600;
  font-size: 12px;
  line-height: 13.4px;
  letter-spacing: 0%;
  vertical-align: middle;
  cursor: pointer;
  width: 100%;
  min-height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 10px;
}

.AngelShop_card__3J4CW {
  aspect-ratio: 1;
  background: #f5f5f5;
  border: var(--borderWidth100) solid #f5f5f5;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: 12px;
  font-weight: 500;
}

.AngelShop_cardTitle__fTJCn {
  font-family: Poppins;
  font-weight: 600;
  font-size: 12px;
  line-height: 13.4px;
  letter-spacing: 0%;
  vertical-align: middle;
  color: #FF541C;
  border-radius: 4px;
  margin: 8px 10px;
  width: calc(100% - 20px);
}

.AngelShop_cardBack__WcsV7 .AngelShop_cardTitle__fTJCn {
  font-family: Poppins;
  max-width: 92%;
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0%;
  vertical-align: middle;
  color: #FF541C;
  text-align: left;
  padding: 0;
  background: none;
  margin: 5px 0px;
}

.AngelShop_cardBackWrapper__5Vxu1 {
  background: rgba(0, 0, 0, 0.08);
  width: 100%;
  height: 100%;
  border-radius: 12px;
}

.AngelShop_cardPrice__MxygK {
  display: flex;
  justify-content: space-between;
  width: 100%;
  font-size: 12px;
  margin: 4px 10px;
  width: calc(100% - 20px);
  font-weight: 400;
}

.AngelShop_shopButton__d7fwQ {
  background: transparent;
  border: none;
  border-radius: 8px;
  padding: 6px 12px;
  font-family: Poppins;
  font-weight: 600;
  font-size: 12px;
  line-height: 13.4px;
  letter-spacing: 0%;
  vertical-align: middle;
  cursor: pointer;
  width: calc(100% - 20px);
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: var(--borderWidth100) solid rgba(255, 84, 28, 0.5);
  color: rgba(255, 84, 28, 1);
  margin: 5px 10px;
  background-color: white;
}

.AngelShop_shopIcon__1\+iqi {
  width: 16px;
  height: 16px;
}

.AngelShop_priceWithIcon__QKDBJ {
  display: flex;
  align-items: center;
  gap: 4px;
}

.AngelShop_pointsIcon__Lvo3\+ {
  width: 16px;
  height: 16px;
}

.AngelShop_customDropdown__CunS9 {
  position: relative;
}

.AngelShop_customSelect__pi9nw {
  border: none !important;
  background: none !important;
  border-radius: 4px !important;
  padding: 4px 32px 4px 8px;
  font-size: 14px !important;
  color: #1F1F1F !important;
  position: relative;
  z-index: 10;
  width: 100%;
  outline: none !important;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.AngelShop_customSelect__pi9nw::after {
  content: '▼';
  position: absolute;
  right: 8px;
  font-size: 12px;
  color: #666;
  pointer-events: none;
}

.AngelShop_dropdownOptions__J2XMR {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 1000;
  background: rgb(229 229 229);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  max-height: 94px;
  overflow-y: auto;
  margin-top: 2px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.AngelShop_dropdownOptions__J2XMR::-webkit-scrollbar {
  display: none;
}

.AngelShop_dropdownOption__HqaoB {
  padding: 4px 8px 4px 8px;
  cursor: pointer;
  color: #1F1F1F;
  font-size: 14px;
  border-bottom: var(--borderWidth100) solid rgba(255, 255, 255, 0.8);
}

.AngelShop_dropdownOption__HqaoB:hover {
  background: rgba(255, 255, 255, 0.8);
}

.AngelShop_dropdownOption__HqaoB:last-child {
  border-bottom: none;
}

.AngelShop_glassInput__wBzbm {
  border: none !important;
  background: #FFFFFF99 !important;
  border-radius: 4px !important;
  padding: 8px;
  font-size: 14px !important;
  color: #1F1F1F !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  position: relative;
  z-index: 10;
  width: 100%;
  outline: none !important;
}

.AngelShop_glassInput__wBzbm::placeholder {
  color: rgba(31, 31, 31, 0.6) !important;
}

@media (max-width: 500px) {
  .AngelShop_cardGrid__Y4hNI {
    grid-template-columns: repeat(2, 1fr);
    gap: 0px;
    padding: 0px;
  }

  .AngelShop_card__3J4CW {
    padding: 8px;
  }

  .AngelShop_cardTitle__fTJCn {
    font-size: 12px;
  }

  .AngelShop_cardPrice__MxygK {
    font-size: 10px;
  }

  .AngelShop_shopButton__d7fwQ {
    padding: 4px 8px;
    font-size: 10px;
  }
}

.AngelShop_glassInput__wBzbm option {
  background: #FFFFFF !important;
  color: #1F1F1F !important;
  border: none !important;
}

.AngelShop_glassInput__wBzbm:focus {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

.AngelShop_genderButton__Uqp0n {
  background: transparent;
  border: var(--borderWidth100) solid transparent;
  border-radius: 4px;
  font-family: Poppins;
  font-weight: 500;
  font-size: 12px;
  color: #FF541C;
  cursor: pointer;
  flex: 1 1;
  height: 24px;
  transition: border 0.3s ease;
}

.AngelShop_genderButton__Uqp0n.AngelShop_selectedGender__cGYZB {
  border: 1px solid #FF541C;
}

.AngelShop_sizeButton__5U60l {
  background: transparent;
  border: var(--borderWidth100) solid transparent;
  border-radius: 4px;
  padding: 4px 8px;
  font-family: Poppins;
  font-weight: 500;
  font-size: 12px;
  color: rgb(82, 82, 82);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1 1;
  transition: opacity 0.3s ease, transform 0.3s ease, border 0.3s ease;
  opacity: 1;
  transform: translateX(0);
}

.AngelShop_sizeButton__5U60l.AngelShop_slideOut__s228Z {
  opacity: 0;
  transform: translateX(-20px);
}

.AngelShop_sizeButton__5U60l.AngelShop_slideIn__eAWUx {
  opacity: 0;
  transform: translateX(20px);
  animation: AngelShop_slideIn__eAWUx 0.3s ease forwards;
}

@keyframes AngelShop_slideIn__eAWUx {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.AngelShop_sizeButton__5U60l.AngelShop_selectedSize__zQ99X {
  border: 1px solid rgb(82, 82, 82);
}

.AngelShop_sizeContainer__qAWOG {
  display: flex;
  align-items: center;
  gap: 2px;
}

.AngelShop_sizeHeader__5LnPK {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 10px;
  align-items: center;
}

.AngelShop_sizeButtons__vAaQU {
  display: flex;
  gap: 4px;
  flex-grow: 1;
  position: relative;
  overflow: hidden;
  height: 24px;
}

.AngelShop_expandButton__BKW0G {
  background: transparent;
  color: rgb(82, 82, 82);
  border: var(--borderWidth100) solid rgb(82, 82, 82);
  border-radius: 4px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
}

.AngelShop_hidden__x6KO3 {
  visibility: hidden;
}

.AngelShop_visible__Utv5V {
  visibility: visible;
}

.AngelShop_dragIconVisible__y0vXB {
  visibility: visible !important;
}

@media (max-width: 1200px) {
  .AngelShop_cartContent__xmbz5 {
    flex-direction: column;
    gap: 15px;
    max-height: 435px;
  }

  .AngelShop_cartLeft__ZjtNT {
    width: 277px;
    display: flex;
    flex-direction: column;
    flex: 1 1;
    overflow-y: scroll;
    scrollbar-width: none;
  }

  .AngelShop_cartItems__Tv7G\+ {
    padding: 0px;
    flex: 1 1;
    min-height: 0;
    scrollbar-width: none;
  }

  .AngelShop_cartItems__Tv7G\+::-webkit-scrollbar {
    display: none;
  }

  .AngelShop_cartRight__G0UNb {
    max-width: 100%;
  }

  .AngelShop_orderSummaryTitle__pAaqf {
    display: none;
  }

  .AngelShop_cartSize__uBaBX {
    width: 315px;
    height: 485px;
  }

  .AngelShop_totalRow__KgjWc {
    margin-bottom: 5px;
  }

  .AngelShop_cartItemRight__2dnQk {
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    padding: 0px 14px 0px 18px;
  }

  .AngelShop_cartItemLeft__\+uPp8 {
    gap: 20px;
  }

  .AngelShop_cartRight__G0UNb {
    flex: 0 1;
  }

  .AngelShop_orderSummaryContainer__GqD6a {
    margin-top: 10px;
  }

  .AngelShop_summaryDivider__q3\+P9 {
    margin: 8px 0px;
  }

  .AngelShop_summaryRow__zkj5e {
    margin-bottom: 6px;
  }

  .AngelShop_dragHandle__52GkW {
    top: 80%;
  }
}

:root {
  --iti-hover-color: rgba(0, 0, 0, 0.05);
  --iti-border-color: #ccc;
  --iti-dialcode-color: #999;
  --iti-dropdown-bg: white;
  --iti-spacer-horizontal: 8px;
  --iti-flag-height: 12px;
  --iti-flag-width: 16px;
  --iti-border-width: 1px;
  --iti-arrow-height: 4px;
  --iti-arrow-width: 6px;
  --iti-triangle-border: calc(var(--iti-arrow-width) / 2);
  --iti-arrow-padding: 6px;
  --iti-arrow-color: #555;
  --iti-path-flags-1x: url(https://www.swmc.com/angelai/static/media/flags.bd95ef49b665a571ca04.webp);
  --iti-path-flags-2x: url(https://www.swmc.com/angelai/static/media/flags@2x.bea0200ba7ea874b359f.webp);
  --iti-path-globe-1x: url(https://www.swmc.com/angelai/static/media/globe.7fb216c936a98b90918e.webp);
  --iti-path-globe-2x: url(https://www.swmc.com/angelai/static/media/globe@2x.5dc7e51d6b5d42fc2be4.webp);
  --iti-flag-sprite-width: 3904px;
  --iti-flag-sprite-height: 12px;
  --iti-mobile-popup-margin: 30px;
}

.iti {
  position: relative;
  display: inline-block;
}
.iti * {
  box-sizing: border-box;
}
.iti__hide {
  display: none;
}
.iti__v-hide {
  visibility: hidden;
}
.iti__a11y-text {
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute;
}
.iti input.iti__tel-input,
.iti input.iti__tel-input[type=text],
.iti input.iti__tel-input[type=tel] {
  position: relative;
  z-index: 0;
  margin: 0 !important;
}
.iti__country-container {
  position: absolute;
  top: 0;
  bottom: 0;
  padding: 1px;
  padding: var(--iti-border-width);
}
.iti__selected-country {
  z-index: 1;
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  border-radius: 0;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: none;
}
.iti__selected-country-primary {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 6px 0 8px;
  padding: 0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal);
}
.iti__arrow {
  margin-left: 6px;
  margin-left: var(--iti-arrow-padding);
  width: 0;
  height: 0;
  border-left: calc(6px / 2) solid transparent;
  border-left: var(--iti-triangle-border) solid transparent;
  border-right: calc(6px / 2) solid transparent;
  border-right: var(--iti-triangle-border) solid transparent;
  border-top: 4px solid #555;
  border-top: var(--iti-arrow-height) solid var(--iti-arrow-color);
}
[dir=rtl] .iti__arrow {
  margin-right: 6px;
  margin-right: var(--iti-arrow-padding);
  margin-left: 0;
}
.iti__arrow--up {
  border-top: none;
  border-bottom: 4px solid #555;
  border-bottom: var(--iti-arrow-height) solid var(--iti-arrow-color);
}
.iti__dropdown-content {
  border-radius: 3px;
  background-color: white;
  background-color: var(--iti-dropdown-bg);
}
.iti--inline-dropdown .iti__dropdown-content {
  position: absolute;
  z-index: 2;
  margin-top: 3px;
  margin-left: calc(1px * -1);
  margin-left: calc(var(--iti-border-width) * -1);
  border: 1px solid #ccc;
  border: var(--iti-border-width) solid var(--iti-border-color);
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
}
.iti__search-input {
  width: 100%;
  border-width: 0;
  border-radius: 3px;
}
.iti__search-input + .iti__country-list {
  border-top: 1px solid #ccc;
  border-top: 1px solid var(--iti-border-color);
}
.iti__country-list {
  list-style: none;
  padding: 0;
  margin: 0;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
.iti--inline-dropdown .iti__country-list {
  max-height: 185px;
}
.iti--flexible-dropdown-width .iti__country-list {
  white-space: nowrap;
}
@media (max-width: 500px) {
  .iti--flexible-dropdown-width .iti__country-list {
    white-space: normal;
  }
}
.iti__country {
  display: flex;
  align-items: center;
  padding: 8px 8px;
  padding: 8px var(--iti-spacer-horizontal);
  outline: none;
}
.iti__dial-code {
  color: #999;
  color: var(--iti-dialcode-color);
}
.iti__country.iti__highlight {
  background-color: rgba(0, 0, 0, 0.05);
  background-color: var(--iti-hover-color);
}
.iti__country-list .iti__flag, .iti__country-name {
  margin-right: 8px;
  margin-right: var(--iti-spacer-horizontal);
}
[dir=rtl] .iti__country-list .iti__flag, [dir=rtl] .iti__country-name {
  margin-right: 0;
  margin-left: 8px;
  margin-left: var(--iti-spacer-horizontal);
}
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover, .iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover button {
  cursor: pointer;
}
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country-primary:hover,
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country:has(+ .iti__dropdown-content:hover) .iti__selected-country-primary {
  background-color: rgba(0, 0, 0, 0.05);
  background-color: var(--iti-hover-color);
}
.iti .iti__selected-dial-code {
  margin-left: 4px;
}
[dir=rtl] .iti .iti__selected-dial-code {
  margin-left: 0;
  margin-right: 4px;
}
.iti--container {
  position: fixed;
  top: -1000px;
  left: -1000px;
  z-index: 1060;
  padding: 1px;
  padding: var(--iti-border-width);
}
.iti--container:hover {
  cursor: pointer;
}

.iti--fullscreen-popup.iti--container {
  background-color: rgba(0, 0, 0, 0.5);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
  padding: 30px;
  padding: var(--iti-mobile-popup-margin);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.iti--fullscreen-popup .iti__dropdown-content {
  display: flex;
  flex-direction: column;
  max-height: 100%;
  position: relative;
}
.iti--fullscreen-popup .iti__country {
  padding: 10px 10px;
  line-height: 1.5em;
}

.iti__flag {
  --iti-flag-offset: 100px;
  height: 12px;
  height: var(--iti-flag-height);
  width: 16px;
  width: var(--iti-flag-width);
  border-radius: 1px;
  box-shadow: 0px 0px 1px 0px #888;
  background-image: url(https://www.swmc.com/angelai/static/media/flags.bd95ef49b665a571ca04.webp);
  background-image: var(--iti-path-flags-1x);
  background-repeat: no-repeat;
  background-position: var(--iti-flag-offset) 0;
  background-size: 3904px 12px;
  background-size: var(--iti-flag-sprite-width) var(--iti-flag-sprite-height);
}

.iti__ac {
  --iti-flag-offset: 0px;
}

.iti__ad {
  --iti-flag-offset: -16px;
}

.iti__ae {
  --iti-flag-offset: -32px;
}

.iti__af {
  --iti-flag-offset: -48px;
}

.iti__ag {
  --iti-flag-offset: -64px;
}

.iti__ai {
  --iti-flag-offset: -80px;
}

.iti__al {
  --iti-flag-offset: -96px;
}

.iti__am {
  --iti-flag-offset: -112px;
}

.iti__ao {
  --iti-flag-offset: -128px;
}

.iti__ar {
  --iti-flag-offset: -144px;
}

.iti__as {
  --iti-flag-offset: -160px;
}

.iti__at {
  --iti-flag-offset: -176px;
}

.iti__au {
  --iti-flag-offset: -192px;
}

.iti__aw {
  --iti-flag-offset: -208px;
}

.iti__ax {
  --iti-flag-offset: -224px;
}

.iti__az {
  --iti-flag-offset: -240px;
}

.iti__ba {
  --iti-flag-offset: -256px;
}

.iti__bb {
  --iti-flag-offset: -272px;
}

.iti__bd {
  --iti-flag-offset: -288px;
}

.iti__be {
  --iti-flag-offset: -304px;
}

.iti__bf {
  --iti-flag-offset: -320px;
}

.iti__bg {
  --iti-flag-offset: -336px;
}

.iti__bh {
  --iti-flag-offset: -352px;
}

.iti__bi {
  --iti-flag-offset: -368px;
}

.iti__bj {
  --iti-flag-offset: -384px;
}

.iti__bl {
  --iti-flag-offset: -400px;
}

.iti__bm {
  --iti-flag-offset: -416px;
}

.iti__bn {
  --iti-flag-offset: -432px;
}

.iti__bo {
  --iti-flag-offset: -448px;
}

.iti__bq {
  --iti-flag-offset: -464px;
}

.iti__br {
  --iti-flag-offset: -480px;
}

.iti__bs {
  --iti-flag-offset: -496px;
}

.iti__bt {
  --iti-flag-offset: -512px;
}

.iti__bw {
  --iti-flag-offset: -528px;
}

.iti__by {
  --iti-flag-offset: -544px;
}

.iti__bz {
  --iti-flag-offset: -560px;
}

.iti__ca {
  --iti-flag-offset: -576px;
}

.iti__cc {
  --iti-flag-offset: -592px;
}

.iti__cd {
  --iti-flag-offset: -608px;
}

.iti__cf {
  --iti-flag-offset: -624px;
}

.iti__cg {
  --iti-flag-offset: -640px;
}

.iti__ch {
  --iti-flag-offset: -656px;
}

.iti__ci {
  --iti-flag-offset: -672px;
}

.iti__ck {
  --iti-flag-offset: -688px;
}

.iti__cl {
  --iti-flag-offset: -704px;
}

.iti__cm {
  --iti-flag-offset: -720px;
}

.iti__cn {
  --iti-flag-offset: -736px;
}

.iti__co {
  --iti-flag-offset: -752px;
}

.iti__cr {
  --iti-flag-offset: -768px;
}

.iti__cu {
  --iti-flag-offset: -784px;
}

.iti__cv {
  --iti-flag-offset: -800px;
}

.iti__cw {
  --iti-flag-offset: -816px;
}

.iti__cx {
  --iti-flag-offset: -832px;
}

.iti__cy {
  --iti-flag-offset: -848px;
}

.iti__cz {
  --iti-flag-offset: -864px;
}

.iti__de {
  --iti-flag-offset: -880px;
}

.iti__dj {
  --iti-flag-offset: -896px;
}

.iti__dk {
  --iti-flag-offset: -912px;
}

.iti__dm {
  --iti-flag-offset: -928px;
}

.iti__do {
  --iti-flag-offset: -944px;
}

.iti__dz {
  --iti-flag-offset: -960px;
}

.iti__ec {
  --iti-flag-offset: -976px;
}

.iti__ee {
  --iti-flag-offset: -992px;
}

.iti__eg {
  --iti-flag-offset: -1008px;
}

.iti__eh {
  --iti-flag-offset: -1024px;
}

.iti__er {
  --iti-flag-offset: -1040px;
}

.iti__es {
  --iti-flag-offset: -1056px;
}

.iti__et {
  --iti-flag-offset: -1072px;
}

.iti__fi {
  --iti-flag-offset: -1088px;
}

.iti__fj {
  --iti-flag-offset: -1104px;
}

.iti__fk {
  --iti-flag-offset: -1120px;
}

.iti__fm {
  --iti-flag-offset: -1136px;
}

.iti__fo {
  --iti-flag-offset: -1152px;
}

.iti__fr {
  --iti-flag-offset: -1168px;
}

.iti__ga {
  --iti-flag-offset: -1184px;
}

.iti__gb {
  --iti-flag-offset: -1200px;
}

.iti__gd {
  --iti-flag-offset: -1216px;
}

.iti__ge {
  --iti-flag-offset: -1232px;
}

.iti__gf {
  --iti-flag-offset: -1248px;
}

.iti__gg {
  --iti-flag-offset: -1264px;
}

.iti__gh {
  --iti-flag-offset: -1280px;
}

.iti__gi {
  --iti-flag-offset: -1296px;
}

.iti__gl {
  --iti-flag-offset: -1312px;
}

.iti__gm {
  --iti-flag-offset: -1328px;
}

.iti__gn {
  --iti-flag-offset: -1344px;
}

.iti__gp {
  --iti-flag-offset: -1360px;
}

.iti__gq {
  --iti-flag-offset: -1376px;
}

.iti__gr {
  --iti-flag-offset: -1392px;
}

.iti__gt {
  --iti-flag-offset: -1408px;
}

.iti__gu {
  --iti-flag-offset: -1424px;
}

.iti__gw {
  --iti-flag-offset: -1440px;
}

.iti__gy {
  --iti-flag-offset: -1456px;
}

.iti__hk {
  --iti-flag-offset: -1472px;
}

.iti__hn {
  --iti-flag-offset: -1488px;
}

.iti__hr {
  --iti-flag-offset: -1504px;
}

.iti__ht {
  --iti-flag-offset: -1520px;
}

.iti__hu {
  --iti-flag-offset: -1536px;
}

.iti__id {
  --iti-flag-offset: -1552px;
}

.iti__ie {
  --iti-flag-offset: -1568px;
}

.iti__il {
  --iti-flag-offset: -1584px;
}

.iti__im {
  --iti-flag-offset: -1600px;
}

.iti__in {
  --iti-flag-offset: -1616px;
}

.iti__io {
  --iti-flag-offset: -1632px;
}

.iti__iq {
  --iti-flag-offset: -1648px;
}

.iti__ir {
  --iti-flag-offset: -1664px;
}

.iti__is {
  --iti-flag-offset: -1680px;
}

.iti__it {
  --iti-flag-offset: -1696px;
}

.iti__je {
  --iti-flag-offset: -1712px;
}

.iti__jm {
  --iti-flag-offset: -1728px;
}

.iti__jo {
  --iti-flag-offset: -1744px;
}

.iti__jp {
  --iti-flag-offset: -1760px;
}

.iti__ke {
  --iti-flag-offset: -1776px;
}

.iti__kg {
  --iti-flag-offset: -1792px;
}

.iti__kh {
  --iti-flag-offset: -1808px;
}

.iti__ki {
  --iti-flag-offset: -1824px;
}

.iti__km {
  --iti-flag-offset: -1840px;
}

.iti__kn {
  --iti-flag-offset: -1856px;
}

.iti__kp {
  --iti-flag-offset: -1872px;
}

.iti__kr {
  --iti-flag-offset: -1888px;
}

.iti__kw {
  --iti-flag-offset: -1904px;
}

.iti__ky {
  --iti-flag-offset: -1920px;
}

.iti__kz {
  --iti-flag-offset: -1936px;
}

.iti__la {
  --iti-flag-offset: -1952px;
}

.iti__lb {
  --iti-flag-offset: -1968px;
}

.iti__lc {
  --iti-flag-offset: -1984px;
}

.iti__li {
  --iti-flag-offset: -2000px;
}

.iti__lk {
  --iti-flag-offset: -2016px;
}

.iti__lr {
  --iti-flag-offset: -2032px;
}

.iti__ls {
  --iti-flag-offset: -2048px;
}

.iti__lt {
  --iti-flag-offset: -2064px;
}

.iti__lu {
  --iti-flag-offset: -2080px;
}

.iti__lv {
  --iti-flag-offset: -2096px;
}

.iti__ly {
  --iti-flag-offset: -2112px;
}

.iti__ma {
  --iti-flag-offset: -2128px;
}

.iti__mc {
  --iti-flag-offset: -2144px;
}

.iti__md {
  --iti-flag-offset: -2160px;
}

.iti__me {
  --iti-flag-offset: -2176px;
}

.iti__mf {
  --iti-flag-offset: -2192px;
}

.iti__mg {
  --iti-flag-offset: -2208px;
}

.iti__mh {
  --iti-flag-offset: -2224px;
}

.iti__mk {
  --iti-flag-offset: -2240px;
}

.iti__ml {
  --iti-flag-offset: -2256px;
}

.iti__mm {
  --iti-flag-offset: -2272px;
}

.iti__mn {
  --iti-flag-offset: -2288px;
}

.iti__mo {
  --iti-flag-offset: -2304px;
}

.iti__mp {
  --iti-flag-offset: -2320px;
}

.iti__mq {
  --iti-flag-offset: -2336px;
}

.iti__mr {
  --iti-flag-offset: -2352px;
}

.iti__ms {
  --iti-flag-offset: -2368px;
}

.iti__mt {
  --iti-flag-offset: -2384px;
}

.iti__mu {
  --iti-flag-offset: -2400px;
}

.iti__mv {
  --iti-flag-offset: -2416px;
}

.iti__mw {
  --iti-flag-offset: -2432px;
}

.iti__mx {
  --iti-flag-offset: -2448px;
}

.iti__my {
  --iti-flag-offset: -2464px;
}

.iti__mz {
  --iti-flag-offset: -2480px;
}

.iti__na {
  --iti-flag-offset: -2496px;
}

.iti__nc {
  --iti-flag-offset: -2512px;
}

.iti__ne {
  --iti-flag-offset: -2528px;
}

.iti__nf {
  --iti-flag-offset: -2544px;
}

.iti__ng {
  --iti-flag-offset: -2560px;
}

.iti__ni {
  --iti-flag-offset: -2576px;
}

.iti__nl {
  --iti-flag-offset: -2592px;
}

.iti__no {
  --iti-flag-offset: -2608px;
}

.iti__np {
  --iti-flag-offset: -2624px;
}

.iti__nr {
  --iti-flag-offset: -2640px;
}

.iti__nu {
  --iti-flag-offset: -2656px;
}

.iti__nz {
  --iti-flag-offset: -2672px;
}

.iti__om {
  --iti-flag-offset: -2688px;
}

.iti__pa {
  --iti-flag-offset: -2704px;
}

.iti__pe {
  --iti-flag-offset: -2720px;
}

.iti__pf {
  --iti-flag-offset: -2736px;
}

.iti__pg {
  --iti-flag-offset: -2752px;
}

.iti__ph {
  --iti-flag-offset: -2768px;
}

.iti__pk {
  --iti-flag-offset: -2784px;
}

.iti__pl {
  --iti-flag-offset: -2800px;
}

.iti__pm {
  --iti-flag-offset: -2816px;
}

.iti__pr {
  --iti-flag-offset: -2832px;
}

.iti__ps {
  --iti-flag-offset: -2848px;
}

.iti__pt {
  --iti-flag-offset: -2864px;
}

.iti__pw {
  --iti-flag-offset: -2880px;
}

.iti__py {
  --iti-flag-offset: -2896px;
}

.iti__qa {
  --iti-flag-offset: -2912px;
}

.iti__re {
  --iti-flag-offset: -2928px;
}

.iti__ro {
  --iti-flag-offset: -2944px;
}

.iti__rs {
  --iti-flag-offset: -2960px;
}

.iti__ru {
  --iti-flag-offset: -2976px;
}

.iti__rw {
  --iti-flag-offset: -2992px;
}

.iti__sa {
  --iti-flag-offset: -3008px;
}

.iti__sb {
  --iti-flag-offset: -3024px;
}

.iti__sc {
  --iti-flag-offset: -3040px;
}

.iti__sd {
  --iti-flag-offset: -3056px;
}

.iti__se {
  --iti-flag-offset: -3072px;
}

.iti__sg {
  --iti-flag-offset: -3088px;
}

.iti__sh {
  --iti-flag-offset: -3104px;
}

.iti__si {
  --iti-flag-offset: -3120px;
}

.iti__sj {
  --iti-flag-offset: -3136px;
}

.iti__sk {
  --iti-flag-offset: -3152px;
}

.iti__sl {
  --iti-flag-offset: -3168px;
}

.iti__sm {
  --iti-flag-offset: -3184px;
}

.iti__sn {
  --iti-flag-offset: -3200px;
}

.iti__so {
  --iti-flag-offset: -3216px;
}

.iti__sr {
  --iti-flag-offset: -3232px;
}

.iti__ss {
  --iti-flag-offset: -3248px;
}

.iti__st {
  --iti-flag-offset: -3264px;
}

.iti__sv {
  --iti-flag-offset: -3280px;
}

.iti__sx {
  --iti-flag-offset: -3296px;
}

.iti__sy {
  --iti-flag-offset: -3312px;
}

.iti__sz {
  --iti-flag-offset: -3328px;
}

.iti__tc {
  --iti-flag-offset: -3344px;
}

.iti__td {
  --iti-flag-offset: -3360px;
}

.iti__tg {
  --iti-flag-offset: -3376px;
}

.iti__th {
  --iti-flag-offset: -3392px;
}

.iti__tj {
  --iti-flag-offset: -3408px;
}

.iti__tk {
  --iti-flag-offset: -3424px;
}

.iti__tl {
  --iti-flag-offset: -3440px;
}

.iti__tm {
  --iti-flag-offset: -3456px;
}

.iti__tn {
  --iti-flag-offset: -3472px;
}

.iti__to {
  --iti-flag-offset: -3488px;
}

.iti__tr {
  --iti-flag-offset: -3504px;
}

.iti__tt {
  --iti-flag-offset: -3520px;
}

.iti__tv {
  --iti-flag-offset: -3536px;
}

.iti__tw {
  --iti-flag-offset: -3552px;
}

.iti__tz {
  --iti-flag-offset: -3568px;
}

.iti__ua {
  --iti-flag-offset: -3584px;
}

.iti__ug {
  --iti-flag-offset: -3600px;
}

.iti__us {
  --iti-flag-offset: -3616px;
}

.iti__uy {
  --iti-flag-offset: -3632px;
}

.iti__uz {
  --iti-flag-offset: -3648px;
}

.iti__va {
  --iti-flag-offset: -3664px;
}

.iti__vc {
  --iti-flag-offset: -3680px;
}

.iti__ve {
  --iti-flag-offset: -3696px;
}

.iti__vg {
  --iti-flag-offset: -3712px;
}

.iti__vi {
  --iti-flag-offset: -3728px;
}

.iti__vn {
  --iti-flag-offset: -3744px;
}

.iti__vu {
  --iti-flag-offset: -3760px;
}

.iti__wf {
  --iti-flag-offset: -3776px;
}

.iti__ws {
  --iti-flag-offset: -3792px;
}

.iti__xk {
  --iti-flag-offset: -3808px;
}

.iti__ye {
  --iti-flag-offset: -3824px;
}

.iti__yt {
  --iti-flag-offset: -3840px;
}

.iti__za {
  --iti-flag-offset: -3856px;
}

.iti__zm {
  --iti-flag-offset: -3872px;
}

.iti__zw {
  --iti-flag-offset: -3888px;
}

.iti__globe {
  background-image: url(https://www.swmc.com/angelai/static/media/globe.7fb216c936a98b90918e.webp);
  background-image: var(--iti-path-globe-1x);
  background-size: contain;
  background-position: right;
  box-shadow: none;
  height: 19px;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2x) {
  .iti__flag {
    background-image: url(https://www.swmc.com/angelai/static/media/flags@2x.bea0200ba7ea874b359f.webp);
    background-image: var(--iti-path-flags-2x);
  }
  .iti__globe {
    background-image: url(https://www.swmc.com/angelai/static/media/globe@2x.5dc7e51d6b5d42fc2be4.webp);
    background-image: var(--iti-path-globe-2x);
  }
}
.iti {
  width: 100%;
}

.iti input.iti__tel-input,
.iti input.iti__tel-input[type='text'],
.iti input.iti__tel-input[type='tel'] {
  /* uncomment if showFlag is true */
  padding-left: 36px;
  padding-right: 0 !important;
  padding-right: initial !important;
  height: 35px;
  font-family: 'Poppins';
  font-size: 16px;
  border: medium none currentColor;
  border: initial;
  width: 100%;
}

.iti:focus-visible,
.iti input.iti__tel-input:focus-visible {
  outline: none;
}

.iti__country-container {
  left: 0;
  right: auto !important;
  right: initial !important;
}

.internationalPhoneNumberContainer {
  width: 100%;
}

.Attachment_class__9ixLL {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: 100%;
  gap: 25px;
  padding: 10px 5px;
  margin: auto;
}
.Attachment_class__9ixLL input {
  display: none;
}
.Attachment_class__9ixLL label,
.Attachment_class__9ixLL button {
  display: block;
  border: var(--borderWidth000) solid transparent;
  background-color: transparent;
  width: 95px;
  height: 85px;
  position: relative;
  overflow: hidden;
}
.Attachment_class__9ixLL label *,
.Attachment_class__9ixLL button * {
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.Attachment_class__9ixLL img {
  object-fit: contain;
  position: absolute;
  inset: 0px;
  border: var(--borderWidth000) solid transparent;
  border-radius: 8px;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  max-width: 100%;
  max-height: 100%;
}
.Attachment_class__9ixLL img + div {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 5px 3px;
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  background: linear-gradient(to bottom, transparent 0%, rgba(255, 255, 255, .5) 42%);
  -webkit-backdrop-filter: blur(52px);
          backdrop-filter: blur(52px);
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.Attachment_class__9ixLL img + div > svg {
  width: 12px;
  height: 12px;
  background-color: var(--gray000);
  color: var(--orange500);
  border-radius: 100%;
}
.Attachment_class__9ixLL img + div > p {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  position: relative;
  font-size: 8px;
  font-family: var(--typographyFontFamily);
  font-weight: 500;
  text-align: left;
  color: var(--gray850);
}
@media (max-width: 900px) {
  .Attachment_class__9ixLL {
    gap: 10px;
  }
}

.Edit_class__9GSGC {
  display: flex;
  flex-direction: column;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 5px;
  margin: auto;
  padding: 5px 5px 0 5px;
  border-radius: 8px;
}

.Edit_class__9GSGC > div {
  width: 100%;
  background-color: var(--gray000);
  border-radius: 8px;
  padding: 8px;
}

.Edit_class__9GSGC > div > div {
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  display: inline;
  background-color: var(--blue050);
  border-radius: 8px;
  float: left;
  margin: 0;
  margin-right: 8px;
  margin-bottom: 8px;
  padding: 2px;
}

.Edit_class__9GSGC > div > div::before {
  background: linear-gradient(to bottom, transparent, #ffffff, transparent);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.Edit_class__9GSGC > div > div > div {
  background-color: var(--gray000);
  border-radius: 7px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.Edit_class__9GSGC > div > div > div > svg {
  width: 44px;
  height: 44px;
  padding: 6px;
  color: var(--blue050);
}

.Edit_class__9GSGC > div > span {
  display: inline;
  font-family: 'Poppins';
  font-weight: 400;
  font-size: 12px;
  line-height: 1.5;
  color: var(--blue999);
}

.Edit_class__9GSGC > p,
.Edit_class__9GSGC > div > p {
  display: block;
  font-size: 0.85em;
  font-size: 9px;
  line-height: 2;
  color: var(--blue050);
  min-width: 100%;
  text-align: center;
}

.FileSelector_class__iK75\+ input {
  display: none;
}
.FileSelector_class__iK75\+ {
  min-width: 100%;
  padding: 5px;
}
.FileSelector_class__iK75\+ ul {
  padding: 6px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px;
  list-style-type: none;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: 100%;
  max-height: 192px;
  overflow: auto;
  position: relative;
}
.FileSelector_class__iK75\+ ul:empty {
  display: none;
}
.FileSelector_class__iK75\+ ul:first-of-type li span p,
.FileSelector_class__iK75\+ ul:first-of-type li button p {
  width: 44px;
  max-width: 44px !important;
}
.FileSelector_class__iK75\+ li {
  height: 56px;
}
.FileSelector_class__iK75\+ li:only-child {
  height: -webkit-fit-content;
  height: fit-content;
}
.FileSelector_class__iK75\+ li > button,
.FileSelector_class__iK75\+ li > span {
  max-width: 44px !important;
}
.FileSelector_class__iK75\+ li > span > p,
.FileSelector_class__iK75\+ li > button > p,
.FileSelector_class__iK75\+ li + li > label > p {
  color: var(--gray800);
  font-size: 8px;
  font-weight: 500;
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
  margin: 0;
  white-space: nowrap;
  pointer-events: none;
  line-height: 12px;
}
.FileSelector_class__iK75\+ label > p:nth-of-type(1) {
  display: none;
}
.FileSelector_class__iK75\+ label > p:nth-of-type(2) {
  display: block;
  display: -webkit-box;
  width: -webkit-fit-content;
  width: fit-content;
  margin: auto;
}
@media (pointer: coarse) {
  .FileSelector_class__iK75\+ label > p:nth-of-type(1) {
    display: block;
    display: -webkit-box;
    width: -webkit-fit-content;
    width: fit-content;
    margin: auto;
  }
  .FileSelector_class__iK75\+ label > p:nth-of-type(2) {
    display: none;
  }
}
.FileSelector_class__iK75\+.FileSelector_selectedFiles__VjQCB label > p {
  display: block;
  display: -webkit-box;
  width: -webkit-fit-content;
  width: fit-content;
  margin: auto;
}
.FileSelector_class__iK75\+ li > button > p > span {
  display: inline-block;
  width: 100%;
  max-width: 10px;
  transform: translateY(1px);
}
.FileSelector_class__iK75\+ li > span > div:first-child,
.FileSelector_class__iK75\+ li > button > div:first-child,
.FileSelector_class__iK75\+ li > label > div:first-child {
  width: 40px;
  height: 40px;
  margin: 0 auto 4px;
}
.FileSelector_class__iK75\+ li > span > div:first-child > div,
.FileSelector_class__iK75\+ li > button > div:first-child > div,
.FileSelector_class__iK75\+ li > label > div:first-child > div {
  mix-blend-mode: normal;
}
.FileSelector_class__iK75\+ li > span > div:first-child > div > *,
.FileSelector_class__iK75\+ li > button > div:first-child > div > * {
  object-fit: cover;
  width: 100%;
  height: 100%;
  color: var(--gray950);
  position: absolute;
  inset: 0;
}
.FileSelector_class__iK75\+ li label div:first-child {
  color: var(--orange500);
  display: flex;
}
.FileSelector_class__iK75\+ li label div:first-child > svg {
  width: 24px;
  height: 24px;
  margin: auto;
}
.FileSelector_class__iK75\+ li label p {
  text-align: center;
  color: var(--gray800);
  font-weight: 500;
  font-size: 10px;
  max-width: 13.0125rem;
  text-wrap: balance;
}
.FileSelector_class__iK75\+ li label p:nth-of-type(1),
.FileSelector_class__iK75\+ li label p:nth-of-type(2) {
  text-align: center;
  color: var(--orange500);
  font-weight: 500;
  font-size: 10px;
  font-weight: 600;
  font-size: 13px;
  margin: 0;
  width: -webkit-fit-content;
  width: fit-content;
  margin: auto;
  text-align: center;
  text-wrap-style: balance;
}
.FileSelector_class__iK75\+ li label div:last-child {
  width: -webkit-fit-content;
  width: fit-content;
  margin: auto;
  background-color: var(--orange500);
  color: var(--gray000);
  cursor: pointer;
  border-radius: 10px;
  padding: 5px 10px;
  margin-top: 7px;
  font-size: 9px;
  font-weight: 500;
}
.FileSelector_class__iK75\+ li label div {
  cursor: pointer;
}
.FileSelector_class__iK75\+ li label:hover > p:nth-of-type(1),
.FileSelector_class__iK75\+ li label:hover > p:nth-of-type(2),
.FileSelector_class__iK75\+ li label:hover > div {
  opacity: .8;
}
.FileSelector_class__iK75\+ ul {
  margin: auto;
}
.FileSelector_class__iK75\+ ul + ul label p {
  max-height: 3rem;
  max-width: 15rem;
  transition: max-width .5s linear, max-height .5s linear .5s;
  overflow: hidden;
  display: block;
}
.FileSelector_class__iK75\+.FileSelector_selectedFiles__VjQCB ul + ul label p,
.FileSelector_class__iK75\+.FileSelector_selectedFiles__VjQCB ul + ul label div:nth-of-type(1) {
  max-height: 0;
  max-width: 0;
  transition: max-height .5s linear, max-width .5s linear .5s;
  overflow: hidden;
  display: block;
}
.FileSelector_class__iK75\+ ul + ul label p:nth-of-type(1),
.FileSelector_class__iK75\+ ul + ul label p:nth-of-type(2) {
  white-space: nowrap;
}
.FileSelector_class__iK75\+.FileSelector_selectedFiles__VjQCB ul + ul label div {
  margin: 0 auto;
  transition: margin .5s linear;
}
.FileSelector_class__iK75\+.FileSelector_selectedFiles__VjQCB ul + ul label {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: -webkit-fit-content;
  width: fit-content;
  align-items: center;
}
.FileSelector_class__iK75\+ li > span {
  position: relative;
}
.FileSelector_class__iK75\+ li > span > div > div > svg {
  position: absolute;
  z-index: 10;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 1000rem;
  background: rgba(255, 255, 255, .4);
}
.FileSelector_class__iK75\+ li > span > div > div > svg > circle {
  transform: rotate(-90deg);
  transform-origin: center center;
}
.FileSelector_pulse__cN8XU {
  animation: FileSelector_pulse__cN8XU 2s linear infinite;
}
@keyframes FileSelector_pulse__cN8XU {
  0% {
    opacity: 100%;
  }
  25% {
    opacity: 10%;
  }
  75% {
    opacity: 100%;
  }
}
.FileSelector_class__iK75\+ > label {
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}
.FileSelector_class__iK75\+ > label input {
  display: none;
}
.FileSelector_class__iK75\+ > label svg {
  color: var(--orange500);
}

.ReplyAll_class__RiMn- {
  display: flex;
  flex-direction: column;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 5px;
  margin: auto;
  padding: 5px 5px 0 5px;
  border-radius: 8px;
}

.ReplyAll_class__RiMn- > div {
  width: 100%;
  background-color: var(--gray000);
  border-radius: 8px;
  padding: 8px;
}

.ReplyAll_class__RiMn- > div > div {
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  display: inline;
  background-color: var(--orange800);
  border-radius: 8px;
  float: left;
  margin: 0;
  margin-right: 8px;
  margin-bottom: 8px;
  padding: 2px;
}

.ReplyAll_class__RiMn- > div > div::before {
  background: linear-gradient(to bottom, transparent, #ffffff, transparent);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.ReplyAll_class__RiMn- > div > div > div {
  background-color: var(--gray000);
  border-radius: 7px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ReplyAll_class__RiMn- > div > div > div > svg {
  width: 44px;
  height: 44px;
  padding: 6px;
  color: var(--orange800);
}

.ReplyAll_class__RiMn- > div > span {
  display: inline;
  font-family: 'Poppins';
  font-weight: 400;
  font-size: 12px;
  line-height: 1.5;
  color: var(--blue999);
}

.ReplyAll_class__RiMn- > p,
.ReplyAll_class__RiMn- > div > p {
  display: block;
  font-size: 0.85em;
  font-size: 9px;
  line-height: 2;
  color: var(--orange800);
  min-width: 100%;
  text-align: center;
}

.AudioMessageContent_container__K5h-a {
  width: 260px;
  height: -webkit-fit-content;
  height: fit-content;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 10px;
  overflow: hidden;
  border-radius: 6px;
  background: linear-gradient(to top, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 1) 30px),
    linear-gradient(90deg, #ff835b, #00add4, #ff1ca4, #ff835b);
  animation: AudioMessageContent_flow__6pC1W 2s linear infinite;
  background-size: 200%;
}

@keyframes AudioMessageContent_flow__6pC1W {
  0% {
    background-position: 0%;
  }
  100% {
    background-position: 200%;
  }
}

.AudioMessageContent_controlPanel__JEals {
  height: 35px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: relative;
}

.AudioMessageContent_canvasContainer__7olgF {
  height: 20px;
}

.AudioMessageContent_canvasContainer__7olgF > canvas {
  height: 100% !important;
}

.AudioMessageContent_visualizerContainer__i\+W3Z {
  height: 20px;
  flex-grow: 1;
}

.AudioMessageContent_playPauseButton__sKgmu {
  height: 35px;
  width: 35px;
  border-radius: 50%;
  background-color: var(--primaryMain);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--gray000);
}

.AudioMessageContent_sideButtons__E3xZb {
  height: 35px;
  width: 35px;
  border-radius: 50%;
  background-color: var(--gray000);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--primaryMain);
}

.AudioMessageContent_messageText__KzDqN {
  font-family: var(--typographyFontFamily);
  font-size: small;
}

.AudioMessageContent_italicized__Xun-z {
  font-style: italic;
}

.AudioMessageContent_italicized__Xun-z::first-letter {
  text-transform: capitalize;
}

.AudioMessageContent_transcriptContainer__gY8y1 {
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
  position: relative;
}

.AudioMessageContent_transcriptContainer__gY8y1.AudioMessageContent_collapsed__8Tj9u {
  max-height: 0;
}

.AudioMessageContent_transcriptContainer__gY8y1.AudioMessageContent_expanded__HE49y {
  max-height: 200px;
}

.AudioMessageContent_messageContainer__5H9Gq {
  padding: 10px;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
  max-height: calc(1.2em * 4);
  overflow-y: auto;
  position: relative;
}

.AudioMessageContent_messageContainer__5H9Gq.AudioMessageContent_expanded__HE49y {
  opacity: 1;
  transition-delay: 0.1s;
}

.AudioMessageContent_transcriptContainer__gY8y1.AudioMessageContent_expanded__HE49y::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1.5em;
  background: linear-gradient(transparent, rgba(255, 255, 255, 1));
  background: linear-gradient(transparent, var(--glass-background, rgba(255, 255, 255, 1)));
  pointer-events: none;
}

@media (min-width: 900px) {
  .AudioMessageContent_container__K5h-a {
    width: 360px;
  }
}

.DocumentMessageContent_class__oq01a {
  max-width: 204px;
  box-sizing: border-box;
  border-radius: 10px;
  position: relative;
  background: linear-gradient(135deg, rgba(255, 255, 255, .6), rgba(255, 255, 255, .2));
  backdrop-filter: blur(384px);
  -webkit-backdrop-filter: blur(384px);
  margin: 1px;
}
.DocumentMessageContent_class__oq01a > div {
  background: linear-gradient(135deg, #fff, #ddd);

  /* Use a mask to cut a transparent hole */
  -webkit-mask:
  linear-gradient(white 0 0) content-box,
  linear-gradient(white 0 0);
  mask:
    linear-gradient(white 0 0) content-box,
    linear-gradient(white 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  border-radius: 10px;
  position: absolute;
  inset: -2px;
  pointer-events: none;
  padding: 2px;
}
.DocumentMessageContent_class__oq01a > header {
  position: relative;
  display: grid;
  grid-template-columns: 44px 1fr auto auto;
  grid-gap: 0;
  gap: 0;
}
.DocumentMessageContent_class__oq01a > header > span {
  min-width: 44px;
  min-height: 44px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--orange500);
}
.DocumentMessageContent_class__oq01a > header > span:nth-of-type(2) {
  color: var(--blue999);
}
.DocumentMessageContent_class__oq01a > header > span > span {
  position: relative;
  margin: 10px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.DocumentMessageContent_class__oq01a > header > span > span::before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  border-radius: 1000rem;
}
.DocumentMessageContent_class__oq01a > header > span:nth-of-type(1) > span::before {
  background-color: rgba(255, 255, 255, .5);
}
.DocumentMessageContent_class__oq01a > header > span:nth-of-type(3) > span::before {
  background-color: var(--peach500);
  opacity: 20%;
}
.DocumentMessageContent_class__oq01a > header > span:nth-of-type(3) > span > span {
  transform: translate(5px, 13px) rotate(0) !important;
  animation: none !important;
}
.DocumentMessageContent_class__oq01a > header > span:nth-of-type(3) > span > span > svg {
  height: 14px;
  width: auto;
}
.DocumentMessageContent_class__oq01a > header > span > span > svg {
  height: 14px;
  width: auto;
}
.DocumentMessageContent_class__oq01a > main > button > span > p,
.DocumentMessageContent_class__oq01a > header > span > p,
.DocumentMessageContent_class__oq01a > header > span > time {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  position: relative;
  font-size: 10px;
  font-family: var(--typographyFontFamily);
  font-weight: 600;
  text-align: left;
  min-width: 100%;
  color: var(--blue999);
}
.DocumentMessageContent_class__oq01a > header > span > time {
  font-weight: 400;
}
.DocumentMessageContent_class__oq01a > header > button {
  position: absolute;
  top: 0;
  right: 0;
  width: 44px;
  height: 44px;
  background-color: transparent;
  border: var(--borderWidth000);
}
.DocumentMessageContent_class__oq01a > main {
  position: relative;
  display: grid;
  grid-template-areas:
    "a a a b"
    "a a a c"
    "a a a d";
  grid-gap: 2px;
  gap: 2px;
  padding: 0 .5rem 2.25rem;
}

.DocumentMessageContent_class__oq01a > main:has( > figure:only-of-type) {
  grid-template-areas:
    "a a a"
    "a a a"
    "a a a";
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(1) {
  grid-area: a;
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(2) {
  grid-area: b;
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(3) {
  grid-area: c;
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(n + 4) {
  grid-area: d;
}
.DocumentMessageContent_class__oq01a figure {
  width: 136px;
  height: 136px;
  position: relative;
  -webkit-user-select: none;
          user-select: none;
}
.DocumentMessageContent_class__oq01a figure:only-of-type {
  width: 182px;
}
.DocumentMessageContent_modal__efp0B > figure {
  width: 100%;
  padding-bottom: 100%;
  position: relative;
}
.DocumentMessageContent_modal__efp0B > div {
  display: flex;
  flex-direction: row;
  max-width: 100%;
  overflow-x: auto;
  gap: .5rem;
}
.DocumentMessageContent_modal__efp0B > div > figure,
.DocumentMessageContent_class__oq01a figure:nth-of-type(n + 2) {
  width: 44px;
  max-width: 44px;
  height: 0;
  position: relative;
  padding-bottom: 44px;
  margin: auto;
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(n + 5) {
  display: none;
}
.DocumentMessageContent_class__oq01a figure > img,
.DocumentMessageContent_class__oq01a figure > audio,
.DocumentMessageContent_class__oq01a figure > embed,
.DocumentMessageContent_class__oq01a figure > video {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  padding-bottom: 100%;
  embed-fit: cover;
  object-fit: cover;
  border-radius: 10px;
  padding: 0;
}
.DocumentMessageContent_class__oq01a figure > img ~ div,
.DocumentMessageContent_class__oq01a figure > audio ~ div,
.DocumentMessageContent_class__oq01a figure > embed ~ div,
.DocumentMessageContent_class__oq01a figure > video ~ div {
  display: none;
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(1) > img ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(1) > audio ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(1) > embed ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(1) > video ~ div {
  content: '';
  display: block;
  position: absolute;
  inset: 0;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  pointer-events: none;

  /* Gradient mask from transparent to opaque (top to bottom) */
  mask-image: linear-gradient(to bottom, transparent 60%, black 100%);
  mask-mode: alpha;
  mask-size: 100% 100%;
  mask-repeat: no-repeat;

  -webkit-mask-image: linear-gradient(to bottom, transparent 60%, black 100%);
  -webkit-mask-mode: alpha;
  -webkit-mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > img ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > audio ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > embed ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > video ~ div {
  display: block;
  position: absolute;
  inset: 0;
  background-color: var(--blue984);
  opacity: 75%;
  border-radius: 10px;
  color: var(--gray000);
  align-content: center;
  justify-items: center;
  text-align: center;
  font-size: 12px;
  font-family: var(--typographyFontFamily);
  font-weight: 400;
}
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > img ~ div,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > audio ~ div,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > embed ~ div,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > video ~ div {
  display: block;
  position: absolute;
  inset: 0;
  background-color: rgba(255, 255, 255, .05);
  opacity: 75%;
  border-radius: 10px;
  color: var(--gray000);
  align-content: center;
  justify-items: center;
  text-align: center;
  font-size: 12px;
  font-family: var(--typographyFontFamily);
  font-weight: 400;

  -webkit-mask-image: linear-gradient(to bottom, black 100%, black 100%);

          mask-image: linear-gradient(to bottom, black 100%, black 100%);
}
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > img ~ div > svg,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > audio ~ div > svg,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > embed ~ div > svg,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies > video ~ div > svg {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: rgba(255, 255, 255, .9);
  filter: drop-shadow(0 0 4px rgba(0, 0, 0, .75));
}
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies:nth-of-type(1) > img ~ div > svg,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies:nth-of-type(1) > audio ~ div > svg,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies:nth-of-type(1) > embed ~ div > svg,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isVideo__TOies:nth-of-type(1) > video ~ div > svg {
  width: 100px;
  height: 100px;
}
.DocumentMessageContent_modal__efp0B figure > img ~ div,
.DocumentMessageContent_modal__efp0B figure > audio ~ div,
.DocumentMessageContent_modal__efp0B figure > embed ~ div,
.DocumentMessageContent_modal__efp0B figure > video ~ div,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > img ~ div:empty,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > audio ~ div:empty,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > embed ~ div:empty,
.DocumentMessageContent_class__oq01a figure:nth-of-type(4) > video ~ div:empty {
  display: none;
}
.DocumentMessageContent_class__oq01a figure > img ~ span,
.DocumentMessageContent_class__oq01a figure > audio ~ span,
.DocumentMessageContent_class__oq01a figure > embed ~ span,
.DocumentMessageContent_class__oq01a figure > video ~ span {
  display: none;
  align-items: center;
  justify-content: center;
  position: absolute;
  inset: 0;
  z-index: 9999999;
  background-color: rgba(255, 255, 255, .4);
  border-radius: 10px;
}
.DocumentMessageContent_class__oq01a figure > button {
  position: absolute;
  inset: 0;
  z-index: 3;
  background-color: transparent;
  -webkit-user-select: none;
          user-select: none;
}
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isDownloading__7Lzn4 > img ~ span,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isDownloading__7Lzn4 > audio ~ span,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isDownloading__7Lzn4 > embed ~ span,
.DocumentMessageContent_class__oq01a figure.DocumentMessageContent_isDownloading__7Lzn4 > video ~ span {
  display: flex;
}
.DocumentMessageContent_class__oq01a figure + button {
  position: absolute;
  bottom: .5rem;
  left: .5rem;
  right: .5rem;
  background-color: rgba(255, 255, 255, .5);
  border-radius: 10px;
  padding: .25rem .5rem;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: .5rem;
  gap: .5rem;
  z-index: 9;
}
.DocumentMessageContent_modal__efp0B > figure + button {
  position: relative;
  bottom: auto;
  bottom: initial;
  left: auto;
  left: initial;
  right: auto;
  right: initial;
  width: -webkit-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.DocumentMessageContent_modal__efp0B > div > button {
  display: none;
}
.DocumentMessageContent_class__oq01a > main > button:nth-of-type(n + 2) {
  display: none;
}
.DocumentMessageContent_modal__efp0B > figure + button > span,
.DocumentMessageContent_class__oq01a > main > button > span {
  display: grid;
  grid-template-columns: 1fr;
  align-items: flex-start;
  justify-content: flex-start;
  opacity: 100% !important;
  color: var(--orange500);
}
.DocumentMessageContent_modal__efp0B > figure + button > span > p,
.DocumentMessageContent_class__oq01a > main > button > span > p {
  font-weight: 500;
  opacity: 50%;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  color: var(--blue999);
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  position: relative;
  height: 1.1875rem;
}
.DocumentMessageContent_modal__efp0B > figure + button > span > p > svg,
.DocumentMessageContent_class__oq01a > main > button > span > svg {
  width: 12px;
  height: 12px;
  transform: translateY(3px);
}

.DocumentMessageContent_modal__efp0B {
  box-sizing: border-box !important;
  border-radius: 10px !important;
  position: relative !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, .6), rgba(255, 255, 255, .2)) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  margin: 1px !important;
  width: -webkit-fit-content !important;
  width: fit-content !important;
  max-width: calc(100vw - 40px) !important;
  max-width: calc(100svw - 40px) !important;
  height: -webkit-fit-content !important;
  height: fit-content !important;
  max-height: calc(100vh - 40px) !important;
  max-height: calc(100svh - 40px) !important;
  display: flex !important;
  flex-direction: column !important;
  border: var(--borderWidth100) solid white;
}
.DocumentMessageContent_modal__efp0B > div {
  padding: .5rem;
  margin: auto;
  min-height: -webkit-fit-content;
  min-height: fit-content;
  overflow-x: auto;
  overscroll-behavior: contain;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: 100%;
}
.DocumentMessageContent_modal__efp0B > header {
  padding-left: .5rem;
}
.DocumentMessageContent_modal__efp0B > figure > button,
.DocumentMessageContent_modal__efp0B figure > img ~ div,
.DocumentMessageContent_modal__efp0B figure > audio ~ div,
.DocumentMessageContent_modal__efp0B figure > embed ~ div,
.DocumentMessageContent_modal__efp0B figure > video ~ div {
  display: none !important;
}
.DocumentMessageContent_modal__efp0B > figure {
  padding: 0;
  flex: 1 1;
  width: 100% !important;
  overflow: auto;
  align-content: center;
  justify-items: center;
  text-align: center;
  max-width: -webkit-max-content;
  max-width: max-content;
  margin: auto;
  height: -webkit-fit-content;
  height: fit-content;
  max-height: 100%;
  overscroll-behavior: none;
  padding: 0 .5rem;
}
.DocumentMessageContent_modal__efp0B > button {
  position: relative;
  width: 100%;
  background-color: transparent !important;
}
.DocumentMessageContent_modal__efp0B > figure > img, 
.DocumentMessageContent_modal__efp0B > figure > audio, 
.DocumentMessageContent_modal__efp0B > figure > embed, 
.DocumentMessageContent_modal__efp0B > figure > video {
  position: relative !important;
  height: auto !important;
  max-width: -webkit-max-content !important;
  max-width: max-content !important;
  margin: auto !important;
}
.DocumentMessageContent_modal__efp0B > figure > embed {
  max-width: none !important;
  max-width: initial !important;
  min-width: calc(100vw - 69px) !important;
  max-height: none !important;
  max-height: initial !important;
  min-height: calc(100vw - 146px) !important;
}
.DocumentMessageContent_modal__efp0B > figure > audio {
  max-width: none !important;
  max-width: initial !important;
  min-width: calc(100vw - 69px) !important;
  max-height: none !important;
  max-height: initial !important;
  min-height: 50px !important;
}
.DocumentMessageContent_modal__efp0B > div > figure {
  display: flex !important;
  min-width: 44px !important;
}

.DefaultModal_dialog__EODsE {
  --animation-duration: 500ms;
  background-color: transparent;
  min-width: 100%;
  min-height: 100%;
  border: var(--borderWidth000);
  margin: 0;
  padding: 0;
}

.DefaultModal_dialog__EODsE[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}
.DefaultModal_dialog__EODsE.DefaultModal_onClose__kTCpy[open] {
  cursor: pointer;
}

.DefaultModal_dialog__EODsE > * {
  position: relative;
  background-color: white;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: calc(100vw - 40px);
  height: -webkit-fit-content;
  height: fit-content;
  max-height: calc(100vh - 40px);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  opacity: 0;
  overflow-y: auto;
  transition: opacity var(--animation-duration) linear;
  margin: auto;
}

.DefaultModal_dialog__EODsE[open] > * {
  opacity: 1;
  transition: opacity var(--animation-duration) linear;
  pointer-events: all;
  cursor: default;
}

.DefaultModal_dialog__EODsE > * > header {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  width: 100%;
}

.DefaultModal_dialog__EODsE > * > header > h1 {
  text-align: center;
  margin: 0;
  padding-left: 40px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--typographyFontFamily);
  font-weight: 600;
  color: var(--blue999);
}

.DefaultModal_dialog__EODsE > * > header > button {
  color: #666;
  height: 40px;
  width: 40px;
  -webkit-user-select: none;
          user-select: none;
  border: var(--borderWidth000);
  background-color: transparent;
  cursor: pointer;
  padding: 0;
}

.DefaultModal_dialog__EODsE > * > header > button:hover {
  color: #ff4d07;
}

.DefaultModal_dialog__EODsE > * > header > button > * {
  pointer-events: none;
}

.DefaultModal_dialog__EODsE > * > header > button svg {
  width: 16px;
  color: var(--blue999);
  opacity: .8;
}

.DefaultModal_dialog__EODsE > * > footer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 1rem;
  margin-top: 1rem;
}

.BubbleWithExpandableLower_containerExpanded__ZT8h- {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 3px;
  z-index: 0;
}

.BubbleWithExpandableLower_containerMinimized__Nrrr9 {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 27px;
  z-index: 0;
}

.BubbleWithExpandableLower_upperBubble__O3lWh,
.BubbleWithExpandableLower_lowerBubble__czzCJ {
  position: relative;
  min-height: 100px;
  min-width: 100px;
  background-color: var(--peach600);
  box-sizing: border-box;
  border-width: var(--borderWidth100);
  border-style: solid;
  border-color: var(--orange700);
  border-radius: 10px;
  height: -webkit-fit-content;
  height: fit-content;
}

.BubbleWithExpandableLower_upperBubble__O3lWh {
  mask-image: radial-gradient(circle at 32px calc(100% + 1px), transparent 23px, black 0);
  -webkit-mask-image: radial-gradient(circle at 32px calc(100% + 1px), transparent 23px, black 0);
}

.BubbleWithExpandableLower_upperBubble__O3lWh::after,
.BubbleWithExpandableLower_lowerBubble__czzCJ::before {
  content: '';
  display: block;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 7px;
  height: 48px;
  width: 48px;
  background-color: var(--primaryMain);
  border-radius: 50%;
  z-index: 1;
}

.BubbleWithExpandableLower_lowerBubble__czzCJ::before {
  top: -27px;
}

.BubbleWithExpandableLower_upperBubble__O3lWh::after {
  bottom: -26px;
}

.BubbleWithExpandableLower_lowerBubble__czzCJ {
  mask-image: radial-gradient(circle at 32px -2px, transparent 23px, black 0);
  -webkit-mask-image: radial-gradient(circle at 32px -2px, transparent 23px, black 0);
}

.BubbleWithExpandableLower_upperMaskBorder__2FAhJ,
.BubbleWithExpandableLower_lowerMaskBorder__gujED {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 7px;
  height: 48px;
  width: 48px;
  background-color: var(--primaryMain);
  border-radius: 50%;
  z-index: 1;
}

.BubbleWithExpandableLower_upperMaskBorder__2FAhJ {
  bottom: -26px;
}

.BubbleWithExpandableLower_lowerMaskBorder__gujED {
  top: -27px;
}

.BubbleWithExpandableLower_expanderButton__6B-jN {
  position: absolute;
  height: 40px;
  width: 40px;
  border-radius: 50%;

  background-color: var(--peach600);
  border-style: solid;
  border-width: var(--borderWidth100);
  border-color: var(--orange700);

  display: flex;
  justify-content: center;
  align-items: center;

  left: 12px;
  z-index: 1;
}

.BubbleWithExpandableLower_containerMinimized__Nrrr9 > .BubbleWithExpandableLower_expanderButton__6B-jN {
  transform: rotate(180deg);
}

.main_joinButtonContainer__nHvuA {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: -webkit-fit-content;
  height: fit-content;
  font-size: 1.5rem;
  font-weight: bold;
  color: white;
  border-radius: 0 0 18px 18px;
  overflow: hidden;
  background: linear-gradient(90deg, var(--orange800), purple, var(--orange800));
  background-size: 300% 100%;
  animation: main_gradientMove__P7bVw 10s linear infinite;
  z-index: 0;
  margin-top: -13px;
}

.main_topPartTextContainer__ooNhr {
  padding: 8px;
  min-width: 50px;
  width: 100%;
  border: var(--borderWidth100) solid var(--orange700);
  border-radius: 16px;
  z-index: 1;
  background-color: white;
  font-size: 0.9rem;
}

.main_topPartTextContainerMobile__ip7pV {
  padding: 4px;
  min-width: 50px;
  width: 100%;
  border: var(--borderWidth100) solid var(--orange700);
  border-radius: 16px;
  z-index: 1;
  background-color: white;
  font-size: 0.9rem;
}

.main_topPartText__C9weZ {
  padding: 8px;
  width: 100%;
}


.main_topPartTextMobile__rkwZo {
  padding: 4px;
  width: 100%;
}

.main_arrow__\+Nxuh {
  margin-right: 10px;
  border: var(--borderWidth100) solid white;
  border-radius: 50%;
  padding: 1px;
  font-size: 19px;
}

@keyframes main_gradientMove__P7bVw {
  0% {
    background-position: 0% 50%;
  }

  100% {
    background-position: -300% 50%;
  }
}

.main_joinButton__NfT00 {
  font-size: 0.8rem;
  width: 100%;
  background: linear-gradient(var(--shadow902), var(--shadow903)) !important;
  margin-top: auto;
  border-radius: 0 0 8px 8px;
  height: -webkit-fit-content;
  height: fit-content;
  padding-top: 12px;
}

.main_joinButtonInnerContainerText__jtQCY {
  font-size: 0.75rem;
  font-weight: bold;
}

.main_joinButtonInnerContainer__MK01i {
  color: white;
  width: 100%;
  padding: 6px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.EditBackground_class__Qsf0T {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  max-width: 100%;
  grid-gap: 10px;
  gap: 10px;
  list-style-type: none;
  padding: 0 10px 10px 10px;
  margin: 0;
  min-width: 90%;
  box-sizing: border-box;
  position: relative;
  bottom: 0;
}
@media (max-width: 900px) {
  .EditBackground_class__Qsf0T {
    min-width: calc(100vw - 16px);
  }
}
.EditBackground_class__Qsf0T > li {
  display: block;
  flex: 1 1;
  width: 100%;
  height: 0;
  padding-bottom: min(calc(100% * 153/192), calc((50vh/2) - 56px - 10px));
  padding-bottom: min(calc(100% * 153/192), calc((50vh/2) - var(--title-height, 56px) - 10px));
  padding-bottom: min(calc(100% * 153/192), calc((50svh/2) - 56px - 10px));
  padding-bottom: min(calc(100% * 153/192), calc((50svh/2) - var(--title-height, 56px) - 10px));
  border-radius: 8px;
  border: var(--borderWidth100) solid var(--blue805);
  transition: border-color .5s linear;
  position: relative;
  overflow: hidden;
  background-color: var(--gray000);
}
.EditBackground_class__Qsf0T > [data-selected="true"] {
  border-color: var(--orange800);
}
.EditBackground_class__Qsf0T > li > button {
  position: absolute;
  inset: 0;
  background-color: transparent;
  border: var(--borderWidth000);
}
.EditBackground_class__Qsf0T > li > button > p {
  position: absolute;
  bottom: 10px;
  width: 85px;
  height: 24px;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(255, 255, 255, .6);
  border: var(--borderWidth100) solid rgba(255, 255, 255, .6);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  border-radius: 1000rem;
  font-weight: 500;
  transition: background-color .5s linear;
}
.EditBackground_class__Qsf0T > li > button:hover > p {
  background-color: rgba(255, 255, 255, 1);
}
.EditBackground_title__fvErx {
  margin-left: 10px;
}

.EditBackground_footer__PFUYE {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0 10px 10px;
}
.EditBackground_footer__PFUYE > button {
  display: block;
  width: -webkit-fit-content;
  width: fit-content;
  padding: 5px 10px;
  cursor: pointer;
  border-radius: 8px;
  border: var(--borderWidth100) solid var(--orange800);
}
.EditBackground_footer__PFUYE > button:first-child {
  background-color: var(--gray000);
  color: var(--orange800);
}
.EditBackground_footer__PFUYE > button:last-child {
  background-color: var(--orange800);
  color: var(--gray000);
}
.EditBackground_title__fvErx {
  display: block;
  text-align: center;
  width: 100%;
  color: var(--blue999);
  font-family: var(--typographyFontFamily);
  font-weight: 500;
  font-size: 1.125rem;
  text-transform: none;
  margin: 0;
}
.EditBackground_title__fvErx > button {
  padding: 8px;
  width: 44px; 
  height: 44px;
  display: block;
  align-content: flex-end;
  justify-items: flex-start;
  top: 0;
  right: 0;
  position: absolute;
  color: var(--blue999);
  transition: color .5s linear;
}
.EditBackground_title__fvErx > button:hover,
.EditBackground_title__fvErx > button:focus {
  color: var(--gray700);
}
.EditBackground_title__fvErx > button > svg {
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}

.GlassConversationTitle_class__Q9lU2 {
  background-color: transparent;
  border: var(--borderWidth000);
  margin: 0;
  padding: 0;
  z-index: 11;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  cursor: pointer;
  height: -webkit-fit-content;
  height: fit-content;
  transform: translateY(calc(56px + 0px - 8px));
  transform: translateY(calc(var(--title-height, 56px) + var(--top, 0px) - 8px));
}

.GlassConversationTitle_class__Q9lU2 > * {
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
  cursor: default;
  overflow: hidden;
  max-height: 0;
  transition: max-height .5s linear;
  padding-top: 8px;
  height: -webkit-fit-content;
  height: fit-content;
}

.GlassConversationTitle_class__Q9lU2.GlassConversationTitle_isOpen__1uZUf > * {
  max-height: calc(100vh - 56px - 56px);
  max-height: calc(100vh - var(--title-height, 56px) - var(--footer-height, 56px));
  max-height: calc(100svh - 56px - 56px);
  max-height: calc(100svh - var(--title-height, 56px) - var(--footer-height, 56px));
}

@media (max-width: 900px) {
  .GlassConversationTitle_class__Q9lU2 {
    inset: 5px;
  }
}

.AnchorsWrapper_div__2HbEK {
  position: absolute;
}

.AnchorWrapper_div__YpnF3 {
  position: absolute;
  display: flex;
  flex-direction: column;
}

.AdminAnchorMenuButtons_button__-dKLm {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  padding: 4px;
  text-wrap: nowrap;
  text-align: start;
  background-color: inherit;
  border-radius: 4px;
}

.AdminAnchorMenuButtons_button__-dKLm:hover {
  filter: invert(.75);
}

.AnchorMenu_div__ehM1n {
    display: flex;
    flex-direction: column;
    position: relative;
    background-color: #B7B6C1;
    box-shadow: 0 10px 20px rgba(64, 64, 64, 0.25);
    border-radius: 4px;
    z-index: 1;
    width: 110%;
  }
.UserAnchorMenuButtons_button__dodj2 {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  padding: 4px;
  border-radius: 4px;
  text-wrap: nowrap;
  background-color: inherit;;
  text-align: start;
}

.UserAnchorMenuButtons_button__dodj2:hover {
  filter: invert(.75);
}

.CheckboxAnchor_input__e88sC {
  cursor: pointer;
  margin: 0;
  pointer-events: none;
  height: 10px;
  width: 10px;
}

.CheckboxAnchor_inputRequired__VtSag {
}

.CheckboxAnchor_inputNotRequired__ztnYQ {
}

.CheckboxAnchor_button__W9seY {
  cursor: pointer;
  border-radius: 4px;
  width: -webkit-fit-content;
  width: fit-content;
  padding: 2.5px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  transform-origin: bottom left;
}

.CheckboxAnchor_buttonRequired__LlEgA {
  background-color: #F6AE2D;
}

.CheckboxAnchor_buttonRequired__LlEgA:hover {
  filter: invert(1);
}

.CheckboxAnchor_buttonNotRequired__OLG9F {
  background-color: #B7B6C1;
}

.CheckboxAnchor_buttonNotRequired__OLG9F:hover {
  filter: invert(1);
}

.RadioAnchor_input__EleWo {
  cursor: pointer;
  margin: 0;
  pointer-events: none;
  height: 10px;
  width: 10px;
}

.RadioAnchor_inputRequired__9MUgl {
}

.RadioAnchor_inputNotRequired__qS42P {
}

.RadioAnchor_button__YsC28 {
  cursor: pointer;
  border-radius: 4px;
  width: -webkit-fit-content;
  width: fit-content;
  padding: 2.5px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  transform-origin: bottom left;
}

.RadioAnchor_buttonRequired__ZAjXV {
  background-color: #F6AE2D;
}

.RadioAnchor_buttonRequired__ZAjXV:hover {
  filter: invert(1);
}

.RadioAnchor_buttonNotRequired__vAffM {
  background-color: #B7B6C1;
}

.RadioAnchor_buttonNotRequired__vAffM:hover {
  filter: invert(1);
}

.SignedSignatureAnchor_div__WhPdb {
  transform-origin: bottom left;
  cursor: pointer;
}

.SignedSignatureAnchor_div__WhPdb > img {
  max-height: 22px;
  max-width: 120px;
}
.UnsignedSignatureAnchor_button__NSWfB {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  color: #083f88;
  font-weight: bold;
  padding: 4px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedSignatureAnchor_buttonRequired__KC2Sr {
  background-color: #F6AE2D;
}

.UnsignedSignatureAnchor_buttonRequired__KC2Sr:hover {
  filter: invert(1);
}

.UnsignedSignatureAnchor_buttonNotRequired__L6iP- {
  background-color: #B7B6C1;
}

.UnsignedSignatureAnchor_buttonNotRequired__L6iP-:hover {
  filter: invert(1);
}

.SignedInitialAnchor_div__kNQBG {
  transform-origin: bottom left;
  cursor: pointer;
}

.SignedInitialAnchor_div__kNQBG > img {
  max-height: 11px;
  max-width: 20px;
}
.UnsignedInitialAnchor_button__lL47n {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  color: #083f88;
  font-weight: bold;
  padding: 4px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedInitialAnchor_buttonRequired__hfPO8 {
  background-color: #F6AE2D;
}

.UnsignedInitialAnchor_buttonRequired__hfPO8:hover {
  filter: invert(1);
}

.UnsignedInitialAnchor_buttonNotRequired__9qnQ2 {
  background-color: #B7B6C1;
}

.UnsignedInitialAnchor_buttonNotRequired__9qnQ2:hover {
  filter: invert(1);
}

.SignedDateAnchor_div__mWDAX {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedDateAnchor_button__-hcYg {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  color: #083f88;
  font-weight: bold;
  padding: 4px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedDateAnchor_buttonRequired__IRLNr {
  background-color: #F6AE2D;
}

.UnsignedDateAnchor_buttonRequired__IRLNr:hover {
  filter: invert(1);
}

.UnsignedDateAnchor_buttonNotRequired__c\+h93 {
  background-color: #B7B6C1;
}

.UnsignedDateAnchor_buttonNotRequired__c\+h93:hover {
  filter: invert(1);
}

.SignedTextAnchor_div__ckEWF {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedTextAnchor_button__K1-EQ {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  color: #083f88;
  font-weight: bold;
  padding: 4px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedTextAnchor_buttonRequired__1LrNL {
  background-color: #F6AE2D;
}

.UnsignedTextAnchor_buttonRequired__1LrNL:hover {
  filter: invert(1);
}

.UnsignedTextAnchor_buttonNotRequired__u\+ovM {
  background-color: #B7B6C1;
}

.UnsignedTextAnchor_buttonNotRequired__u\+ovM:hover {
  filter: invert(1);
}

.SignedTextConstantAnchor_div__SWawg {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedTextConstantAnchor_button__LoklP {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  color: #083f88;
  font-weight: bold;
  padding: 4px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-max-content;
  width: max-content;
  transform-origin: bottom left;
}

.UnsignedTextConstantAnchor_buttonRequired__dme62 {
  background-color: #F6AE2D;
}

.UnsignedTextConstantAnchor_buttonRequired__dme62:hover {
  filter: invert(1);
}

.UnsignedTextConstantAnchor_buttonNotRequired__3HW30 {
  background-color: #B7B6C1;
}

.UnsignedTextConstantAnchor_buttonNotRequired__3HW30:hover {
  filter: invert(1);
}

.TextDropdownAnchor_select__pqa4k {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  cursor: pointer;
  border: none;
  color: #083f88;
  font-weight: bold;
  padding: 4px;
  border-radius: 4px;
  width: -webkit-min-content;
  width: min-content;
  transform-origin: bottom left;
}

.TextDropdownAnchor_selectRequired__vZ\+FM {
  background-color: #F6AE2D;
}

.TextDropdownAnchor_selectRequired__vZ\+FM:hover {
  filter: invert(1);
}

.TextDropdownAnchor_selectNotRequired__EkIfv {
  background-color: #B7B6C1;
}

.TextDropdownAnchor_selectNotRequired__EkIfv:hover {
  filter: invert(1);
}

.PdfReaderWrapper_div__UuvrS {
  display: flex;
  max-width: inherit;
  max-height: inherit;
  position: relative;
  -webkit-clip-path: margin-box;
          clip-path: margin-box;
  overflow: auto;
}

.PdfReader_canvas__X7uIx {
  transform-origin: 0px 0px;
  position: absolute;
  aspect-ratio: var(--docDimensions);
}

.WorkflowTimelineSteps_stepContainer__2VIzG {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  width: 80px;
}

.WorkflowTimelineSteps_iconCircle__-gmpB {
  transition: all 0.4s ease;
  height: 40px;
  width: 40px;
  background-color: var(--peach600);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 10px;
  position: relative;
  cursor: pointer;
}

.WorkflowTimelineSteps_iconCircle__-gmpB::after {
  transition: all 0.4s ease;
  content: "";
  position: absolute;
  transform: translateY(22px);
  width: 0;
  height: 0;
  border-left: var(--borderWidth600) solid transparent;
  border-right: var(--borderWidth600) solid transparent;
  border-top: var(--borderWidth1000) solid var(--peach600);
}

.WorkflowTimelineSteps_inProgressCircle__jqkZ4 {
  background-color: var(--orange900);
  height: 50px;
  width: 50px;
  top: -20px;
}

.WorkflowTimelineSteps_inProgressCircle__jqkZ4 img {
  filter: invert(1);
}

.WorkflowTimelineSteps_inProgressCircle__jqkZ4::after {
  transform: translateY(28px);
  border-top: var(--borderWidth1000) solid var(--orange900);
}

.WorkflowTimelineSteps_inProgressCircle__jqkZ4::before {
  content: "";
  position: absolute;
  bottom: -17px;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 15px;
  background-color: var(--orange900);
}

.WorkflowTimelineSteps_suspendedCircle__CcMpJ {
  background-color: var(--orange060);
}
.WorkflowTimelineSteps_suspendedCircle__CcMpJ::after {
  border-top: var(--borderWidth1000) solid var(--orange060);
}

.WorkflowTimelineSteps_iconCircle__-gmpB img {
  width: 25px;
  height: 25px;
}

.WorkflowTimelineSteps_selectedCircle__YTcab {
  background-color: var(--green600);
}

.WorkflowTimelineSteps_selectedCircle__YTcab::after {
  border-top: var(--borderWidth1000) solid var(--green600);
}

.WorkflowTimelineSteps_timeline__TJW2D{
  transition: all 0.4s ease;
  margin-top: 10px;
  background-color: var(--peach600);
  width: 80px;
  height: 10px;
  position: relative;
}

.WorkflowTimelineSteps_inProgressTimeline__CmpFf{
  margin-top: 0px;
  background-color: var(--orange900);
}

.WorkflowTimelineSteps_selectedTimeline__VrFCe{
  background-color: var(--green600);
  border-radius: 5px;
}

.WorkflowTimelineSteps_number__PwFeC {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--gray900);
}

.WorkflowTimelineSteps_number__PwFeC span {
  transform: translateY(2px);
}

.WorkflowTimelineSteps_timelineHead__IaT5A {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.WorkflowTimelineSteps_timelineTail__Mhzzd {
  background-color: var(--gray060);
  width: 100px;
  height: 10px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  margin-top: 50px;
}

.WorkflowTimelineSteps_lastStepContainer__zgKlQ {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  width: 100px;
  bottom: 19px;
}

.WorkflowTimelineSteps_lastIconCircle__Ky7x7 {
  height: 40px;
  width: 40px;
  background-color: var(--gray060);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 10px;
  position: relative;
}

.WorkflowTimelineSteps_lastIconCircle__Ky7x7::after {
  content: "";
  position: absolute;
  transform: translateY(22px);
  width: 0;
  height: 0;
  border-left: var(--borderWidth600) solid transparent;
  border-right: var(--borderWidth600) solid transparent;
  border-top: var(--borderWidth1000) solid var(--gray060);
}

.WorkflowTimelineSteps_lastTimeline__yXudz{
  margin-top: 10px;
  background-color: var(--gray060);
  width: 100px;
  height: 10px;
  position: relative;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.ScrollingText_scrollContainer__BV2ii {
  white-space: nowrap;
  overflow: hidden;
  max-width: 100%;
  box-sizing: border-box;
  padding-inline: 0.5rem;
  height: 100%;
  position: relative;
  cursor: grab;
  -webkit-user-select: none;
          user-select: none;
}

.ScrollingText_scrollContainer__BV2ii:active {
  cursor: grabbing;
}

.ScrollingText_scrollContent__vB-N\+ {
  display: inline-block;
  white-space: nowrap;
}

.ScrollingText_animateScroll__myjs8 {
  animation: ScrollingText_scrollText__R8CtH 10s linear infinite;
}

.ScrollingText_scrollContainer__BV2ii:hover .ScrollingText_animateScroll__myjs8 {
  animation-play-state: paused;
}

@keyframes ScrollingText_scrollText__R8CtH {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

.langSelectorSwiper .swiper-wrapper {
    justify-content: center !important;
}

.AchPaymentFooter_componentContainer__97Mvx {
  --ach-payment-footer-input-border-radius: 24px;
  --ach-payment-footer-submit-hover: #ec501c;
  --ach-payment-footer-blue: #667eeaa0;
  --ach-payment-footer-purple: #8a57bda0;
  --ach-payment-footer-pink: #f093fba0;
  --ach-payment-footer-gradient: linear-gradient(
    135deg,
    var(--ach-payment-footer-blue) 0%,
    var(--ach-payment-footer-purple) 50%,
    var(--ach-payment-footer-pink) 100%
  );
  --ach-payment-footer-form-gap: 12px;
}

.AchPaymentFooter_componentContainer__97Mvx {
  position: relative;
  width: -webkit-fit-content;
  width: fit-content;
  min-width: 300px;
  max-width: 88vw;
  margin-right: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.AchPaymentFooter_footer__gXjw2 {
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(40px) saturate(200%) brightness(1.1);
  -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(1.1);
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.2);
  border-radius: 24px;
  box-shadow: 
    0 8px 32px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    inset 0 -1px 0 rgba(0, 0, 0, 0.05);
  font-family: 'Poppins', sans-serif !important;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.AchPaymentFooter_footer__gXjw2::before {
  content: '';
  position: absolute;
  top: -100%;
  left: -100%;
  width: 300%;
  height: 300%;
  background: radial-gradient(circle at 20% 30%, rgba(102, 126, 234, 0.9) 0%, transparent 40%),
    radial-gradient(circle at 80% 20%, rgba(167, 113, 221, 0.6) 0%, transparent 35%),
    radial-gradient(circle at 60% 80%, rgba(240, 147, 251, 0.7) 0%, transparent 40%),
    radial-gradient(circle at 30% 70%, rgba(102, 126, 234, 0.4) 0%, transparent 37%),
    radial-gradient(circle at 70% 40%, rgba(172, 117, 228, 0.5) 0%, transparent 41%),
    radial-gradient(circle at 90% 60%, rgba(240, 147, 251, 0.8) 0%, transparent 35%);
  filter: blur(0px);
  z-index: -2;
  animation: AchPaymentFooter_float__sualX 25s linear infinite;
}

.AchPaymentFooter_footer__gXjw2::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 
    radial-gradient(circle at 50% 50%, transparent 30%, rgba(255, 255, 255, 0.02) 70%),
    repeating-conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(255, 255, 255, 0.01) 1deg, transparent 2deg),
    repeating-linear-gradient(0deg, transparent, rgba(255, 255, 255, 0.03) 1px, transparent 2px),
    repeating-linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.03) 1px, transparent 2px);
  opacity: 0.6;
  z-index: 1;
  pointer-events: none;
}

@keyframes AchPaymentFooter_float__sualX {
  0%,
  100% {
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
  25% {
    transform: translate(-30px, -15px) rotate(90deg) scale(1.05);
  }
  50% {
    transform: translate(20px, -20px) rotate(180deg) scale(0.95);
  }
  75% {
    transform: translate(30px, 15px) rotate(270deg) scale(1.02);
  }
}

.AchPaymentFooter_componentContainer__97Mvx[data-desktop='false'] {
  margin-right: 0px;
}

.AchPaymentFooter_secureIcon__SIYTA {
  position: absolute;
  top: -15px;
  left: -15px;
  width: 40px;
  height: 40px;
  background: rgba(59, 196, 63, 0.6);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: var(--borderWidth100) solid rgba(76, 175, 80, 0.8);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  animation: AchPaymentFooter_secureGlow__\+UWBk 3s ease-in-out infinite;
  color: white;
}

@keyframes AchPaymentFooter_secureGlow__\+UWBk {
  0%,
  100% {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  }
  50% {
    box-shadow: 0 12px 40px rgba(76, 175, 80, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.4),
      inset 0 -1px 0 rgba(0, 0, 0, 0.05);
    transform: scale(1.05);
  }
}

.AchPaymentFooter_infoIcon__oRMpM {
  width: 24px;
  height: 24px;
  color: white !important;
  margin-top: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 4px;
}

.AchPaymentFooter_infoIcon__oRMpM:hover {
  color: rgba(255, 255, 255, 0.8) !important;
  transform: scale(1.1);
}

.AchPaymentFooter_infoPopup__IbP-5 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  border-radius: 24px;
  background: rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.AchPaymentFooter_infoPopup__IbP-5[data-closing="false"] {
  animation: AchPaymentFooter_infoPopupOpen__-1Ysa 500ms ease-in-out forwards;
}

.AchPaymentFooter_infoPopup__IbP-5[data-closing="true"] {
  animation: AchPaymentFooter_infoPopupClose__vNUkl 500ms ease-in-out forwards;
}

@keyframes AchPaymentFooter_infoPopupOpen__-1Ysa {
  0% { opacity: 0; -webkit-backdrop-filter: blur(0px); backdrop-filter: blur(0px); }
  100% { opacity: 1; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
}

@keyframes AchPaymentFooter_infoPopupClose__vNUkl {
  0% { opacity: 1; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
  100% { opacity: 0; -webkit-backdrop-filter: blur(0px); backdrop-filter: blur(0px); }
}

.AchPaymentFooter_infoPopupContent__8aCU8 {
  background: rgba(255, 255, 255, 0.1);
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
  padding: 24px;
  max-width: 350px;
  margin: 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.AchPaymentFooter_infoPopupHeader__NxO\+h {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.AchPaymentFooter_infoPopupTitle__A6c5p {
  color: white !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-shadow: 0 2px 8px rgba(75, 39, 130, 0.3);
}

.AchPaymentFooter_closeIcon__Dot3M {
  color: white !important;
  padding: 4px !important;
  transition: all 0.3s ease;
  margin-bottom: 2px;
}

.AchPaymentFooter_closeIcon__Dot3M:hover {
  color: rgba(255, 255, 255, 0.7) !important;
  transform: scale(1.1);
}

.AchPaymentFooter_infoPopupText__ikDKr {
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.5);
}

.AchPaymentFooter_container__\+\+QNJ::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  transition: left 0.5s;
}

.AchPaymentFooter_container__\+\+QNJ:hover::before {
  left: 100%;
}

.AchPaymentFooter_container__\+\+QNJ {
  padding: 24px;
  position: relative;
  overflow: hidden;
}

.AchPaymentFooter_header__SpEHD {
  justify-content: center;
  display: flex;
  gap: 10px;
  margin-bottom: 6px;
}

.AchPaymentFooter_title__sZtWb {
  color: white;
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 8px 0;
  text-shadow: 0 2px 8px rgba(75, 39, 130, 0.3);
}

.AchPaymentFooter_subtitle__nrTht {
  color: rgba(255, 255, 255, 0.95);
  font-size: 14px;
  margin: 0;
  font-weight: 400;
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.7);
}

.AchPaymentFooter_form__tP9IU {
  display: flex;
  flex-direction: column;
  gap: var(--ach-payment-footer-form-gap);
}

.AchPaymentFooter_row__o22hY {
  display: flex;
  gap: var(--ach-payment-footer-form-gap);
  flex-wrap: wrap;
}

.AchPaymentFooter_row__o22hY > * {
  flex: 1 1;
  min-width: 200px;
}

.AchPaymentFooter_label__zPSfQ {
  color: white !important;
  font-size: 16px;
  font-weight: 600;
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.8);
}

/* MUI Label overrides */
.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiInputLabel-root__tB7Nb {
  color: white !important;
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.8) !important;
}

.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiInputLabel-root__tB7Nb.AchPaymentFooter_Mui-focused__sip15 {
  color: white !important;
  text-shadow: 0 1px 6px rgba(75, 39, 130, 0.6) !important;
}

.AchPaymentFooter_input__2qMMu {
  text-shadow: 0 1px 6px rgba(75, 39, 130, 0.6) !important;
  background: rgba(79, 8, 94, 0.15);
  font-size: 16px;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.15);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 4px 16px rgba(0, 0, 0, 0.05);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
  border-radius: var(--ach-payment-footer-input-border-radius);
}

/* MUI TextField overrides for glassmorphism */
.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiOutlinedInput-root__bUHb7 {
  background: rgba(0, 0, 0, 0.2) !important;
  -webkit-backdrop-filter: blur(10px) !important;
          backdrop-filter: blur(10px) !important;
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.25) !important;
  border-radius: var(--ach-payment-footer-input-border-radius) !important;
  overflow: hidden !important;
}

.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiOutlinedInput-root__bUHb7 .AchPaymentFooter_MuiOutlinedInput-notchedOutline__ByZBj {
  border: var(--borderWidth000) !important;
}

.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiOutlinedInput-root__bUHb7:hover {
  background: rgba(0, 0, 0, 0.15) !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
}

.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiOutlinedInput-root__bUHb7.AchPaymentFooter_Mui-focused__sip15 {
  background: rgba(0, 0, 0, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2) !important;
}

.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiInputBase-input__4wRU\+ {
  color: white !important;
  font-weight: 500 !important;
}

.AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiOutlinedInput-input__nTOWL::placeholder {
  color: rgba(255, 255, 255, 0.8);
  opacity: 1;
}

.AchPaymentFooter_input__2qMMu::placeholder {
  color: rgba(255, 255, 255, 0.8);
}

/* Hide the little arrows that come up for number inputs */
.AchPaymentFooter_footer__gXjw2 input[type='number']::-webkit-outer-spin-button,
.AchPaymentFooter_footer__gXjw2 input[type='number']::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.AchPaymentFooter_footer__gXjw2 input[type='number'] {
  -webkit-appearance: textfield;
          appearance: textfield;
  -moz-appearance: textfield;
}

/* Height-constrained screens */
@media (max-height: 730px) {
  .AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiOutlinedInput-root__bUHb7 {
    padding: 2px 6px !important;
  }

  .AchPaymentFooter_input__2qMMu .AchPaymentFooter_MuiInputBase-input__4wRU\+ {
    padding: 2px 0 !important;
  }

  .AchPaymentFooter_accountTypeButton__7zBG3 {
    padding: 2px 6px;
  }

  .AchPaymentFooter_componentContainer__97Mvx {
    --ach-payment-footer-form-gap: 8px;
  }
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .AchPaymentFooter_container__\+\+QNJ {
    padding: 20px 16px;
  }

  .AchPaymentFooter_title__sZtWb {
    font-size: 20px;
  }

  .AchPaymentFooter_subtitle__nrTht {
    font-size: 13px;
  }

  .AchPaymentFooter_row__o22hY > * {
    flex: 1 1 100%;
  }
}

@media (max-width: 480px) {
  .AchPaymentFooter_container__\+\+QNJ {
    padding: 16px 12px;
  }

  .AchPaymentFooter_title__sZtWb {
    font-size: 18px;
  }
}

.AchPaymentFooter_paymentIcon__a3Y4C {
  font-size: 48px;
  margin-bottom: 12px;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));
  animation: AchPaymentFooter_pulse__wmK2U 2s infinite;
}

@keyframes AchPaymentFooter_pulse__wmK2U {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

.AchPaymentFooter_accountTypeSelector__D8EN9 {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.AchPaymentFooter_accountTypeLabel__m2J7A {
  color: white !important;
  font-size: 16px;
  font-weight: 600;
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.8);
}

.AchPaymentFooter_accountTypeButtons__4ZVQi {
  display: flex;
  gap: 12px;
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.5);
  padding: 2px;
  border-radius: 16px;
}

.AchPaymentFooter_accountTypeButton__7zBG3 {
  flex: 1 1;
  padding: 10px 18px;
  background: rgba(0, 0, 0, 0.2);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.25);
  border-radius: 14px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  text-shadow: 0 1px 4px rgba(75, 39, 130, 0.6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 4px 16px rgba(0, 0, 0, 0.05);
}

.AchPaymentFooter_accountTypeButton__7zBG3:hover {
  background: rgba(0, 0, 0, 0.15);
  border-color: rgba(255, 255, 255, 0.4);
  color: white;
  transform: translateY(-1px);
}

.AchPaymentFooter_accountTypeButton__7zBG3.AchPaymentFooter_active__mqwzz {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.5);
  color: white;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 6px 20px rgba(0, 0, 0, 0.1);
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .AchPaymentFooter_footer__gXjw2::before {
    animation: none;
  }
  .AchPaymentFooter_paymentIcon__a3Y4C {
    animation: none;
  }
  .AchPaymentFooter_accountTypeButton__7zBG3 {
    transform: none !important;
  }
}

:root {
  --exchange-primary-cyan: #9bffff;
  --exchange-primary-purple: #8000ff;
  --exchange-primary-yellow: #ffff00;
  --exchange-bg-dark: #0a0a0a;
  --exchange-bg-mid: #1a1a2e;
  --exchange-bg-light: #16213e;
  --exchange-text-white: #fff;
  --exchange-text-cyan: #9affff;
  --exchange-text-gray: #666;
  --exchange-success-green: #00ff00;
  --exchange-success-text: #00ff88;
  --exchange-error-red: #f73d59;
  --exchange-error-details: #ffcccc;
  --exchange-black: #000;
  --exchange-input-gradient: linear-gradient(135deg, rgba(0, 200, 255, 0.4), rgba(255, 0, 255, 0.2));
  --exchange-title-text-gradient: linear-gradient(to right, rgb(133, 255, 243), rgb(175, 174, 255) 60%);
}

.Exchange_componentContainer__dNV\+v {
  margin: 0 auto;
  position: relative;
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);
  background: linear-gradient(135deg, var(--exchange-bg-dark) 0%, var(--exchange-bg-mid) 50%, var(--exchange-bg-light) 100%);
}

.Exchange_formContainer__J8DUM {
  padding: 18px 14px 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  overflow: hidden;
  max-width: 550px;
  margin: 0 auto;
}

.Exchange_componentContainer__dNV\+v::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, rgb(57, 176, 255), rgb(255, 0, 255), rgb(255, 255, 0), rgb(0, 255, 255));
  background-size: 400% 100%;
  animation: Exchange_neonFlow__1dEFJ 3s linear infinite;
}

@keyframes Exchange_neonFlow__1dEFJ {
  0% { background-position: 0% 0%; }
  100% { background-position: 400% 0%; }
}

.Exchange_loaderContainer__4uceC {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 500;
  pointer-events: auto;
}

.Exchange_loader__k16Fy {
  width: 50px;
  height: 50px;
  border: var(--borderWidth300) solid rgba(0, 255, 255, 0.3);
  border-top: var(--borderWidth300) solid #00ffff;
  border-radius: 50%;
  animation: Exchange_loaderSpin__0QJoc 1s linear infinite;
}

@keyframes Exchange_loaderSpin__0QJoc {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.Exchange_header__Qvjin {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 4px;
  position: relative;
  z-index: 2;
}

.Exchange_vestedInfoIcon__hRSrg {
  cursor: pointer;
  font-size: 0.8rem;
  background: rgba(0, 255, 255, 0.1);
  border: var(--borderWidth100) solid rgba(0, 255, 255, 0.3);
  border-radius: 50%;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.Exchange_vestedInfoIcon__hRSrg:hover {
  background: rgba(0, 255, 255, 0.2);
  border-color: rgba(0, 255, 255, 0.6);
  transform: scale(1.1);
}

.Exchange_iconCircle__ye-Yk {
  width: 38px;
  height: 38px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(45deg, #9bffff, #8000ff 70%);
  background: linear-gradient(45deg, var(--exchange-primary-cyan), var(--exchange-primary-purple) 70%);
  box-shadow: 0 0 10px 2px rgba(0, 255, 255, 0.2);
  border-radius: 50%;
  animation: Exchange_iconCirclePulse__YKpT8 2s ease infinite;
}

.Exchange_iconCircle__ye-Yk img {
  bottom: 0;
}

@keyframes Exchange_iconCirclePulse__YKpT8 {
  0% { transform: scale(1); box-shadow: 0 0 10px 2px rgba(0, 255, 255, 0.2); }
  50% { transform: scale(1.05); box-shadow: 0 0 10px 2px rgba(0, 255, 255, 0.4); }
  100% { transform: scale(1); box-shadow: 0 0 10px 2px rgba(0, 255, 255, 0.2); }
}

.Exchange_title__9FOay {
  color: #fff;
  color: var(--exchange-text-white);
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0;
  text-align: center;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}

.Exchange_titleGlow__bowlD {
  background: linear-gradient(to right, rgb(133, 255, 243), rgb(175, 174, 255) 60%);
  background: var(--exchange-title-text-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 20px rgba(0, 255, 255, 0.1);
  animation: Exchange_textGlow__Fj8XB 2s ease-in-out infinite alternate;
}

.Exchange_arrow__3DFZ4 {
  font-size: 1.6rem;
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  text-shadow: 0 0 10px #9bffff;
  text-shadow: 0 0 10px var(--exchange-primary-cyan);
  animation: Exchange_arrowPulse__tmQLq 1.5s ease-in-out infinite;
  margin-left: 4px;
}

@keyframes Exchange_textGlow__Fj8XB {
  0% { text-shadow: 0 0 20px rgba(0, 255, 255, 0.3); }
  100% { text-shadow: 0 0 30px rgba(0, 255, 255, 0.8), 0 0 40px rgba(255, 0, 255, 0.1); }
}

@keyframes Exchange_arrowPulse__tmQLq {
  0%, 100% { transform: scale(1); opacity: 0.8; }
  50% { transform: scale(1.1); opacity: 1; }
}

.Exchange_balanceCards__wIcol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 16px;
  gap: 16px;
  position: relative;
  z-index: 2;
}

.Exchange_balanceCard__lWGmh {
  background: linear-gradient(135deg, rgba(0, 255, 255, 0.1), rgba(255, 0, 255, 0.05));
  border-radius: 14px;
  padding: 12px;
  border: var(--borderWidth100) solid rgba(0, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  overflow: hidden;
}

.Exchange_balanceCard__lWGmh[data-desktop="true"]::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(0, 255, 255, 0.1), transparent);
  transition: left 0.5s;
}

.Exchange_balanceCard__lWGmh[data-desktop="true"]:hover::before {
  left: 100%;
}

.Exchange_balanceCard__lWGmh[data-desktop="true"]:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 
    0 10px 30px rgba(0, 255, 255, 0.3),
    0 0 20px rgba(255, 0, 255, 0.2);
  border-color: rgba(0, 255, 255, 0.6);
}

.Exchange_cardIcon__xAKaA {
  font-size: 1.8rem;
  animation: Exchange_hologramFloat__eJytK 3s ease-in-out infinite;
}

.Exchange_cardIconImg__C2OLd {
  width: 32px;
  filter: drop-shadow(0 0 10px rgba(0, 255, 255, 0.5));
  position: relative;
  bottom: -2px;
}

@keyframes Exchange_hologramFloat__eJytK {
  0%, 100% { transform: translateY(2px) rotateY(0deg); }
  50% { transform: translateY(-2px) rotateY(10deg); }
}

.Exchange_cardContent__iJ-do {
  flex: 1 1;
  min-width: 0;
}

.Exchange_balanceValue__LeudM {
  color: #fff;
  color: var(--exchange-text-white);
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
  text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
  font-family: 'Courier New', monospace;
  word-wrap: break-word;
}

.Exchange_loadingText__pGXo3 {
  color: #666;
  color: var(--exchange-text-gray);
  font-size: 0.9rem;
  font-style: italic;
  margin: 0;
  animation: Exchange_loadingPulse__7s-Lv 1.5s ease-in-out infinite;
}

@keyframes Exchange_loadingPulse__7s-Lv {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 1; }
}

.Exchange_conversionSection__TMjXz {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  z-index: 2;
}

.Exchange_inputSection__GHviB {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.Exchange_inputLabel__Znoch {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  font-weight: 600;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.Exchange_inputIcon__TyME4 {
  font-size: 1.1rem;
  animation: Exchange_iconGlow__0Uuez 2s ease-in-out infinite alternate;
}

@keyframes Exchange_iconGlow__0Uuez {
  0% { filter: drop-shadow(0 0 5px rgba(0, 255, 255, 0.5)); }
  100% { filter: drop-shadow(0 0 15px rgba(0, 255, 255, 0.8)); }
}

.Exchange_amountInputContainer__\+CANB {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(0, 200, 255, 0.4), rgba(255, 0, 255, 0.2));
  background: var(--exchange-input-gradient);
  border-radius: 16px;
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.2);
  margin-bottom: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 2px;
}

.Exchange_amountInput__-SgA0 {
  background: rgba(0, 0, 0, 0.8);
  outline: none;
  border: var(--borderWidth000);
  padding: 12px 16px;
  border-radius: 14px;
  min-width: 100%;
  min-height: 101%;
  font-size: 1rem;
  color: #9affff;
  color: var(--exchange-text-cyan);
  font-weight: 600;
  font-family: 'Courier New', monospace;
  transition: all 0.3s ease;
  text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
}

.Exchange_amountInput__-SgA0:focus {
  background: rgba(0, 0, 0, 0.98);
  box-shadow: inset 0 0 20px rgba(0, 255, 255, 0.1);
}

.Exchange_amountInput__-SgA0::placeholder {
  color: inherit;
  opacity: 0.7;
  font-weight: 400;
}

/* Hide the little arrows that come up for number inputs */
.Exchange_componentContainer__dNV\+v input[type="number"]::-webkit-outer-spin-button,
.Exchange_componentContainer__dNV\+v input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.Exchange_componentContainer__dNV\+v input[type=number] {
  -webkit-appearance: textfield;
          appearance: textfield;
  -moz-appearance: textfield;
}

.Exchange_conversionPreview__\+vCWn {
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.8), rgba(0, 255, 255, 0.05));
  border-radius: 10px;
  padding: 10px 12px;
  border: var(--borderWidth100) solid rgba(0, 255, 255, 0.2);
  box-shadow: inset 0 0 10px rgba(0, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(1px);
          backdrop-filter: blur(1px);
}

.Exchange_loadingPreview__xyo5P {
  color: #666;
  color: var(--exchange-text-gray);
  font-style: italic;
  font-size: 0.9rem;
  animation: Exchange_loadingPulse__7s-Lv 1.5s ease-in-out infinite;
}

.Exchange_previewContent__7PSsQ {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #fff;
  color: var(--exchange-text-white);
  font-weight: 500;
  font-size: 0.85rem;
  font-family: 'Courier New', monospace;
}

.Exchange_previewIcon__1SNk\+ {
  display: block;
  width: 8px;
  height: 8px;
  background: rgba(0, 255, 255, 0.6);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
  animation: Exchange_previewPulse__gI3sQ 2s linear infinite;
  margin-right: 4px;
  filter: blur(2px);
}

@keyframes Exchange_previewPulse__gI3sQ {
  0% { transform: scale(1); }
  50% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

.Exchange_actionSection__gJEaM {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  position: relative;
  z-index: 2;
}

.Exchange_redeemButton__MaunK {
  transition: all 0.3s ease !important;
  position: relative;
  overflow: hidden;
  background: linear-gradient(45deg, rgba(36, 79, 79, 1), rgba(57, 36, 75, 1), rgba(36, 79, 79, 1));
  background-size: 200% 200%;
  font-weight: 700;
  font-size: 1rem;
  padding: 6px 20px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 1px;
  border: var(--borderWidth200) solid rgba(0, 255, 255, 0.5);
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);
  animation: Exchange_buttonPulse__Zr99C 2s ease-in-out infinite;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  color: white;
}

.Exchange_redeemButton__MaunK:disabled {
  color: white;
  opacity: 0.7;
}

.Exchange_redeemButton__MaunK:hover {
  transform: translateY(-1px) scale(1.015);
  box-shadow: 0 0 30px rgba(0, 255, 255, 0.6), 0 0 50px rgba(255, 0, 255, 0.3);
  background-position: 100% 100%;
}

.Exchange_redeemButton__MaunK::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  transition: left 0.5s;
}

.Exchange_redeemButton__MaunK:hover::before {
  left: 100%;
}

@keyframes Exchange_buttonPulse__Zr99C {
  0%, 100% { 
    background-position: 0% 50%;
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.3), inset 0 0 20px rgba(255, 255, 255, 0.1);
  }
  50% { 
    background-position: 100% 50%;
    box-shadow: 0 0 30px rgba(128, 0, 255, 0.4), inset 0 0 20px rgba(255, 255, 255, 0.2);
  }
}

@keyframes Exchange_successIconBounce__lpzBo {
  0%, 20%, 50%, 80%, 100% { transform: translateY(0) rotateZ(0deg); }
  40% { transform: translateY(-10px) rotateZ(10deg); }
  60% { transform: translateY(-5px) rotateZ(-5deg); }
}

.Exchange_assetSelector__ovxVz {
  position: relative;
  z-index: 2;
  margin-bottom: 6px;
}

.Exchange_selectorLabel__ZhrHV {
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.Exchange_assetOptions__PrMkw {
  display: flex;
  gap: 8px;
  background: rgba(0, 0, 0, 0.5);
  padding: 4px;
  border-radius: 20px;
  border: var(--borderWidth100) solid rgba(0, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(1px);
          backdrop-filter: blur(1px);
  overflow-x: auto;
}

.Exchange_assetOption__Dh05z {
  flex: 1 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 14px;
  cursor: pointer;
  transition: all 0.3s ease;
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.5px;
}

.Exchange_assetOptionName__C04\+j {
  text-transform: uppercase;
}

.Exchange_assetOption__Dh05z:hover {
  background: rgba(0, 255, 255, 0.1);
  color: #9bffff;
  color: var(--exchange-primary-cyan);
}

.Exchange_assetOption__Dh05z.Exchange_active__BeTtM {
  background: linear-gradient(45deg, rgba(0, 255, 255, 0.2), rgba(128, 0, 255, 0.1));
  color: #fff;
  color: var(--exchange-text-white);
  box-shadow: 0 0 15px rgba(0, 255, 255, 0.3);
  border: var(--borderWidth100) solid rgba(0, 255, 255, 0.4);
}

.Exchange_assetIcon__oznLO {
  font-size: 1.2rem;
  animation: Exchange_iconFloat__jn0aR 2s ease-in-out infinite alternate;
}

img.Exchange_assetIcon__oznLO {
  width: 24px;
  height: 22px;
}

.Exchange_assetOption__Dh05z.Exchange_active__BeTtM .Exchange_assetIcon__oznLO {
  animation: Exchange_iconGlowActive__O6cBt 2s ease-in-out infinite alternate;
}

@keyframes Exchange_iconFloat__jn0aR {
  0% { transform: translateY(0px); }
  100% { transform: translateY(-2px); }
}

@keyframes Exchange_iconGlowActive__O6cBt {
  0% { 
    transform: translateY(0px) scale(1);
    filter: drop-shadow(0 0 5px rgba(0, 255, 255, 0.5));
  }
  100% { 
    transform: translateY(-2px) scale(1.1);
    filter: drop-shadow(0 0 15px rgba(0, 255, 255, 0.8));
  }
}

.Exchange_basePopup__-e2XJ {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 12px;
  padding: 24px;
  z-index: 1000;
  min-width: 300px;
  max-width: 300px;
  text-align: center;
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
  animation: Exchange_popupShow__K39gN 0.5s ease;
}

@keyframes Exchange_popupShow__K39gN {
  from { 
    opacity: 0; 
    transform: translate(-50%, -50%) scale(0.5);
  }
  to { 
    opacity: 1; 
    transform: translate(-50%, -50%) scale(1);
  }
}

.Exchange_popupIcon__vwUMC {
  font-size: 32px;
  margin-bottom: 16px;
  font-weight: bold;
}

.Exchange_popupTitle__ouUsc {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 16px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.Exchange_popupCloseIcon__wkWXL {
  position: absolute;
  top: 8px;
  right: 12px;
  font-size: 28px;
  cursor: pointer;
  font-weight: bold;
  opacity: 0.7;
  transition: all 0.3s ease;
  line-height: 1;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.Exchange_popupCloseIcon__wkWXL:hover {
  opacity: 1;
  transform: scale(1.1);
}

.Exchange_successPopup__TQVNL {
  background: linear-gradient(135deg, rgba(46, 26, 77, 0.52) 0%, rgba(59, 32, 94, 0.41) 100%);
  border: var(--borderWidth200) solid #8000ff;
  border: var(--borderWidth200) solid var(--exchange-primary-purple);
  box-shadow: 0 8px 32px rgba(132, 0, 255, 0.3);
}

.Exchange_successIcon__LFje7 {
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  animation: Exchange_successIconBounce__lpzBo 1.2s ease;
}

.Exchange_successIcon__LFje7 img {
  width: 40px;
}

.Exchange_successTitle__uF1QC {
  color: #9bffff;
  color: var(--exchange-primary-cyan);
}

.Exchange_successCloseIcon__LUudM {
  color: #9bffff;
  color: var(--exchange-primary-cyan);
}

.Exchange_successCloseIcon__LUudM:hover {
  text-shadow: 0 0 10px #9bffff;
  text-shadow: 0 0 10px var(--exchange-primary-cyan);
}

.Exchange_successDetails__qu5a5 {
  display: flex;
  flex-direction: column;
}

.Exchange_confirmationReceivingTradeRow__G6mKQ {
  border-bottom: none !important;
  margin-bottom: 6px;
}

.Exchange_tradeIcon__VljLf {
  width: 24px;
  height: 24px;
  margin: 0 auto 10px auto;
}

.Exchange_vestedDescription__7mxmi {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  margin-top: 12px;
  line-height: 1.4;
  text-wrap: balance;
}

.Exchange_stillProcessing__j1TdE {
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  line-height: 1.4;
  text-align: center;
}

.Exchange_youMayWait__M5Opw {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.8rem;
  line-height: 1.3;
  text-align: center;
}

.Exchange_tradeRow__jiGLB {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  padding-bottom: 12px;
  gap: 10px;
  width: 100%;
  font-size: 14px;
}

.Exchange_tradeRow__jiGLB:first-of-type {
  border-bottom: var(--borderWidth100) solid rgba(0, 255, 136, 0.2);
}

.Exchange_tradeRow__jiGLB span:first-child {
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  min-width: 80px;
  max-width: 150px;
  display: inline-block;
  text-align: left;
}

.Exchange_tradeRow__jiGLB span:last-child {
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  font-weight: bold;
  text-align: right;
  max-width: 130px;
  display: inline-block;
  word-wrap: break-word;
}

.Exchange_errorPopup__-1aaB {
  background: linear-gradient(135deg, rgba(77, 26, 26, 0.52) 0%, rgba(94, 32, 32, 0.41) 100%);
  border: var(--borderWidth200) solid #f73d59;
  border: var(--borderWidth200) solid var(--exchange-error-red);
  box-shadow: 0 8px 32px rgba(255, 0, 64, 0.3);
}

.Exchange_errorIcon__dMKcO {
  color: #f73d59;
  color: var(--exchange-error-red);
  animation: Exchange_errorShake__1S1Y0 1.2s ease;
  font-size: 26px;
}

@keyframes Exchange_errorShake__1S1Y0 {
  0%, 100% { transform: translateX(0); }
  10% { transform: translateX(-6px); }
  20% { transform: translateX(6px); }
  30% { transform: translateX(-6px); }
  40% { transform: translateX(6px); }
  50% { transform: translateX(0); }
}

.Exchange_errorTitle__piaqh {
  color: #f73d59;
  color: var(--exchange-error-red);
}

.Exchange_errorCloseIcon__TffzF {
  color: #f73d59;
  color: var(--exchange-error-red);
}

.Exchange_errorCloseIcon__TffzF:hover {
  text-shadow: 0 0 10px #f73d59;
  text-shadow: 0 0 10px var(--exchange-error-red);
}

.Exchange_errorDetails__vHu6d {
  color: #ffcccc;
  color: var(--exchange-error-details);
  line-height: 1.4;
}

.Exchange_accessPinError__bXbS3 {
  margin-top: 16px;
  line-height: 1.2;
  border: var(--borderWidth100) solid #f73d59;
  border: var(--borderWidth100) solid var(--exchange-error-red);
  border-radius: 12px;
  padding: 6px 4px;
  font-size: 15px;
}

.Exchange_accessPinLoading__Prhse {
  margin-top: 16px;
  color: rgba(255, 255, 255, 0.6);
  font-style: italic;
  text-align: center;
}

.Exchange_enterAccessPin__TGJE\+ {
  font-size: 15px;
}

.Exchange_accessPinInput__KnD6z {
  width: 100%;
  padding: 12px;
  border-radius: 8px;
  border: var(--borderWidth100) solid rgba(0, 255, 255, 0.3);
  background: rgba(0, 0, 0, 0.8);
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  font-size: 16px;
  text-align: center;
  letter-spacing: 2px;
  margin: 16px auto;
}

.Exchange_confirmAccessPinBtn__RiEs2 {
  width: 100%;
  background: linear-gradient(45deg, rgba(36, 79, 79, 1), rgba(57, 36, 75, 1));
  color: white;
  font-weight: bold;
  position: relative;
  overflow: hidden;
}

.Exchange_confirmAccessPinBtn__RiEs2:disabled {
  opacity: 0.7;
}

.Exchange_confirmAccessPinBtn__RiEs2:hover {
  transform: translateY(-1px) scale(1.015);
  box-shadow: 0 0 30px rgba(36, 79, 79, 1), 0 0 50px rgba(57, 36, 75, 1);
  background-position: 100% 100%;
}

.Exchange_confirmAccessPinBtn__RiEs2::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  transition: left 0.5s;
}

.Exchange_confirmAccessPinBtn__RiEs2:hover::before {
  left: 100%;
}

/* Fee confirmation styles */
.Exchange_feeDescription__EE0pi {
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  line-height: 1.4;
  text-align: center;
  text-wrap: balance;
}

.Exchange_feeAmount__Kf6fz {
  margin-bottom: 16px;
  color: #9bffff;
  color: var(--exchange-primary-cyan);
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
}

.Exchange_feeDisclaimer__rRWJ2 {
  margin-bottom: 20px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.8rem;
  line-height: 1.3;
  text-align: center;
}

.Exchange_feeButtons__RdBPy {
  display: flex;
  gap: 10px;
}

.Exchange_feeCancelButton__1oQGJ {
  flex: 1 1;
  border-color: rgba(255, 255, 255, 0.3) !important;
  color: white !important;
}

.Exchange_feeConfirmButton__\+0mPb {
  flex: 1 1;
  background: linear-gradient(45deg, rgba(36, 79, 79, 1), rgba(57, 36, 75, 1)) !important;
  color: white !important;
  font-weight: bold !important;
}

/* Mobile-specific styling */
@media screen and (max-width: 480px) {
  .Exchange_balanceCards__wIcol {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .Exchange_balanceCard__lWGmh {
    padding: 2px 2px 2px 8px;
    gap: 20px;
  }
}

@media screen and (max-height: 730px) {
  .Exchange_componentContainer__dNV\+v {
    padding: 0;
  }

  .Exchange_balanceValue__LeudM {
    font-size: 0.85rem;
  }
  
  .Exchange_formContainer__J8DUM {
    padding: 10px 20px 8px 20px;
  }

  .Exchange_formContainer__J8DUM, .Exchange_conversionSection__TMjXz {
    gap: 10px;
  }

  .Exchange_iconCircle__ye-Yk {
    width: 26px;
    height: 26px;
  }

  .Exchange_iconCircle__ye-Yk img {
    width: 20px;
  }

  .Exchange_cardIconImg__C2OLd {
    width: 20px;
    bottom: 0;
  }
  
  .Exchange_title__9FOay {
    font-size: 1.2rem;
  }

  .Exchange_selectorLabel__ZhrHV, .Exchange_inputLabel__Znoch {
    font-size: 0.8rem;
  }

  .Exchange_assetOptions__PrMkw {
    padding: 2px 4px;
  }
  
  .Exchange_assetOption__Dh05z {
    padding: 3px 6px;
    gap: 4px;
  }

  .Exchange_assetOption__Dh05z span {
    font-size: 0.7rem;
  }
  
  .Exchange_assetIcon__oznLO {
    font-size: 1rem;
  }

  .Exchange_redeemButton__MaunK {
    font-size: 0.9rem;
    border-radius: 16px;
  }

  .Exchange_errorIcon__dMKcO {
    font-size: 22px;
  }

  .Exchange_errorMessage__luMIs {
    font-size: 14px;
  }

  .Exchange_errorMessage__luMIs {
    padding: 6px;
  }

  @keyframes Exchange_hologramFloat__eJytK {
    0%, 100% { transform: translateY(-2px) rotateY(0deg); }
    50% { transform: translateY(0px) rotateY(10deg); }
  }
}

.rainbowWrapper {
  box-sizing: border-box;
  font-family: inherit;
  margin: 0;
  text-transform: none;
  position: relative;
  display: inline-flex;
  height: 2.75rem;
  animation: rainbow 2s infinite linear;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  white-space: nowrap;
  background-color: hsl(240, 6%, 11%);
  background-image: linear-gradient(var(--primaryBackground), var(--primaryBackground)),
    linear-gradient(90deg,
      hsl(0, 98%, 64%),
      hsl(92, 98%, 62%),
      hsl(208, 98%, 64%),
      hsl(196, 99%, 62%),
      hsl(268, 98%, 62%));
  background-size: 200%;
  font-size: .875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: hsl(0 0% 98%);
  box-shadow:
    0 0 #0000,
    0 0 #0000,
    0 1px 3px 0 rgba(0, 0, 0, 0.12),
    0 1px 2px -1px rgba(0, 0, 0, 0.12);
  transition-duration: .15s;
  transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-timing-function: cubic-bezier(0.42, 0, 0.22, 1);
  background-clip: padding-box, border-box, border-box;
  background-origin: border-box;
  border: var(--borderWidth100) solid transparent;
}

.rainbowWrapper:hover {
  background-color: rgba(240 5.9% 10%, 0.9);
  /* Equivalent to hover:bg-primary/90 */
}

.rainbowWrapper:focus-visible {
  outline: none;
  ring: 1px solid;
  ring-color: 240 5% 64.9%;
  /* focus-visible:ring-ring */
}

/* Animation for "animate-rainbow" */
.rainbowWrapper {
  animation: rainbow 3s linear infinite;
}

@keyframes rainbow {
  0% {
    background-position: 0%;
  }

  100% {
    background-position: 200%;
  }
}

.rainbowWrapper::before {
  content: "";
  position: absolute;
  z-index: 0;
  height: 100%;
  width: 100%;
  animation: rainbow 2s linear infinite;
  background: linear-gradient(90deg,
      rgb(255, 70, 70),
      rgb(158, 255, 70),
      rgb(70, 158, 255),
      rgb(70, 205, 250),
      rgb(165, 70, 255));
  background-size: 200%;
  filter: blur(5.5px);
  cursor: inherit;
  display: block;
  border-radius: inherit;
}

.WalletGridBackground_grid__GyJIf {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image:
    linear-gradient(rgba(55, 49, 206, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55, 49, 206, 0.08) 1px, transparent 1px);
  background-size: 20px 20px;
  pointer-events: none;
}

.WalletGridBackground_scanlines__Mjrr1 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    transparent 50%,
    rgba(0, 8, 80, 0.05) 50%
  );
  background-size: 100% 4px;
  pointer-events: none;
  animation: WalletGridBackground_scanlineMove__APwFW 2s linear infinite;
}

@keyframes WalletGridBackground_scanlineMove__APwFW {
  0% { background-position: 0 0; }
  100% { background-position: 0 20px; }
}

.styles_SingleItem__-m5dF {
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: all 0.3s ease;
  align-items: center;
  border-radius: 8px;
  padding: 6px;
}

.styles_SingleItemParagraph__f8ycA {
  font-family: 'Poppins';
  color: var(--peach900);
  text-align: center;
  overflow-wrap: break-word;
  word-wrap: break-word;
  white-space: normal;
  max-width: 100%;
  margin-top: 5px;
  margin-left: 0px;
  line-height: 1.3;
  padding-bottom: 2px;
}

.styles_footerPartBaseClass__732MQ {
  background-color: white;
  position: absolute;
  left: 10px;
  bottom: 1px;
  border-radius: 15px;
  padding-right: 6px;
  padding-left: 6px;
  display: flex;
  justify-content: start;
  flex-direction: column;
  transition: all 0.5s ease-in-out !important;
  border: var(--borderWidth100) solid var(--primaryMain);
}

.styles_footerPartBaseClassWhileDragging__zNZnK {
  background-color: white;
  position: absolute;
  left: 10px;
  bottom: 1px;
  border-radius: 15px;
  padding-right: 6px;
  padding-left: 6px;
  display: flex;
  justify-content: start;
  flex-direction: column;
  transition: all 0s !important;
  border: var(--borderWidth100) solid var(--primaryMain);
}

.styles_footerPartBaseClassNoTransition__aVc35 {
  width: 97%;
  background-color: white;
  position: absolute;
  left: 1.5%;
  bottom: 4px;
  border-radius: 15px;
  padding-right: 6px;
  padding-left: 6px;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.styles_backgroundGradient__zoB1I {
  background: radial-gradient(circle at 90% 45%, var(--appsMenuBackgroundOrbsBlue) 2%, transparent 10%),
              radial-gradient(circle at 5% 60%, var(--appsMenuBackgroundOrbsOrange) 2%, transparent 10%),
              radial-gradient(circle at 95% 45%, var(--appsMenuBackgroundOrbsCyan) 2%, transparent 10%),
              radial-gradient(circle at 2% 75%, var(--appsMenuBackgroundOrbsPurple) 2%, transparent 10%),
              radial-gradient(circle at 35% 65%, var(--appsMenuBackgroundOrbsPurpleDim) 2%, transparent 10%),
              radial-gradient(circle at 65% 50%, var(--appsMenuBackgroundOrbsPurpleDim) 2%, transparent 10%),
              radial-gradient(circle at 75% 45%, var(--appsMenuBackgroundOrbsBlue) 2%, transparent 10%),
              radial-gradient(circle at 10% 75%, var(--appsMenuBackgroundOrbsOrange) 2%, transparent 10%),
              radial-gradient(circle at 85% 69%, var(--appsMenuBackgroundOrbsCyan) 2%, transparent 10%),
              radial-gradient(circle at 15% 80%, var(--appsMenuBackgroundOrbsPurple) 2%, transparent 10%),
              radial-gradient(circle at 45% 60%, var(--appsMenuBackgroundOrbsPurpleDim) 2%, transparent 10%),
              radial-gradient(circle at 55% 45%, var(--appsMenuBackgroundOrbsPurpleDim) 2%, transparent 10%);
  background-size: 300% 100%;
  background-blend-mode: screen;
  animation: styles_moveGradient__bkoXk 15s ease-in-out infinite alternate;
  z-index: 1;
}

.styles_scrollable__0XT0O {
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: none;
  -webkit-overflow-scrolling: touch;
  /* scrollbar-width: thin; */
}

/* Scrollbar styling applied globally in index.css */
/* .scrollable::-webkit-scrollbar {
  width: 0.4em;
}

.scrollable::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px var(--shadow000);
  -webkit-box-shadow: inset 0 0 6px var(--shadow000);
}

.scrollable::-webkit-scrollbar-thumb {
  background-color: var(--shadow110);
  outline: 1px solid slategrey;
  border-radius: 0.2em;
} */

@keyframes styles_moveGradient__bkoXk {
  from {
    background-position: 0% 50%;
  }
  to {
    background-position: 100% 50%;
  }
}

/* Role Indicator Badge Styles */

.RoleIndicatorBadge_badgeContainer__w\+skU {
  position: absolute;
  top: 2px;
  right: 2px;
  z-index: 10;
  background: var(--appsMenuRoleIndicatorBadgeBackground);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  border-radius: 8px;
  padding: 2px 4px;
  display: flex;
  align-items: center;
  gap: 2px;
  box-shadow: 0 2px 6px var(--appsMenuRoleIndicatorBadgeShadowMedium);
  animation: RoleIndicatorBadge_fadeIn__NHzA5 0.2s ease-out;
}

@keyframes RoleIndicatorBadge_fadeIn__NHzA5 {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.RoleIndicatorBadge_roleRow__l0IOU {
  display: flex;
  align-items: center;
  gap: 2px;
}

.RoleIndicatorBadge_roleEmoji__GQ9cT {
  font-size: 14px;
  line-height: 1;
  display: inline-block;
  filter: drop-shadow(0 1px 2px var(--appsMenuRoleIndicatorBadgeIconShadow));
  transition: transform 0.2s ease;
}

.RoleIndicatorBadge_roleEmoji__GQ9cT:hover {
  transform: scale(1.3);
}

.RoleIndicatorBadge_roleEmojiBlacklisted__kfOTq {
  opacity: 0.5;
  position: relative;
}

.RoleIndicatorBadge_roleEmojiBlacklisted__kfOTq::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 2px;
  background: var(--appsMenuRoleIndicatorBadgeErrorBackground);
  transform: translate(-50%, -50%) rotate(-45deg);
  box-shadow: 0 0 4px var(--appsMenuRoleIndicatorBadgeErrorShadow);
}

.RoleIndicatorBadge_exceptText__2tdgg {
  font-size: 9px;
  color: var(--appsMenuRoleIndicatorBadgeTextMuted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0 2px;
}

.RoleIndicatorBadge_moreCount__yXMdM {
  font-size: 10px;
  font-weight: 700;
  color: var(--appsMenuRoleIndicatorBadgeTextBright);
  background: var(--appsMenuRoleIndicatorBadgeHoverBackground);
  border-radius: 4px;
  padding: 1px 3px;
  margin-left: 2px;
}

/* Mobile responsive */
@media (max-width: 768px) {
  .RoleIndicatorBadge_badgeContainer__w\+skU {
    padding: 1px 3px;
  }
  
  .RoleIndicatorBadge_roleEmoji__GQ9cT {
    font-size: 12px;
  }
  
  .RoleIndicatorBadge_exceptText__2tdgg {
    font-size: 8px;
  }
  
  .RoleIndicatorBadge_moreCount__yXMdM {
    font-size: 9px;
  }
}

/* Folder-specific styling (larger) */
.RoleIndicatorBadge_badgeContainer__w\+skU.RoleIndicatorBadge_folderBadge__T9TP5 {
  top: 4px;
  right: 4px;
  padding: 3px 6px;
  border-radius: 10px;
}

.RoleIndicatorBadge_badgeContainer__w\+skU.RoleIndicatorBadge_folderBadge__T9TP5 .RoleIndicatorBadge_roleEmoji__GQ9cT {
  font-size: 16px;
}

.RoleIndicatorBadge_badgeContainer__w\+skU.RoleIndicatorBadge_folderBadge__T9TP5 .RoleIndicatorBadge_exceptText__2tdgg {
  font-size: 10px;
}

.RoleIndicatorBadge_badgeContainer__w\+skU.RoleIndicatorBadge_folderBadge__T9TP5 .RoleIndicatorBadge_moreCount__yXMdM {
  font-size: 11px;
}

/* Container for folder - simple wrapper */
.CategoryFolderItem_folderContainer__DybBr {
    width: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
}

/* Hide count badges when SHOW_COUNT_BADGES is false */
.CategoryFolderItem_countBadge__U\+b4i,
.CategoryFolderItem_countBadgeMobile__QEq5y {
    display: none !important;
}

/* When folder is expanded, overlay the entire menu area (Android-style) */
.CategoryFolderItem_folderContainerExpanded__oF5Uf {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color: transparent;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 8px 20px 20px 20px; /* Reduced top padding from 20px to 8px */
    animation: CategoryFolderItem_fadeIn__OT5JR 0.2s ease-in-out;
    pointer-events: none; /* Allow clicks to pass through to elements below */
}

.CategoryFolderItem_folderContainerExpanded__oF5Uf > div 
{
    position: relative;
    width: 100%;
    pointer-events: auto; /* Re-enable pointer events for the actual folder content */
}

@keyframes CategoryFolderItem_fadeIn__OT5JR {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Android-style foldout area - contains the preview grid and app tiles */
.CategoryFolderItem_foldoutArea__CRtpy {
    position: relative;
    width: 150px;
    height: 150px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0;
    background-color: transparent;
    border-radius: 8px;
    border: none;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    margin: 0 auto; /* Ensure folder is centered within its container */
}

.CategoryFolderItem_foldoutAreaExpanded__8RQBQ {
    width: calc(100% - 40px); /* Full width minus padding for alignment with grid */
    max-width: 1200px;
    height: auto;
    max-height: 80vh;
    overflow: hidden; /* Parent doesn't scroll - only the apps list scrolls */
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 24px 0px; /* Only top/bottom padding, no side padding so scrollbar is at edge */
    background-color: var(--appsMenuFolderExpandedBackground);
    border-radius: 20px;
    border: 1px solid var(--appsMenuFolderExpandedBorder);
    box-shadow: 0 8px 32px var(--appsMenuFolderExpandedShadow);
    cursor: default;
    animation: CategoryFolderItem_scaleIn__7Zi8c 0.25s ease-out;
    margin: 0 auto; /* Center the expanded folder */
    box-sizing: border-box;
}

@keyframes CategoryFolderItem_scaleIn__7Zi8c {
    from {
        transform: scale(0.9);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

@media (max-width: 768px) {
    .CategoryFolderItem_foldoutArea__CRtpy {
        width: 125px;
        height: 125px;
        margin: 0 auto; /* Ensure folder is centered within its container on mobile */
    }
    
    .CategoryFolderItem_foldoutAreaExpanded__8RQBQ {
        width: 95%;
        max-width: none;
        height: auto;
        max-height: 75vh;
        padding: 16px 0px; /* Only top/bottom padding, no side padding so scrollbar is at edge */
        box-sizing: border-box;
    }
    
    .CategoryFolderItem_folderInfoOverlayExpanded__K0IAw {
        bottom: 4px;
        left: 0;
        right: 0;
        padding: 6px 28px; /* Match the expanded folder padding on mobile */
    }
}

/* Folder tile - just the preview grid when collapsed */
.CategoryFolderItem_folderTile__7zPWD {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    max-height: 100%;
    justify-content: center; /* Center content instead of space-between */
    align-items: center;
    gap: 4px; /* Small gap between preview and text */
    padding: 8px;
    padding-top: 10px;
    padding-bottom: 6px;
    overflow: visible;
}

.CategoryFolderItem_folderTileHidden__DHscL {
    display: none;
}

/* Floating folder info overlay - appears on top when expanded */
.CategoryFolderItem_folderInfoOverlay__c52qZ {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 0;
    background-color: transparent;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    z-index: 1;
}

.CategoryFolderItem_folderInfoOverlayExpanded__K0IAw {
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
    z-index: 10;
    padding: 8px 32px; /* Match the expanded folder padding */
    background-color: transparent;
    border-radius: 0;
    -webkit-backdrop-filter: none;
            backdrop-filter: none;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
}

/* Position folder info at top when FOLDER_NAME_AT_TOP is true */
.CategoryFolderItem_folderInfoAtTop__kahrL {
    bottom: auto;
    top: 8px;
}

/* Row container for folder name and close button (inline) */
.CategoryFolderItem_folderNameRow__GoY4R {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

/* Row container for folder name and close button (spaced apart) */
.CategoryFolderItem_folderNameRowSpaced__OfHw9 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 20px;
}

/* Close button for expanded folder */
.CategoryFolderItem_closeButton__c8Zj2 {
    width: 28px;
    height: 28px;
    min-width: 28px;
    min-height: 28px;
    border-radius: 50%;
    /* background-color: var(--appsMenuCloseButtonBackground); */
    color: var(--appsMenuCloseButtonText);
    /* border: 2px solid var(--appsMenuCloseButtonBorder); */
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    /* box-shadow: 0 2px 8px var(--appsMenuCloseButtonShadowLight); */
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
}

.CategoryFolderItem_closeButton__c8Zj2:hover {
    /* background-color: var(--appsMenuCloseButtonBackgroundHover); */
    transform: scale(1.1);
    /* box-shadow: 0 4px 12px var(--appsMenuCloseButtonShadowMedium); */
}

.CategoryFolderItem_closeButton__c8Zj2:active {
    transform: scale(0.95);
}

@media (max-width: 768px) {
    .CategoryFolderItem_closeButton__c8Zj2 {
        width: 32px;
        height: 32px;
        min-width: 32px;
        min-height: 32px;
        font-size: 1.1rem;
    }
}

/* Mini grid preview of apps inside folder - video game inventory style */
.CategoryFolderItem_previewGrid__V9tz2 {
    width: 100px; /* Reduced from 118px to give more room for text */
    height: 100px;
    min-height: 100px;
    min-width: 100px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-gap: 4px;
    gap: 4px;
    padding: 6px;
    background-color: var(--appsMenuFolderPreviewGridBackground);
    box-shadow: 0 1px 3px var(--appsMenuFolderPreviewGridShadowLight);
    border-radius: 8px;
    border: none;
    position: relative;
    flex-shrink: 0;
    margin: 0 auto; /* Center the preview grid */
}

.CategoryFolderItem_previewGridMobile__XIlHp {
    width: 70px; /* Balanced preview grid size */
    height: 70px;
    min-height: 70px;
    min-width: 70px;
    gap: 3px;
    padding: 5px;
}

.CategoryFolderItem_previewAppIcon__OiAin {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--appsMenuFolderPreviewGridIconBackground);
    /* box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); */
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    aspect-ratio: 1;
}

.CategoryFolderItem_previewAppIconEmpty__dJQ3K {
    opacity: 0.3;
}

.CategoryFolderItem_previewAppIconImg__Ci7p6 {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

/* Video game style count badge - appears on top right of preview grid */
.CategoryFolderItem_countBadge__U\+b4i {
    position: absolute;
    top: -8px;
    right: -8px;
    min-width: 28px;
    height: 28px;
    padding: 0 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--appsMenuFolderCountBadgeBackground);
    color: white;
    border-radius: 14px;
    font-size: 0.85rem;
    font-weight: 700;
    z-index: 5;
    border: 2px solid white;
    box-shadow: 0 2px 4px var(--appsMenuFolderCountBadgeShadowMedium);
}

.CategoryFolderItem_countBadgeMobile__QEq5y {
    font-size: 0.75rem;
    min-width: 24px;
    height: 24px;
    top: -6px;
    right: -6px;
}

.CategoryFolderItem_previewMoreIndicator__P2i9B {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--appsMenuFolderMoreIndicatorBackground);
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--appsMenuFolderMoreIndicatorText);
}

.CategoryFolderItem_previewMoreIndicatorMobile__jy-X- {
    font-size: 0.65rem;
}

/* Small preview grid in overlay when expanded */
.CategoryFolderItem_previewGridSmall__bdpDk {
    width: 40px;
    height: 40px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-gap: 2px;
    gap: 2px;
    padding: 3px;
    background-color: var(--appsMenuFolderPreviewSmallBackground);
    border-radius: 6px;
    border: none;
    flex-shrink: 0;
}

.CategoryFolderItem_previewAppIconSmall__njQAz {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--appsMenuFolderPreviewSmallIconBackground);
    border-radius: 3px;
    overflow: hidden;
}

.CategoryFolderItem_previewAppIconImgSmall__6TK1- {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

/* Folder info container */
.CategoryFolderItem_folderInfo__TPFPp {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1 1;
    min-width: 0;
}

/* Folder name - appears BELOW the preview grid when collapsed */
.CategoryFolderItem_folderName__NslyD {
    margin: 0;
    margin-top: 2px;
    width: 100%;
    max-width: 150px;
    text-align: center;
    word-wrap: break-word;
    overflow: visible; /* Allow text to show fully on desktop */
    text-overflow: ellipsis;
    white-space: normal; /* Allow wrapping on desktop */
    color: var(--peach900);
    font-weight: 400;
    line-height: 1.2; /* Slightly increased for better spacing */
    font-size: 0.8rem; /* Match regular apps on desktop */
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Maximum 2 lines on desktop */
    line-clamp: 2; /* Standard property for compatibility */
    -webkit-box-orient: vertical;
}

.CategoryFolderItem_folderNameMobile__XTTnG {
    font-size: 0.9rem; /* Match regular apps on mobile */
    max-width: 125px;
    line-height: 1.1; /* Very tight line height for compact multiline text */
    margin-top: 0; /* Remove extra margin on mobile to prevent cutoff */
    white-space: normal; /* Allow wrapping on mobile */
    overflow: visible; /* Allow text to overflow and show fully */
    text-overflow: ellipsis; /* Show ellipsis after 2 lines if text is still too long */
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Maximum 2 lines on mobile */
    line-clamp: 2; /* Standard property for compatibility */
    -webkit-box-orient: vertical;
}

.CategoryFolderItem_folderNameExpanded__8GNAv {
    margin-top: 0;
    text-align: center;
    white-space: nowrap; /* Keep text on one line */
    display: block;
    width: 100%; /* Ensure it takes full width for proper centering */
    max-width: none; /* Remove max-width restriction to allow full width */
    -webkit-line-clamp: unset;
    line-clamp: initial;
    -webkit-box-orient: unset;
    font-weight: 700;
    font-size: 1rem;
    overflow: visible; /* Allow full text to show */
}

.CategoryFolderItem_folderNameExpandedMobile__irELj {
    font-size: 1.1rem;
}

/* App count - hidden when collapsed (shown as badge instead) */
.CategoryFolderItem_appCount__nTiT\+ {
    display: none;
}

.CategoryFolderItem_appCountMobile__wdHp- {
    display: none;
}

.CategoryFolderItem_appCountExpanded__lJ4Ix {
    display: none; /* Hide app count in expanded view */
    font-size: 0.7rem;
    color: var(--peach600);
    margin: 0;
    margin-top: 4px;
    text-align: center;
    font-weight: 500;
}

.CategoryFolderItem_appCountExpandedMobile__WRSza {
    font-size: 0.75rem;
}

/* Empty message */
.CategoryFolderItem_emptyMessage__YTNzb {
    font-family: Poppins, sans-serif;
    font-size: 0.85rem;
    color: var(--peach600);
    font-style: italic;
    padding: 12px;
    text-align: center;
    width: 100%;
    grid-column: 1 / -1;
    margin-top: 0;
    margin-bottom: 40px;
}

/* Scrollable apps container inside expanded folder */
.CategoryFolderItem_folderAppsList__BNy3H {
    width: 100%;
    height: 100%;
    flex: 1 1;
    overflow-y: auto;
    overflow-x: hidden;
    display: grid;
    grid-template-columns: repeat(auto-fit, 150px);
    grid-gap: 12px;
    gap: 12px;
    place-content: start center;
    align-items: start;
    margin-bottom: 40px; /* Reserve space for the fixed folder name at bottom */
    padding-right: 20px; /* Right padding so content doesn't go under scrollbar */
    box-sizing: border-box;
}

/* When folder name is at top, adjust margins accordingly */
.CategoryFolderItem_folderAppsListNameAtTop__duSC6 {
    margin-top: 40px; /* Reserve space for the fixed folder name at top */
    margin-bottom: 0; /* Remove bottom margin */
}

@media (max-width: 768px) {
    .CategoryFolderItem_folderAppsList__BNy3H {
        grid-template-columns: repeat(auto-fill, 125px);
        gap: 10px;
        justify-content: center;
        padding-right: 16px; /* Smaller right padding on mobile */
    }
    
    .CategoryFolderItem_folderAppsListNameAtTop__duSC6 {
        margin-top: 60px; /* More space on mobile for the folder name at top */
        margin-bottom: 0;
        padding-bottom: 0;
    }
}

/* App wrapper in expanded folder view */
.CategoryFolderItem_expandedAppWrapper__XOEpg {
    position: relative;
    width: 150px;
    height: 150px;
    min-width: 150px;
    min-height: 150px;
    max-width: 150px;
    max-height: 150px;
    aspect-ratio: 1;
    flex-shrink: 0;
    flex-grow: 0;
    flex-basis: 150px;
    box-sizing: border-box;
    overflow: visible;
}

@media (max-width: 768px) {
    .CategoryFolderItem_expandedAppWrapper__XOEpg {
        width: 125px;
        height: 125px;
        min-width: 125px;
        min-height: 125px;
        max-width: 125px;
        max-height: 125px;
        flex-basis: 125px;
    }
}

/* Helper classes */
.CategoryFolderItem_iconPlaceholder__RU--g {
    font-size: 0.6rem;
    color: var(--peach500);
}

.CategoryFolderItem_iconPlaceholderSmall__yqvy9 {
    font-size: 0.45rem;
    color: var(--peach500);
}

.CategoryFolderItem_previewAppIconEmpty__dJQ3K {
    opacity: 0.3;
}

/* OptionsList.module.css */
/* 
 * Styles for the OptionsList component
 * This file contains CSS classes for the grid layout and list items
 * Note: Some dynamic styles (like gap value) remain inline in the component
 * Note: flexRelatedStyles prop for child components still uses Styles object in JS
 */

/* Grid container for combined menu items (folders and apps) */
.OptionsList_appMenuGridContainer__-hZ4S {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 100%; /* Fill parent height */
    box-sizing: border-box;
    overflow-y: auto; /* Scrolling happens here */
    overflow-x: hidden;
    justify-content: center;
    align-content: flex-start; /* Align content to top */
    margin: 0 auto;
}

/* Override MUI Grow wrapper to work with flex */
.OptionsList_appMenuGridContainer__-hZ4S > * {
    flex: 0 0 auto;
}

/* Mobile version */
@media (max-width: 768px) {
    .OptionsList_appMenuGridContainer__-hZ4S {
        grid-template-columns: repeat(auto-fit, 125px);
    }
}

/* Single list item - desktop */
.OptionsList_singleListItem__piBh5 {
    position: relative;
    aspect-ratio: 1;
    min-height: 150px;
    min-width: 150px;
    height: 150px;
    width: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Single list item - mobile */
.OptionsList_singleListItemMobile__9envM {
    position: relative;
    aspect-ratio: 1;
    min-height: 125px;
    min-width: 125px;
    height: 125px;
    width: 125px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Folder wrapper styling */
.OptionsList_folderWrapper__CWEJy {
    opacity: 1;
    pointer-events: auto;
    transition: opacity 0.3s ease;
}

.OptionsList_folderWrapperExpanded__Qgiia {
    opacity: 0;
    pointer-events: none;
}

/**
 * Swiper 9.4.1
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2023 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 13, 2023
 */

@font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper,swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:initial;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide,swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{-webkit-margin-start:var(--swiper-centered-offset-before);margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{-webkit-margin-before:var(--swiper-centered-offset-before);margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid #007aff;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.Styles_animatingArrow__VXfZA {
  animation: Styles_AnimateArrow__va-qA ease 300ms;
}

@keyframes Styles_AnimateArrow__va-qA {
  0% {
    transform: none;
    opacity: 1;
  }

  50% {
    transform: translateY(25%) scale(0.5);
    opacity: 0;
  }

  51% {
    transform: translateY(-25%) scale(0.5);
    opacity: 0;
  }

  100% {
    transform: none;
    opacity: 1;
  }
}

.Styles_container__e45Wz {
  width: -webkit-fit-content;
  width: fit-content;
  position: relative;
  margin: auto;
  background-color: var(--blue995);
  display: flex;
  justify-content: center;
  align-items: stretch;
  border-radius: 15px 15px 0 0;
  transition: all 125ms ease-in-out;
}

.Styles_container__e45Wz::before {
  position: absolute;
  left: -0.5rem;
  bottom: -0.01rem;
  width: 0.625rem;
  height: 0.625rem;
  content: '';
  display: block;
  background-color: var(--blue995);
  -webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 17% 93%, 33% 84%, 51% 73%, 66% 60%, 76% 47%, 86% 33%, 93% 19%);
          clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 17% 93%, 33% 84%, 51% 73%, 66% 60%, 76% 47%, 86% 33%, 93% 19%);
}

.Styles_container__e45Wz::after {
  position: absolute;
  right: -0.5rem;
  bottom: -0.01rem;
  width: 0.625rem;
  height: 0.625rem;
  content: '';
  display: block;
  background-color: var(--blue995);
  -webkit-clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 83% 93%, 67% 84%, 49% 73%, 34% 60%, 24% 47%, 14% 33%, 7% 19%);
          clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 83% 93%, 67% 84%, 49% 73%, 34% 60%, 24% 47%, 14% 33%, 7% 19%);
}

.Styles_skeleton__6BUaG {
  min-width: 25rem;
  padding: 20px;
  display: flex;
  color: var(--gray000);
  justify-content: center;
  gap: 1rem;
}

.Styles_bottomBorder__kcbbQ {
  height: 0.75rem;
  background-color: var(--blue995);
  border-radius: 0.5rem 0.5rem 0 0;
  display: block;
  margin: 0;
  position: relative;
}

@media (max-width: 650px) {
  .Styles_container__e45Wz {
    width: 100%;
  }

  .Styles_container__e45Wz::before, .Styles_container__e45Wz::after {
    display: none;
  }

  .Styles_skeleton__6BUaG {
    width: 100%;
  }
  
  .Styles_bottomBorder__kcbbQ {
    border-radius: 0 0 0 0.5rem;
  }
}

:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;top:var(--swiper-navigation-top-offset,50%);width:calc(44px/ 44 * 27);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:44px;height:var(--swiper-navigation-size);margin-top:calc(0px - (44px/ 2));margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-theme-color);color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:44px;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-feature-settings:;font-variant:normal;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:10px;left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:10px;right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-button-lock{display:none}
.mentionHightlight_mhOverlay__5VRWB {
  position: absolute;
  inset: 0;
  pointer-events: none;
  color: transparent;
  caret-color: transparent;
  z-index: 0;
  overflow: hidden;
}

.mentionHightlight_pill__hrkgp {
  background: #e0e0e0;
  color: transparent;
  border-radius: 12px;
  padding-left: 4px;
  margin-left: -4px;
  padding-right: 2px;
  margin-right: -2px;
}


/* Hover only on devices that actually hover */
@media (hover: hover) {
  .mentionHightlight_mentionItem__PZ9\+Q:hover {
    background: rgba(0, 0, 0, 0.04);
  }
}

.mentionHightlight_mentionItem__PZ9\+Q {
  padding: 8px 10px;
}

@media (hover: none) and (pointer: coarse) {
  .mentionHightlight_mentionItem__PZ9\+Q {
    padding: 10px 12px;
  }
}

/* Trigger Button (Collapsed State) - Attached to App Gallery tab */
.DeveloperRoleSelector_triggerButton__vVQNb {
  position: relative; /* Changed from fixed to relative */
  display: inline-flex; /* Changed to inline-flex to sit next to text */
  align-items: center;
  justify-content: center;
  padding: 8px;
  width: 32px;
  height: 32px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border: none;
  border-radius: 50%; /* Circular button */
  color: white;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
  margin-left: 8px; /* Space from "app gallery" text */
  z-index: 1; /* Stay on top of tab */
}

.DeveloperRoleSelector_triggerButton__vVQNb:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.DeveloperRoleSelector_triggerButton__vVQNb.DeveloperRoleSelector_enabled__hBqta {
  animation: DeveloperRoleSelector_pulse__IjFiw 2s infinite;
}

/* Mobile hover (no additional mobile-specific styling needed) */
.DeveloperRoleSelector_triggerButtonMobile__9Fh\+I:hover {
  transform: scale(1.1);
}

@keyframes DeveloperRoleSelector_pulse__IjFiw {
  0%, 100% {
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
  }
  50% {
    box-shadow: 0 4px 16px rgba(74, 222, 128, 0.6);
  }
}

.DeveloperRoleSelector_triggerIcon__XCiFR {
  font-size: 16px;
  line-height: 1;
}

.DeveloperRoleSelector_triggerText__H-ale {
  white-space: nowrap;
}

.DeveloperRoleSelector_activeDot__Os1w9 {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 10px;
  height: 10px;
  background: #4ade80;
  border: 2px solid white;
  border-radius: 50%;
  box-shadow: 0 0 8px #4ade80;
}

/* Modal Backdrop */
.DeveloperRoleSelector_backdrop__L3uOc {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  z-index: 10000; /* Above app menu (9999) */
  animation: DeveloperRoleSelector_fadeIn__vfABe 0.2s;
}

@keyframes DeveloperRoleSelector_fadeIn__vfABe {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Modal Container */
.DeveloperRoleSelector_modal__bihH8 {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10001; /* Above backdrop and app menu */
  animation: DeveloperRoleSelector_slideIn__gTSYc 0.3s ease-out;
  max-width: 90vw;
  max-height: 90vh;
}

@keyframes DeveloperRoleSelector_slideIn__gTSYc {
  from {
    opacity: 0;
    transform: translate(-50%, -45%);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%);
  }
}

/* Modal Content */
.DeveloperRoleSelector_modalContent__xuhE\+ {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
  min-width: 500px;
  max-width: 700px;
}

/* Modal Header */
.DeveloperRoleSelector_modalHeader__GaN3K {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.DeveloperRoleSelector_headerLeft__HPTJj {
  display: flex;
  align-items: center;
  gap: 16px;
}

.DeveloperRoleSelector_headerRight__Ipuk2 {
  display: flex;
  align-items: center;
  gap: 8px;
}

.DeveloperRoleSelector_modalTitle__hC9Ch {
  font-size: 18px;
  font-weight: 700;
  color: white;
  margin: 0;
}

.DeveloperRoleSelector_enableSwitch__ehl5N {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.2);
  padding: 6px 12px;
  border-radius: 16px;
  transition: background 0.2s;
}

.DeveloperRoleSelector_enableSwitch__ehl5N:hover {
  background: rgba(255, 255, 255, 0.3);
}

.DeveloperRoleSelector_checkbox__fDcm4 {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.DeveloperRoleSelector_statusDot__xl-pg {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transition: all 0.2s;
}

.DeveloperRoleSelector_statusDot__xl-pg.DeveloperRoleSelector_active__tg\+bD {
  background: #4ade80;
  box-shadow: 0 0 10px #4ade80;
}

.DeveloperRoleSelector_statusText__pVpp3 {
  font-size: 13px;
  font-weight: 600;
  color: white;
}

.DeveloperRoleSelector_resetButton__uue3f {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  color: white;
  font-size: 20px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.DeveloperRoleSelector_resetButton__uue3f:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: rotate(180deg);
}

.DeveloperRoleSelector_closeButton__FxsDl {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  color: white;
  font-size: 20px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.DeveloperRoleSelector_closeButton__FxsDl:hover {
  background: rgba(255, 77, 77, 0.8);
}

/* Info Text */
.DeveloperRoleSelector_infoText__0b31G {
  color: rgba(255, 255, 255, 0.9);
  font-size: 13px;
  margin: 0 0 16px 0;
  text-align: center;
}

.DeveloperRoleSelector_infoText__0b31G strong {
  color: white;
  font-weight: 700;
}

/* Swiper Container */
.DeveloperRoleSelector_swiperContainer__qg\+Ry {
  position: relative;
  margin: 0 -20px;
  padding: 0 50px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding-top: 16px;
  padding-bottom: 16px;
}

.DeveloperRoleSelector_roleSwiper__71rZy {
  padding: 8px 12px;
}

.DeveloperRoleSelector_roleSlide__BztGU {
  width: auto !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.DeveloperRoleSelector_roleBubble__Xpmfe {
  position: relative;
  border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.15);
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.DeveloperRoleSelector_roleBubble__Xpmfe:hover {
  transform: scale(1.15);
  border-color: rgba(255, 255, 255, 0.6);
  background: rgba(255, 255, 255, 0.25);
}

.DeveloperRoleSelector_roleBubble__Xpmfe.DeveloperRoleSelector_selected__71lz\+ {
  border-color: #4ade80;
  background: rgba(74, 222, 128, 0.3);
  box-shadow: 0 0 16px rgba(74, 222, 128, 0.5);
}

.DeveloperRoleSelector_roleBubble__Xpmfe.DeveloperRoleSelector_current__VXUwP {
  border-color: #fbbf24;
  box-shadow: 0 0 12px rgba(251, 191, 36, 0.5);
}

.DeveloperRoleSelector_roleEmoji__8nP03 {
  display: block;
  line-height: 1;
}

.DeveloperRoleSelector_checkmark__Yr-JM {
  position: absolute;
  top: -4px;
  right: -4px;
  background: #4ade80;
  color: white;
  font-size: 12px;
  font-weight: bold;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.DeveloperRoleSelector_currentStar__Vv9TQ {
  position: absolute;
  bottom: -4px;
  right: -4px;
  font-size: 14px;
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.4));
}

.DeveloperRoleSelector_roleLabelCompact__f\+ms0 {
  font-size: 11px;
  color: white;
  text-align: center;
  max-width: 70px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.DeveloperRoleSelector_navArrow__Rm7DH {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.25);
  border: 2px solid rgba(255, 255, 255, 0.4);
  color: white;
  font-size: 22px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.DeveloperRoleSelector_navArrow__Rm7DH:hover:not(.DeveloperRoleSelector_swiper-button-disabled__ikYBu) {
  background: rgba(255, 255, 255, 0.4);
  transform: translateY(-50%) scale(1.1);
}

.DeveloperRoleSelector_navArrow__Rm7DH.DeveloperRoleSelector_swiper-button-disabled__ikYBu {
  opacity: 0.3;
  cursor: default;
}

.DeveloperRoleSelector_navPrev__sO8MY {
  left: 8px;
}

.DeveloperRoleSelector_navNext__sc7KM {
  right: 8px;
}

/* Modal Footer */
.DeveloperRoleSelector_modalFooter__ZQNAs {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 16px;
  gap: 12px;
  flex-wrap: wrap;
}

.DeveloperRoleSelector_selectedCount__5HstF {
  font-size: 13px;
  font-weight: 700;
  color: white;
  background: rgba(255, 255, 255, 0.2);
  padding: 6px 14px;
  border-radius: 16px;
}

.DeveloperRoleSelector_activeIndicator__DvKUH {
  font-size: 12px;
  color: white;
  background: rgba(74, 222, 128, 0.3);
  padding: 6px 14px;
  border-radius: 16px;
  flex: 1 1;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  border: 1px solid rgba(74, 222, 128, 0.4);
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .DeveloperRoleSelector_triggerButton__vVQNb {
    bottom: 16px;
    right: 16px;
    padding: 6px 12px;
    font-size: 12px;
  }

  .DeveloperRoleSelector_triggerIcon__XCiFR {
    font-size: 14px;
  }

  .DeveloperRoleSelector_modalContent__xuhE\+ {
    min-width: auto;
    width: 90vw;
    padding: 16px;
  }

  .DeveloperRoleSelector_modalTitle__hC9Ch {
    font-size: 16px;
  }

  .DeveloperRoleSelector_swiperContainer__qg\+Ry {
    padding: 0 8px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .DeveloperRoleSelector_navArrow__Rm7DH {
    display: none;
  }

  .DeveloperRoleSelector_modalFooter__ZQNAs {
    flex-direction: column;
    align-items: stretch;
  }

  .DeveloperRoleSelector_activeIndicator__DvKUH {
    text-align: center;
  }
}

.GlassButton_class__qD78s {
  --bg-color: rgba(255, 255, 255, 0.25);
  --highlight: rgba(255, 255, 255, 0.75);

  position: relative;
  display: flex;
  cursor: pointer;
  background: transparent;
  border-radius: 1000rem;
  box-shadow: 0 6px 6px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.1);
  margin: 0.5rem;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  position: relative;
  border: var(--borderWidth000);
  padding: 0;
  margin: 0;
}

.GlassButton_class__qD78s::before,
.GlassButton_class__qD78s::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: var(--borderWidth300) solid transparent;
  border-bottom-color: #FF3D00;
  filter: blur(3px);
  opacity: 0;
  transition: opacity .5s linear;
  z-index: 7;
  pointer-events: none;
}
.GlassButton_class__qD78s * {
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}

.GlassButton_class__qD78s:hover::before {
  opacity: 1;
}

.GlassButton_class__qD78s:active::before {
  animation: GlassButton_left__39F9d 1s forwards;
}
.GlassButton_class__qD78s:active::after {
  animation: GlassButton_right__1ePSa 1s forwards;
}

@keyframes GlassButton_left__39F9d {
  0% {
    opacity: 0;
    transform: rotate(0);
  }
  5% {
    opacity: 1;
    transform: rotate(0);
  }
  95% {
    opacity: 1;
    transform: rotate(180deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}

@keyframes GlassButton_right__1ePSa {
  0% {
    opacity: 0;
    transform: rotate(0);
  }
  5% {
    opacity: 1;
    transform: rotate(0);
  }
  90% {
    opacity: 1;
    transform: rotate(-180deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}



.GlassButton_class__qD78s > div {
  color: white;
  fill: currentColor;
  mix-blend-mode: difference;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  min-width: 40px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  /* Optional: subtle edge boost to prevent vanishing */
  filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.25));

  /* Ensure it's positioned correctly for blending */
  position: relative;
  z-index: 3;
  border-radius: 1000rem;
  overflow: hidden;
}
.GlassButton_class__qD78s > div::before {
  content: '';
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  overflow: hidden;
  box-shadow: inset 1px 1px 0 var(--highlight), inset 0 0 5px var(--highlight);
  border-radius: 1000rem;
}
.GlassButton_class__qD78s > div::after {
  content: '';
  display: block;
  position: absolute;
  inset: 0;
  z-index: 0;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  isolation: isolate;
  pointer-events: none;
  background: var(--bg-color);
  overflow: hidden;
  border-radius: 1000rem;
}
.GlassButton_class__qD78s > div > * {
  position: relative;
  z-index: 3;
}

/* Wrapper container for the options list */
.MenuContent_optionsListWrapper__TSNjP {
    width: 100%;
    height: 100%; /* Need defined height */
    display: block;
    overflow: visible; /* No scrolling here - moved to appMenuGridContainer */
    box-sizing: border-box;
    position: relative; /* Make this the positioning context for expanded folders */
}

.SkipAction_class__4LpKS {
  width: 0;
  transition: width 500ms ease-out;
  overflow: hidden;
}
.SkipAction_errandIcon__rh6eg {
  width: 57px;
}
.SkipAction_shouldHide__Pm0nF {
  width: 0;
}
.SkipAction_class__4LpKS > div {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 52px;
  height: 100%;
  overflow: hidden;
}
.SkipAction_class__4LpKS > div > button,
.SkipAction_class__4LpKS > div > button:hover {
  display: block;
  min-width: 53px;
  min-height: 53px;
  max-width: 53px;
  max-height: 53px;
  border-radius: 6px;
  background-color: var(--orange500);
  color: var(--peach100); 
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0;
  position: relative;
  margin-top: 3px;
}
.SkipAction_class__4LpKS > div > button:after {
  content: '';
  opacity: 0;
  background: rgba(255, 84, 28, 0.15);
  width: 5px;
  height: 5px;
  border-radius: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
}
.SkipAction_class__4LpKS > div > button:focus::after {
  animation: SkipAction_ripple__sGduL 0.5s ease-out;
}
@keyframes SkipAction_ripple__sGduL {
  0% {
    transform: scale(0, 0);
    opacity: 0;
  }

  100% {
    opacity: 1;
    transform: scale(10, 10);
  }
}
.SkipAction_class__4LpKS > div > button * {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
}
.SkipAction_class__4LpKS > div > button > svg {
  width: auto;
  min-height: 32px;
  -webkit-user-select: none;
          user-select: none;
}
.SkipAction_class__4LpKS.SkipAction_disable__l5dY9 * {
  cursor: not-allowed;
}
.SkipAction_class__4LpKS > div > button:hover {
  outline: 2px solid rgba(0,0,0,0.04);
}

.SkipAction_class__4LpKS > div > button::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  background-color: currentColor;
  transition: transform 0.5s ease-out, opacity 1s ease-out;
  pointer-events: none;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform-origin: center;
  opacity: 0;
}

.SkipAction_class__4LpKS > div > button:active::after,
.SkipAction_class__4LpKS > div > button:focus::after {
  transform: translate(-50%, -50%) scale(1.5);
  opacity: .2;
  transition: transform 0.3s ease-out, opacity .3s ease-out;
}

.SkipAction_class__4LpKS > div > button > p {
  position: absolute;
  top: 50%;
  transform: translate(calc(-50% + 3px), -5px);
  left: 50%;
  font-size: 12px;
  white-space: nowrap;
}

.SkipAction_class__4LpKS.SkipAction_en__MdqB8 > div > button > p,
.SkipAction_class__4LpKS.SkipAction_es__6ba\+n > div > button > p {
  transform: translate(calc(-50% + 3px), -7px);
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
}

.SkipAction_class__4LpKS.SkipAction_hi__xRjvB > div > button > p {
  transform: translate(calc(-50% + 3px), -7px);
}

.SkipAction_class__4LpKS.SkipAction_ht__QJxTq > div > button > p {
  transform: translate(calc(-50% + 5px), -3px);
  font-size: 10px;
}

.SkipAction_class__4LpKS.SkipAction_ja__3plM6 > div > button > p {
  transform: translate(calc(-50% + 4px), -4px);
  font-size: 8px;
}

.SkipAction_class__4LpKS.SkipAction_vi__LP\+pT > div > button > p {
  transform: translate(calc(-50% + 5px), -3px);
  font-size: 10px;
}

.SkipAction_class__4LpKS.SkipAction_zh__5yPNu > div > button > p {
  transform: translate(calc(-50% + 3px), -6px);
  font-size: 12px;
}


@media (min-width: 900px) {
  .SkipAction_class__4LpKS > div > button,
  .SkipAction_class__4LpKS > div > button:hover {
    min-width: 52px;
    min-height: 52px;
    max-width: 52px;
    max-height: 52px;
    margin-top: 1px;
  }
}

.GlassContainer_class__WOjTM {
  will-change: backdrop-filter;
  transform: translateZ(0);
  /* forces GPU compositing */
  display: flex;
  flex-direction: column;
  position: relative;
  background: rgba(255, 255, 255, 0.95);
  border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
  border-radius: 8px;
}

.GlassContainer_class__WOjTM.GlassContainer_clear__vcdK8 {
  background: rgba(255, 255, 255, 0.95);
  border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
  --noise-opacity: 0.1;
  --noise-size: 1px;
}

.GlassContainer_class__WOjTM.GlassContainer_subtle__JBiPW {
  background: rgba(255, 255, 255, 0.95);
  border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
  --noise-opacity: 0.2;
  --noise-size: 2px;
}

.GlassContainer_class__WOjTM.GlassContainer_frosted__J5dUS {
  background: rgba(255, 255, 255, 0.95);
  border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
  --noise-opacity: 0.3;
  --noise-size: 3px;
}

.GlassContainer_class__WOjTM.GlassContainer_blurred__yBFJF {
  background: rgba(255, 255, 255, 0.95);
  border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
  --noise-opacity: 0.4;
  --noise-size: 4px;
}

.GlassContainer_class__WOjTM.GlassContainer_opaque__oMjht {
  background: rgba(255, 255, 255, 0.95);
  border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
  --noise-opacity: 0.5;
  --noise-size: 5px;
}

.GlassContainer_class__WOjTM::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: inherit;
  background-image: url("data:image/svg+xml,%3Csvg viewBox=%270 0 171 171%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cfilter id=%27noiseFilter%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%273.74%27 numOctaves=%272%27 stitchTiles=%27stitch%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23noiseFilter%29%27/%3E%3C/svg%3E");
  background-size: 2px;
  background-size: var(--noise-size, 2px);
  pointer-events: none;
  opacity: 0.2;
  opacity: var(--noise-opacity, 0.2);
}

.GlassContainer_class__WOjTM>section>header {
  display: block;
  color: #FF0000;
  color: var(--orange500, #FF0000);
  text-transform: capitalize;
  font-family: 'Poppins', Ariel, Helvetica, san-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 8px;
}

.GlassContainer_class__WOjTM>section>main {
  display: block;
  margin-bottom: auto;
  font-family: 'Poppins', Ariel, Helvetica, san-serif;
  font-size: 12px;
}

.GlassContainer_class__WOjTM>section>footer {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  margin-top: auto;
  font-family: 'Poppins', Ariel, Helvetica, san-serif;
  font-size: 12px;
  gap: 8px;
  padding: 8px;
}

.GlassContainer_class__WOjTM>div,
.GlassContainer_class__WOjTM>section>header:empty,
.GlassContainer_class__WOjTM>section>main:empty,
.GlassContainer_class__WOjTM>section>footer:empty {
  display: none;
}

.GlassContainer_class__WOjTM.GlassContainer_element__A\+30M {
  display: flex;
  position: relative;
  background: transparent;
  border-radius: 1000rem;
  overflow: hidden;
  box-shadow: 0 6px 6px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
}

.GlassContainer_class__WOjTM.GlassContainer_element__A\+30M>div {
  display: block;
  position: absolute;
  inset: 0;
}

.GlassContainer_class__WOjTM.GlassContainer_element__A\+30M>div:nth-of-type(1),
.GlassContainer_class__WOjTM .GlassContainer_filter__A5aF8 {
  filter: url(#lg-dist);
  isolation: isolate;
}

.GlassContainer_class__WOjTM.GlassContainer_element__A\+30M>div:nth-of-type(2),
.GlassContainer_class__WOjTM .GlassContainer_overlay__7e8NJ {
  background: rgba(255, 255, 255, 0.9);
}

.GlassContainer_class__WOjTM.GlassContainer_element__A\+30M>div:nth-of-type(3),
.GlassContainer_class__WOjTM .GlassContainer_specular__Qt\+0k {
  border-radius: inherit;
  overflow: hidden;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.75),
    inset 0 0 5px rgba(255, 255, 255, 0.75);
}

@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
  .GlassContainer_class__WOjTM {
    background: rgba(255, 255, 255, 0.6);
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.6);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_clear__vcdK8 {
    background: rgba(255, 255, 255, 0.2);
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.2);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_subtle__JBiPW {
    background: rgba(255, 255, 255, 0.4);
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.4);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_frosted__J5dUS {
    background: rgba(255, 255, 255, 0.6);
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.6);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_blurred__yBFJF {
    background: rgba(255, 255, 255, 0.8);
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.8);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_opaque__oMjht {
    background: rgba(255, 255, 255, 0.95);
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_dashed__LKW3E {
    background: rgba(255, 255, 255, 0.95);
    border: var(--borderWidth030) dashed var(--chatBubblesUserBorderSecondary);
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_element__A\+30M>div:nth-of-type(1),
  .GlassContainer_class__WOjTM .GlassContainer_filter__A5aF8 {
    -webkit-backdrop-filter: blur(0px);
            backdrop-filter: blur(0px);
  }

  .GlassContainer_class__WOjTM.GlassContainer_element__A\+30M>div:nth-of-type(2),
  .GlassContainer_class__WOjTM .GlassContainer_overlay__7e8NJ {
    background: rgba(255, 255, 255, 0.25);
  }

  .GlassContainer_class__WOjTM::before {
    display: none;
  }

  .GlassContainer_showNoise__e13ZF.GlassContainer_class__WOjTM::before {
    display: block;
  }
}

.PseudoButton_class__RrfVR {
  --bg-color: rgba(255, 255, 255, 0.25);
  --highlight: rgba(255, 255, 255, 0.75);

  position: relative;
  display: flex;
  cursor: pointer;
  background: transparent;
  border-radius: 1000rem;
  box-shadow: 0 6px 6px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.1);
  margin: 0.5rem;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  position: relative;
  border: var(--borderWidth000);
  padding: 0;
  margin: 0;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.PseudoButton_class__RrfVR.PseudoButton_disabled__LvTb0 {
  cursor: default;
}

.PseudoButton_class__RrfVR::before,
.PseudoButton_class__RrfVR::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: var(--borderWidth300) solid transparent;
  border-bottom-color: #FF3D00;
  filter: blur(3px);
  opacity: 0;
  transition: opacity .5s linear;
  z-index: 7;
}

.PseudoButton_class__RrfVR:hover::before {
  opacity: 1;
}
.PseudoButton_class__RrfVR.PseudoButton_disabled__LvTb0:hover::before {
  opacity: 0;
}

button:active .PseudoButton_class__RrfVR::before {
  animation: PseudoButton_left__gBuNm 1s forwards;
}
button:active .PseudoButton_class__RrfVR::after {
  animation: PseudoButton_right__0E7ui 1s forwards;
}
button:active .PseudoButton_class__RrfVR.PseudoButton_disabled__LvTb0::before {
  animation: none;
}
button:active .PseudoButton_class__RrfVR.PseudoButton_disabled__LvTb0::after {
  animation: none;
}

@keyframes PseudoButton_left__gBuNm {
  0% {
    opacity: 0;
    transform: rotate(0);
  }
  5% {
    opacity: 1;
    transform: rotate(0);
  }
  95% {
    opacity: 1;
    transform: rotate(180deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}

@keyframes PseudoButton_right__0E7ui {
  0% {
    opacity: 0;
    transform: rotate(0);
  }
  5% {
    opacity: 1;
    transform: rotate(0);
  }
  90% {
    opacity: 1;
    transform: rotate(-180deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}

.PseudoButton_class__RrfVR > div {
  color: white;
  fill: currentColor;
  mix-blend-mode: difference;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  min-width: 40px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  /* Optional: subtle edge boost to prevent vanishing */
  filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.25));

  /* Ensure it's positioned correctly for blending */
  position: relative;
  z-index: 3;
  border-radius: 1000rem;
  overflow: hidden;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  box-shadow: inset 1px 1px 0 var(--highlight), inset 0 0 5px var(--highlight);
}
.PseudoButton_class__RrfVR > div > * {
  position: relative;
  z-index: 3;
}

.styles_footerPartBaseClass__lO5\+b {
  background-color: white;
  position: absolute;
  left: 10px;
  bottom: 1px;
  border-radius: 15px;
  display: flex;
  justify-content: start;
  flex-direction: column;
  transition: all 0.5s ease-in-out !important;
  border: var(--borderWidth100) solid var(--primaryMain);
}

.styles_cornerHideBottomPart__n1Duw::after {
  content: '';
  position: absolute;
  top: -17px;
  left: 0;
  width: 100%;
  height: 15px; /* adjust as needed */
  background: white; /* or use current background */
  pointer-events: none; /* ensures it doesn't block interaction */
  z-index: 1;
}

.styles_rainbowBg__5SdYh {
  background: radial-gradient(circle at 90% 40%, rgba(48, 83, 252, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 5% 50%, rgba(255, 84, 28, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 95% 40%, rgba(28, 221, 255, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 2% 60%, rgba(157, 28, 255, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 35% 55%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
  radial-gradient(circle at 65% 45%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
  radial-gradient(circle at 75% 40%, rgba(48, 83, 252, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 10% 60%, rgba(255, 84, 28, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 85% 60%, rgba(28, 221, 255, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 15% 65%, rgba(157, 28, 255, 0.2) 2%, transparent 10%),
  radial-gradient(circle at 45% 50%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
  radial-gradient(circle at 55% 40%, rgba(157, 28, 255, 0.1) 2%, transparent 10%),
  white;

  animation: styles_moveGradient__J7SP1 15s ease-in-out infinite alternate;
  background-size: 300% 100%;
}

@keyframes styles_moveGradient__J7SP1 {
  from {
    background-position: 0% 50%;
  }
  to {
    background-position: 100% 50%;
  }
}

.AudioVisualizerStyles_container__XFwV\+ {
  width: 100%;

  position: absolute;
  width: calc(100% - 20px);
  height: 350px;
  background-color: white;
  bottom: 5px;
  left: 50%;
  translate: -50%;
  z-index: 11;
  padding-bottom: 90px;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: var(--borderWidth200) solid var(--primaryMain);
  overflow: hidden;
}

.AudioVisualizerStyles_header__7l6X7 {
  background-color: var(--primaryMain);
  width: 100%;
  height: 30px;

  display: flex;
  justify-content: center;
  align-items: center;

  color: white;
  font-weight: bold;
  text-transform: capitalize;
  font-family: var(--typographyFontFamily);
}

.AudioVisualizerStyles_waveContainer__qFpTC {
  width: 100%;
  height: 110px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.AudioVisualizerStyles_recordButton__QUqYU {
  background-color: red !important;
}

.AudioVisualizerStyles_playButton__V\+LfK {
  border: var(--borderWidth200) solid var(--primaryMain);
  background-color: white;
  color: var(--primaryMain);
  height: 40px;
  width: 40px;
}

.AudioVisualizerStyles_controls__KDHJO {
  text-align: center;
  display: grid;
  width: 100%;
  justify-content: center;
  align-items: center;
  grid-template-columns: 1fr 60px 1fr;
  padding: 0 10px;
}

.AudioVisualizerStyles_hr__bErUk {
  border: var(--borderWidth100) solid darkblue;
  position: absolute;
  width: 100%;
  translate: 0 -3px;
}

.AudioVisualizerStyles_title__CXCP3 {
  padding-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.AudioVisualizerStyles_timer__g3Fmb {
  width: 52px;
}

.AudioVisualizerStyles_elapsedTime__rbBFG {
  font-family: monospace;
  font-size: 12px;
}

.AudioVisualizerStyles_status__iDK0v {
  font-size: 14px;
}

.AudioVisualizerStyles_circleIcon__QoQMz {
  position: absolute;
  background-color: var(--gray000);
  height: 55px;
  width: 55px;
  border-radius: 50%;
  color: var(--primaryMain);
  font-size: large;
  display: flex;
  justify-content: center;
  align-items: center;
}

.AudioVisualizerStyles_btn__jbYAI {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  background-color: var(--primaryMain);
  outline: 0;
  border: var(--borderWidth000);
  margin: 0;
  border-radius: 0;
  padding: 6px 16px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  vertical-align: middle;
  -moz-appearance: none;
  -webkit-appearance: none;
  -webkit-text-decoration: none;
  text-decoration: none;
  color: inherit;
  font-family: var(--typographyFontFamily);
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.75;
  text-transform: capitalize;
  min-width: 64px;
  padding: 6px 16px;
  border-radius: 4px;
  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
    border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  color: #fff;
  background-color: #ff541c;
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14),
    0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

.AudioVisualizerStyles_filename__NaDOx {
  color: black;
  white-space: nowrap;
  position: absolute;
  bottom: 0;
  transform: translateY(100%);
}

.AudioVisualizerStyles_filenameContainer__\+0p3v {
  display: flex;
  justify-content: flex-end;
  padding-right: 8px;
}

.AudioVisualizerStyles_label__tZDZm {
  text-transform: capitalize;
}

.AudioVisualizerStyles_inputContainer__C3AJq {
  justify-self: left;
  flex-direction: column;
  display: flex;
  align-items: center;
  gap: 3px;
  width: 100%;
  position: relative;
}

/* screen widths larger than 900px */
@media (min-width: 900px) {
  .AudioVisualizerStyles_recordButton__QUqYU {
    max-width: 200px;
    justify-self: end;
  }
  .AudioVisualizerStyles_btn__jbYAI {
    max-width: 200px;
    justify-self: start;
  }

  .AudioVisualizerStyles_inputContainer__C3AJq {
    max-width: 200px;
    flex-direction: row;
  }
}

.CassetteRecorder_cassetteContainer__EmD1a {
  border: var(--borderWidth200) solid #ff4103;
  border-radius: 12px;
  background-color: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  width: 260px;
  display: flex;
  align-items: center;
  flex-direction: column;
  padding-top: 34px;
  box-sizing: border-box;
  padding-bottom: 10px;
  gap: 5px;
}

.CassetteRecorder_screwsContainer__oivi7 {
  position: absolute;
  display: flex;
  top: 4px;
  justify-content: space-between;
  width: 100%;
  padding: 0px 4px;
  box-sizing: border-box;
}

.CassetteRecorder_screw__CsuGC {
  height: 13px;
  width: 13px;
  background-color: transparent;
  border: var(--borderWidth200) solid #ff4103;
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

.CassetteRecorder_screw__CsuGC:nth-child(odd)::before,
.CassetteRecorder_screw__CsuGC:nth-child(odd)::after {
  content: '';
  display: block;
  position: absolute;
  width: 6px;
  height: 1.5px;
  border-radius: 2px;
  background-color: #ff4103;
  transform: rotate(-15deg);
}

.CassetteRecorder_screw__CsuGC:nth-child(odd)::after {
  transform: rotate(75deg);
}

.CassetteRecorder_trapezoid__k9Tdd {
  display: flex;
  position: absolute;
  top: -1px;
}

.CassetteRecorder_window__AdNZ7 {
  height: 48px;
  width: 212px;
  border: var(--borderWidth200) solid #ff4103;
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 4px;
}

.CassetteRecorder_reel__Ifu7f {
  display: flex;
}

@keyframes CassetteRecorder_spinCounterClockwise__x91WV {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-360deg);
  }
}

@keyframes CassetteRecorder_spinClockwise__G8l13 {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.CassetteRecorder_spinning__zWY63 {
  animation: CassetteRecorder_spinCounterClockwise__x91WV 2s linear infinite;
}

.CassetteRecorder_spinningClockwise__v4l64 {
  animation: CassetteRecorder_spinClockwise__G8l13 2s linear infinite;
}

.CassetteRecorder_canvasContainer__0QmFr {
  height: 100%;
  width: 100%;
}

.CassetteRecorder_canvasContainer__0QmFr > canvas {
  height: 100% !important;
}

.CassetteRecorder_visualizerContainer__VTZ1q {
  height: 100%;
  width: 100%;
}

.CassetteRecorder_time__n6uPo {
  color: #ff4103;
  font-weight: bold;
}

.CassetteRecorder_controls__pNvgL {
  margin-top: auto;
  padding-bottom: 10px;
}

.FallingOrb_class__kkVs1 {
  display: block;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
  position: absolute;
  top: -50px;
  left: calc(50% - 22px);
  width: 44px;
  height: 44px;
  border-radius: 50%;
}
.FallingOrb_class__kkVs1.FallingOrb_shouldFall__kyHtN {
  animation: FallingOrb_fall__CH7F6 900ms cubic-bezier(1, 0, .91, .39) forwards;
  animation: FallingOrb_fall__CH7F6 var(--fall-duration, 900ms) cubic-bezier(1, 0, .91, .39) forwards;
}
@keyframes FallingOrb_fall__CH7F6 {
  to {
    top: 50%;
    left: 100%;
  }
}
.FallingOrb_class__kkVs1 > * {
  display: none;
}
.FallingOrb_class__kkVs1.FallingOrb_isOrb__eHhEM > * {
  display: flex;
}

.MessageOptions_class__9yR0u {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: 100%;
  gap: 25px;
  padding: 10px 5px;
  margin: auto;
}
.MessageOptions_class__9yR0u::after {
  content: '';
  position: absolute;
  display: block;
  border-left: var(--borderWidth100) dashed var(--orange700);
  border-right: var(--borderWidth100) dashed var(--orange700);
  width: 0;
  height: 50px;
  left: 0;
  top: -50px;
}
.MessageOptions_class__9yR0u button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: var(--borderWidth100) solid transparent;
  background-color: transparent;
  width: 76px;
  height: 60px;
  position: relative;
  overflow: hidden;
  gap: 6px;
}
.MessageOptions_class__9yR0u button * {
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.MessageOptions_class__9yR0u button > div:first-child {
  width: 24px;
  height: 24px;
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--orange500);
  color: var(--gray000);
  border-radius: 4px;
}
.MessageOptions_class__9yR0u button > div:first-child > img {
  object-fit: contain;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border: var(--borderWidth000) solid transparent;
  border-radius: 8px;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  max-width: 100%;
  max-height: 100%;
}
.MessageOptions_class__9yR0u button > div:first-child > svg {
  height: 16px;
  width: auto;
}

.MessageOptions_class__9yR0u button > div:last-child {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.MessageOptions_class__9yR0u button > div:last-child > svg {
  width: 12px;
  height: 12px;
  background-color: var(--gray000);
  color: var(--orange500);
  border-radius: 100%;
}
.MessageOptions_class__9yR0u button > div:last-child > p {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  position: relative;
  font-size: 11px;
  font-family: var(--typographyFontFamily);
  font-weight: 500;
  text-align: center;
  color: var(--gray850);
  width: 100%;
}
@media (max-width: 900px) {
  .MessageOptions_class__9yR0u {
    gap: 10px;
  }
}

.TextMessageContent_class__8hOQz {
  display: flex;
  width: -webkit-max-content;
  width: max-content;
  flex-direction: column;
  max-width: 100%;
  position: relative;
  align-items: flex-start;
  justify-content: flex-start;
  --unit: 5px;
  --time: 0.5s;
  --offset: 3px;
  max-width: calc(100% - 44px);
}

.TextMessageContent_class__8hOQz.TextMessageContent_messageAlignByCurrentUser__LHsY1 {
  align-items: flex-end;
  justify-content: flex-end;
}

.TextMessageContent_class__8hOQz * {
  -webkit-user-select: none;
          user-select: none;
}

.TextMessageContent_class__8hOQz.TextMessageContent_isOperator__dbkA- * {
  -webkit-user-select: text;
          user-select: text;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX {
  font-size: 12px;
  font-weight: 400;
  font-family: var(--typographyFontFamily);
  padding: var(--unit) calc(var(--unit) * 2);
  max-width: var(--max-width);
}


.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz > div:last-of-type {
  min-width: var(--text-width);
  max-width: var(--text-width);
}

.TextMessageContent_class__8hOQz > * {
  margin-bottom: calc(-1 * (var(--height) - var(--offset)));
  position: relative;
  -webkit-user-select: none;
          user-select: none;
  word-break: break-word;
  overflow-wrap: break-word;
  transition: 
    margin-bottom var(--time) linear,
    margin-left var(--time) linear,
    margin-right var(--time) linear,
    min-width var(--time) linear,
    max-width var(--time) linear;
}

.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_messageAlignByCurrentUser__LHsY1 > * {
  margin-right: 0;
}
.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz > * {
  margin-left: 0;
}

/* 1 item */
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(1)) > *:nth-of-type(1) {
  max-width: var(--width);
  min-width: var(--width);
}

/* 2 items */
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(2)) > *:nth-of-type(1) {
  max-width: var(--width);
  min-width: var(--width);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(2)) > *:nth-of-type(2) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 1);
  margin-right: calc(var(--offset) * 1);
}


/* 3 items */
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(3)) > *:nth-of-type(1) {
  max-width: var(--width);
  min-width: var(--width);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(3)) > *:nth-of-type(2) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 1);
  margin-right: calc(var(--offset) * 1);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(3)) > *:nth-of-type(3) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 2);
  margin-right: calc(var(--offset) * 2);
}


/* 4 items */
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(4)) > *:nth-of-type(1) {
  max-width: var(--width);
  min-width: var(--width);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(4)) > *:nth-of-type(2) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 1);
  margin-right: calc(var(--offset) * 1);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(4)) > *:nth-of-type(3) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 2);
  margin-right: calc(var(--offset) * 2);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(4)) > *:nth-of-type(4) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 3);
  margin-right: calc(var(--offset) * 3);
}


/* 5 items */
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(n+5)) > *:nth-of-type(1) {
  max-width: var(--width);
  min-width: var(--width);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(n+5)) > *:nth-of-type(2) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 1);
  margin-right: calc(var(--offset) * 1);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(n+5)) > *:nth-of-type(3) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 2);
  margin-right: calc(var(--offset) * 2);
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(n+5)) > *:nth-of-type(n+4) {
  max-width: var(--width);
  min-width: var(--width);
  margin-left: calc(var(--offset) * 3);
  margin-right: calc(var(--offset) * 3);
}
/* Hide items between 3rd and last by default */
.TextMessageContent_class__8hOQz:not(.TextMessageContent_isExpanded__WXJfW):has(> *:nth-of-type(4)) > *:nth-of-type(n+4):not(:last-of-type) {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  max-height: 0;
  max-width: 100%;
  overflow: hidden;
  margin-bottom: 0;
}
.TextMessageContent_class__8hOQz:has(> *:nth-of-type(2)) > *:not(:last-of-type) > div > div:last-of-type > div {
  interpolate-size: allow-keywords;
  max-height: calc(var(--height) - 8px);
  min-height: calc(var(--height) - 8px);
  transition: min-height .5s linear, max-height .5s linear;
}
.TextMessageContent_class__8hOQz.TextMessageContent_shouldShiftUp__sbmlm.TextMessageContent_showReadMoreText__D5fNi > div:last-of-type .TextMessageContent_messageContentWrapper__G8BPX {
  interpolate-size: allow-keywords;
  max-height: calc(var(--action-height) - 27px);
  transition: min-height var(--time) linear,  var(--time) linear;
  overflow: clip;
}
.TextMessageContent_class__8hOQz.TextMessageContent_field__2QYts.TextMessageContent_messageAlignByCurrentUser__LHsY1:has(> *:nth-of-type(2)) {
  transform: translateY(calc(-1 * var(--offset) * 2))
}
.TextMessageContent_class__8hOQz.TextMessageContent_field__2QYts.TextMessageContent_messageAlignByCurrentUser__LHsY1:has(> *:nth-of-type(3)) {
  transform: translateY(calc(-1 * var(--offset) * 3))
}
.TextMessageContent_class__8hOQz.TextMessageContent_field__2QYts.TextMessageContent_messageAlignByCurrentUser__LHsY1:has(> *:nth-of-type(n+4)) {
  transform: translateY(calc(-1 * var(--offset) * 4))
}
.TextMessageContent_class__8hOQz.TextMessageContent_showReadLessText__SVMg6 > div:last-of-type .TextMessageContent_messageContentWrapper__G8BPX {
  min-height: 0;
  max-height: none;
  max-height: initial;
}
.TextMessageContent_class__8hOQz:has(> div:nth-of-type(2)) > div:not(:last-of-type) .TextMessageContent_messageContentWrapper__G8BPX {
  opacity: 0;
}
.TextMessageContent_class__8hOQz.TextMessageContent_isExpanded__WXJfW:has(> div:nth-of-type(2)) > div:not(:last-of-type) .TextMessageContent_messageContentWrapper__G8BPX {
  opacity: 1;
}
.TextMessageContent_class__8hOQz.TextMessageContent_isExpanded__WXJfW:has(> div:nth-of-type(2)) > div:not(:last-of-type) > div > div:last-of-type > div {
  min-height: 0;
  max-height: none;
  max-height: initial;
}
.TextMessageContent_class__8hOQz.TextMessageContent_action__Fw0Zm section {
  display: none;
}
.TextMessageContent_class__8hOQz.TextMessageContent_class__8hOQz.TextMessageContent_isExpanded__WXJfW > div,
.TextMessageContent_class__8hOQz > div:last-of-type {
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  max-width: var(--max-width);
  min-width: 0;
  word-break: normal;
  overflow-wrap: break-word;
  word-break: auto-phrase;
  min-width: -webkit-max-content !important;
  min-width: max-content !important;
}

.TextMessageContent_class__8hOQz:has(> *:nth-of-type(2)) > *:last-of-type {
  /* min-width: 123px; */
  max-width: 100%;
}

.TextMessageContent_class__8hOQz.TextMessageContent_isExpanded__WXJfW > *::after,
.TextMessageContent_class__8hOQz > *:last-of-type::after {
  opacity: 0;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + div,
.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + textarea + div {
  padding: var(--unit) calc(var(--unit) * 2);
  margin-top: -25.5px;
}
/* .class.isSinglelined .messageContentWrapper + div,
.class.isSinglelined .messageContentWrapper + textarea + div {
  max-width: unset;
} */

.TextMessageContent_class__8hOQz.TextMessageContent_isSinglelined__VsQ\+f.TextMessageContent_icon__pRB1d .TextMessageContent_messageContentWrapper__G8BPX + div,
.TextMessageContent_class__8hOQz.TextMessageContent_isSinglelined__VsQ\+f.TextMessageContent_icon__pRB1d .TextMessageContent_messageContentWrapper__G8BPX + textarea + div {
  margin-top: -8.5px;
  margin-left: auto;
}

.TextMessageContent_class__8hOQz.TextMessageContent_isSinglelined__VsQ\+f.TextMessageContent_icon__pRB1d > *:last-of-type .TextMessageContent_messageContentWrapper__G8BPX {
  margin-left: 32px;
  /* min-width: 62px; */
}

.TextMessageContent_class__8hOQz.TextMessageContent_isSinglelined__VsQ\+f.TextMessageContent_icon__pRB1d.TextMessageContent_messageAlignByCurrentUser__LHsY1 .TextMessageContent_messageContentWrapper__G8BPX {
  /* min-width: 74px; */
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + div:has(time:only-child),
.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + textarea + div:has(time:only-child) {
  max-width: -webkit-fit-content;
  max-width: fit-content;
  padding: var(--unit) calc(var(--unit) * 2);
}

.TextMessageContent_class__8hOQz.TextMessageContent_icon__pRB1d .TextMessageContent_messageSideIconButtonComponent__PhAGq {
  float: left;
  transform: translateY(2px);
  margin-right: 2px;
  margin-bottom: calc(-1 * var(--unit));
  margin-left: 1px;
}

.TextMessageContent_class__8hOQz.TextMessageContent_isSinglelined__VsQ\+f.TextMessageContent_icon__pRB1d .TextMessageContent_messageSideIconButtonComponent__PhAGq {
  position: absolute;
  top: 50%;
  left: 1px;
  transform: translateY(-50%);
}

.TextMessageContent_class__8hOQz.TextMessageContent_icon__pRB1d .TextMessageContent_messageSideIconButtonComponent__PhAGq button {
  width: 26px !important;
  height: 26px !important;
}

.TextMessageContent_class__8hOQz .TextMessageContent_viewEditHistoryButton__bFMc7 {
  position: absolute;
  top: 0;
  right: 0;
  padding: 4px;
  background: transparent;
  border: none;
  width: 18px;
  height: 18px;
  display: flex;
  justify-content: stretch;
  align-items: stretch;
}

.TextMessageContent_class__8hOQz .TextMessageContent_viewEditHistoryButton__bFMc7 span {
  border-top: 2px solid var(--chatBubblesUserTextColor);
  border-right: 2px solid var(--chatBubblesUserTextColor);
  width: 10px;
  height: 10px;
}
.TextMessageContent_class__8hOQz.TextMessageContent_isAIMessage__Sc1lp .TextMessageContent_viewEditHistoryButton__bFMc7 span {
  border-top: 2px solid var(--chatBubblesAiTextColor);
  border-right: 2px solid var(--chatBubblesAiTextColor);
}

.TextMessageContent_class__8hOQz > div > div > div > div {
  display: block;
}

/* isTranslated */
.TextMessageContent_class__8hOQz:has( > section) > *:last-of-type .TextMessageContent_messageContentWrapper__G8BPX,
.TextMessageContent_class__8hOQz.TextMessageContent_messageSenderTypeOperator__fbi-F:has( > section) > *:last-of-type .TextMessageContent_messageContentWrapper__G8BPX {
  min-width: 220px;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX s {
  -webkit-text-decoration-color: currentColor;
          text-decoration-color: currentColor;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX li > br,
.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX ul > br {
  display: none;
}

/* ------------------ Proper max-height transition for expansion ------------------ */

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX:last-child > s {
  width: -webkit-fit-content;
  width: fit-content;
  text-align: left;
  margin-right: auto;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 1.96875rem;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-text-decoration-color: transparent;
          text-decoration-color: transparent;
  transition: max-height var(--time) linear var(--time);
}

.TextMessageContent_class__8hOQz.TextMessageContent_isExpanded__WXJfW .TextMessageContent_messageContentWrapper__G8BPX:last-child > s {
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: initial;
  max-height: 1000vh;
}

.TextMessageContent_class__8hOQz.TextMessageContent_isSinglelined__VsQ\+f .TextMessageContent_messageContentWrapper__G8BPX:last-child {
  margin-bottom: 0;
}

.TextMessageContent_class__8hOQz div.TextMessageContent_messageContentWrapper__G8BPX p {
  padding: 0;
}
.TextMessageContent_class__8hOQz strong,
.TextMessageContent_class__8hOQz.TextMessageContent_isOperator__dbkA- strong {
  font-weight: 500;
}
.TextMessageContent_class__8hOQz > *:last-of-type div.TextMessageContent_messageContentWrapper__G8BPX p,
.TextMessageContent_class__8hOQz.TextMessageContent_isOperator__dbkA- > *:last-of-type div.TextMessageContent_messageContentWrapper__G8BPX p,
.TextMessageContent_class__8hOQz.TextMessageContent_messageSenderTypeOperator__fbi-F > *:last-of-type div.TextMessageContent_messageContentWrapper__G8BPX p {
  display: block !important;
  text-align: left !important;
  margin-right: auto !important;
  margin-left: 0 !important;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageSideIconButtonComponent__PhAGq {
  display: none;
}

.TextMessageContent_class__8hOQz.TextMessageContent_icon__pRB1d > *:last-of-type .TextMessageContent_messageSideIconButtonComponent__PhAGq {
  display: block;
}

.TextMessageContent_class__8hOQz.TextMessageContent_glowingBorder__OiAJQ {
  position: relative;
}

.TextMessageContent_class__8hOQz.TextMessageContent_glowingBorder__OiAJQ::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  border-radius: 12px;
  padding: 2px;
  background: linear-gradient(45deg, #ff6b35, #7513f2, #ff6b35, #7513f2);
  background-size: 400% 400%;
  animation: TextMessageContent_glowingBorderAnimation__t80a- 2s ease-in-out infinite;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
          mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  opacity: 0.5;
  z-index: -1;
}

@keyframes TextMessageContent_glowingBorderAnimation__t80a- {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX:has( + textarea) {
  opacity: 0;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + textarea {
  position: absolute;
  inset: 0;
  padding: 5px 10px 20px;
  border-radius: 12px;
  border: none;
  color: var(--chatBubblesUserTextColor);
  outline-color: var(--chatBubblesUserTextColor);
  background-color: transparent;
  font-family: var(--typographyFontFamily);
  font-size: 12px;
  letter-spacing: 0.15008px;
  pointer-events: none;
  white-space: pre-wrap;
  field-sizing: content;
  overflow: clip;
}

.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + div,
.TextMessageContent_class__8hOQz .TextMessageContent_messageContentWrapper__G8BPX + textarea + div {
  padding: 5px 10px;
}

@keyframes TopPiece_shaking__xcqWj {
  0% {
    transform: scale(1) rotate(-30deg);
  }

  10% {
    transform: scale(1.1) rotate(10deg);
  }

  20% {
    transform: scale(1.2) rotate(-30deg);
  }

  30% {
    transform: scale(1.1) rotate(10deg);
  }

  40% {
    transform: scale(1.2) rotate(-30deg);
  }

  50% {
    transform: scale(1) rotate(-30deg);
  }

  100% {
    transform: scale(1) rotate(-30deg);
  }
}

@keyframes TopPiece_shakingNotification__IgUiU {
  0% {
    transform: scale(1) rotate(0deg);
  }

  25% {
    transform: scale(1.1) rotate(10deg);
  }

  50% {
    transform: scale(1.2) rotate(-10deg);
  }

  75% {
    transform: scale(1.1) rotate(10deg);
  }

  100% {
    transform: scale(1) rotate(0deg);
  }
}

@keyframes TopPiece_regrowingNotification__JKcEY {
  0% {
    transform: scale(1);
  }

  25% {
    transform: scale(1.2);
  }

  50% {
    transform: scale(1.0);
  }

  75% {
    transform: scale(1.2);
  }

  100% {
    transform: scale(1);
  }
}

.TopPiece_handPieceShaking__JgzF0 {
  animation: TopPiece_shaking__xcqWj 2.5s ease 1 forwards;
}

.TopPiece_notificationPieceShaking__hZ4nq {
  animation: TopPiece_shakingNotification__IgUiU 1s ease 1 forwards;
}


.TopPiece_notificationPieceRegrowing__pz25i {
  animation: TopPiece_regrowingNotification__JKcEY 1.5s ease 1 forwards;
}

.TopPiece_handPiece__WR10D {
  transform: scale(1) rotate(-30deg);
}

.TopPiece_notificationPiece__vEuRt {
  transform: scale(1);
}

@keyframes TopPiece_typing__QIB4C {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}

@keyframes TopPiece_blinkCaret__dejWm {

  0%,
  100% {
    border-right-color: transparent;
  }

  50% {
    border-right-color: black;
  }
}

.TopPiece_typing__QIB4C {
  font-family: monospace;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  border-right: 2px solid black;
  animation: TopPiece_typing__QIB4C 2s steps(10, end) forwards,
    TopPiece_blinkCaret__dejWm 0.7s step-end infinite;
}

.TopPiece_animatedDot__3XrAE {
  position: fixed;
  top: -500px;
  /* this will be overridden by animation */
  left: 35%;
  width: 20px;
  height: 20px;
  background-color: white;
  border-radius: 50%;
  z-index: 9999;
  animation: TopPiece_dropAndSettle__NvEsz 3s ease forwards;
  animation-delay: 2s;
  box-shadow: 0 0 10px 2px rgba(255, 255, 255, 0.6);
}

.TopPiece_animatedDotMobile__\+2QEN {
  position: absolute;
  top: -500px;
  /* this will be overridden by animation */
  left: calc(50% - 10px);
  width: 20px;
  height: 20px;
  background-color: white;
  border-radius: 50%;
  z-index: 9999;
  animation: TopPiece_dropAndSettleMobile__TrBC8 2s ease forwards;
  animation-delay: 2s;
  box-shadow: 0 0 10px 2px rgba(255, 255, 255, 0.6);
}

@keyframes TopPiece_dropAndSettleMobile__TrBC8 {
  0% {
    top: -500px;
    left: calc(50% - 10px);
    transform: scale(1);
    opacity: 1;
  }

  50% {
    top: 15px;
    left: calc(50% - 10px);
    opacity: 1;
    transform: scale(0.9);
  }

  100% {
    top: 0px;
    left: calc(50% - 10px);
    transform: scale(0.5);
    opacity: 0;
  }
}

@keyframes TopPiece_dropAndSettle__NvEsz {
  0% {
    top: -500px;
    left: 35%;
    transform: scale(1);
    opacity: 1;
  }

  40% {
    top: 40px;
    left: 35%;
    opacity: 1;
    transform: scale(1.2);
  }

  60% {
    top: 30px;
    left: 35%;
    opacity: 1;
    transform: scale(1);
  }

  100% {
    top: 30px;
    left: 10%;
    transform: scale(1);
    opacity: 0;
  }
}

.TopPiece_doneIcon__-TrNi {
  transition: all 0.3s ease !important;
  border: var(--borderWidth100) solid transparent;
  border-radius: 6px;
}

.TopPiece_doneIconMobile__gRKXS {
  transition: all 0.3s ease !important;
  border: var(--borderWidth100) solid transparent;
  border-radius: 6px;
  font-size: 1.3rem;
}

.TopPiece_doneIcon__-TrNi:hover {
  box-shadow: -1px 1px 3px 0px rgba(0, 0, 0, 0.75);
  -webkit-box-shadow: -1px 1px 3px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: -1px 1px 3px 0px rgba(0, 0, 0, 0.75);
}

.TopPiece_gearIcon__h30pn {
  transition: all 0.3s ease;
}

.TopPiece_gearIcon__h30pn:hover {
  transform: rotate(50deg);
}

.TopPiece_finalEmojiContainer__M0YDz {
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  cursor: pointer;
}
.TopPiece_topLeftZero__McQtU {
  top: 0 !important;
  left: 0 !important;
}

@keyframes TopPiece_postShaking__65Gy4 {
  0% {
    transform: rotate(0deg);
  }

  20% {
    transform: rotate(30deg);
  }

  40% {
    transform: rotate(-30deg);
  }

  60% {
    transform: rotate(10deg);
  }

  80% {
    transform: rotate(-10deg);
  }

  90% {
    transform: rotate(10deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

.TopPiece_postShakingAnimation__eH5Cg {
  animation: TopPiece_postShaking__65Gy4 0.5s ease 1 forwards;
}

.DownloadAppBannerStyles_contentContainer__pVZ3- {
  display: flex;
  flex-direction: row;
  /* height: 80px; */
  width: 300px;
  margin: 10px;
  gap: 10px;
  z-index: 1;
}

.DownloadAppBannerStyles_left__XKL97 {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
}

.DownloadAppBannerStyles_icon__zQnBB {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
  width: 60px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 0 5px gray;
}

.DownloadAppBannerStyles_textContainer__ctwm0 {
  display: flex;
  flex-direction: column;
  text-align: left;
  width: 100%;
  align-items: start;
  justify-content: space-between;
}

.DownloadAppBannerStyles_titleText__QAhG6 {
  font-size: 14.19px;
  font-weight: 500;
  color: var(--orange500);
}

.DownloadAppBannerStyles_buttonText__VxVjF {
  font-size: 11px;
  color: white;
  height: 20px;
  width: 100px;
  background-color: var(--orange500);
  border-radius: 5px;
}

.CornerTransition_container__-qEmW {
  /* position: fixed; */
  top: 0;
  left: 0;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  transform-origin: top left;
  pointer-events: auto;
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  touch-action: pan-x;
}

.CornerTransition_transition__HL8ex {
  transition:
    transform 450ms cubic-bezier(0.4, 0, 0.2, 1),
    opacity 450ms cubic-bezier(0.4, 0, 0.2, 1);
}

.CornerTransition_closed__foCci {
  transform: scale(0);
  opacity: 0;
}

.CornerTransition_open__LE91d {
  transform: scale(1);
  opacity: 1;
}

@keyframes ConfirmBanner_style_gearSpin__pae6D {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes ConfirmBanner_style_smallGearSpin__bemz\+ {
  0%   { transform: rotate(-20deg); }
  100% { transform: rotate(340deg); }
}

.ConfirmBanner_style_smallerGear__mm3bo {
  transform: rotate(-20deg);
  animation: ConfirmBanner_style_smallGearSpin__bemz\+ 6s linear infinite;
  transform-origin: center;
}

.ConfirmBanner_style_biggerGear__jdijo {
  animation: ConfirmBanner_style_gearSpin__pae6D 6s linear infinite reverse;
  transform-origin: center;
}

.Attachment_skeleton_class__1HkNZ {
  width: 100%;
  height: 82px;
}
.Attachment_skeleton_class__1HkNZ > div {
  height: 85px;
  width: 95px;
  border: var(--borderWidth300) solid var(--gray000);
}

.Edit_skeleton_class__zoVsS {
  display: flex;
  flex-direction: column;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 5px;
  margin: auto;
  padding: 5px 5px 0 5px;
  border-radius: 8px;
}

.Edit_skeleton_class__zoVsS > div {
  width: 100%;
  max-width: calc(100% - 10px);
  background-color: var(--gray000);
  border-radius: 8px;
  padding: 8px;
  height: 60px;
}

.Edit_skeleton_class__zoVsS > p,
.Edit_skeleton_class__zoVsS > div > p {
  display: block;
  font-size: 0.85em;
  font-size: 9px;
  line-height: 2;
  color: var(--blue050);
  min-width: 100%;
  text-align: center;
}

.ExpandFullMode_link__l8kK1 {
  display: flex;
  flex-direction: row;
  gap: 5px;
  width: -webkit-max-content;
  width: max-content;
  font-size: 14px;
  font-family: var(--typographyFontFamily);
  height: 29px;
  align-items: center;
  color: var(--orange400);
  text-decoration: none;
  cursor: pointer;
}

.FileSelector_skeleton_class__k9Zzi {
  width: 100%;
  height: 121px;
}

.PointsTrackerStyles_wrapper__ZxC3R {
  height: 27.37px;
  /*padding: 1px 5px 0px 5px;*/
  padding: 2px 8px 0px 8px;
  background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.6));
  border-radius: 50px;
  font-family: var(--typographyFontFamily);
  display: flex;
  justify-content: center;
  align-items: center;
  /* gap: 3px; */
  color: var(--gray000);
  transition: width 0.3s ease-in-out;
  /*overflow: hidden;*/
  overflow: visible;

  white-space: nowrap;
  width: 80px; /*Og 80*/
}

.PointsTrackerStyles_disable__hfPw9 {
  cursor: not-allowed;
}

.PointsTrackerStyles_icon__aWrQ\+ {
  transform: translateY(-1px);
  height: 25px;
  width: 25px;
  margin-right: 5px;
}

.PointsTrackerStyles_numberText__h4HHs {
  font-weight: 700;
  font-family: var(--typographyFontFamily), monospace !important;
  transform: translateX(100%);
  opacity: 0;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, width 0.3s ease-in-out;
  white-space: nowrap;
}

.PointsTrackerStyles_show__AOCHF {
  transform: translateX(0);
  opacity: 1;
}

.PointsTrackerStyles_hiddenText__UiGVQ {
  position: absolute;
  visibility: hidden;
  white-space: nowrap;
  font-weight: 700;
  font-family: 'IBM Plex Mono', monospace;
  font-size: inherit;
}

/*MRGN-2074 - CSS for reward .gif inside the .wrapper*/
.PointsTrackerStyles_rewardGif__CP571 {
  position: fixed;
  top: 58.5%;
  left: 50%;
  transform: translate(-50%, -50%) scale(4.5);
  width: 320px;
  /*height: 100px;*/
  z-index: 9999;
  pointer-events: none;
  /*filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.25));*/
}

@media (max-width: 768px) {
  .PointsTrackerStyles_rewardGif__CP571 {
    top: 56.5%;
  }
}

/*MRGN-2074*/
.PointsTrackerStyles_pointsIconWrapper__o\+EXJ{
  position: relative;
  display: inline-flex;
  align-items: center;
  overflow: visible;
  /*margin-right: 5px;*/
}

/*MRGN-2074 - Flyng coin animation styles for points reward effect*/
.PointsTrackerStyles_flyingCoin__tyGB5 {
  position: fixed;
  top: 50vh;
  top: var(--coin-start-y, 50vh);
  left: 50vw;
  left: var(--coin-start-x, 50vw);
  width: 25px;
  height: 25px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 9999;
  animation: PointsTrackerStyles_coinFly__i0VB4 2s linear forwards;
}

/*MRGN-2074 - Keyframe animation for coins flying from microphone button to .icon*/
@keyframes PointsTrackerStyles_coinFly__i0VB4 {
  0% {
    /* MRGN-2074 - Start position with random spread and small scale*/
    transform:
      translate(
        calc(-50% + var(--spread-x)),
        calc(-50% + var(--spread-y))
      ) scale(0.5);
    opacity: 0.4;
  }

  100% {
    /* MRGN-2074 - End position at points tracker with larger scale*/
    transform: 
      translate(
      calc(var(--coin-target-x) - 50vw - 24px), 
      calc(var(--coin-target-y) - 50vh - 12px)
      ) scale(1.3);
    transform: 
      translate(
      calc(var(--coin-target-x) - var(--coin-start-x, 50vw) - 24px), 
      calc(var(--coin-target-y) - var(--coin-start-y, 50vh) - 12px)
      ) scale(1.3);
    opacity: 1;
  }
}

/*MRGN-2074*/
.PointsTrackerStyles_iconSpaced__vO0Gw {
  margin-right: 5px;
  transition: margin-right 0.25s ease;
}

/*MRGN-2074*/
.PointsTrackerStyles_hoverGif__tC8R6 {
  height: 25px;
  width: 25px;
}


.MessageOptions_skeleton_class__70l9a {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: 100%;
  gap: 25px;
  padding: 10px 5px;
  margin: auto;
}
.MessageOptions_skeleton_class__70l9a::after {
  content: '';
  position: absolute;
  display: block;
  border-left: var(--borderWidth100) dashed var(--orange700);
  border-right: var(--borderWidth100) dashed var(--orange700);
  width: 0;
  height: 50px;
  left: 0;
  top: -50px;
}
.MessageOptions_skeleton_class__70l9a button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: var(--borderWidth100) solid transparent;
  background-color: transparent;
  width: 76px;
  height: 60px;
  position: relative;
  overflow: hidden;
  gap: 6px;
}
.MessageOptions_skeleton_class__70l9a button * {
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.MessageOptions_skeleton_class__70l9a button > div:first-child {
  width: 24px;
  height: 24px;
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--orange500);
  color: var(--gray000);
  border-radius: 4px;
}
.MessageOptions_skeleton_class__70l9a button > div:first-child > img {
  object-fit: contain;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border: var(--borderWidth000) solid transparent;
  border-radius: 8px;
  width: -webkit-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  max-width: 100%;
  max-height: 100%;
}
.MessageOptions_skeleton_class__70l9a button > div:first-child > svg {
  height: 16px;
  width: auto;
}

.MessageOptions_skeleton_class__70l9a button > div:last-child {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.MessageOptions_skeleton_class__70l9a button > div:last-child > svg {
  width: 12px;
  height: 12px;
  background-color: var(--gray000);
  color: var(--orange500);
  border-radius: 100%;
}
@media (max-width: 900px) {
  .MessageOptions_skeleton_class__70l9a {
    gap: 10px;
  }
}

.BWMC_title-container-master-slotMachine::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--peach700);
  top: 0;
  left: 0;
  z-index: -1;
  border-radius: 0px 7px 0 7px;
}

@keyframes enlarge {

  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.2);
  }
}

.BWMC_subContent-gif {
    transition: all 0.4s ease;
}

.BWMC_subContent-gif-enlarge {
    animation-name: enlarge;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
}


.BWMC_subContent-gif-enlarge-slotMachine {
    animation-delay: 2s;
    animation-duration: 1.6s;
}

.BWMC_subContent-gif-force-enlarge {
    transform: scale(1.2) !important;
}

.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position: relative;
}
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-default .odometer-digit {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position: relative;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner {
  text-align: left;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon {
  display: block;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner {
  display: block;
  -webkit-backface-visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-default .odometer-digit .odometer-value {
  display: block;
  -webkit-transform: translateZ(0);
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value {
  position: absolute;
}
.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner {
  transition: transform 2s;
}
.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner {
  transform: translateY(-100%);
}
.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner {
  transform: translateY(-100%);
}
.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
  transition: transform 2s;
  transform: translateY(0);
}

.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
  font-family: "Helvetica Neue", sans-serif;
  line-height: 1.1em;
}
.odometer.odometer-auto-theme .odometer-value, .odometer.odometer-theme-default .odometer-value {
  text-align: center;
}

.ReplyAll_skeleton_class__ZXEYa {
  display: flex;
  flex-direction: column;
  overflow: auto;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 5px;
  margin: auto;
  padding: 5px 5px 0 5px;
  border-radius: 8px;
}

.ReplyAll_skeleton_class__ZXEYa > div {
  width: 100%;
  max-width: calc(100% - 10px);
  background-color: var(--gray000);
  border-radius: 8px;
  padding: 8px;
  height: 60px;
}

.ReplyAll_skeleton_class__ZXEYa > p,
.ReplyAll_skeleton_class__ZXEYa > div > p {
  display: block;
  font-size: 0.85em;
  font-size: 9px;
  line-height: 2;
  color: var(--orange800);
  min-width: 100%;
  text-align: center;
}

/* ==================== Animations ==================== */
.Styles_pulse__c5yAg {
  animation: Styles_Pulse__CNMK4 2000ms ease-in-out infinite;
}

@keyframes Styles_Pulse__CNMK4 {
  0% { opacity: 1; }
  50% { opacity: 0.75; }
  100% { opacity: 1; }
}

.Styles_fade__Wzvi- {
  animation: Styles_Fade__dML0Y 1000ms ease-in-out;
}

@keyframes Styles_Fade__dML0Y {
  0% { opacity: 1; }
  45% { opacity: 0; }
  55% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes Styles_selectPop__oxQQ1 {
  0% { transform: translateY(-50%) scale(1); }
  50% { transform: translateY(-50%) scale(1.2); }
  100% { transform: translateY(-50%) scale(1); }
}

/* ==================== Incoming Message Card ==================== */
.Styles_container__pSxbL {
  min-width: 12rem;
  max-width: 29.3125rem;
}

.Styles_containerOperator__e3xS8 {
  padding: 16px 0 0 10px;
}

.Styles_header__yb\+Gv {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--gray000);
  background-color: var(--orange700);
  border: var(--borderWidth100) solid var(--orange700);
  border-radius: 8px 8px 0 0;
  position: relative;
  font-family: Poppins, sans-serif;
  padding: 6px 30px 6px 8px;
}

.Styles_headerOperator__pa2AU {
  padding: 6px 8px;
  text-indent: 24px;
}

.Styles_optionsList__Z4EBq {
  padding: 4px 16px;
  background: transparent;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border: var(--borderWidth100) solid var(--orange700);
  border-radius: 0 0 8px 8px;
  list-style-type: none;
  margin: 0;
}

.Styles_optionItem__K58Zr {
  font-size: 12px;
  font-family: Poppins, sans-serif;
  color: var(--blue999);
  padding: 4px 0;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
  pointer-events: auto;
}

.Styles_optionItem__K58Zr:hover {
  background-color: rgba(255, 84, 28, 0.1);
  border-radius: 4px;
  margin-left: -4px;
  padding-left: 4px;
}

.Styles_numberBadge__znRqO {
  width: 20px;
  aspect-ratio: 1/1;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  text-align: center;
  padding-right: 2px;
  color: var(--gray000);
  background-color: var(--orange700);
  border: var(--borderWidth200) solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: -26px;
  transform: translateY(-50%);
  transition: all 0.2s ease;
}

.Styles_numberBadgeSelected__5rEub {
  background-color: var(--green800);
  border-color: var(--green600);
  animation: Styles_selectPop__oxQQ1 0.3s ease-out;
}

.Styles_translationContainer__vlfYZ {
  margin: auto;
  padding-bottom: 4px;
  min-width: 220px;
  max-width: 220px;
  text-align: center;
  color: var(--blue999);
  background-color: inherit;
  background-repeat: no-repeat;
  background-size: contain 100%;
  background-position: 50% 100%;
  align-self: center;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  position: relative;
}

.CaughtUp_caughtUpWrapper__t9brl {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  width: 100%;
}

.CaughtUp_caughtUpBox__Dqa\+n {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: center;
  gap: 10px;
  font-weight: 500;
  font-size: 16px;
  position: relative;
  z-index: 1;
  padding: 16px;
}

.CaughtUp_gifCrop__9FTjk {
  height: 75px;
  width: 67px;
  object-fit: cover;
  object-position: top;
}

.CaughtUp_gradientCircle1__cQCSw {
  position: absolute;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(255, 84, 28, 1) 0%,
    rgba(255, 84, 28, 0.65) 25%,
    rgba(255, 84, 28, 0.45) 45%,
    rgba(255, 84, 28, 0.1) 65%,
    rgba(255, 84, 28, 0.04) 80%,
    rgba(255, 84, 28, 0.02) 90%,
    transparent 100%
  );

  filter: blur(1px);
  top: -10px;
  left: 30%;
  z-index: 0;
  opacity: 1;
  animation: CaughtUp_slideLeft1__e1bD2 10s linear infinite;
}

.CaughtUp_gradientCircle2__anUt0 {
  position: absolute;
  width: 165px;
  height: 165px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(117, 19, 242, 0.25) 0%,
    rgba(117, 19, 242, 0.18) 25%,
    rgba(117, 19, 242, 0.12) 45%,
    rgba(117, 19, 242, 0.08) 65%,
    rgba(117, 19, 242, 0.04) 80%,
    rgba(117, 19, 242, 0.02) 90%,
    transparent 100%
  );
  filter: blur(1px);
  top: -50px;
  left: 70%;
  z-index: 0;
  opacity: 1;
  animation: CaughtUp_slideLeft2__tY2Eg 40s linear infinite -8s;
}

.CaughtUp_gradientCircle3__EcNwO {
  position: absolute;
  width: 315px;
  height: 315px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(255, 84, 28, 0.25) 0%,
    rgba(255, 84, 28, 0.18) 25%,
    rgba(255, 84, 28, 0.12) 45%,
    rgba(255, 84, 28, 0.08) 65%,
    rgba(255, 84, 28, 0.04) 80%,
    rgba(255, 84, 28, 0.02) 90%,
    transparent 100%
  );
  filter: blur(1px);
  bottom: -62px;
  left: 100%;
  z-index: 0;
  opacity: 1;
  animation: CaughtUp_slideLeft3__jVM20 40s linear infinite -16s;
}

.CaughtUp_gradientCircle4__-azx2 {
  position: absolute;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(28, 221, 255, 0.25) 0%,
    rgba(28, 221, 255, 0.18) 25%,
    rgba(28, 221, 255, 0.12) 45%,
    rgba(28, 221, 255, 0.08) 65%,
    rgba(28, 221, 255, 0.04) 80%,
    rgba(28, 221, 255, 0.02) 90%,
    transparent 100%
  );
  filter: blur(1px);
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
  z-index: 0;
  opacity: 1;
  animation: CaughtUp_slideLeft4__gHWZ7 40s linear infinite -24s;
}

.CaughtUp_gradientCircle5__rV-zG {
  position: absolute;
  width: 345px;
  height: 345px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(157, 28, 255, 0.25) 0%,
    rgba(157, 28, 255, 0.18) 25%,
    rgba(157, 28, 255, 0.12) 45%,
    rgba(157, 28, 255, 0.08) 65%,
    rgba(157, 28, 255, 0.04) 80%,
    rgba(157, 28, 255, 0.02) 90%,
    transparent 100%
  );
  filter: blur(1px);
  top: 20%;
  left: 100%;
  z-index: 0;
  opacity: 1;
  animation: CaughtUp_slideLeft5__zPKL5 40s linear infinite -32s;
}

@keyframes CaughtUp_slideLeft1__e1bD2 {
  0% {
    left: 130%;
  }
  100% {
    left: -50%;
  }
}

@keyframes CaughtUp_slideLeft2__tY2Eg {
  0% {
    left: 70%;
  }
  50% {
    left: calc(-100% - 200px);
  }
  50.01% {
    left: 100%;
  }
  100% {
    left: 70%;
  }
}

@keyframes CaughtUp_slideLeft3__jVM20 {
  0% {
    left: 100%;
  }
  100% {
    left: calc(-100% - 200px);
  }
}

@keyframes CaughtUp_slideLeft4__gHWZ7 {
  0% {
    left: 100%;
  }
  100% {
    left: calc(-100% - 200px);
  }
}

@keyframes CaughtUp_slideLeft5__zPKL5 {
  0% {
    left: 100%;
  }
  100% {
    left: calc(-100% - 200px);
  }
}

.CaughtUp_leftNotificationPieceContainer__xst9d {
  width: 58px;
  display: flex;
  justify-content: center;
  /* margin-right: 6px; */
  height: 100%;
  align-items: center;
  border-radius: 6px;
  cursor: pointer;
  z-index: 12;
}

/**
 * StarRating styles for GlassConversationFooter
 * Part of MRGN-2037: Survey Feedback for Angel Advisors Workflow
 * 
 * Specs from Figma:
 * - Title: Poppins 600 22px #FF541C
 * - Stars: White fill #FFFFFF, gray stroke #8C8C8C, 3px stroke
 * - Stars filled: California Gold #FFC000
 * - Hint: Poppins 400 18px rgba(154, 153, 152, 0.65)
 */

.StarRating_container__9k0zi {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 0.75rem;
  width: 100%;
  gap: 0.25rem;
  /* Transparent - backdrop pseudo-element handles gradient */
  background: transparent;
}

.StarRating_title__2hjsS {
  font-family: 'Poppins', sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 17px;
  line-height: 24px;
  text-align: center;
  color: #FF541C;
  margin: 0;
}

.StarRating_starsContainer__DWKLL {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  padding: 0.35rem 0;
}

.StarRating_star__jEh8O {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: transform 0.15s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
}

.StarRating_star__jEh8O:hover {
  transform: scale(1.1);
}

.StarRating_star__jEh8O:active {
  transform: scale(0.95);
}

.StarRating_starIcon__fqcIT {
  width: 34px;
  height: 32px;
  transition: fill 0.15s ease-in-out;
}

.StarRating_hint__Y0yZC {
  font-family: 'Poppins', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  color: rgba(154, 153, 152, 0.65);
  margin: 0;
}

/* Responsive adjustments for mobile */
@media (max-width: 480px) {
  .StarRating_container__9k0zi {
    padding: 0.5rem 0.5rem;
  }
  
  .StarRating_title__2hjsS {
    font-size: 15px;
    line-height: 20px;
  }
  
  .StarRating_starIcon__fqcIT {
    width: 28px;
    height: 26px;
  }
  
  .StarRating_starsContainer__DWKLL {
    gap: 0.35rem;
  }
  
  .StarRating_hint__Y0yZC {
    font-size: 12px;
    line-height: 16px;
  }
}

/* ==================== Loading Skeleton ==================== */
.StarRating_skeletonContainer__aHqYJ {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  min-height: 80px;
}

.StarRating_skeletonStarsContainer__DCAez {
  display: flex;
  gap: 8px;
}

.StarRating_skeletonStar__q1Xnb {
  width: 32px;
  height: 32px;
  background-color: rgba(255, 84, 28, 0.1);
  border-radius: 50%;
}

/* ==================== Animations ==================== */
.Styles_pulse__5vWoz {
  animation: Styles_Pulse__wEAO0 2000ms ease-in-out infinite;
}

@keyframes Styles_Pulse__wEAO0 {
  0% { opacity: 1; }
  50% { opacity: 0.75; }
  100% { opacity: 1; }
}

/* ==================== Outgoing Message Card ==================== */
.Styles_container__EUKob {
  min-width: 12rem;
  max-width: 29.3125rem;
  cursor: pointer;
}

.Styles_header__OBVK- {
  padding: 6px 8px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  font-family: Poppins, sans-serif;
  color: var(--gray000);
  background-color: var(--orange700);
  border: var(--borderWidth100) solid var(--orange700);
  border-radius: 8px 8px 0 0;
  text-align: center;
  position: relative;
}

.Styles_optionsList__a1s5V {
  padding: 4px 16px;
  margin: 0;
  background: transparent;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border: var(--borderWidth100) solid var(--orange700);
  border-radius: 0 0 8px 8px;
  list-style-type: none;
}

.Styles_optionItem__YyI8p {
  font-size: 12px;
  font-family: Poppins, sans-serif;
  text-align: left;
  color: var(--blue999);
  padding: 4px 0;
  position: relative;
}

.Styles_numberBadge__UtNXx {
  width: 20px;
  aspect-ratio: 1/1;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  text-align: center;
  color: var(--gray000);
  background-color: var(--green800);
  border: var(--borderWidth200) solid var(--green600);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: -26px;
  transform: translateY(-50%);
}

.WelcomeUserInterface_welcomeWrapper__-ud5u {
  position: relative;
  max-width: 400px;
  margin: 10px auto;
  overflow: hidden;
  border-radius: 12px;
}

.WelcomeUserInterface_welcomeContainer__Liest {
  position: relative;
  z-index: 0;
  text-align: center;
  color: var(--orange800);
  padding: 20px 10px 10px 10px;
  opacity: 1;
}

.WelcomeUserInterface_gradientCircle1__WBGjh {
  position: absolute;
  width: 375px;
  height: 375px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 84, 28, 0.25) 0%, rgba(255, 84, 28, 0.18) 25%, rgba(255, 84, 28, 0.12) 45%, rgba(255, 84, 28, 0.08) 65%, rgba(255, 84, 28, 0.04) 80%, rgba(255, 84, 28, 0.02) 90%, transparent 100%);
  filter: blur(1px);
  top: -38px;
  left: 30%;
  z-index: 0;
  opacity: 1;
  animation: WelcomeUserInterface_slideLeft1__FNswr 40s linear infinite;
}

.WelcomeUserInterface_gradientCircle2__\+B6ip {
  position: absolute;
  width: 165px;
  height: 165px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(117, 19, 242, 0.25) 0%, rgba(117, 19, 242, 0.18) 25%, rgba(117, 19, 242, 0.12) 45%, rgba(117, 19, 242, 0.08) 65%, rgba(117, 19, 242, 0.04) 80%, rgba(117, 19, 242, 0.02) 90%, transparent 100%);
  filter: blur(1px);
  top: -50px;
  left: 70%;
  z-index: 0;
  opacity: 1;
  animation: WelcomeUserInterface_slideLeft2__jEXLO 40s linear infinite -8s;
}

.WelcomeUserInterface_gradientCircle3__y\+g2h {
  position: absolute;
  width: 315px;
  height: 315px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 84, 28, 0.25) 0%, rgba(255, 84, 28, 0.18) 25%, rgba(255, 84, 28, 0.12) 45%, rgba(255, 84, 28, 0.08) 65%, rgba(255, 84, 28, 0.04) 80%, rgba(255, 84, 28, 0.02) 90%, transparent 100%);
  filter: blur(1px);
  bottom: -62px;
  left: 100%;
  z-index: 0;
  opacity: 1;
  animation: WelcomeUserInterface_slideLeft3__urLb0 40s linear infinite -16s;
}

.WelcomeUserInterface_gradientCircle4__LubgR {
  position: absolute;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(28, 221, 255, 0.25) 0%, rgba(28, 221, 255, 0.18) 25%, rgba(28, 221, 255, 0.12) 45%, rgba(28, 221, 255, 0.08) 65%, rgba(28, 221, 255, 0.04) 80%, rgba(28, 221, 255, 0.02) 90%, transparent 100%);
  filter: blur(1px);
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
  z-index: 0;
  opacity: 1;
  animation: WelcomeUserInterface_slideLeft4__-ctEY 40s linear infinite -24s;
}

.WelcomeUserInterface_gradientCircle5__SQ9ui {
  position: absolute;
  width: 345px;
  height: 345px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(157, 28, 255, 0.25) 0%, rgba(157, 28, 255, 0.18) 25%, rgba(157, 28, 255, 0.12) 45%, rgba(157, 28, 255, 0.08) 65%, rgba(157, 28, 255, 0.04) 80%, rgba(157, 28, 255, 0.02) 90%, transparent 100%);
  filter: blur(1px);
  top: 20%;
  left: 100%;
  z-index: 0;
  opacity: 1;
  animation: WelcomeUserInterface_slideLeft5__u5N9Z 40s linear infinite -32s;
}

.WelcomeUserInterface_greetingSection__cuBxJ {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--orange800);
}

.WelcomeUserInterface_middleSection__eHIHJ {
  margin-bottom: 20px;
  color: var(--orange800);
  font-size: 14px;
  cursor: pointer;
  padding: 0 30px;
}

.WelcomeUserInterface_trendingText__N51wD {
  font-size: 14px;
  color: var(--orange800);
  margin-bottom: 8px;
  letter-spacing: 0.4px;
  text-align: left;
}

.WelcomeUserInterface_currentTextWrapper__vHtwq {
  height: 2.6em;
  line-height: 1.3;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
}

.WelcomeUserInterface_trendingIcon__JNc9b {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 1px;
}

.WelcomeUserInterface_currentText__7\+ahX {
  font-size: 13px;
  text-align: left;
  flex: 1 1;
}

.WelcomeUserInterface_bottomSection__mNZXM {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.WelcomeUserInterface_appsButtonContainer__pmngp {
  display: flex;
  align-items: center;
  gap: 8px;
}

.WelcomeUserInterface_authButtonsContainer__DQEJK {
  display: flex;
  align-items: center;
  gap: 8px;
}

.WelcomeUserInterface_iconCircle__sWzZf {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: white;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}

.WelcomeUserInterface_appsButton__BaRZA {
  background: none;
  border: none;
  color: var(--orange800);
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  padding: 0;
}

.WelcomeUserInterface_appsButton__BaRZA:hover {
  opacity: 0.8;
}

.WelcomeUserInterface_authButtons__XFmOU {
  display: flex;
  align-items: center;
  gap: 5px;
}

.WelcomeUserInterface_signInButton__EfmnV,
.WelcomeUserInterface_signUpButton__eTKgi,
.WelcomeUserInterface_trainingButton__qqMEU {
  background: none;
  border: none;
  color: var(--orange800);
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  padding: 0;
}

.WelcomeUserInterface_signInButton__EfmnV:hover,
.WelcomeUserInterface_signUpButton__eTKgi:hover,
.WelcomeUserInterface_trainingButton__qqMEU:hover {
  opacity: 0.8;
}

.WelcomeUserInterface_separator__SNJGn {
  color: var(--orange800);
  font-weight: bold;
  margin: 0 2px;
}
@keyframes WelcomeUserInterface_slideLeft1__FNswr {
  0% {
    left: 30%;
  }
  50% {
    left: calc(-100% - 200px);
  }
  50.01% {
    left: 100%;
  }
  100% {
    left: 30%;
  }
}

@keyframes WelcomeUserInterface_slideLeft2__jEXLO {
  0% {
    left: 70%;
  }
  50% {
    left: calc(-100% - 200px);
  }
  50.01% {
    left: 100%;
  }
  100% {
    left: 70%;
  }
}

@keyframes WelcomeUserInterface_slideLeft3__urLb0 {
  0% {
    left: 100%;
  }
  100% {
    left: calc(-100% - 200px);
  }
}

@keyframes WelcomeUserInterface_slideLeft4__-ctEY {
  0% {
    left: 100%;
  }
  100% {
    left: calc(-100% - 200px);
  }
}

@keyframes WelcomeUserInterface_slideLeft5__u5N9Z {
  0% {
    left: 100%;
  }
  100% {
    left: calc(-100% - 200px);
  }
}

@media (max-width: 500px) {
  .WelcomeUserInterface_welcomeWrapper__-ud5u {
    max-width: 350px;
  }
  
  .WelcomeUserInterface_gradientCircle1__WBGjh {
    width: 280px;
    height: 280px;
  }
  
  .WelcomeUserInterface_gradientCircle2__\+B6ip {
    width: 240px;
    height: 240px;
  }
  
  .WelcomeUserInterface_gradientCircle3__y\+g2h {
    width: 200px;
    height: 200px;
  }
  
  .WelcomeUserInterface_appsButtonContainer__pmngp,
  .WelcomeUserInterface_authButtonsContainer__DQEJK {
    flex-direction: column;
    gap: 4px;
  }
}

.SelectMultiple_container__MWcuW {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem 0.75rem 1.5rem;
  width: 100%;
  gap: 0.25rem;
  transition: all 0.35s ease-out;
}

/* Compact state - smaller when no options selected */
.SelectMultiple_compact__EUvbU {
  padding: 0.4rem 0.75rem 0.5rem;
}

.SelectMultiple_compact__EUvbU .SelectMultiple_cardsContainer__nvvDQ {
  min-height: 1rem;
  padding: 0.25rem;
}

.SelectMultiple_compact__EUvbU .SelectMultiple_hint__qvFVK {
  display: none; /* Hide hint when no options selected */
}

/* Expanded state - grows upward when options are selected */
.SelectMultiple_expanded__OtCGh {
  padding: 0.5rem 0.75rem 1.5rem;
  animation: SelectMultiple_expandUp__ufelY 0.35s ease-out forwards;
}

@keyframes SelectMultiple_expandUp__ufelY {
  0% {
    transform: scaleY(0.85);
    transform-origin: bottom center;
  }
  100% {
    transform: scaleY(1);
    transform-origin: bottom center;
  }
}

.SelectMultiple_expanded__OtCGh .SelectMultiple_cardsContainer__nvvDQ {
  min-height: 3rem;
  padding: 0.5rem 0.5rem 1.5rem;
}

.SelectMultiple_title__PFY7a {
  font-family: 'Poppins', sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 15px;
  line-height: 20px;
  text-align: center;
  color: #FF541C;
  margin: 0;
}

/* ==================== Animated Option Cards ==================== */
.SelectMultiple_cardsContainer__nvvDQ {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 0.5rem;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  min-height: 3rem;
  padding: 0.5rem 0.5rem 1.5rem; /* Extra bottom padding for checkboxes extending beyond cards */
}

.SelectMultiple_card__pnDRI {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 115px;
  max-width: 130px;
  padding: 0.5rem 0.75rem 1rem;
  background: rgba(255, 255, 255, 0.95);
  border: 2px solid var(--orange700);
  border-radius: 8px;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
}

.SelectMultiple_card__pnDRI:hover {
  background: rgba(255, 84, 28, 0.1);
  box-shadow: 0 0 8px rgba(255, 84, 28, 0.4);
}

/* Hidden state - collapsed */
.SelectMultiple_cardHidden__Qx5zf {
  opacity: 0;
  transform: scale(0);
  width: 0;
  min-width: 0;
  max-width: 0;
  padding: 0;
  margin: 0;
  border-width: 0;
  overflow: hidden;
}

/* Visible state */
.SelectMultiple_cardVisible__cSmao {
  opacity: 1;
  transform: scale(1);
  background: rgba(255, 84, 28, 0.15);
}

/* Animation for appearing cards */
.SelectMultiple_cardAnimating__9ehCf {
  animation: SelectMultiple_cardAppear__srFdH 0.5s ease-out forwards;
}

@keyframes SelectMultiple_cardAppear__srFdH {
  0% {
    opacity: 0;
    transform: scale(0) rotate(-10deg);
  }
  50% {
    opacity: 0.8;
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
}

.SelectMultiple_cardNumber__TUKru {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  background: var(--orange700);
  color: white;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.SelectMultiple_cardText__kAAE2 {
  font-size: 11px;
  font-weight: 500;
  color: var(--gray900);
  text-align: center;
  word-wrap: break-word;
  line-height: 1.3;
}

.SelectMultiple_cardCheckbox__a-\+WG {
  height: 1rem;
  width: 1rem;
  border: 2px solid var(--orange700);
  border-radius: 50%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 50%);
  background-color: #FFFFFF;
  transition: all 100ms ease-in-out;
}

.SelectMultiple_cardCheckboxSelected__KhrV8 {
  background-color: var(--green800);
  border-color: var(--green800);
}

/* ==================== Hint Text ==================== */
.SelectMultiple_hint__qvFVK {
  font-family: 'Poppins', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  color: rgba(154, 153, 152, 0.65);
  margin: 0;
  margin-top: 0.5rem;
}

/* ==================== Mobile Responsive Adjustments ==================== */

/* Standard mobile devices (up to 480px) */
@media (max-width: 480px) {
  .SelectMultiple_container__MWcuW {
    padding: 0.4rem 0.5rem 0.6rem;
  }
  
  .SelectMultiple_title__PFY7a {
    font-size: 14px;
    line-height: 18px;
  }
  
  .SelectMultiple_hint__qvFVK {
    font-size: 11px;
    line-height: 14px;
  }
  
  .SelectMultiple_card__pnDRI {
    min-width: 100px;
    max-width: 110px;
  }
  
  .SelectMultiple_cardText__kAAE2 {
    font-size: 10px;
  }
  
  .SelectMultiple_expanded__OtCGh .SelectMultiple_cardsContainer__nvvDQ {
    padding-bottom: 2rem;
  }
}

/* Small mobile devices (up to 400px - iPhone SE, small Android) */
@media (max-width: 400px) {
  .SelectMultiple_card__pnDRI {
    min-width: 85px;
    max-width: 95px;
    padding: 0.4rem 0.5rem 0.8rem;
  }
  
  .SelectMultiple_cardNumber__TUKru {
    width: 1.25rem;
    height: 1.25rem;
    font-size: 11px;
  }
  
  .SelectMultiple_cardText__kAAE2 {
    font-size: 9px;
    line-height: 1.2;
  }
  
  .SelectMultiple_cardsContainer__nvvDQ {
    gap: 0.5rem 0.35rem;
  }
  
  .SelectMultiple_title__PFY7a {
    font-size: 13px;
  }
  
  .SelectMultiple_hint__qvFVK {
    font-size: 10px;
  }
}

/* Very small screens (up to 360px) - horizontal scroll */
@media (max-width: 360px) {
  .SelectMultiple_cardsContainer__nvvDQ {
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  
  .SelectMultiple_cardsContainer__nvvDQ::-webkit-scrollbar {
    display: none;
  }
  
  .SelectMultiple_card__pnDRI {
    flex-shrink: 0;
    min-width: 80px;
    max-width: 90px;
  }
}

/* Extra small screens (up to 320px) */
@media (max-width: 320px) {
  .SelectMultiple_card__pnDRI {
    min-width: 75px;
    max-width: 85px;
    padding: 0.35rem 0.4rem 0.7rem;
  }
  
  .SelectMultiple_cardNumber__TUKru {
    width: 1.1rem;
    height: 1.1rem;
    font-size: 10px;
  }
  
  .SelectMultiple_cardCheckbox__a-\+WG {
    height: 0.85rem;
    width: 0.85rem;
  }
  
  .SelectMultiple_title__PFY7a {
    font-size: 12px;
  }
}

/* ==================== Loading Skeleton ==================== */
.SelectMultiple_skeletonContainer__c5wIz {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  min-height: 80px;
}

.SelectMultiple_skeletonBar__XZwzy {
  width: 60%;
  height: 20px;
  background-color: rgba(255, 84, 28, 0.2);
  border-radius: 4px;
  margin-bottom: 0.5rem;
}

.LinkPreview_class__oF3lG {
  --time-in-ms: 500ms;
  display: block;
  position: absolute;
  inset: 0;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
  z-index: 14;
}
.LinkPreview_class__oF3lG > div {
  interpolate-size: allow-keywords;
  position: absolute;
  right: 0;
  top: 50%;
  aspect-ratio: inherit;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  opacity: 0;
  transition: width var(--time-in-ms) ease-out calc(3 * var(--time-in-ms)), height var(--time-in-ms) ease-out calc(3 * var(--time-in-ms));
}
.LinkPreview_class__oF3lG > div > section,
.LinkPreview_class__oF3lG > div > section > main,
.LinkPreview_class__oF3lG > div > section > main > iframe {
  width: 100%;
  height: 100%;
  padding: 0;
}
.LinkPreview_class__oF3lG > div > section > main > iframe {
  opacity: 0;
  transition: opacity var(--time-in-ms) ease-out calc(6 * var(--time-in-ms));
  border: var(--borderWidth000);
}
.LinkPreview_class__oF3lG > nav {
  position: absolute;
  left: 10px;
  right: 10px;
  opacity: 0;
  transform: translateY(20px);
  transition: transform var(--time-in-ms) ease-out calc(5 * var(--time-in-ms)), opacity var(--time-in-ms) ease-out calc(4.5 * var(--time-in-ms));
  max-width: 18rem;
  width: -webkit-fit-content;
  width: fit-content;
  margin: auto;
}
.LinkPreview_class__oF3lG > nav > div,
.LinkPreview_class__oF3lG > nav > div > section {
  width: -webkit-fit-content;
  width: fit-content;
}
.LinkPreview_class__oF3lG > nav > div > section > main {
  display: flex;
  flex-direction: row;
  gap: 10px;
  padding: 10px 30px;
  align-items: center;
  justify-content: center;
  width: -webkit-fit-content;
  width: fit-content;
  cursor: grab;
}
.LinkPreview_class__oF3lG > nav > div > section > main > svg {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  color: var(--gray800);
  pointer-events: none;
}
.LinkPreview_class__oF3lG > nav > div > section > main > span > button,
.LinkPreview_class__oF3lG > nav > div > section > main > button {
  box-shadow: none;
}
.LinkPreview_class__oF3lG > nav > div > section > main > button *,
.LinkPreview_class__oF3lG > nav > div > section > main > span > button * {
  mix-blend-mode: normal;
  color: var(--orange500);
}
.LinkPreview_class__oF3lG nav span {
  position: relative;
}
.LinkPreview_class__oF3lG nav span span {
  position: absolute;
  display: block;
  width: 1rem;
  height: 1rem;
  background-color: var(--orange500);
  color: var(--gray000);
  top: 0;
  right: 0;
  border-radius: 100%;
  z-index: 10;
  font-size: 10px;
  align-content: center;
  justify-items: center;
  text-align: center;
  opacity: 1;
  transition: opacity var(--time-in-ms) ease-out calc(3 * var(--time-in-ms));
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.LinkPreview_class__oF3lG nav span span:empty {
  opacity: 0;
}
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX {
  pointer-events: all;
  user-select: contain;
}
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX > div,
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX > nav {
  opacity: 1;
}
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX > nav {
  transform: translateY(0px);
  pointer-events: fill;
}
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX > div {
  width: 100%;
  height: 100%;
}
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX iframe {
  opacity: 1;
}
.LinkPreview_class__oF3lG > span {
  display: block;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
  position: absolute;
  top: -50px;
  left: calc(50% - 22px);
  width: 44px;
  height: 44px;
  border-radius: 50%;
}
.LinkPreview_class__oF3lG.LinkPreview_src__DZpqX > nav > div {
  animation: LinkPreview_pulse__c7Vdz calc(3 * var(--time-in-ms)) cubic-bezier(1, 0, .91, .39) forwards calc(4 * var(--time-in-ms));
}
@keyframes LinkPreview_pulse__c7Vdz {
  0% {
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.6);
  }
  25% {
    border: var(--borderWidth300) solid var(--orange500);
  }
  50% {
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.6);
  }
  75% {
    border: var(--borderWidth300) solid var(--orange500);
  }
  100% {
    border: var(--borderWidth300) solid rgba(255, 255, 255, 0.6);
  }
}

.hintOptionContainer a, .allMountedHintContainer a {
    text-decoration: none;
    font-weight: 700;
    color: #000E90;
}

.wumc_circles_container {
    position: absolute;
    top: 22px;
    left: 10px;
    z-index: -2;
    transition: all 1s linear;
    opacity: 0;
}

.opacity1 {
    opacity: 1;
}

.opacity0 {
    opacity: 0;
}

.logoContainer::before {
    z-index: -2;
    content: '';
    position: absolute;
    bottom: 2px;
    left: -7px;
    width: 94px;
    height: 48px;
    background-color: #fff3ee;
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
}


.referrerImgContainer {
    cursor: default !important;
}

.referrerImgContainer::before {
    z-index: -2;
    content: '';
    position: absolute;
    bottom: -14px;
    left: -3px;
    width: 85px;
    height: 46px;
    background-color: #fff3ee;
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
}

.logoContainer-circle-background {
    width: 70px;
    height: 70px;
    position: absolute;
    background-color: #fff3ee;
    z-index: -1;
    top: 16px;
    left: 5px;
    border-radius: 50%;
}

.logoContainer-circle-1 {
    width: 60px;
    height: 60px;
    position: absolute;
    background-color: #f9ccb2;
    z-index: -2;
    border-radius: 50%;
    filter: blur(7px);
    animation: moveCircular 2s infinite linear;
}

.logoContainer-circle-2 {
    width: 60px;
    height: 60px;
    position: absolute;
    background-color: rgb(255, 116, 0);
    z-index: -2;
    border-radius: 50%;
    filter: blur(7px);
    animation: moveCircular 2.5s infinite linear;
}

.logoContainer-circle-3 {
    width: 60px;
    height: 60px;
    position: absolute;
    background-color: #FF541C;
    z-index: -2;
    border-radius: 50%;
    filter: blur(7px);
    animation: moveCircular 1.5s infinite linear;
}


@keyframes moveCircular { 
    0% { 
        transform: rotate(0deg)  
              translateY(10px) rotate(0deg); 
    } 

    100% { 
        transform: rotate(360deg)  
              translateY(10px) rotate(-360deg); 
    } 
}

.initialConsentPortion {
    height: 0px;
    opacity: 0;
}

.hintOptionContainer {
    transition: background-color 0.5s ease;
    -webkit-transition: background-color 0.5s ease; /* Safari and older browsers */
    -moz-transition: background-color 0.5s ease;
    padding-left: 15px;
    padding-right: 6px;
    /* border-radius: 0px 10px 10px 0px; */
    padding-top: 0px;
    padding-bottom: 0px;
    cursor: pointer;
    position: relative;
    width: 100%;
    transform: translateX(-100%); /* Start off-screen to the left */
    opacity: 0;
    height: 0px;
    display: flex;
    align-items: center;
}

.hintOptionContainer::after, .allMountedHintContainer::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 1px; /* Border height */
    background-color: rgb(255, 116, 0); /* Border color */
    transition: width 0.5s ease; /* Animation duration and easing */
    opacity: 0;
}

.hintOptionContainer::before, .allMountedHintContainer::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px; /* Border height */
    background-color: rgb(255, 116, 0); /* Border color */
    transition: width 0.5s ease; /* Animation duration and easing */
    opacity: 0;
}

.allMountedHintContainer.hovered, .hintOptionContainer.hovered {
    background-color: var(--peach600);
}

.hintOptionContainer > :first-child,
.allMountedHintContainer > :first-child {
    transition: all 0.4s ease;
}

.allMountedHintContainer {
    padding-top: 9px;
    padding-bottom: 9px;
    opacity: 1;
    height: -webkit-fit-content;
    height: fit-content;
    transition: background-color 0.5s ease;
    -webkit-transition: background-color 0.5s ease;
    -moz-transition: background-color 0.5s ease;
    padding-left: 15px;
    padding-right: 6px;

    cursor: pointer;
    position: relative;
    width: 100%;
    display: flex;
    align-items: start;
}

.measuringHintContainer {
    transition: all 0.4s ease;
    padding-left: 15px;
    padding-right: 6px;
    /* border-radius: 0px 10px 10px 0px; */
    padding-top: 9px;
    padding-bottom: 9px;
    cursor: pointer;
    position: relative;
    width: 100%;
    display: flex;
    align-items: start;
    height: -webkit-fit-content !important;
    height: fit-content !important;
}

@media (max-width: 900px){
    .measuringHintContainer, .allMountedHintContainer{
        padding-top: 5px;
        padding-bottom: 5px;
    }
}

/* Apply hover effect only for screens larger than 1024px (i.e., exclude tablets and mobiles) */
@media only screen and (min-width: 1025px) {
    .hintOptionContainer:hover, .allMountedHintContainer:hover {
      background-color: #ffe0cf;
    }

    .hintOptionContainer:hover::after, 
    .hintOptionContainer:hover::before, 
    .allMountedHintContainer:hover::after, 
    .allMountedHintContainer:hover::before {
        width: 100%;
        opacity: 0.6;
    }
    
    .hintOptionContainer:hover > :first-child,
    .allMountedHintContainer:hover > :first-child {
        /* background-color: #FFF3EE !important; */
        background-color: rgb(253, 166, 94) !important;
        transform: scale(1.1);
    }
  }


.WUM_Action_Button {
    position: relative;
    overflow: hidden;
}

.WUM_Action_Button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -230%;
    width: 200%;
    height: 100%;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.1) 100%);
    transform: skewX(-30deg);
    transition: left 0.5s ease-in;
}

.WUM_Action_Button:hover::before {
    left: 100%;
}

.GlassConversationFooter_class__aYdZa {
  position: absolute;
  left: 22px;
  right: 27px;
  bottom: 2px;
  opacity: 1;
  z-index: 0;
}
@keyframes GlassConversationFooter_fadein__EAk4W {
  to {
    opacity: 1;
  }
}
.GlassConversationFooter_class__aYdZa > div > section > main {
  interpolate-size: allow-keywords;
  align-content: center;
  justify-items: center;
  position: relative;
  margin-bottom: var(--margin-bottom);
  max-height: calc(100vh - 146px);
  animation: GlassConversationFooter_expand__sUkXU 0.5s forwards 0.5s, GlassConversationFooter_overflow__SxviW 0.6s forwards 0.6s;
  height: 0;
  overflow: clip;
}
.GlassConversationFooter_class__aYdZa > div > section > main > *:not(.GlassConversationFooter_class__aYdZa) {
  opacity: 0;
  animation: GlassConversationFooter_overflow__SxviW 0.6s forwards 0.6s, GlassConversationFooter_fadein__EAk4W 0.5s forwards 0.5s;
  overflow: clip;
}
@keyframes GlassConversationFooter_expand__sUkXU {
  to {
    height: auto;
  }
}
@keyframes GlassConversationFooter_overflow__SxviW {
  0% {
    overflow: clip;
  }
  99% {
    overflow: clip;
  }
  100% {
    overflow: auto;
  }
}

@media (max-width: 900px) {
  .GlassConversationFooter_class__aYdZa {
    left: 12px;
    right: 17px;
  }
  .GlassConversationFooter_class__aYdZa > div > section > main {
    max-height: calc(100vh - 126px);
  }
}


.GlassConversationFooter_class__aYdZa.GlassConversationFooter_MessageOptions__VXMWU::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  filter: blur(40px);
  width: 110px;
  height: 95px;
  border-radius: 100%;
  background-color: var(--orange700);
}

/* StarRating: Standard sizing like other glass containers */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_StarRating__HDeuM {
  /* Use standard positioning from .class - no overflow needed */
}

/* Custom gradient background for StarRating */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_StarRating__HDeuM::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* Vibrant gradient - App Gallery inspired */
  background: 
              radial-gradient(circle at 10% 35%, rgba(255, 84, 28, 0.55) 0%, transparent 55%),
              radial-gradient(circle at 90% 30%, rgba(48, 83, 252, 0.5) 0%, transparent 55%),
              radial-gradient(circle at 80% 80%, rgba(28, 221, 255, 0.5) 0%, transparent 55%),
              radial-gradient(circle at 20% 75%, rgba(157, 28, 255, 0.35) 0%, transparent 50%),
              radial-gradient(circle at 50% 50%, rgba(255, 192, 0, 0.15) 0%, transparent 60%),
              rgba(255, 255, 255, 0.75);
  background-blend-mode: screen;
  border-radius: 10px;
  border: 2px solid #FF541C;
  pointer-events: none;
  z-index: 0;
}

/* Ensure content is above the backdrop */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_StarRating__HDeuM > * {
  position: relative;
  z-index: 1;
}

/* Make Glass component transparent so only our backdrop shows */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_StarRating__HDeuM > div {
  background: transparent !important;
  border: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Hide the Glass noise overlay */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_StarRating__HDeuM > div::before {
  display: none !important;
}

/* ===================== SelectMultiple Styles ===================== */

/* SelectMultiple: Standard sizing like other glass containers */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ {
  /* Use standard positioning from .class */
}

/* Custom gradient background for SelectMultiple (same as StarRating) */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* Vibrant gradient - App Gallery inspired */
  background: 
              radial-gradient(circle at 10% 35%, rgba(255, 84, 28, 0.55) 0%, transparent 55%),
              radial-gradient(circle at 90% 30%, rgba(48, 83, 252, 0.5) 0%, transparent 55%),
              radial-gradient(circle at 80% 80%, rgba(28, 221, 255, 0.5) 0%, transparent 55%),
              radial-gradient(circle at 20% 75%, rgba(157, 28, 255, 0.35) 0%, transparent 50%),
              radial-gradient(circle at 50% 50%, rgba(255, 192, 0, 0.15) 0%, transparent 60%),
              rgba(255, 255, 255, 0.75);
  background-blend-mode: screen;
  border-radius: 10px;
  border: 2px solid #FF541C;
  pointer-events: none;
  z-index: 0;
}

/* Ensure content is above the backdrop */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > * {
  position: relative;
  z-index: 1;
}

/* Make Glass component transparent so only our backdrop shows */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div {
  background: transparent !important;
  border: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Hide the Glass noise overlay */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div::before {
  display: none !important;
}

/* Reduce Glass component internal padding for compact layout */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section {
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > header {
  padding: 0 !important;
}

.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > footer {
  padding: 0 !important;
  margin-top: 0.5rem !important; /* Space between options and input box */
}

.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > main {
  margin: 0 !important;
  margin-bottom: 1rem !important; /* Extra space between options and footer */
  overflow: visible !important; /* Allow checkboxes extending beyond cards to show */
  height: auto !important; /* Override base height: 0 */
  max-height: none !important; /* Remove max-height constraint */
  min-height: 120px !important; /* Ensure minimum visible height */
  animation: none !important; /* Disable expand animation - show immediately */
}

/* Ensure SelectMultiple content doesn't get clipped and is visible */
.GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > main > * {
  overflow: visible !important;
  opacity: 1 !important; /* Override base opacity: 0 */
  animation: none !important; /* Disable fadein animation - show immediately */
}

/* ==================== Mobile Responsive for SelectMultiple ==================== */
@media (max-width: 480px) {
  .GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > main {
    padding-bottom: 0.5rem !important;
  }
  
  .GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > footer {
    margin-top: 0.75rem !important;
  }
}

@media (max-width: 360px) {
  .GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ {
    left: 8px;
    right: 13px;
  }
  
  .GlassConversationFooter_class__aYdZa.GlassConversationFooter_SelectMultiple__jeioQ > div > section > main {
    padding-bottom: 0.25rem !important;
  }
}

.TextMessageContent_skeleton_class__7hVuw {
  display: flex;
  width: -webkit-fit-content;
  width: fit-content;
  flex-direction: column;
  max-width: min(90%, calc(100vw - 50px));
  min-width: 85px;
  position: relative;
  align-items: flex-start;
}

.TextMessageContent_skeleton_messageAlignByCurrentUser__FhGxU {
  align-items: flex-end;
}

.TextMessageContent_skeleton_class__7hVuw > * {
  margin-bottom: -20px;
  position: relative;
  transform: margin-bottom .5s linear;
  -webkit-user-select: none;
          user-select: none;
}
.TextMessageContent_skeleton_class__7hVuw > button,
.TextMessageContent_skeleton_class__7hVuw > *:last-child {
  margin-bottom: 0;
}
.TextMessageContent_skeleton_class__7hVuw > * > * {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
}

.TextMessageContent_skeleton_class__7hVuw > * > div:last-of-type {
  pointer-events: none;
  width: -webkit-fit-content !important;
  width: fit-content !important;
  min-width: 85px !important;
  max-width: 100% !important;
  position: relative !important;
}
.TextMessageContent_skeleton_class__7hVuw > * > div:last-child > div > div > div:last-of-type {
  padding: 6px 7px 8px 9px !important;
}
.TextMessageContent_skeleton_class__7hVuw > * > div:last-child > div > div {
  flex-direction: row-reverse !important;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_messageAlignByCurrentUser__FhGxU > * > div:last-child > div > div {
  flex-direction: row !important;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_messageAlignByCurrentUser__FhGxU > * > div:last-child > div > div > div:last-of-type {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 5px;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_field__PnIjj > * > div:last-child > div > div > div:last-of-type {
  flex-direction: column !important;
}

.TextMessageContent_skeleton_class__7hVuw > * > div > div > div {
  min-width: 85px;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_messageSenderTypeOperator__A-q4O > * > div > div > div {
  min-width: 110px;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_messageSenderTypeOperator__A-q4O.TextMessageContent_skeleton_isOperator__C10IL > * > div > div > div {
  min-width: 150px;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_messageAccessTypeInternal__jIJEK > * > div > div > div {
  min-width: 0 !important;
  min-width: initial !important;
}
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_isTranslated__yqwA3:has( > button) > button > div > div > div,
.TextMessageContent_skeleton_class__7hVuw.TextMessageContent_skeleton_isTranslated__yqwA3:not(.TextMessageContent_skeleton_isTranslated__yqwA3:has( > button)) > div:last-of-type > div > div > div {
  min-width: 220px;
}

@keyframes main_curvedArrowPulse__vpdtX {
  0% {
    transform: scale(1);
  }

  10% {
    transform: scale(1.15);
  }

  20% {
    transform: scale(1);
  }

  30% {
    transform: scale(1.15);
  }

  40% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.15);
  }

  60% {
    transform: scale(1);
  }

  100% {
    transform: scale(1);
  }
}

.main_curvedArrowSvgAppearanceAnimation__6zK7i {
  animation: main_curvedArrowPulse__vpdtX 4s ease-in-out forwards;
}

.scene {
  height: 100px;
  width: calc(100% - 20px);
  padding: 0px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  perspective: calc(300px + 100vw);
  z-index: 99;
  position: relative;
}

.carousel {
  width: 100%;
  height: 100%;
  position: absolute;
  transform: translateZ(-73px);
  transform-style: preserve-3d;
}

.carousel .carousel__cell {
  position: absolute;
  width: 100%;
  margin: 0;
  background-color: var(--gray000);
  -webkit-clip-path: inset(-5px -5px -5px 0px);
          clip-path: inset(-5px -5px -5px 0px);
  text-align: top;
  z-index: 1;
  border-radius: 12px 4px 4px 12px;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  border: var(--borderWidth100) solid var(--orange700);
  border-left: var(--borderWidth000);
  display: flex;
  flex-direction: row;
  align-items: center;
  color: var(--shadow870);
  height: 45px;
  padding: 3px 4px 3px 15px;
  transition: all 0.2s ease;
}

.carousel .carousel__cell input {
  font-size: 16px;
  cursor: ns-resize;
  text-align: left;
}

@media (max-width: 375px) {
  .carousel {
    width: calc(100% - 8px);
  }

  .carousel .carousel__cell {
    padding: 3px 4px 3px 24px;
  }
}

.carousel__cell_hidden {
  width: 100%;
  height: 150px;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  visibility: hidden;
  /* transition: transform 1s, opacity 1s; */
}

/* .carousel__cell {
  position: absolute;
  width: 100%;
  height: 45px;
  border: var(--borderWidth100) solid orangered;
  font-size: 24px;
  font-weight: bold;
  color: black;
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  /* transition: transform 1s, opacity 1s; */
  /* padding-left: 32px; */
  /* backface-visibility: hidden; */
  /* user-select: none; */
/* } */ 

/* Optional: initial transforms for each cell if you need to see them before any state changes */
.carousel__cell:nth-child(1) {
  transform: rotateX(-0deg) translateZ(39px);
}

.carousel__cell:nth-child(2) {
  transform: rotateX(-60deg) translateZ(39px);
}

.carousel__cell:nth-child(3) {
  transform: rotateX(-120deg) translateZ(39px);
}

.carousel__cell:nth-child(4) {
  transform: rotateX(-180deg) translateZ(39px);
}

.carousel__cell:nth-child(5) {
  transform: rotateX(-240deg) translateZ(39px);
}

.carousel__cell:nth-child(6) {
  transform: rotateX(-300deg) translateZ(39px);
}

.carousel-options {
  margin-top: 150px;
  text-align: center;
  position: relative;
  z-index: 2;
  background: hsla(0, 0%, 100%, 0.8);
}

.hide-scrollbar {
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  /* Internet Explorer 10+ */
  overflow: scroll;
  /* still allow scrolling */
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
  /* WebKit browsers (Chrome, Safari) */
}

.hide-focus-outline:focus-visible {
  outline: none !important;
}

.full-width-glass {
  width: 100% !important;
  height: 100% !important;
  border-radius: 12px 4px 4px 12px !important;
  background: rgba(255, 255, 255, 0.6) !important;
  border: var(--borderWidth100) solid rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  filter: grayscale(100%) !important;
  padding: 0 !important;
  margin: 0 !important;
}

.full-width-glass::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox=%270 0 100 100%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cfilter id=%27noiseFilter%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%270.9%27 numOctaves=%274%27 stitchTiles=%27stitch%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23noiseFilter%29%27/%3E%3C/svg%3E") !important;
  background-size: 3px 3px !important;
  opacity: 0.4 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 1 !important;
}

.full-width-glass > section {
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.full-width-glass > section > main {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

.carousel .carousel__cell:not([style*="background-color: var(--gray100)"]) {
  border-color: #c8a2c8 !important;
}

.carousel .carousel__cell[style*="background-color: var(--gray000)"] {
  border-color: #c8a2c8 !important;
}

.scrollWheelContainer {
  border: var(--borderWidth000) !important;
}

.UrlMessageContent_class__Ck0M7 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ {
  align-items: flex-end;
}
.UrlMessageContent_class__Ck0M7 > div:has(>section) {
  min-height: var(--height);
  justify-content: flex-start !important;
  margin-bottom: 8px;
}
.UrlMessageContent_class__Ck0M7 > ul {
  --v-offset: 96.71px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transform: translateY(var(--v-offset));
  transition: transform 0.25s linear;
  margin-bottom: var(--v-offset);
}
.UrlMessageContent_class__Ck0M7.UrlMessageContent_internal__o-AAP > ul {
  display: none;
}
.UrlMessageContent_class__Ck0M7.UrlMessageContent_isExpanded__-LSz- > ul {
  --v-offset: -4px;
  --offset: 0;
}
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul {
  align-items: flex-end;
}
.UrlMessageContent_class__Ck0M7 > ul > li {
  position: relative;
  margin: 0;
  list-style-type: none;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  color: var(--blue999);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 30%), rgba(153, 153, 153, 30%));
  width: 12.5rem;
  aspect-ratio: 1.91;
  border-radius: 8px;
  margin-top: calc(-1 * var(--v-offset));
  transition:
    margin-left 0.25s linear 0.25s,
    margin-right 0.25s linear 0.25s,
    margin-top 0.25s linear 0s;
}
.UrlMessageContent_class__Ck0M7 > ul img {
  border-radius: 8px;
  object-fit: cover;
  position: absolute;
  inset: 3px;
  width: calc(100% - 6px);
  height: calc(100% - 6px);
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.UrlMessageContent_class__Ck0M7 > ul svg {
  position: relative;
  width: 16px;
  height: 16px;
  filter: drop-shadow(0 0 2px black);
  color: white;
}
.UrlMessageContent_class__Ck0M7 > ul p {
  filter: drop-shadow(0 0 2px black);
  color: white;
  font-size: 12px;
  font-family: var(--typographyFontFamily);
}
.UrlMessageContent_class__Ck0M7 > ul button,
.UrlMessageContent_class__Ck0M7 > ul span {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 4px;
  padding: 1px;
}
.UrlMessageContent_class__Ck0M7 > ul button * {
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(1) {
  position: absolute;
  inset: 0;
  z-index: 1;
  border: var(--borderWidth000);
  background-color: transparent;
  cursor: grab;
}
.UrlMessageContent_class__Ck0M7 > ul button:focus:nth-of-type(1) {
  cursor: grabbing;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) {
  position: absolute;
  top: 8px;
  right: 8px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 30%), rgba(153, 153, 153, 30%));
  border-radius: 1000rem;
  z-index: 2;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > span {
  background: linear-gradient(135deg, rgba(255, 255, 255, 60%), rgba(255, 255, 255, 10%));
  border-radius: 1000rem;
  width: 22px;
  height: 22px;
  padding: 3px;
  overflow: hidden;
  position: relative;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > span > div {
  width: 72px;
  gap: -6px;
  height: 24px;
  animation: UrlMessageContent_slide__G0lSc 6s linear infinite;
  position: absolute;
  bottom: 0;
  left: 0;
}
@keyframes UrlMessageContent_slide__G0lSc {
  0% {
    left: 30px;
  }
  50% {
    left: -48px;
  }
  100% {
    left: 30px;
  }
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > span > div > div {
  border-radius: 100%;
  filter: blur(16px);
  opacity: .9;
  width: 30px;
  height: 200%;
  position: absolute;
  top: 12px;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > span > div > div:nth-of-type(1) {
  background-color: #1A6AFF;
  left: -30px;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > span > div > div:nth-of-type(2) {
  background-color: #DB3700;
  left: 18px;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > span > div > div:nth-of-type(3) {
  background-color: #E00087;
  left: 42px;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) {
  width: 100%;
  margin: 3px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  padding: 5px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 60%) 60%);
  position: relative;
  overflow: hidden;
  z-index: 2;
}

@keyframes UrlMessageContent_slide2__DDHUm {
  0% {
    left: 0;
  }
  50% {
    left: -400px;
  }
  100% {
    left: 0;
  }
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) > div {
  width: 600px;
  gap: -50px;
  height: 33.5px;
  animation: UrlMessageContent_slide2__DDHUm 6s linear infinite;
  position: absolute;
  top: 16px;
  left: 0;
}
@media (prefers-reduced-motion: reduce) {
  .UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(2) > div,
  .UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) > div {
    display: none;
  }
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) > div > div {
  border-radius: 100%;
  filter: blur(16px);
  opacity: .9;
  width: 250px;
  height: 200%;
  position: absolute;
  top: 0;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) > div > div:nth-of-type(1) {
  background-color: #1A6AFF;
  left: -50px;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) > div > div:nth-of-type(2) {
  background-color: #DB3700;
  left: 150px;
}
.UrlMessageContent_class__Ck0M7 > ul button:nth-of-type(3) > div > div:nth-of-type(3) {
  background-color: #E00087;
  left: 350px;
}

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(1) { margin-left: calc(var(--offset) * 0) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(1) { margin-right: calc(var(--offset) * 0) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(2) { margin-left: calc(var(--offset) * 1) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(2) { margin-right: calc(var(--offset) * 1) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(3) { margin-left: calc(var(--offset) * 2) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(3) { margin-right: calc(var(--offset) * 2) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(4) { margin-left: calc(var(--offset) * 3) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(4) { margin-right: calc(var(--offset) * 3) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(5) { margin-left: calc(var(--offset) * 4) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(5) { margin-right: calc(var(--offset) * 4) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(6) { margin-left: calc(var(--offset) * 5) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(6) { margin-right: calc(var(--offset) * 5) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(7) { margin-left: calc(var(--offset) * 6) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(7) { margin-right: calc(var(--offset) * 6) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(8) { margin-left: calc(var(--offset) * 7) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(8) { margin-right: calc(var(--offset) * 7) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(9) { margin-left: calc(var(--offset) * 8) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(9) { margin-right: calc(var(--offset) * 8) }

.UrlMessageContent_class__Ck0M7:not(.UrlMessageContent_alignByCurrentUser__SiPfQ) > ul li:nth-child(10) { margin-left: calc(var(--offset) * 9) }
.UrlMessageContent_class__Ck0M7.UrlMessageContent_alignByCurrentUser__SiPfQ > ul li:nth-child(10) { margin-right: calc(var(--offset) * 9) }

.ChoosePaymentMethodPage_headerText__MdpwX {
  font-weight: 600;
  text-align: center;
  font-size: 16px;
  margin-bottom: 8px;
}

.ChoosePaymentMethodPage_outerContainer__L9wTA {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: min(90dvw, 700px);
  width: -webkit-fit-content;
  width: fit-content;
  margin: 0 auto;
  padding: 20px 10px;
  font-family: var(--typographyFontFamily);
}

.ChoosePaymentMethodPage_paymentMethodsContainer__7K18D {
  display: flex;
  flex-direction: column;
  gap: 5px;
  justify-content: center;
}