*,:after,:before{box-sizing:border-box}blockquote,body,dd,dl,figure,h1,h2,h3,h4,p{margin:0}ol[role=list],ul[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}body,html{height:100%;width:100%}body{background-clip:red;line-height:1.5;min-height:100vh;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}img,picture{display:block;max-width:100%}button,input,select,textarea{font:inherit}@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}html{font-size:13px}html.text-size-s{font-size:10px}html.text-size-l{font-size:16px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}@media(min-width:768px){html{font-size:calc(.8125rem + .2604vw - 1.99987px);min-height:0}}@media(min-width:1920px){html{font-size:16px}html.text-size-s{font-size:13px}html.text-size-l{font-size:19px}}.login{align-items:center;background-color:var(--clr-primary-l-30);display:flex;height:100vh;justify-content:center;overflow:hidden;padding:2rem;width:100%}.login__container{background-color:var(--clr-background);border-radius:3.4rem;box-shadow:0 60px 40px -30px rgba(0,0,0,.27);max-width:1080px;min-height:640px;position:relative;width:100%}.login__container__box{height:calc(100% - 4.2rem);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:calc(100% - 4.2rem)}.login__container.signup-mode .forms{left:55%}.login__container.signup-mode .intro{left:0}.login__container.signup-mode .forms__signin{opacity:0;pointer-events:none}.login__container.signup-mode .forms__signup{opacity:1;pointer-events:all}.forms{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;height:100%;left:0;position:absolute;top:0;transition:.8s ease-in-out;width:45%}.forms__signin,.forms__signup{display:flex;flex-direction:column;grid-column:1/2;grid-row:1/2;height:100%;justify-content:space-evenly;margin:0 auto;max-width:320px;transition:opacity .02s .4s;width:100%}.forms__signin__heading h2,.forms__signup__heading h2{font-size:3.2rem}.forms__signin__heading h6,.forms__signup__heading h6{color:var(--clr-text-light);display:inline;font-size:1.6rem;font-weight:400}.forms__signin__heading .forms__toggle,.forms__signup__heading .forms__toggle{color:var(--clr-primary);font-size:1.2rem;font-weight:600;text-decoration:none}.forms__signin__heading .forms__toggle:hover,.forms__signup__heading .forms__toggle:hover{color:var(--clr-primary-hover)}.forms__signup{opacity:0;pointer-events:none}.intro{align-items:center;background-color:var(--clr-primary-l-25);border-radius:2rem;display:flex;flex-direction:column;height:100%;justify-content:space-evenly;left:45%;padding:1.8rem;position:absolute;top:0;transition:.8s ease-in-out;width:55%}.intro__message{text-align:center}.intro__message h1{color:var(--clr-text);font-size:3.8rem;font-weight:900}.intro__message h4{color:var(--clr-text-light);font-size:1.4rem;font-weight:400}.intro__image{background-image:url(assets/icons/hero_image.svg);background-position:50%;background-repeat:no-repeat;background-size:cover;height:80%;width:80%}.form-content__input-wrap{align-items:center;display:flex;height:37px;margin-bottom:1.4rem;position:relative}.form-content__input-wrap__input-field{background-color:transparent;border:none;border-bottom:2px solid var(--clr-slightly-visible);color:var(--clr-text);font-size:1.2rem;height:100%;outline:none;padding:0;position:absolute;transition:.3s;width:100%}.form-content__input-wrap__input-field:focus{border-bottom:2px solid var(--clr-primary)}.form-content__input-wrap__input-field:focus~.form-content__input-wrap__input-label{color:var(--clr-primary)}.form-content__input-wrap__input-field:focus~.form-content__input-wrap__input-label,.form-content__input-wrap__input-field:not(:placeholder-shown)~.form-content__input-wrap__input-label{font-size:.9rem;transform:translateY(-180%)}.form-content__input-wrap__input-label{color:var(--clr-slightly-visible);font-size:1.2rem;left:0;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:.4s}.form-content__input-wrap .form-content__password-toggle{background-image:url(assets/icons/password_show.svg);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;height:30px;position:absolute;right:0;top:50%;transform:translateY(-50%);width:30px}.form-content__input-wrap .form-content__password-toggle.show-password{background-image:url(assets/icons/password_hide.svg)}.form-content__input-wrap__checkbox{accent-color:var(--clr-text-light);border:1px solid var(--clr-slightly-visible);cursor:pointer;height:1.2rem;margin-right:.6rem;width:1.2rem}.form-content__submit-btn{background-color:var(--clr-text-light);border:none;border-radius:21.5px;color:var(--clr-background);cursor:pointer;display:inline-block;font-size:1.2rem;height:43px;margin-bottom:2rem;outline:none;transition:.3s;width:100%}.form-content__submit-btn:hover{background-color:var(--clr-primary)}@media only screen and (max-width:900px){.login__container{height:auto;max-width:550px;overflow:hidden}.login__container__box{display:flex;flex-direction:column-reverse;height:revert;padding:2rem;position:static;transform:none;width:revert}.login__container .forms{height:auto;position:revert;width:100%}.login__container .forms__signin,.login__container .forms__signup{max-width:revert;padding:1.5rem 2.5rem 2rem;transition:transform .8s ease-in-out,opacity .45s linear}.login__container .forms__signin__heading,.login__container .forms__signup__heading{margin-bottom:1rem}.login__container .forms__signup{transform:translateX(100%)}.login__container .intro{height:auto;padding:2rem 1rem;position:revert;width:100%}.login__container .intro__image{display:none}.login__container.signup-mode .forms__signin{transform:translateX(-100%)}.login__container.signup-mode .forms__signup{transform:translateX(0)}}@media only screen and (max-width:530px){.login{padding:1.2rem}.login__container{border-radius:2rem}.login__container__box{padding:1rem}.login__container .intro{padding:1.5rem 1rem}.login__container .intro h1{font-size:3rem}.login__container .intro h4{font-size:1.2rem}.forms__signin,.forms__signup{padding:1rem 2rem 1.5rem}.forms__signin__heading h2,.forms__signup__heading h2{font-size:2.6em}.forms__signin__heading .forms__toggle,.forms__signin__heading h6,.forms__signup__heading .forms__toggle,.forms__signup__heading h6{font-size:1rem}}body{--clr-primary:#3b7845;--clr-primary-hover:#2f663a;--clr-primary-active:#22582d;--clr-primary-d-5:#2f663a;--clr-primary-d-10:#2a5e34;--clr-primary-d-15:#24562e;--clr-primary-d-20:#1f4e28;--clr-primary-d-25:#194621;--clr-primary-d-30:#133e1b;--clr-primary-d-35:#0e3615;--clr-primary-d-40:#082e0f;--clr-primary-d-45:#032608;--clr-primary-d-50:#000e02;--clr-primary-d-55:#000;--clr-primary-d-60:#000;--clr-primary-d-65:#000;--clr-primary-d-70:#000;--clr-primary-d-75:#000;--clr-primary-d-80:#000;--clr-primary-d-85:#000;--clr-primary-d-90:#000;--clr-primary-d-95:#000;--clr-primary-l-5:#4c8e52;--clr-primary-l-10:#54965b;--clr-primary-l-15:#5cae63;--clr-primary-l-20:#64b66c;--clr-primary-l-25:#6ccf74;--clr-primary-l-30:#74d77d;--clr-primary-l-35:#7ce085;--clr-primary-l-40:#84e88e;--clr-primary-l-45:#8cf096;--clr-primary-l-50:#94f89f;--clr-primary-l-55:#9cfeb7;--clr-primary-l-60:#a4fec0;--clr-primary-l-65:#acffca;--clr-primary-l-70:#b4ffd3;--clr-primary-l-75:#bcffdb;--clr-primary-l-80:#c4ffe4;--clr-primary-l-85:#ccffec;--clr-primary-l-90:#d4fff5;--clr-primary-l-95:#dcffff;--clr-text:#1b1b1b;--clr-background:#fff;--clr-text-light:#151111;--clr-slightly-visible:#bbb;--clr-camera-background:#e9e9e9;--clr-camera-icon:#3b3b3b;--clr-camera-shutter:#c9c9c9;--clr-image-background:#e9e9e9;--clr-image-icon:#3b3b3b;--clr-message-background:#e9e9e9;--clr-message-text:#1b1b1b;--clr-message-time:#5e5e5e;--clr-message-myself-background:var(--clr-primary);--clr-message-myself-text:#f5ebf2;--clr-message-myself-time:#ccc;--clr-message-divider:#fff;--clr-message-divider-text:#1b1b1b;--clr-appbar-background:#e9e9e9;--clr-appbar-text:#1b1b1b;--clr-appbar-icon:#3b3b3b;--clr-appbar-icon-hover:#d4d4d4;--clr-search-background:#e9e9e9;--clr-search-text:#1b1b1b;--clr-search-text-placeholder:#848484;--clr-compose-background:#e9e9e9;--clr-compose-send-background:var(--clr-primary-l-5);--clr-compose-send-background-hover:var(--clr-primary-hover);--clr-compose-send-icon:#fff;--clr-compose-recording:#c5283a;--clr-compose-recording-icon:#151515;--clr-compose-icon:#3b3b3b;--clr-compose-text:#1b1b1b;--clr-compose-placeholder:#848484;--clr-setting-background:#e9e9e9;--clr-setting-border:#dedede;--clr-setting-theme-sun:#f48037;--clr-setting-theme-moon:#e1c38b;--clr-setting-button-bg:#f5f5f5;--clr-setting-button-bg-text:#151515;--clr-setting-button-bg-active:var(--clr-primary);--clr-setting-button-bg-active-text:#fbfbfb;--clr-setting-grey:#f5f5f5;--clr-setting-reset:#2048b8;--clr-setting-accent-icon-selected:#fff;--clr-setting-accent-green:#3b7845;--clr-setting-accent-purple:#9932c8;--clr-setting-wallpaper-empty-icon:#fbfbfb;--clr-setting-icon:#3b3b3b;--clr-setting-text:#3b3b3b;--clr-setting-delete:#edcece;--clr-setting-delete-text:#b33a3a;--clr-scrollbar-track:#dfdfdf;--clr-scrollbar-thumb:#9c9c9c;--clr-scrollbar-thumb-hover:#acacac;--clr-scrollbar-thumb-active:#999}body.theme--accent--purple{--clr-primary:#9932c8;--clr-primary-hover:#7e29a9;--clr-primary-active:#712597;--clr-primary-d-5:#7e29a9;--clr-primary-d-10:#752597;--clr-primary-d-15:#6c2190;--clr-primary-d-20:#631a89;--clr-primary-d-25:#5a1282;--clr-primary-d-30:#510b7b;--clr-primary-d-35:#480474;--clr-primary-d-40:#3f006d;--clr-primary-d-45:#360066;--clr-primary-d-50:#2d005f;--clr-primary-d-55:#240058;--clr-primary-d-60:#1b004f;--clr-primary-d-65:#120048;--clr-primary-d-70:#090041;--clr-primary-d-75:#00003a;--clr-primary-d-80:#003;--clr-primary-d-85:#00002c;--clr-primary-d-90:#000025;--clr-primary-d-95:#00001e;--clr-primary-l-5:#a53bd1;--clr-primary-l-10:#b144d9;--clr-primary-l-15:#ba4de2;--clr-primary-l-20:#c356ea;--clr-primary-l-25:#cc5ff3;--clr-primary-l-30:#d568fb;--clr-primary-l-35:#df71ff;--clr-primary-l-40:#e87aff;--clr-primary-l-45:#f183ff;--clr-primary-l-50:#fb8cff;--clr-primary-l-55:#ff95ff;--clr-primary-l-60:#ff9eff;--clr-primary-l-65:#ffa7ff;--clr-primary-l-70:#ffb0ff;--clr-primary-l-75:#ffb9ff;--clr-primary-l-80:#ffc2ff;--clr-primary-l-85:#ffcbff;--clr-primary-l-90:#ffd4ff;--clr-primary-l-95:#fdf}body.theme--dark{--clr-text:#fff;--clr-background:#121212;--clr-text-light:#fff;--clr-slightly-visible:#bbb;--clr-camera-background:#3b3b3b;--clr-camera-icon:#dedede;--clr-camera-shutter:#fbfbfb;--clr-image-background:#3b3b3b;--clr-image-icon:#dedede;--clr-message-background:#3b3b3b;--clr-message-text:#e9e9e9;--clr-message-time:#b1b1b1;--clr-message-myself-background:var(--clr-primary);--clr-message-myself-text:#f5ebfa;--clr-message-myself-time:#ccc;--clr-message-divider:#2e2e2e;--clr-message-divider-text:#e9e9e9;--clr-appbar-background:#2e2e2e;--clr-appbar-text:#f6f6f6;--clr-appbar-icon:#dedede;--clr-appbar-icon-hover:#525252;--clr-search-background:#2e2e2e;--clr-search-text:#e9e9e9;--clr-search-text-placeholder:#b9b9b9;--clr-compose-background:#2e2e2e;--clr-compose-send-background:var(--clr-primary-l-5);--clr-compose-send-background-hover:var(--clr-primary-hover);--clr-compose-send-icon:#dedede;--clr-compose-recording:#f23f42;--clr-compose-recording-icon:#151515;--clr-compose-icon:#dedede;--clr-compose-text:#e9e9e9;--clr-compose-placeholder:#b9b9b9;--clr-setting-background:#2e2e2e;--clr-setting-border:#5e5e5e;--clr-setting-theme-sun:#f48037;--clr-setting-theme-moon:#e1c38b;--clr-setting-button-bg:#3b3b3b;--clr-setting-button-bg-text:#fbfbfb;--clr-setting-button-bg-active:var(--clr-primary);--clr-setting-button-bg-active-text:#fbfbfb;--clr-setting-grey:#3b3b3b;--clr-setting-reset:#6d81ff;--clr-setting-accent-icon-selected:#fbfbfb;--clr-setting-accent-green:#3b7845;--clr-setting-accent-purple:#9932c8;--clr-setting-wallpaper-empty-icon:#fff;--clr-setting-icon:#fbfbfb;--clr-setting-text:#fbfbfb;--clr-setting-delete:#e4acac;--clr-setting-delete-text:#a32222;--clr-scrollbar-track:#2e2e2e;--clr-scrollbar-thumb:#5e5e5e;--clr-scrollbar-thumb-hover:#7e7e7e;--clr-scrollbar-thumb-active:#9e9e9e}::-webkit-scrollbar{width:.5rem}::-webkit-scrollbar-track{background-color:var(--clr-scrollbar-track);border-radius:.25rem}::-webkit-scrollbar-thumb{background-clip:content-box;background-color:var(--clr-scrollbar-thumb);border-radius:.25rem}::-webkit-scrollbar-thumb:hover{background-color:var(--clr-scrollbar-thumb-hover)}::-webkit-scrollbar-thumb:active{background-color:var(--clr-scrollbar-thumb-active)}.chat{display:flex;flex-direction:column;height:100vh;overflow:hidden;position:relative;width:100%}.chat__app-bar{background-color:var(--clr-appbar-background);box-shadow:0 2px 8px 0 rgba(99,99,99,.2);gap:1.5rem;height:fit-content;padding:1.5rem;position:fixed;z-index:100}.chat__app-bar,.chat__app-bar__container{align-items:center;display:flex;flex-direction:row;justify-content:space-between;width:100%}.chat__app-bar__container .title{color:var(--clr-appbar-text);font-size:2rem;font-weight:700}.chat__app-bar__container .search{border-radius:.4rem;cursor:pointer;height:2.5rem;transition:background-color .2s ease-in-out;width:2.5rem}.chat__app-bar__container .search:hover{background-color:var(--clr-appbar-icon-hover)}.chat__app-bar__container .search .icon{background-color:var(--clr-appbar-icon);height:100%;mask:url(assets/icons/search.svg) no-repeat center;-webkit-mask:url(assets/icons/search.svg) no-repeat center;mask-size:90%;-webkit-mask-size:90%;width:100%}.chat__app-bar__settings{border-radius:.4rem;cursor:pointer;height:2.5rem;transition:background-color .2s ease-in-out;width:2.5rem}.chat__app-bar__settings:hover{background-color:var(--clr-appbar-icon-hover)}.chat__app-bar__settings .icon{background-color:var(--clr-appbar-icon);height:100%;mask:url(assets/icons/more.svg) no-repeat center;-webkit-mask:url(assets/icons/more.svg) no-repeat center;mask-size:90%;-webkit-mask-size:90%;width:100%}.chat__window{background-color:var(--clr-background);background-position:50%;background-repeat:no-repeat;background-size:cover;display:flex;flex-direction:column-reverse;height:100%;margin-top:5.715rem;overflow-x:hidden;overflow-y:scroll;padding:1.5rem 1.5rem 7rem;width:100%}.chat__window__divider{background-color:var(--clr-message-divider);border-radius:2rem;color:var(--clr-message-divider-text);font-weight:700;margin:1rem auto 0;padding:.4rem 1rem;width:fit-content}.chat__window__divider:last-child{margin-top:0}.chat__preview{background-color:var(--clr-primary);border-radius:1.5rem;bottom:5.5rem;height:7rem;left:3rem;margin-bottom:1rem;position:absolute;width:10rem}.chat__preview:has(.chat__preview__container__image:not([src])){display:none}.chat__preview__container{height:100%;position:relative;width:100%}.chat__preview__container__image{border-radius:1.5rem;height:100%;width:100%}.chat__preview__container__remove{background-image:url(assets/icons/close.svg);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;height:2rem;position:absolute;right:.5rem;top:.5rem;transition:transform .4s ease-in-out;width:2rem}.chat__compose{bottom:0;gap:1.5rem;height:fit-content;margin:0 1.5rem 1.5rem;min-height:4rem;position:fixed;width:calc(100% - 3rem)}.chat .compose__container,.chat__compose{align-items:center;display:flex;flex-direction:row}.chat .compose__container{background-color:var(--clr-compose-background);border-radius:2rem;box-shadow:0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);gap:.75rem;padding:.5rem 1rem;width:calc(100% - 6rem)}.chat .compose__container__camera{cursor:pointer;height:2.5rem;width:2.5rem}.chat .compose__container__camera__icon{background-color:var(--clr-compose-icon);height:100%;mask:url(assets/icons/camera.svg) no-repeat center;-webkit-mask:url(assets/icons/camera.svg) no-repeat center;mask-size:100%;-webkit-mask-size:100%;width:100%}.chat .compose__container__microphone{cursor:pointer;height:2.5rem;width:2.5rem}.chat .compose__container__microphone__icon{background-color:var(--clr-compose-icon);height:100%;mask:url(assets/icons/microphone.svg) no-repeat center;-webkit-mask:url(assets/icons/microphone.svg) no-repeat center;mask-size:100%;-webkit-mask-size:100%;width:100%}@keyframes recording{0%{transform:scale(1)}25%{transform:scale(1.05)}50%{transform:scale(1)}75%{transform:scale(.95)}to{transfform:scale(1)}}.chat .compose__container__microphone.recording{animation:recording 1s infinite;background-color:var(--clr-compose-recording);border-radius:1.5rem;padding:.3rem}.chat .compose__container__microphone.recording .compose__container__microphone__icon{background-color:var(--clr-compose-recording-icon)}.chat .compose__container__microphone.recording:hover .compose__container__microphone__icon{background-color:var(--clr-compose-recording-icon);mask-image:url(assets/icons/microphone-off.svg);-webkit-mask-image:url(assets/icons/microphone-off.svg)}.chat .compose__container__input{background-color:transparent;border:none;color:var(--clr-compose-text);font-size:1.2rem;font-weight:400;resize:none;width:100%}.chat .compose__container__input::placeholder{color:var(--clr-compose-placeholder);font-size:1.2rem}.chat .compose__container__input:focus{outline:none}.chat .compose__send{background-color:var(--clr-compose-send-background);border:none;border-radius:2rem;box-shadow:0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);cursor:pointer;height:3.5rem;transition:background-size .4s ease-in-out,background-color .2s ease-in-out;width:3.5rem}.chat .compose__send:hover{background-color:var(--clr-compose-send-background-hover)}.chat .compose__send__icon{background-color:var(--clr-compose-send-icon);height:100%;mask:url(assets/icons/send.svg) no-repeat 2px center;-webkit-mask:url(assets/icons/send.svg) no-repeat 2px center;mask-size:100%;-webkit-mask-size:100%;transform:rotate(-35deg);width:100%}.searchbar{align-items:center;background-color:var(--clr-search-background);border-radius:1.2rem;box-shadow:0 4px 12px rgba(0,0,0,.1);display:flex;flex-direction:row;height:4rem;justify-content:center;max-width:0;opacity:0;pointer-events:none;position:absolute;right:5rem;top:4.75rem;transition:max-width .8s ease-in-out;width:25rem}.searchbar.active{max-width:100rem;opacity:1;pointer-events:all}.searchbar input{background-color:transparent;border:none;color:var(--clr-search-text);font-size:1.2rem;font-weight:500;height:calc(100% - 1rem);outline:none;width:calc(100% - 1rem)}.searchbar input:placeholder{color:var(--clr-search-text-placeholder)}.options{background-color:var(--clr-setting-background);border-radius:1.2rem;box-shadow:0 4px 12px rgba(0,0,0,.1);color:var(--clr-setting-text);max-height:0;overflow:hidden;position:absolute;right:1.5rem;top:4.75rem;transition:max-height .4s ease-in-out;width:25rem}.options.active{max-height:85vh}.options__container{max-height:85vh;overflow-x:hidden;overflow-y:auto;position:relative}.options__container__section{border-bottom:1px solid var(--clr-setting-border);padding:1rem}.options__container__section:last-child{border-bottom:none}.options__container__section__header{align-items:center;display:flex;flex-direction:row;gap:1rem;justify-content:start;margin-bottom:1rem}.options__container__section__header.button{cursor:pointer;margin-bottom:0}.options__container__section__header .icon{background-color:var(--clr-setting-icon);height:2rem;width:2rem}.options__container__section__header .icon.help{mask:url(assets/icons/help.svg) no-repeat center;-webkit-mask:url(assets/icons/help.svg) no-repeat center;mask-size:100%;-webkit-mask-size:100%}.options__container__section__header .icon.settings{mask:url(assets/icons/settings.svg) no-repeat center;-webkit-mask:url(assets/icons/settings.svg) no-repeat center;mask-size:100%;-webkit-mask-size:100%}.options__container__section__header .icon.logout{mask:url(assets/icons/logout.svg) no-repeat center;-webkit-mask:url(assets/icons/logout.svg) no-repeat center;mask-size:100%;-webkit-mask-size:100%}.options__container__section h3{color:var(--clr-text);font-size:1.2rem;font-weight:700}.options__container__section__wrapper{display:flex;flex-direction:column;gap:1.2rem}.options__container__section__wrapper .setting{align-items:center;display:flex;flex-direction:row;gap:1rem;justify-content:space-between}.options__container__section__wrapper .setting__description{position:relative;width:100%}.options__container__section__wrapper .setting__description h5,.options__container__section__wrapper .setting__description p{color:var(--clr-text);font-size:1rem;margin:0}.options__container__section__wrapper .setting__description__reset{color:var(--clr-setting-reset);cursor:pointer;font-size:.9rem;position:absolute;right:0;top:0}.options__container__section__wrapper .setting .fontSize__container{align-items:center;display:flex;flex-direction:row;gap:.5rem;width:100%}.options__container__section__wrapper .setting .fontSize__container button{background-color:var(--clr-setting-button-bg);border:none;border-radius:2rem;color:var(--clr-setting-button-bg-text);cursor:pointer;font-weight:500;outline:none;padding:1rem 1.5rem;width:100%}.options__container__section__wrapper .setting .fontSize__container button.active{background-color:var(--clr-setting-button-bg-active);color:var(--clr-setting-button-bg-active-text);font-weight:700}.options__container__section__wrapper .setting .theme__container{align-items:center;display:flex;flex-direction:row;height:100%;justify-content:center;width:fit-content}.options__container__section__wrapper .setting .theme__container__switch{border-radius:1.25rem;cursor:pointer;display:inline-block;height:2.5rem;overflow:hidden;position:relative;width:5.5rem}.options__container__section__wrapper .setting .theme__container__switch input{height:0;opacity:0;width:0}.options__container__section__wrapper .setting .theme__container__switch__slider{background-color:var(--clr-setting-grey);border-radius:1.25rem;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:all .4s}.options__container__section__wrapper .setting .theme__container__switch__slider:before{background-color:var(--clr-setting-theme-sun);border-radius:50%;content:"";height:2rem;left:.25rem;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;width:2rem}.options__container__section__wrapper .setting .theme__container__switch__slider:after{background-color:var(--clr-setting-grey);border-radius:50%;content:"";height:2rem;left:-2rem;position:absolute;top:30%;transform:translateY(-50%);transition:all .4s;width:2rem}.options__container__section__wrapper .setting .theme__container__switch input:checked~.theme__container__switch__slider:before{background-color:var(--clr-setting-theme-moon);transform:translate(150%,-50%)}.options__container__section__wrapper .setting .theme__container__switch input:checked~.theme__container__switch__slider:after{transform:translate(230%,-50%)}.options__container__section__wrapper .setting .deleteAccount__container{align-items:center;display:flex;flex-direction:column;gap:.5rem}.options__container__section__wrapper .setting .deleteAccount__container button{background-color:var(--clr-setting-delete);border:none;border-radius:2rem;color:var(--clr-setting-delete-text);cursor:pointer;font-weight:700;outline:none;padding:1rem 1.5rem;width:100%}.options__container__section__wrapper .setting .primaryColor__container{align-items:center;display:flex;flex-direction:row;gap:.5rem}.options__container__section__wrapper .setting .primaryColor__container button{background-color:red;border:none;border:.25rem solid var(--clr-setting-grey);border-radius:50%;cursor:pointer;height:2.5rem;outline:none;width:2.5rem}.options__container__section__wrapper .setting .primaryColor__container button div{display:none}.options__container__section__wrapper .setting .primaryColor__container button[data-color=green]{background-color:var(--clr-setting-accent-green)}.options__container__section__wrapper .setting .primaryColor__container button[data-color=purple]{background-color:var(--clr-setting-accent-purple)}.options__container__section__wrapper .setting .primaryColor__container button.active div{background-color:var(--clr-setting-accent-icon-selected);display:block;height:100%;mask:url(assets/icons/done.svg) no-repeat center;-webkit-mask:url(assets/icons/done.svg) no-repeat center;mask-size:100%;-webkit-mask-size:100%;width:100%}.options__container__section__wrapper .setting .wallpaper__container{align-items:center;display:flex;flex-direction:row;gap:.5rem;width:100%}.options__container__section__wrapper .setting .wallpaper__container__preview{background-color:var(--clr-primary);background-position:50%;background-size:cover;border-radius:1rem;cursor:pointer;padding-bottom:25%;position:relative;width:100%}.options__container__section__wrapper .setting .wallpaper__container__preview .icon{display:none;height:100%;position:absolute;width:100%}.options__container__section__wrapper .setting .wallpaper__container__preview.empty .icon{background-color:var(--clr-setting-wallpaper-empty-icon);display:block;mask:url(assets/icons/wallpaper.svg) no-repeat center;-webkit-mask:url(assets/icons/wallpaper.svg) no-repeat center;mask-size:60%;-webkit-mask-size:60%}.options__container__section__wrapper .setting .wallpaper__container__upload{border-radius:1rem;padding-bottom:25%;position:relative;width:100%}.options__container__section__wrapper .setting .wallpaper__container__upload input{display:none}.options__container__section__wrapper .setting .wallpaper__container__upload label{background-color:var(--clr-setting-grey);border-radius:1rem;cursor:pointer;display:inline-block;height:100%;position:absolute;width:100%}.options__container__section__wrapper .setting .wallpaper__container__upload label .wallpaper__upload__icon{background-color:var(--clr-setting-icon);height:100%;mask:url(assets/icons/upload.svg) no-repeat center;-webkit-mask:url(assets/icons/upload.svg) no-repeat center;mask-size:40%;-webkit-mask-size:40%;width:100%}.options__container__section__wrapper .setting-column{align-items:start;flex-direction:column;gap:.6rem}#camera-modal{background-color:var(--clr-camera-background);border:none;border-radius:3.3rem;height:640px;margin:auto;max-width:1080px;overflow:hidden;padding:2rem;position:relative}#camera-modal::backdrop{background-color:rgba(0,0,0,.27)}#camera-modal .camera{align-items:center;display:flex;flex-direction:column;gap:1rem;height:100%;justify-content:space-between;width:100%}#camera-modal .camera__close{background-image:url(assets/icons/close.svg);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;height:2.5rem;position:absolute;right:.8rem;top:.8rem;transition:transform .4s ease-in-out;width:2.5rem}#camera-modal .camera__preview{border-radius:3.3rem;height:100%;max-height:calc(100% - 5rem);width:100%}#camera-modal .camera__options{align-items:center;display:flex;flex-direction:row;justify-content:space-around;width:100%}#camera-modal .camera__options__shutter{background-color:transparent;border:none;border-radius:2rem;height:4rem;outline:none;position:relative;width:4rem}#camera-modal .camera__options__shutter .circle{background-color:var(--clr-camera-shutter);border-radius:100%;bottom:12%;left:12%;opacity:.8;position:absolute;right:12%;top:12%;transition:all .25s}#camera-modal .camera__options__shutter .ring{border:.25rem solid var(--clr-camera-shutter);border-radius:100%;bottom:0;left:0;opacity:.8;position:absolute;right:0;top:0;transition:all .25s}#camera-modal .camera__options__shutter:active .ring,#camera-modal .camera__options__shutter:hover .circle{opacity:1}#camera-modal .camera__options__shutter:active .circle{opacity:.6}#image-modal{background-color:var(--clr-image-background);border:none;border-radius:3.3rem;height:calc(100% - 6rem);margin:auto;max-width:calc(100% - 6rem);outline:none;overflow:hidden;padding:3rem;position:relative}#image-modal::backdrop{background-color:rgba(0,0,0,.27)}#image-modal .image{height:100%;margin:0;position:relative;width:100%}#image-modal .image__close{background-image:url(assets/icons/close.svg);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;height:2.5rem;position:absolute;right:-2rem;top:-2rem;transition:transform .4s ease-in-out;width:2.5rem}#image-modal .image__preview{border:none;height:100%;outline:none;overflow:hidden}.message{background-color:var(--clr-message-background);border-radius:1.55rem;display:flex;flex-direction:column;gap:.2rem;margin-top:1rem;max-width:60%;padding:.8rem 1rem;position:relative;width:fit-content}.message.emoji_only{background-color:transparent}.message.emoji_only .message__header__sender{margin-bottom:1.5rem}.message.emoji_only .message__body__text__content{font-size:4rem}.message.emoji_only .message__body__text__time{bottom:-2rem}.message__header{align-items:end;display:flex;flex-direction:row;gap:.4rem;justify-content:space-between}.message__header__sender{font-size:.9rem;font-weight:800}.message__body__text__content{color:var(--clr-message-text);font-size:1.1rem;line-height:1.5rem;overflow-wrap:break-all;word-break:break-word}.message__body__text__time{bottom:-.5rem;color:var(--clr-message-time);float:right;font-size:.8rem;font-weight:400;line-height:1.2rem;margin-left:.5rem;position:relative}.message__body__image{border-radius:1.6rem;cursor:pointer;margin-bottom:.5rem;margin-top:.5rem;width:100%}.message__body__image:not([src]){display:none}.message.myself{background-color:var(--clr-primary);border-bottom-right-radius:.4rem;margin-left:auto;padding-right:1rem}.message.myself,.message.myself .message__body__text__content{color:var(--clr-message-myself-text)}.message.myself .message__body__text__time{color:var(--clr-message-myself-time)}.message.myself.emoji_only{background-color:transparent}.message.myself .message__header{display:none}.message.myself.same_sender{border-bottom-right-radius:.4rem;border-top-right-radius:.4rem;margin-top:.2rem}.message:not(.myself){border-bottom-left-radius:.4rem;padding-left:1rem}.message:not(.myself).same_sender{border-bottom-left-radius:.4rem;border-top-left-radius:.4rem;margin-top:.2rem}.message.same_sender .message__header{display:none}@media only screen and (max-width:900px){.message{max-width:75%}}@media only screen and (max-width:530px){.message{max-width:90%}}