/* Phone navigation based on supplied reference. */
.phone-drawer{padding:0;border:0;background:#0b0b0b;color:#ccc;width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;position:fixed;inset:0;box-sizing:border-box}.phone-drawer::backdrop{background:#0009}.phone-drawer>header{position:sticky;top:0;z-index:2;height:66px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:#000;border-bottom:1px solid #222}.phone-drawer h2{font:600 21px Arial;margin:0;color:#fff}.phone-drawer>header button{width:38px;height:38px;border:0;border-radius:9px;background:#101212;color:#fff;font-size:30px;cursor:pointer}.phone-drawer-content{padding:10px 12px 30px}.phone-drawer a,.phone-place-toggle{display:flex;align-items:center;gap:16px;padding:20px 12px;color:inherit;text-decoration:none;font:500 17px/1.4 Arial;border:0;background:none;width:100%;text-align:left;box-sizing:border-box}.phone-drawer svg{width:25px;height:25px;flex:0 0 25px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.phone-place-toggle span{margin-left:auto;font-size:28px}.phone-drawer a:hover,.phone-drawer a:focus-visible,.phone-place-toggle:focus-visible{background:#1a241d;outline:2px solid #5aa16c;outline-offset:-2px}.phone-drawer hr{border:0;border-top:1px solid #292929;margin:15px 0}.phone-service-types[hidden]{display:none}.phone-service-types{padding-left:22px;border-left:1px solid #34523a;margin:0 12px}.phone-service-types a{font-size:15px;padding:14px 12px}.phone-identity{display:flex;flex-direction:column;align-items:center;gap:10px;padding:15px 10px 23px}.phone-identity>svg{width:54px;height:54px;padding:15px;background:#161616;border-radius:50%;box-sizing:content-box}.phone-identity strong{font-size:21px}.phone-identity small{font-size:12px;background:#191919;padding:5px 8px;border-radius:5px}.phone-account-wallet{padding:16px;border-radius:12px;background:#000;margin:0 0 15px;display:grid;gap:10px}.phone-account-wallet>span{font-size:15px;font-weight:600}.phone-account-wallet>strong{font-size:29px;color:white}.phone-account-wallet>a{border:1px solid #555;border-radius:7px;padding:12px;justify-content:center;font-size:15px}.phone-drawer-open{overflow:hidden}.phone-drawer nav>a:last-child[href*=logout]{border-top:1px solid #292929;margin-top:10px}
@media(max-width:850px){body .topbar:not(.admin-topbar){height:68px;min-height:68px;display:flex;padding:0 4%;gap:12px;flex-wrap:nowrap}body .topbar:not(.admin-topbar) .menu-toggle{order:0;flex:0 0 28px;width:28px;height:36px;margin:0;padding:0;border:0;background:transparent;border-radius:0;font-size:24px}body .topbar:not(.admin-topbar) .brand{order:1;flex:1 1 160px;width:auto;min-width:80px;margin:0}body .topbar:not(.admin-topbar) .mt-motion-logo{max-width:190px!important}body .topbar:not(.admin-topbar) .header-search{display:flex!important;order:2;width:25px;flex:0 0 25px;margin:0}body .topbar:not(.admin-topbar) .header-search svg{width:23px;height:23px}body .topbar:not(.admin-topbar) .account-tools{display:flex!important;order:3;margin:0;gap:14px;flex:0 0 auto}body .topbar:not(.admin-topbar) .account-tools .balance-chip,body .topbar:not(.admin-topbar) .account-tools .language-toggle{display:none!important}body .topbar:not(.admin-topbar) .header-bag{display:grid;width:23px;height:30px}body .topbar:not(.admin-topbar) .header-bag svg{width:23px;height:23px}body .topbar:not(.admin-topbar) .avatar{display:grid;width:25px;height:30px;border:0;background:transparent;color:inherit;border-radius:0}body .topbar:not(.admin-topbar) .avatar svg{width:24px;height:24px}body .topbar .mobile-customer-menu{display:none!important}.reference-footer{grid-template-columns:1fr;gap:24px}.reference-footer>div{grid-column:1/-1}.reference-footer h2{font-size:27px}.reference-footer a{font-size:14px}.header-product-search{left:3%;right:3%;width:auto;box-sizing:border-box}body .auth-card{width:100%;padding:24px 20px}body .auth-wrap{padding:24px 4%;box-sizing:border-box}body .profile-edit-form input,body .customer-password-form input,body .topup-form input{font-size:16px!important}body .solid-button[type=submit]{min-height:42px;background:#287b40;color:#fff;border:0;border-radius:7px;cursor:pointer}}
@media(max-width:360px){body .topbar:not(.admin-topbar){gap:8px;padding:0 3%}body .topbar:not(.admin-topbar) .account-tools{gap:9px}}
html[data-theme=light] .phone-drawer{background:#f9fafb;color:#24312b}html[data-theme=light] .phone-account-wallet{background:#eef3ef}html[data-theme=light] .phone-account-wallet>strong{color:#173721}html[data-theme=light] .phone-identity>svg,html[data-theme=light] .phone-identity small{background:#e6ece7}

@media(max-width:850px){body .topbar:not(.admin-topbar) .avatar svg{display:none}body .topbar:not(.admin-topbar) .avatar::after{content:"⋮";font:28px/1 Arial,sans-serif;color:inherit}body .topbar:not(.admin-topbar) .brand img{max-height:50px}}

/* Compact Menu and Account for phones. */
@media(max-width:850px){.phone-drawer>header{height:54px;padding:0 15px}.phone-drawer h2{font-size:18px}.phone-drawer>header button{width:32px;height:32px;font-size:25px;border-radius:7px}.phone-drawer-content{padding:7px 11px 22px}.phone-drawer a,.phone-place-toggle{padding:14px 10px;font-size:15px;gap:12px}.phone-drawer svg{width:21px;height:21px;flex-basis:21px}.phone-place-toggle span{font-size:23px}.phone-drawer hr{margin:10px 0}.phone-service-types a{padding:11px 10px;font-size:13px}.phone-identity{gap:7px;padding:10px 8px 16px}.phone-identity>svg{width:37px;height:37px;padding:11px}.phone-identity strong{font-size:17px}.phone-identity small{font-size:10px;padding:4px 7px}.phone-account-wallet{padding:13px;gap:8px;margin-bottom:10px;border-radius:9px}.phone-account-wallet>span{font-size:13px}.phone-account-wallet>strong{font-size:24px}.phone-account-wallet>a{padding:9px;font-size:13px}.phone-drawer nav>a:last-child[href*=logout]{margin-top:7px}}
