#offcanvasMenu_btn.yalla-menu{--menu-red:#f24a45;--menu-soft:#fff3f1;width:min(390px,calc(100vw - 20px));margin:10px;border:0;border-radius:18px;box-shadow:0 18px 55px rgba(31,24,22,.2);background:#fff;overflow:hidden;height:calc(100vh - 20px)}
#offcanvasMenu_btn .offcanvas-header{direction:ltr;padding:18px;border:0!important;min-height:78px}
#offcanvasMenu_btn .offcanvas-title img{display:block;max-width:145px;max-height:48px;object-fit:contain}
#offcanvasMenu_btn .yalla-menu-close{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:10px;background:var(--menu-soft);color:var(--menu-red);font-size:18px}
#offcanvasMenu_btn .offcanvas-body{padding:5px 16px 16px;overflow-y:auto}
#offcanvasMenu_btn .yalla-menu-content{min-height:100%;display:flex;flex-direction:column}
#offcanvasMenu_btn ul{margin:0;padding:0;list-style:none}
#offcanvasMenu_btn .yalla-category-list{display:flex!important;flex-direction:column!important;gap:8px!important}
#offcanvasMenu_btn .yalla-category-link{min-height:50px;width:100%;padding:7px 12px 7px 14px;display:flex;align-items:center;justify-content:space-between;border:1px solid #f1eeec;border-radius:12px;background:#fff;color:#292929;font-size:14px;font-weight:600;box-shadow:0 2px 8px rgba(54,43,38,.045);transition:.2s}
#offcanvasMenu_btn .yalla-category-link:hover{border-color:#ffd6d1;color:var(--menu-red);transform:translateX(-2px)}
#offcanvasMenu_btn .yalla-category-main{display:flex;align-items:center;gap:11px}
#offcanvasMenu_btn .yalla-category-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--menu-soft);overflow:hidden;flex:none}
#offcanvasMenu_btn .yalla-category-icon img{width:25px;height:25px;object-fit:contain;border-radius:5px}
#offcanvasMenu_btn .yalla-category-link>i{font-size:12px;color:#676767;transition:.2s}
#offcanvasMenu_btn .has-toggle.open>.yalla-category-link>i{transform:rotate(-90deg)}
#offcanvasMenu_btn .yalla-submenu{padding:7px 16px 0 0!important}
#offcanvasMenu_btn .yalla-submenu .yalla-category-link{min-height:43px;margin-bottom:6px;background:#fffaf9}
#offcanvasMenu_btn .yalla-pages-list{display:flex;flex-direction:column;gap:7px;margin-top:10px}
#offcanvasMenu_btn .yalla-page-link{display:block;padding:10px 13px;border-radius:10px;background:#faf9f8;color:#353535;font-size:13px;font-weight:600}
#offcanvasMenu_btn .yalla-contact-card{margin-top:auto;padding:15px 14px 12px;border:1px solid #ffe4df;border-radius:14px;background:linear-gradient(135deg,#fff8f5,#fffdfc);box-shadow:0 4px 16px rgba(242,74,69,.06)}
#offcanvasMenu_btn .yalla-help-row{display:flex;align-items:center;gap:9px;padding-bottom:12px;border-bottom:1px dashed #f1dcd8}
#offcanvasMenu_btn .yalla-help-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#ffe6e2;color:var(--menu-red);font-size:17px;flex:none}
#offcanvasMenu_btn .yalla-help-copy{display:flex;flex-direction:column;line-height:1.35}
#offcanvasMenu_btn .yalla-help-copy strong{font-size:12px;color:var(--menu-red)}
#offcanvasMenu_btn .yalla-help-copy span{font-size:10px;color:#6f6f6f}
#offcanvasMenu_btn .yalla-call-btn{margin-right:auto;padding:8px 10px;border:1px solid #ffdcd6;border-radius:9px;background:#fff;color:var(--menu-red);font-size:11px;font-weight:700;white-space:nowrap}
#offcanvasMenu_btn .yalla-call-btn i{margin-left:4px}
#offcanvasMenu_btn .yalla-address-row{display:flex;align-items:flex-start;gap:10px;padding-top:12px}
#offcanvasMenu_btn .yalla-address-row>i{color:var(--menu-red);font-size:18px;margin-top:2px}
#offcanvasMenu_btn .yalla-address-row div{display:flex;flex-direction:column;line-height:1.45}
#offcanvasMenu_btn .yalla-address-row strong{font-size:11px;color:#333}
#offcanvasMenu_btn .yalla-address-row span{font-size:9px;color:#777;direction:ltr;text-align:left}
#offcanvasMenu_btn .yalla-socials{display:flex;gap:9px;padding:12px 28px 0}
#offcanvasMenu_btn .yalla-socials a{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#646464;font-size:11px;box-shadow:0 2px 7px rgba(0,0,0,.08)}
#offcanvasMenu_btn .yalla-socials a:hover,#offcanvasMenu_btn .yalla-menu-close:hover{background:var(--menu-red);color:#fff}
@media(max-width:480px){#offcanvasMenu_btn.yalla-menu{width:calc(100vw - 20px)}#offcanvasMenu_btn .offcanvas-body{padding-inline:12px}}