/* Use Cairo throughout the interface; icon classes retain their own icon font. */
body,input,select,textarea,button,.pixel-font,.code-font{font-family:"Cairo",sans-serif}
#email-box,#modal-receiver,#domain-selector,#domain-selector option{font-family:"Cairo",sans-serif;direction:ltr;unicode-bidi:isolate}
#email-box{font-family:"Cairo",sans-serif;font-weight:400;font-size:16px;line-height:1.5;letter-spacing:normal;text-align:center}#domain-selector{max-width:100%}
#theme-menu{position:absolute;top:calc(100% + 4px);right:0;min-width:140px;padding:4px;background:#1A1A1C;border:2px solid #000;border-radius:8px;box-shadow:2px 2px 0 #000;z-index:60}
#theme-menu[hidden]{display:none}#theme-menu:not([hidden]){display:block}
#theme-menu button{display:block;width:100%;padding:7px 10px;text-align:left;border-radius:5px;color:white;font-size:12px;font-weight:800}
#theme-menu button:hover,#theme-menu button:focus-visible{outline:2px solid var(--primary-accent);outline-offset:-2px}
#theme-menu button[aria-selected=true]{background:var(--primary-accent)}.theme-3 #theme-trigger,.theme-3 #language-toggle,.theme-3 #theme-menu button[aria-selected=true]{color:#000}
.language-toggle{display:flex;font-size:11px;font-weight:800}

#toast{max-width:calc(100vw - 24px);white-space:normal;width:max-content}
@media(min-width:768px){html[dir=ltr] .md\:text-right{text-align:left}}
button:disabled{cursor:wait;opacity:.65}

#refresh-messages-btn[aria-busy=true] .fa-refresh{animation:inbox-refresh-spin 1s linear infinite}
@keyframes inbox-refresh-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#refresh-messages-btn[aria-busy=true] .fa-refresh{animation:none}}

.brand-block{max-width:100%;text-align:center}
.brand-logo{position:relative;display:block;width:240px;max-width:100%;height:48px;overflow:hidden;border-radius:5px}
.brand-logo img{filter:url("#brand-theme-color");position:absolute;width:130%;max-width:none;height:auto;left:50%;top:50%;transform:translate(-50%,-50%)}
.footer-brand{display:flex;align-items:center;gap:8px;direction:ltr}.footer-brand .brand-logo{width:120px;height:26px}

.theme-icon-button,#language-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:2px solid #000;border-radius:8px;background:var(--primary-accent);color:white;cursor:pointer}
.theme-icon-button:focus-visible,#language-toggle:focus-visible{outline:2px solid white;outline-offset:2px}
.theme-brush{display:block;width:20px;height:20px;background:currentColor;mask:url('/assets/icons/paint-brush-solid.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/paint-brush-solid.svg') center/contain no-repeat}