.ma-auth-screen{min-height:100vh;display:grid;place-items:center;padding:35px;background:radial-gradient(circle at 10% 10%,rgba(10,185,82,.20),transparent 30%),linear-gradient(135deg,#042e20 0%,#075d38 48%,#f4faf6 48%,#f4faf6 100%);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:#14231b}
.ma-auth-shell{width:min(1050px,100%);display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;border-radius:32px;background:#fff;box-shadow:0 35px 90px rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.28)}
.ma-auth-brand{padding:48px;background:linear-gradient(145deg,#07502f,#0a8b49);color:#fff;position:relative;overflow:hidden}
.ma-auth-brand:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-90px;bottom:-100px;background:rgba(255,255,255,.08)}
.ma-auth-logo{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#fff;color:#087f3f;font-size:25px;font-weight:950;margin-bottom:24px;box-shadow:0 15px 35px rgba(0,0,0,.16)}
.ma-auth-brand h1{margin:0 0 12px;font-size:42px;line-height:1.04;color:#fff;font-weight:950;letter-spacing:-1.5px}
.ma-auth-brand p{max-width:440px;color:rgba(255,255,255,.78);font-size:14px;line-height:1.75;margin:0}
.ma-auth-points{display:grid;gap:12px;margin-top:34px}
.ma-auth-point{display:flex;gap:12px;align-items:center;color:#fff;font-size:13px;font-weight:700}
.ma-auth-point i{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.12);font-style:normal}
.ma-auth-form-side{padding:42px;background:#fff}
.ma-auth-tabs{display:grid;grid-template-columns:1fr 1fr;padding:5px;background:#f1f6f3;border-radius:14px;margin-bottom:26px}
.ma-auth-tab{border:0;background:transparent;border-radius:10px;padding:12px;font-weight:850;color:#718078;cursor:pointer}
.ma-auth-tab.active{background:#fff;color:#087f3f;box-shadow:0 5px 18px rgba(8,127,63,.10)}
.ma-auth-panel{display:none}.ma-auth-panel.active{display:block}
.ma-auth-form-side h2{margin:0 0 7px;font-size:27px;font-weight:950;color:#14231b}.ma-auth-form-side>p{margin:0 0 22px;color:#7a8780;font-size:12px;line-height:1.6}
.ma-auth-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}.ma-auth-field{display:grid;gap:7px}.ma-auth-field.full{grid-column:1/-1}.ma-auth-field label{font-size:10px;font-weight:850;color:#4d5c54}.ma-auth-field input{width:100%;border:1px solid #dce9e1;border-radius:12px;padding:13px 14px;background:#fbfdfc;color:#14231b;outline:0}.ma-auth-field input:focus{border-color:#0a9c4a;box-shadow:0 0 0 4px rgba(10,156,74,.08)}
.ma-auth-submit{width:100%;border:0;border-radius:13px;padding:14px;margin-top:18px;background:linear-gradient(135deg,#087f3f,#0ab952);color:#fff;font-weight:900;cursor:pointer;box-shadow:0 12px 25px rgba(8,127,63,.18)}
.ma-auth-note{font-size:10px;color:#849088;line-height:1.6;margin-top:13px}.ma-auth-error,.ma-auth-success{padding:11px 13px;border-radius:12px;font-size:11px;margin-bottom:15px}.ma-auth-error{background:#fff1f1;color:#a73535;border:1px solid #f0cccc}.ma-auth-success{background:#effaf3;color:#08723a;border:1px solid #ccebd8}.ma-auth-lost{display:block;text-align:center;margin-top:13px;color:#087f3f;font-size:11px;font-weight:800}
body:has(.ma-auth-screen){overflow:hidden}
body:has(.ma-auth-screen) #page, body:has(.ma-auth-screen) .site, body:has(.ma-auth-screen) header, body:has(.ma-auth-screen) .site-header, body:has(.ma-auth-screen) .widget-area, body:has(.ma-auth-screen) aside:not(.ma-auth-shell){display:none!important}
body:has(.ma-auth-screen) .site-content, body:has(.ma-auth-screen) .site-main, body:has(.ma-auth-screen) .content-area, body:has(.ma-auth-screen) .entry-content{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
@media(max-width:800px){.ma-auth-screen{padding:15px;background:linear-gradient(145deg,#07502f,#0a8b49)}.ma-auth-shell{grid-template-columns:1fr;border-radius:24px}.ma-auth-brand{padding:30px}.ma-auth-brand h1{font-size:32px}.ma-auth-form-side{padding:26px 22px}.ma-auth-fields{grid-template-columns:1fr}.ma-auth-field.full{grid-column:auto}}
.ma-customer-dashboard,
.ma-customer-dashboard * {
box-sizing: border-box;
}
.ma-direct-payment-overlay { display:none; position:fixed; inset:0; z-index:999999; background:rgba(5,20,12,.62); align-items:center; justify-content:center; padding:20px; }
.ma-direct-payment-overlay.open { display:flex; }
.ma-direct-payment-card { width:min(520px,100%); background:#fff; border-radius:22px; padding:28px; position:relative; box-shadow:0 24px 80px rgba(0,0,0,.22); }
.ma-direct-payment-card h2 { margin:8px 0; }
.ma-direct-payment-card p { color:var(--ma-muted); line-height:1.6; }
.ma-direct-payment-card label { display:block; font-weight:700; margin:14px 0 6px; }
.ma-direct-payment-card input { width:100%; min-height:48px; border:1px solid var(--ma-border); border-radius:12px; padding:0 14px; font-size:15px; }
.ma-direct-payment-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px; }
.ma-direct-payment-message { margin-top:12px; color:var(--ma-danger); font-size:13px; min-height:18px; }
.ma-wallet-internal-tools { margin-top:18px; }
.ma-wallet-tool { display:none; margin-top:12px; padding:18px; border:1px solid var(--ma-border); border-radius:16px; background:#fff; }
.ma-wallet-tool.open { display:block; }
.ma-personal-details-card{margin:0 0 14px;padding:18px;border:1px solid var(--ma-border);border-radius:18px;background:#f8fcf9}.ma-personal-details-head{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.ma-personal-details-head strong{font-size:12px;color:var(--ma-text)}.ma-personal-details-head span{font-size:8px;color:var(--ma-muted)}.ma-photo-upload-box{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px;margin-bottom:16px;border:1px dashed #b9dfc6;border-radius:16px;background:#f8fcf9}.ma-photo-upload-box div{display:flex;flex-direction:column;gap:4px}.ma-photo-upload-box strong{font-size:10px}.ma-photo-upload-box span{font-size:8px;color:var(--ma-muted)}.ma-photo-upload-box input{font-size:9px;max-width:260px}
.ma-wallet-tool-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:15px; }
.ma-wallet-tool-head h3 { margin:0 0 5px; }
.ma-wallet-tool-head p { margin:0; color:var(--ma-muted); }
@media (max-width:640px){ .ma-direct-payment-actions{grid-template-columns:1fr;} .ma-direct-payment-card{padding:20px;} }
.ma-customer-dashboard {
--ma-green: #087f3f;
--ma-green-2: #0ab952;
--ma-green-dark: #056b34;
--ma-green-light: #e9f8ef;
--ma-green-soft: #f4fbf6;
--ma-text: #15231b;
--ma-muted: #77847c;
--ma-border: #e4eee8;
--ma-white: #fff;
--ma-danger: #c53d3d;
--ma-warning: #a66b00;
--ma-shadow: none;
width: 100%;
max-width: none;
min-height: 100vh;
height: 100vh;
margin: 0;
padding: 0;
border: 0;
border-radius: 0;
overflow: hidden;
background: #f7faf8;
color: var(--ma-text);
font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
box-shadow: var(--ma-shadow);
}
.ma-customer-dashboard a {
text-decoration: none !important;
}
.ma-dashboard-layout {
display: grid;
grid-template-columns: 255px minmax(0, 1fr);
width: 100%;
height: 100vh;
min-height: 100vh;
overflow: hidden;
}
.ma-dashboard-sidebar {
position: relative;
display: flex;
flex-direction: column;
padding: 27px 17px 20px;
color: #fff;
background:
radial-gradient(circle at 10% 5%, rgba(255,255,255,.10), transparent 26%),
linear-gradient(180deg, #087d3d 0%, #056a34 100%);
}
.ma-brand {
display: flex;
align-items: center;
gap: 10px;
padding: 3px 12px 27px;
}
.ma-brand-logo {
width: 45px;
height: 45px;
display: grid;
place-items: center;
border-radius: 14px;
background: #fff;
color: var(--ma-green);
font-weight: 950;
font-size: 20px;
box-shadow: 0 12px 28px rgba(0,0,0,.13);
}
.ma-brand-copy strong {
display: block;
color: #fff;
font-size: 17px;
font-weight: 900;
letter-spacing: -.4px;
line-height: 1;
}
.ma-brand-copy span {
display: block;
margin-top: 5px;
color: rgba(255,255,255,.58);
font-size: 9px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 1.4px;
}
.ma-sidebar-label {
padding: 11px 12px 7px;
color: rgba(255,255,255,.43);
font-size: 9px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: 1.25px;
}
.ma-sidebar-nav {
display: flex;
flex-direction: column;
gap: 6px;
}
.ma-sidebar-link {
display: flex;
align-items: center;
gap: 11px;
min-height: 48px;
padding: 0 12px;
border: 1px solid transparent;
border-radius: 15px;
color: rgba(255,255,255,.80) !important;
cursor: pointer;
font-size: 12px;
font-weight: 750;
transition: .22s ease;
}
.ma-sidebar-link:hover {
color: #fff !important;
background: rgba(255,255,255,.10);
transform: translateX(2px);
}
.ma-sidebar-link.ma-active {
color: #fff !important;
background: rgba(255,255,255,.16);
border-color: rgba(255,255,255,.08);
box-shadow: 0 8px 20px rgba(0,0,0,.07);
}
.ma-sidebar-icon {
width: 31px;
height: 31px;
flex: 0 0 31px;
display: grid;
place-items: center;
border-radius: 10px;
background: rgba(255,255,255,.09);
font-size: 14px;
}
.ma-sidebar-link.ma-active .ma-sidebar-icon {
background: rgba(255,255,255,.20);
}
.ma-sidebar-badge {
margin-left: auto;
min-width: 20px;
height: 20px;
padding: 0 6px;
display: inline-grid;
place-items: center;
border-radius: 999px;
background: #fff;
color: var(--ma-green);
font-size: 9px;
font-weight: 900;
}
.ma-sidebar-bottom {
margin-top: auto;
padding: 18px 5px 0;
}
.ma-sidebar-profile {
display: flex;
align-items: center;
gap: 10px;
padding: 13px;
border: 1px solid rgba(255,255,255,.11);
border-radius: 17px;
background: rgba(255,255,255,.07);
}
.ma-sidebar-profile img {
width: 39px;
height: 39px;
border-radius: 12px;
object-fit: cover;
border: 2px solid rgba(255,255,255,.55);
}
.ma-sidebar-profile strong {
display: block;
max-width: 135px;
overflow: hidden;
color: #fff;
font-size: 11px;
font-weight: 850;
text-overflow: ellipsis;
white-space: nowrap;
}
.ma-sidebar-profile span {
display: block;
margin-top: 3px;
color: rgba(255,255,255,.55);
font-size: 9px;
}
.ma-dashboard-main {
min-width: 0;
padding: 20px 28px 40px;
background: #fbfdfc;
}
.ma-topbar {
display: flex;
align-items: center;
gap: 12px;
min-height: 54px;
margin-bottom: 18px;
}
.ma-mobile-menu {
display: none;
width: 43px;
height: 43px;
border: 1px solid var(--ma-border);
border-radius: 13px;
background: #fff;
color: var(--ma-green);
cursor: pointer;
font-size: 18px;
}
.ma-search {
position: relative;
flex: 1;
max-width: 570px;
}
.ma-search input {
width: 100% !important;
height: 46px !important;
margin: 0 !important;
padding: 0 49px 0 17px !important;
border: 1px solid #edf1ee !important;
border-radius: 15px !important;
outline: none !important;
background: #f2f6f3 !important;
color: var(--ma-text) !important;
font-size: 12px !important;
box-shadow: none !important;
}
.ma-search button {
position: absolute;
top: 5px;
right: 5px;
width: 36px;
height: 36px;
border: 0 !important;
border-radius: 10px;
background: #fff !important;
color: var(--ma-green) !important;
cursor: pointer;
font-size: 16px;
}
.ma-top-actions {
display: flex;
align-items: center;
gap: 8px;
margin-left: auto;
}
.ma-top-action {
position: relative;
width: 42px;
height: 42px;
display: grid;
place-items: center;
border: 1px solid var(--ma-border);
border-radius: 13px;
background: #fff;
color: #53605a !important;
font-size: 16px;
cursor: pointer;
transition: .2s ease;
}
.ma-top-action:hover {
color: var(--ma-green) !important;
border-color: #cde5d5;
transform: translateY(-1px);
}
.ma-top-dot {
position: absolute;
top: 7px;
right: 7px;
width: 7px;
height: 7px;
border-radius: 50%;
border: 2px solid #fff;
background: #0ac45a;
}
.ma-top-avatar {
width: 43px;
height: 43px;
border-radius: 14px;
object-fit: cover;
border: 2px solid #fff;
box-shadow: 0 6px 18px rgba(0,0,0,.10);
}
.ma-panel {
display: none;
animation: maPanelIn .22s ease;
}
.ma-panel.ma-panel-active {
display: block;
}
@keyframes maPanelIn {
from {
opacity: 0;
transform: translateY(5px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.ma-page-header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 20px;
margin: 4px 0 18px;
}
.ma-page-header h1 {
margin: 0 !important;
color: var(--ma-text) !important;
font-size: 25px !important;
line-height: 1.15 !important;
font-weight: 900 !important;
letter-spacing: -.8px !important;
}
.ma-page-header p {
margin: 6px 0 0 !important;
color: var(--ma-muted) !important;
font-size: 11px !important;
line-height: 1.5 !important;
}
.ma-section-title {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 14px;
margin: 27px 0 13px;
}
.ma-section-title h2 {
margin: 0 !important;
color: var(--ma-text) !important;
font-size: 18px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
letter-spacing: -.45px !important;
}
.ma-section-title p {
margin: 4px 0 0 !important;
color: var(--ma-muted) !important;
font-size: 10px !important;
}
.ma-see-all {
color: var(--ma-green) !important;
font-size: 10px;
font-weight: 900;
cursor: pointer;
}
.ma-hero {
position: relative;
min-height: 190px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 25px;
padding: 31px 36px;
overflow: hidden;
border-radius: 25px;
background:
radial-gradient(circle at 88% 15%, rgba(255,255,255,.17), transparent 19%),
radial-gradient(circle at 72% 115%, rgba(255,255,255,.09), transparent 36%),
linear-gradient(120deg, #087d3d 0%, #0bb952 100%);
box-shadow: 0 18px 38px rgba(7,125,62,.17);
}
.ma-hero:before,
.ma-hero:after {
content: "";
position: absolute;
border: 1px solid rgba(255,255,255,.13);
border-radius: 50%;
pointer-events: none;
}
.ma-hero:before {
width: 240px;
height: 240px;
right: -100px;
top: -120px;
}
.ma-hero:after {
width: 170px;
height: 170px;
right: 110px;
bottom: -120px;
}
.ma-hero-content {
position: relative;
z-index: 2;
}
.ma-hero-kicker {
display: inline-flex;
padding: 6px 10px;
margin-bottom: 10px;
border-radius: 999px;
background: rgba(255,255,255,.12);
color: rgba(255,255,255,.88);
font-size: 9px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .8px;
}
.ma-hero h1 {
margin: 0 !important;
color: #fff !important;
font-size: clamp(25px, 3vw, 36px) !important;
line-height: 1.08 !important;
font-weight: 900 !important;
letter-spacing: -1.25px !important;
}
.ma-hero p {
max-width: 560px;
margin: 9px 0 0 !important;
color: rgba(255,255,255,.78) !important;
font-size: 12px !important;
line-height: 1.55 !important;
}
.ma-hero-profile {
position: relative;
z-index: 2;
width: 112px;
height: 112px;
flex: 0 0 112px;
padding: 6px;
border-radius: 50%;
background: rgba(255,255,255,.20);
border: 1px solid rgba(255,255,255,.25);
box-shadow: 0 15px 30px rgba(0,0,0,.12);
}
.ma-hero-profile img {
width: 100%;
height: 100%;
border: 4px solid #fff;
border-radius: 50%;
object-fit: cover;
}
.ma-online-dot {
position: absolute;
right: 5px;
bottom: 8px;
width: 18px;
height: 18px;
border: 3px solid #fff;
border-radius: 50%;
background: #0bd25e;
}
.ma-stats {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 11px;
}
.ma-stat {
min-height: 118px;
padding: 16px;
border: 1px solid var(--ma-border);
border-radius: 19px;
background: #fff;
transition: .22s ease;
}
.ma-stat:hover {
transform: translateY(-3px);
border-color: #d2e8da;
box-shadow: 0 12px 30px rgba(25,75,47,.08);
}
.ma-stat-top {
display: flex;
align-items: center;
justify-content: space-between;
color: var(--ma-green);
font-size: 17px;
}
.ma-stat-pill {
padding: 4px 7px;
border-radius: 999px;
background: var(--ma-green-light);
color: var(--ma-green);
font-size: 8px;
font-weight: 900;
}
.ma-stat-value {
margin-top: 13px;
color: var(--ma-text);
font-size: 21px;
font-weight: 900;
line-height: 1;
letter-spacing: -.6px;
}
.ma-stat-label {
margin-top: 7px;
color: var(--ma-muted);
font-size: 9px;
font-weight: 700;
}
.ma-quick-actions {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
margin-top: 13px;
}
.ma-btn {
min-height: 46px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 0 15px;
border: 0;
border-radius: 13px;
font-size: 11px;
font-weight: 900;
cursor: pointer;
transition: .22s ease;
}
.ma-btn-primary {
color: #fff !important;
background: linear-gradient(135deg, #087e3f, #0ab952);
box-shadow: 0 9px 20px rgba(6,127,62,.17);
}
.ma-btn-primary:hover {
color: #fff !important;
background: linear-gradient(135deg, #056d35, #079e46);
transform: translateY(-2px);
}
.ma-btn-secondary {
color: var(--ma-green) !important;
border: 1px solid #cde7d6;
background: #fff;
}
.ma-btn-secondary:hover {
color: var(--ma-green) !important;
background: var(--ma-green-light);
transform: translateY(-2px);
}
.ma-card {
overflow: hidden;
border: 1px solid var(--ma-border);
border-radius: 20px;
background: #fff;
}
.ma-card-pad {
padding: 20px;
}
.ma-inline-notice {
padding: 15px;
border-radius: 13px;
background: #fff8e9;
color: #7f5b16;
font-size: 11px;
font-weight: 700;
}
.ma-success {
padding: 13px 15px;
margin-bottom: 15px;
border: 1px solid #cdebd7;
border-radius: 12px;
background: #eefaf2;
color: #18723d;
font-size: 11px;
font-weight: 750;
}
.ma-error {
padding: 13px 15px;
margin-bottom: 15px;
border: 1px solid #f1d1d1;
border-radius: 12px;
background: #fff2f2;
color: #a33131;
font-size: 11px;
font-weight: 750;
}
.ma-orders-scroll {
width: 100%;
overflow-x: auto;
}
.ma-orders-table {
width: 100%;
min-width: 720px;
border-collapse: collapse;
}
.ma-orders-table th {
padding: 13px 16px;
border-bottom: 1px solid var(--ma-border);
background: #f7faf8;
color: #7b8780;
font-size: 8px;
font-weight: 900;
text-align: left;
text-transform: uppercase;
letter-spacing: .7px;
}
.ma-orders-table td {
padding: 14px 16px;
border-bottom: 1px solid #edf2ee;
color: #3e4b44;
font-size: 10px;
font-weight: 650;
vertical-align: middle;
}
.ma-orders-table tr:last-child td {
border-bottom: 0;
}
.ma-order-number {
color: var(--ma-green) !important;
font-weight: 900 !important;
}
.ma-status {
display: inline-flex;
padding: 6px 9px;
border-radius: 999px;
background: #eef8f1;
color: var(--ma-green);
font-size: 8px;
font-weight: 900;
white-space: nowrap;
}
.ma-status-pending,
.ma-status-on-hold {
color: var(--ma-warning);
background: #fff7e7;
}
.ma-status-cancelled,
.ma-status-failed,
.ma-status-refunded {
color: var(--ma-danger);
background: #fff0f0;
}
.ma-empty {
padding: 40px 20px;
text-align: center;
}
.ma-empty-icon {
width: 56px;
height: 56px;
display: grid;
place-items: center;
margin: 0 auto 10px;
border-radius: 17px;
background: var(--ma-green-light);
color: var(--ma-green);
font-size: 22px;
}
.ma-empty strong {
display: block;
color: var(--ma-text);
font-size: 13px;
}
.ma-empty p {
margin: 6px 0 16px;
color: var(--ma-muted);
font-size: 10px;
}
.ma-order-detail {
display: none;
margin-top: 13px;
border: 1px solid #dcebe2;
border-radius: 17px;
background: #f8fcf9;
overflow: hidden;
}
.ma-order-detail.ma-open {
display: block;
animation: maPanelIn .2s ease;
}
.ma-order-detail-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 15px;
padding: 14px 16px;
background: #fff;
border-bottom: 1px solid #e5eee8;
}
.ma-order-detail-head strong {
color: var(--ma-text);
font-size: 12px;
}
.ma-order-detail-body {
padding: 16px;
}
.ma-order-info-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 9px;
margin-bottom: 15px;
}
.ma-order-info {
padding: 11px;
border-radius: 12px;
background: #fff;
border: 1px solid #e5eee8;
}
.ma-order-info span {
display: block;
color: var(--ma-muted);
font-size: 8px;
font-weight: 700;
}
.ma-order-info strong {
display: block;
margin-top: 5px;
color: var(--ma-text);
font-size: 11px;
font-weight: 900;
}
.ma-order-items {
display: flex;
flex-direction: column;
gap: 7px;
}
.ma-order-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 10px 12px;
border: 1px solid #e6eee9;
border-radius: 11px;
background: #fff;
}
.ma-order-item-name {
color: var(--ma-text);
font-size: 10px;
font-weight: 800;
}
.ma-order-item-meta {
margin-top: 3px;
color: var(--ma-muted);
font-size: 8px;
}
.ma-order-item-total {
color: var(--ma-green);
font-size: 10px;
font-weight: 900;
white-space: nowrap;
}
.ma-products-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 12px;
}
.ma-product-card {
overflow: hidden;
border: 1px solid var(--ma-border);
border-radius: 19px;
background: #fff;
transition: .22s ease;
}
.ma-product-card:hover {
transform: translateY(-3px);
box-shadow: 0 13px 30px rgba(25,75,47,.08);
}
.ma-product-image {
position: relative;
height: 150px;
background: #f3f7f4;
overflow: hidden;
}
.ma-product-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: .3s ease;
}
.ma-product-card:hover .ma-product-image img {
transform: scale(1.04);
}
.ma-product-badge {
position: absolute;
z-index: 2;
top: 9px;
left: 9px;
padding: 5px 7px;
border-radius: 999px;
background: #fff;
color: var(--ma-green);
font-size: 7px;
font-weight: 900;
box-shadow: 0 4px 12px rgba(0,0,0,.07);
}
.ma-product-body {
padding: 12px;
}
.ma-product-name {
display: -webkit-box;
min-height: 31px;
overflow: hidden;
color: var(--ma-text) !important;
font-size: 10px;
line-height: 1.45;
font-weight: 850;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.ma-product-price {
margin-top: 7px;
color: var(--ma-green);
font-size: 13px;
font-weight: 950;
}
.ma-product-add {
width: 100%;
min-height: 34px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 10px;
border-radius: 10px;
background: var(--ma-green);
color: #fff !important;
font-size: 9px;
font-weight: 900;
}
.ma-product-add:hover {
color: #fff !important;
background: var(--ma-green-dark);
}
.ma-cart-items {
display: flex;
flex-direction: column;
gap: 9px;
}
.ma-cart-item {
display: flex;
align-items: center;
gap: 12px;
padding: 12px;
border: 1px solid var(--ma-border);
border-radius: 15px;
background: #fff;
}
.ma-cart-item img {
width: 58px;
height: 58px;
border-radius: 12px;
object-fit: cover;
background: #f3f7f4;
}
.ma-cart-item-main {
min-width: 0;
flex: 1;
}
.ma-cart-item-main strong {
display: block;
color: var(--ma-text);
font-size: 10px;
font-weight: 850;
}
.ma-cart-item-main span {
display: block;
margin-top: 4px;
color: var(--ma-muted);
font-size: 8px;
}
.ma-cart-item-controls { display:flex; align-items:center; gap:6px; margin-top:8px; }
.ma-cart-qty-btn { width:28px; height:28px; border:1px solid var(--ma-border); border-radius:8px; background:#fff; color:var(--ma-green-dark); font-weight:900; cursor:pointer; line-height:1; }
.ma-cart-qty { min-width:24px; text-align:center; font-size:10px; font-weight:850; color:var(--ma-text); }
.ma-cart-remove { border:0; background:transparent; color:#b24b4b; font-size:8px; font-weight:800; cursor:pointer; padding:5px 2px; }
.ma-cart-qty-btn:disabled,.ma-cart-remove:disabled { opacity:.45; cursor:wait; }
.ma-cart-item.is-updating { opacity:.6; pointer-events:none; }
.ma-cart-live-total { transition:opacity .15s ease; }
.ma-market-cart-item { align-items:flex-start; }
.ma-market-cart-item input { font:inherit; }
@media (max-width:680px){ .ma-market-cart-item > .ma-cart-item-main > div[style*='grid-template-columns']{grid-template-columns:1fr 1fr !important;} .ma-market-cart-item > .ma-cart-item-main > div[style*='grid-template-columns'] label:first-child{grid-column:1/-1;} .ma-cart-item{align-items:flex-start;} .ma-cart-item > .ma-cart-line-total{white-space:nowrap;} }
.ma-cart-total-box {
display: flex;
align-items: center;
justify-content: space-between;
gap: 15px;
margin-top: 15px;
padding: 15px;
border-radius: 15px;
background: var(--ma-green-soft);
border: 1px solid #d9eee0;
}
.ma-cart-total-box span {
color: var(--ma-muted);
font-size: 10px;
}
.ma-cart-total-box strong {
color: var(--ma-green);
font-size: 18px;
font-weight: 950;
}
.ma-market-pagination{display:flex;align-items:center;justify-content:center;gap:7px;margin:24px 0 6px;flex-wrap:wrap}.ma-market-page,.ma-market-page-arrow{min-width:34px;height:34px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #dfeae3;border-radius:10px;background:#fff;color:#526259;text-decoration:none;font-size:9px;font-weight:900;transition:.18s ease}.ma-market-page:hover,.ma-market-page-arrow:hover{border-color:#0ab952;color:#087f3f;transform:translateY(-1px)}.ma-market-page.is-active{background:#087f3f;border-color:#087f3f;color:#fff;box-shadow:0 8px 18px rgba(8,127,63,.16)}.ma-market-page-arrow{font-size:18px;line-height:1}.ma-market-page-dots{font-size:12px;color:#9aa59f;padding:0 2px}.ma-market-page-summary{text-align:center;color:#7b8981;font-size:8px;font-weight:700;margin-bottom:8px}.ma-wallet-atm-top .ma-wallet-brand{margin-top:0}.ma-wallet-atm-top .ma-wallet-chip{display:block;margin-top:0}
.ma-wallet-atm-card{position:relative;overflow:hidden;min-height:275px;padding:27px 30px;border-radius:26px;background:linear-gradient(135deg,#062d1c 0%,#075d37 52%,#0b9149 100%);color:#fff;box-shadow:0 20px 50px rgba(5,72,43,.20);border:1px solid rgba(255,255,255,.12)}
.ma-wallet-atm-glow{position:absolute;width:280px;height:280px;right:-120px;top:-150px;border-radius:50%;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 35px rgba(255,255,255,.025),0 0 0 70px rgba(255,255,255,.018)}
.ma-wallet-atm-head{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.ma-wallet-atm-head div{display:flex;flex-direction:column;gap:4px}.ma-wallet-atm-label{font-size:9px;font-weight:950;letter-spacing:2px;color:rgba(255,255,255,.72)}.ma-wallet-atm-head strong{font-size:18px;letter-spacing:.5px}.ma-wallet-contactless{font-size:25px;letter-spacing:-8px;opacity:.8;transform:rotate(90deg);display:inline-block;margin-right:8px}.ma-wallet-atm-chip-row{position:relative;z-index:2;display:flex;align-items:center;gap:12px;margin-top:24px}.ma-wallet-secure{font-size:8px;font-weight:850;letter-spacing:1.2px;color:#8df0b6}.ma-wallet-atm-balance-label{position:relative;z-index:2;margin-top:23px;color:rgba(255,255,255,.58);font-size:8px;font-weight:850;letter-spacing:1.5px}.ma-wallet-atm-balance{position:relative;z-index:2;margin-top:6px;font-size:clamp(30px,4vw,48px);font-weight:950;line-height:1;letter-spacing:-1.8px}.ma-wallet-atm-details{position:relative;z-index:2;display:grid;grid-template-columns:1.4fr 1fr;gap:20px;margin-top:25px;padding-top:14px;border-top:1px solid rgba(255,255,255,.13)}.ma-wallet-atm-details div{display:flex;flex-direction:column;gap:5px;min-width:0}.ma-wallet-atm-details span{font-size:7px;letter-spacing:1.4px;color:rgba(255,255,255,.50);font-weight:850}.ma-wallet-atm-details strong{font-size:10px;letter-spacing:.7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ma-wallet-feature-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:13px}.ma-wallet-feature{display:flex;flex-direction:column;gap:5px;min-width:0;padding:15px 12px;border:1px solid var(--ma-border);border-radius:17px;background:#fff;text-decoration:none;transition:.18s ease}.ma-wallet-feature:hover{transform:translateY(-2px);border-color:#b9dfc6;box-shadow:0 10px 25px rgba(5,72,43,.07)}.ma-wallet-feature-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:10px;background:#eaf8ef;color:#087f3f;font-size:16px;font-weight:900}.ma-wallet-feature strong{font-size:9px;color:var(--ma-text);font-weight:950}.ma-wallet-feature small{font-size:7px;line-height:1.35;color:var(--ma-muted)}
.ma-wallet-hero {
position: relative;
overflow: hidden;
min-height: 190px;
padding: 25px 28px;
border-radius: 24px;
background:
radial-gradient(circle at 85% 15%, rgba(255,255,255,.12), transparent 34%),
linear-gradient(135deg, #062f1d 0%, #075b35 52%, #087f3f 100%);
color: #fff;
box-shadow: 0 18px 45px rgba(5,72,43,.18);
border: 1px solid rgba(255,255,255,.10);
}
.ma-wallet-hero:before {
content: '';
position: absolute;
width: 180px;
height: 180px;
right: -65px;
bottom: -95px;
border: 1px solid rgba(255,255,255,.10);
border-radius: 50%;
box-shadow: 0 0 0 22px rgba(255,255,255,.025), 0 0 0 44px rgba(255,255,255,.018);
}
.ma-wallet-atm-top {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.ma-wallet-chip {
width: 38px;
height: 28px;
border-radius: 7px;
background: linear-gradient(135deg, #d7b66b, #f2d991);
box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
position: relative;
}
.ma-wallet-chip:after {
content: '';
position: absolute;
inset: 6px 9px;
border: 1px solid rgba(80,60,20,.35);
border-radius: 4px;
}
.ma-wallet-brand {
font-size: 9px;
font-weight: 950;
letter-spacing: 1.5px;
color: rgba(255,255,255,.78);
text-transform: uppercase;
}
.ma-wallet-hero span {
position: relative;
z-index: 1;
display: block;
margin-top: 24px;
color: rgba(255,255,255,.62);
font-size: 9px;
font-weight: 800;
letter-spacing: 1.6px;
}
.ma-wallet-hero strong {
position: relative;
z-index: 1;
display: block;
margin-top: 7px;
color: #fff;
font-size: clamp(30px, 4vw, 44px);
font-weight: 950;
letter-spacing: -1.5px;
line-height: 1;
}
.ma-wallet-hero small {
position: relative;
z-index: 1;
display: flex;
align-items: center;
gap: 7px;
margin-top: 13px;
color: rgba(255,255,255,.62);
font-size: 8px;
}
.ma-wallet-hero small:before {
content: '●';
color: #45df86;
font-size: 8px;
}
.ma-wallet-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 11px;
margin-top: 13px;
}
.ma-wallet-card {
padding: 16px;
border: 1px solid var(--ma-border);
border-radius: 17px;
background: #fff;
}
.ma-wallet-card strong {
display: block;
color: var(--ma-text);
font-size: 13px;
}
.ma-wallet-card span {
display: block;
margin-top: 5px;
color: var(--ma-muted);
font-size: 9px;
}
.ma-support-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 12px;
}
.ma-support-card {
padding: 19px;
border: 1px solid var(--ma-border);
border-radius: 19px;
background: #fff;
transition: .2s ease;
}
.ma-support-card:hover {
transform: translateY(-2px);
box-shadow: 0 12px 28px rgba(25,75,47,.07);
}
.ma-support-icon {
width: 39px;
height: 39px;
display: grid;
place-items: center;
margin-bottom: 12px;
border-radius: 12px;
background: var(--ma-green-light);
color: var(--ma-green);
font-size: 16px;
}
.ma-support-card strong {
display: block;
color: var(--ma-text);
font-size: 11px;
}
.ma-support-card p {
margin: 6px 0 13px !important;
color: var(--ma-muted) !important;
font-size: 9px !important;
line-height: 1.55 !important;
}
.ma-settings-form {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 13px;
}
.ma-field {
display: flex;
flex-direction: column;
gap: 6px;
}
.ma-field.ma-full {
grid-column: 1 / -1;
}
.ma-field label {
color: #4d5a53;
font-size: 9px;
font-weight: 850;
}
.ma-field input {
width: 100% !important;
min-height: 43px !important;
padding: 0 12px !important;
border: 1px solid #dfeae3 !important;
border-radius: 11px !important;
background: #fbfdfc !important;
color: var(--ma-text) !important;
outline: none !important;
box-shadow: none !important;
font-size: 10px !important;
}
.ma-field input:focus {
border-color: #9dd5af !important;
background: #fff !important;
}
.ma-profile-header {
display: flex;
align-items: center;
gap: 14px;
padding: 17px;
margin-bottom: 16px;
border-radius: 17px;
background: var(--ma-green-soft);
border: 1px solid #d9eee0;
}
.ma-profile-header img {
width: 59px;
height: 59px;
border-radius: 17px;
object-fit: cover;
}
.ma-profile-header strong {
display: block;
color: var(--ma-text);
font-size: 13px;
}
.ma-profile-header span {
display: block;
margin-top: 4px;
color: var(--ma-muted);
font-size: 9px;
}
.ma-login-screen {
min-height: 550px;
display: grid;
place-items: center;
padding: 30px;
border-radius: 25px;
background: linear-gradient(135deg,#f0faf3,#fbfdfc);
}
.ma-login-card {
width: 100%;
max-width: 460px;
padding: 38px;
border: 1px solid var(--ma-border);
border-radius: 25px;
background: #fff;
text-align: center;
box-shadow: var(--ma-shadow);
}
.ma-login-logo {
width: 58px;
height: 58px;
display: grid;
place-items: center;
margin: 0 auto 13px;
border-radius: 18px;
color: #fff;
background: linear-gradient(135deg,#087e3f,#0ab952);
font-size: 24px;
font-weight: 950;
}
.ma-login-kicker {
color: var(--ma-green);
font-size: 9px;
font-weight: 900;
letter-spacing: 1.4px;
}
.ma-login-card h2 {
margin: 12px 0 8px !important;
color: var(--ma-text) !important;
font-size: 23px !important;
font-weight: 900 !important;
}
.ma-login-card p {
margin: 0 0 20px !important;
color: var(--ma-muted) !important;
font-size: 11px !important;
line-height: 1.6 !important;
}
.ma-sidebar-overlay {
display: none;
position: fixed;
z-index: 99998;
inset: 0;
background: rgba(8,28,17,.43);
}
@media (min-width: 851px) {
html:has(.ma-customer-dashboard),
body:has(.ma-customer-dashboard) {
width: 100%;
max-width: 100%;
margin: 0 !important;
padding: 0 !important;
overflow: hidden;
}
body:has(.ma-customer-dashboard) #page,
body:has(.ma-customer-dashboard) .site,
body:has(.ma-customer-dashboard) .site-content,
body:has(.ma-customer-dashboard) .site-main,
body:has(.ma-customer-dashboard) .content-area,
body:has(.ma-customer-dashboard) .main-content,
body:has(.ma-customer-dashboard) .entry-content,
body:has(.ma-customer-dashboard) .container,
body:has(.ma-customer-dashboard) .site-container,
body:has(.ma-customer-dashboard) .page-container,
body:has(.ma-customer-dashboard) .content-wrapper,
body:has(.ma-customer-dashboard) .page-content {
width: 100% !important;
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
body:has(.ma-customer-dashboard) .widget-area,
body:has(.ma-customer-dashboard) .sidebar,
body:has(.ma-customer-dashboard) .site-sidebar,
body:has(.ma-customer-dashboard) .secondary,
body:has(.ma-customer-dashboard) .right-sidebar,
body:has(.ma-customer-dashboard) .left-sidebar,
body:has(.ma-customer-dashboard) .page-sidebar,
body:has(.ma-customer-dashboard) aside:not(.ma-dashboard-sidebar) {
display: none !important;
width: 0 !important;
max-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
body:has(.ma-customer-dashboard) .ma-customer-dashboard {
position: fixed !important;
inset: 0 !important;
width: 100vw !important;
max-width: 100vw !important;
height: 100vh !important;
min-height: 100vh !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
overflow: hidden !important;
z-index: 99990 !important;
}
body:has(.ma-customer-dashboard) header,
body:has(.ma-customer-dashboard) .site-header,
body:has(.ma-customer-dashboard) .main-header,
body:has(.ma-customer-dashboard) .elementor-location-header,
body:has(.ma-customer-dashboard) footer,
body:has(.ma-customer-dashboard) .site-footer,
body:has(.ma-customer-dashboard) .elementor-location-footer,
body:has(.ma-customer-dashboard) .breadcrumb,
body:has(.ma-customer-dashboard) .breadcrumbs {
display: none !important;
}
body:has(.ma-customer-dashboard) .ma-dashboard-layout {
width: 100vw !important;
max-width: 100vw !important;
height: 100vh !important;
min-height: 100vh !important;
}
body:has(.ma-customer-dashboard) .ma-dashboard-main {
width: 100% !important;
min-width: 0 !important;
height: 100vh !important;
min-height: 100vh !important;
padding: 20px 30px 40px !important;
overflow-y: auto !important;
overflow-x: hidden !important;
}
body:has(.ma-customer-dashboard) .ma-panel {
width: 100% !important;
max-width: none !important;
}
}
@media (max-width: 1180px) {
.ma-dashboard-layout {
grid-template-columns: 220px minmax(0,1fr);
}
.ma-dashboard-main {
padding: 18px 20px 35px;
}
.ma-stats {
grid-template-columns: repeat(2,1fr);
}
.ma-products-grid {
grid-template-columns: repeat(3,1fr);
}
}
@media (max-width: 850px) {
body:has(.ma-customer-dashboard) .ma-customer-dashboard {
position: relative !important;
inset: auto !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
min-height: 100vh !important;
overflow: visible !important;
z-index: auto !important;
}
.ma-customer-dashboard {
width: 100%;
max-width: 100%;
min-height: 100vh;
height: auto;
margin: 0;
padding: 0;
border-radius: 0;
border: 0;
overflow: visible;
}
.ma-dashboard-layout {
display: block;
width: 100%;
height: auto;
min-height: 100vh;
overflow: visible;
}
.ma-dashboard-sidebar {
position: fixed;
z-index: 100000;
top: 0;
left: 0;
width: 275px;
height: 100vh;
overflow-y: auto;
border-radius: 0 25px 25px 0;
transform: translateX(-105%);
transition: transform .25s ease;
}
.ma-customer-dashboard.ma-menu-open .ma-dashboard-sidebar {
transform: translateX(0);
}
.ma-customer-dashboard.ma-menu-open .ma-sidebar-overlay {
display: block;
}
.ma-mobile-menu {
display: grid;
place-items: center;
}
.ma-dashboard-main {
padding: 13px;
}
.ma-topbar {
gap: 8px;
}
.ma-search {
max-width: none;
}
.ma-top-action.ma-mobile-hide {
display: none;
}
.ma-hero {
min-height: 185px;
padding: 26px;
}
.ma-hero-profile {
width: 92px;
height: 92px;
flex-basis: 92px;
}
.ma-support-grid {
grid-template-columns: 1fr;
}
}
@media (max-width: 620px) {
.ma-stats {
grid-template-columns: repeat(2,1fr);
gap: 9px;
}
.ma-stat {
min-height: 103px;
padding: 13px;
}
.ma-stat-value {
font-size: 18px;
}
.ma-quick-actions {
grid-template-columns: 1fr;
}
.ma-hero {
min-height: 205px;
padding: 21px;
}
.ma-hero h1 {
font-size: 25px !important;
}
.ma-hero-profile {
position: absolute;
right: 18px;
top: 18px;
width: 76px;
height: 76px;
}
.ma-hero-content {
padding-right: 58px;
}
.ma-products-grid {
grid-template-columns: repeat(2,1fr);
gap: 9px;
}
.ma-product-image {
height: 125px;
}
.ma-wallet-grid {
grid-template-columns: 1fr;
}
.ma-settings-form {
grid-template-columns: 1fr;
}
.ma-field.ma-full {
grid-column: auto;
}
.ma-order-info-grid {
grid-template-columns: 1fr;
}
.ma-page-header {
align-items: flex-start;
flex-direction: column;
}
}
@media (max-width: 390px) {
.ma-dashboard-main {
padding: 10px;
}
.ma-hero {
padding: 18px;
}
.ma-products-grid {
grid-template-columns: repeat(2,1fr);
}
.ma-product-image {
height: 110px;
}
}
.ma-btn-request {
color: #fff !important;
background: linear-gradient(135deg, #0b7a43, #11b85b);
border: 1px solid rgba(255,255,255,.18);
box-shadow: 0 10px 24px rgba(8,126,63,.20);
}
.ma-btn-request:hover {
color: #fff !important;
transform: translateY(-2px);
box-shadow: 0 14px 28px rgba(8,126,63,.25);
}
.ma-request-layout {
display: grid;
grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr);
gap: 14px;
align-items: start;
}
.ma-request-card {
padding: 20px;
border: 1px solid var(--ma-border);
border-radius: 20px;
background: #fff;
box-shadow: 0 14px 35px rgba(20,70,45,.05);
}
.ma-request-form-grid {
display: grid;
grid-template-columns: minmax(0,1fr) 170px 190px;
gap: 11px;
}
.ma-request-field {
display: flex;
flex-direction: column;
gap: 6px;
}
.ma-request-field label {
color: #26362e;
font-size: 9px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .5px;
}
.ma-request-field input,
.ma-request-field textarea {
width: 100%;
border: 1px solid #dce9e1;
border-radius: 12px;
background: #fbfdfc;
color: #17231d;
font-size: 11px;
font-weight: 700;
padding: 12px 13px;
outline: none;
transition: .2s ease;
}
.ma-request-field textarea {
min-height: 90px;
resize: vertical;
}
.ma-market-list-items {
display: flex;
flex-direction: column;
gap: 11px;
}
.ma-market-item-row {
position: relative;
padding: 15px;
border: 1px solid #dce9e1;
border-radius: 16px;
background: #fbfdfc;
}
.ma-market-item-row-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-bottom: 11px;
}
.ma-market-item-number {
color: var(--ma-green);
font-size: 10px;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .5px;
}
.ma-market-remove {
min-height: 30px;
padding: 0 9px;
border: 1px solid #f0d0d0;
border-radius: 9px;
background: #fff5f5;
color: #b73a3a;
font-size: 9px;
font-weight: 900;
cursor: pointer;
}
.ma-market-item-grid {
display: grid;
grid-template-columns: minmax(0,1fr) 125px 165px;
gap: 9px;
}
.ma-market-item-note {
grid-column: 1 / -1;
}
.ma-market-line-total {
display: flex;
justify-content: flex-end;
margin-top: 9px;
color: var(--ma-green);
font-size: 10px;
font-weight: 900;
}
@media (max-width: 720px) {
.ma-market-item-grid {
grid-template-columns: 1fr 1fr;
}
.ma-market-item-grid .ma-market-product-name,
.ma-market-item-note {
grid-column: 1 / -1;
}
}
.ma-request-field input:focus,
.ma-request-field textarea:focus {
border-color: #18a957;
box-shadow: 0 0 0 3px rgba(24,169,87,.09);
background: #fff;
}
.ma-request-help {
margin: 0 0 16px;
padding: 13px 14px;
border-radius: 14px;
background: linear-gradient(135deg,#edf9f1,#f8fcf9);
border: 1px solid #d6ecde;
color: #4f6659;
font-size: 10px;
line-height: 1.6;
}
.ma-request-help strong {
display: block;
color: #087e3f;
margin-bottom: 3px;
font-size: 11px;
}
.ma-request-total {
margin-top: 13px;
padding: 14px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
border-radius: 14px;
background: #f5fbf7;
border: 1px solid #d8eee0;
}
.ma-request-total span {
color: #64746b;
font-size: 9px;
font-weight: 800;
}
.ma-request-total strong {
color: #087e3f;
font-size: 16px;
font-weight: 950;
}
.ma-request-submit {
width: 100%;
margin-top: 12px;
}
.ma-request-result {
display: none;
margin-top: 14px;
padding: 15px;
border-radius: 16px;
border: 1px solid #cfe8d8;
background: #f3fbf6;
}
.ma-request-result.show {
display: block;
}
.ma-request-result.error {
border-color: #f0caca;
background: #fff7f7;
}
.ma-request-result h3 {
margin: 0 0 5px;
color: #087e3f;
font-size: 13px;
font-weight: 950;
}
.ma-request-result.error h3 {
color: #a32121;
}
.ma-request-result p {
margin: 0 0 11px;
color: #607168;
font-size: 10px;
line-height: 1.55;
}
.ma-request-summary {
display: grid;
grid-template-columns: repeat(3,1fr);
gap: 8px;
margin: 10px 0 12px;
}
.ma-request-summary > div {
padding: 10px;
border-radius: 11px;
background: #fff;
border: 1px solid #e0eee5;
}
.ma-request-summary span {
display: block;
color: #7a887f;
font-size: 7px;
font-weight: 900;
text-transform: uppercase;
}
.ma-request-summary strong {
display: block;
margin-top: 4px;
color: #213129;
font-size: 10px;
}
.ma-request-side {
padding: 18px;
border-radius: 20px;
background: linear-gradient(150deg,#0b743e,#0a9f4c);
color: #fff;
box-shadow: 0 16px 35px rgba(7,105,56,.17);
position: relative;
overflow: hidden;
}
.ma-request-side:after {
content: '';
position: absolute;
width: 150px;
height: 150px;
right: -70px;
top: -70px;
border-radius: 50%;
background: rgba(255,255,255,.10);
}
.ma-request-side-icon {
width: 43px;
height: 43px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 14px;
background: rgba(255,255,255,.14);
font-size: 22px;
margin-bottom: 14px;
}
.ma-request-side h3 {
margin: 0 0 7px;
font-size: 16px;
font-weight: 950;
color: #fff;
}
.ma-request-side p {
margin: 0;
color: rgba(255,255,255,.78);
font-size: 10px;
line-height: 1.7;
}
.ma-request-side-list {
margin: 15px 0 0;
padding: 0;
list-style: none;
}
.ma-request-side-list li {
display: flex;
gap: 8px;
align-items: flex-start;
padding: 8px 0;
border-top: 1px solid rgba(255,255,255,.12);
color: rgba(255,255,255,.88);
font-size: 9px;
line-height: 1.5;
}
.ma-request-side-list b {
color: #dff9e8;
}
.ma-request-history {
margin-top: 14px;
}
.ma-request-history-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 13px 0;
border-bottom: 1px solid #edf2ee;
}
.ma-request-history-item:last-child {
border-bottom: 0;
}
.ma-request-history-main strong {
display: block;
color: #1d2c24;
font-size: 10px;
font-weight: 900;
}
.ma-request-history-main span {
display: block;
margin-top: 4px;
color: #7a877f;
font-size: 8px;
}
.ma-request-history-actions {
display: flex;
gap: 6px;
align-items: center;
flex-wrap: wrap;
justify-content: flex-end;
}
.ma-request-history-actions .ma-btn {
min-height: 31px;
padding: 0 10px;
font-size: 8px;
}
.ma-request-badge {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 4px 7px;
border-radius: 999px;
background: #eaf8ef;
color: #087e3f;
font-size: 7px;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .3px;
}
@media (max-width: 800px) {
.ma-request-layout {
grid-template-columns: 1fr;
}
.ma-request-form-grid {
grid-template-columns: 1fr 1fr;
}
.ma-request-field:first-child,
.ma-request-field:nth-child(4) {
grid-column: 1 / -1;
}
}
@media (max-width: 500px) {
.ma-request-form-grid {
grid-template-columns: 1fr;
}
.ma-request-field:first-child,
.ma-request-field:nth-child(4) {
grid-column: auto;
}
.ma-request-summary {
grid-template-columns: 1fr;
}
}
.ma-eyebrow{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:var(--ma-green-light);color:var(--ma-green);font-size:8px;font-weight:950;letter-spacing:.8px;text-transform:uppercase;margin-bottom:7px}
.ma-customer-chat-shell{display:grid;grid-template-columns:310px minmax(0,1fr);min-height:640px;border:1px solid var(--ma-border);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 16px 42px rgba(25,75,47,.06)}
.ma-customer-chat-list{background:#f5f9f6;border-right:1px solid var(--ma-border);display:flex;flex-direction:column;min-width:0}
.ma-customer-chat-list-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px;border-bottom:1px solid var(--ma-border);background:#fff}
.ma-customer-chat-list-head strong{display:block;color:var(--ma-text);font-size:11px;font-weight:950}
.ma-customer-chat-list-head span:not(.ma-chat-live-pill){display:block;margin-top:4px;color:var(--ma-muted);font-size:8px}
.ma-chat-live-pill{padding:5px 7px!important;border-radius:999px!important;background:#eaf9ef;color:#087e3f!important;font-size:7px!important;font-weight:950!important;letter-spacing:.7px}
.ma-customer-conversations{padding:9px;display:grid;align-content:start;gap:7px;overflow:auto}
.ma-customer-conversation{width:100%;border:1px solid transparent;border-radius:15px;background:#fff;padding:11px;text-align:left;cursor:pointer;transition:.2s ease}
.ma-customer-conversation:hover,.ma-customer-conversation.active{border-color:#cde5d6;background:#edf9f1;transform:translateY(-1px)}
.ma-customer-conversation-top{display:flex;gap:9px;align-items:center}
.ma-customer-conversation-avatar{position:relative;width:39px;height:39px;flex:0 0 39px}
.ma-customer-conversation-avatar img{width:39px;height:39px;border-radius:13px;object-fit:cover;border:2px solid #fff;box-shadow:0 5px 13px rgba(0,0,0,.08)}
.ma-customer-conversation-avatar i{position:absolute;right:-1px;bottom:0;width:10px;height:10px;border-radius:50%;background:#a7b2ad;border:2px solid #fff}
.ma-customer-conversation-avatar i.online{background:#12bd5b;box-shadow:0 0 0 3px rgba(18,189,91,.12)}
.ma-customer-conversation-main{min-width:0;flex:1}
.ma-customer-conversation-main strong{display:block;color:var(--ma-text);font-size:10px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ma-customer-conversation-main span{display:block;margin-top:3px;color:var(--ma-muted);font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ma-customer-conversation-unread{min-width:19px;height:19px;display:grid;place-items:center;padding:0 5px;border-radius:999px;background:#0ab952;color:#fff;font-size:7px;font-weight:950}
.ma-chat-participant-btn{border:1px solid #dbe8e0;background:#f7faf8;color:#4d5d54;border-radius:999px;padding:6px 9px;font-size:7px;font-weight:900;cursor:pointer;flex:1}.ma-chat-participant-btn:hover,.ma-chat-participant-btn.active{background:#e8f7ee;border-color:#8fcba3;color:#087f3f}.ma-order-detail .ma-order-toggle{cursor:pointer}
.ma-customer-conversation-preview{margin:8px 0 0;padding-top:7px;border-top:1px solid #edf2ee;color:#69766f;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ma-chat-loading,.ma-chat-no-orders{padding:30px 14px;text-align:center;color:var(--ma-muted);font-size:9px;line-height:1.6}
.ma-customer-chat-window{min-width:0;display:flex;flex-direction:column;background:#fff}
.ma-customer-chat-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid var(--ma-border);background:#fff}
.ma-customer-chat-person{display:flex;align-items:center;gap:10px;min-width:0}
.ma-customer-chat-person{position:relative}
.ma-customer-chat-person img{width:43px;height:43px;border-radius:14px;object-fit:cover;border:2px solid #fff;box-shadow:0 5px 15px rgba(0,0,0,.08)}
.ma-customer-chat-person>div{min-width:0}
.ma-customer-chat-person strong{display:block;color:var(--ma-text);font-size:12px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ma-customer-chat-person span:not(.ma-customer-chat-presence){display:block;margin-top:4px;color:var(--ma-muted);font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ma-customer-chat-presence{position:absolute!important;left:34px;top:34px;width:11px;height:11px;border-radius:50%;background:#a7b2ad;border:2px solid #fff}
.ma-customer-chat-presence.online{background:#12bd5b;box-shadow:0 0 0 3px rgba(18,189,91,.12)}
.ma-customer-chat-actions{display:flex;gap:6px;flex-wrap:wrap}
.ma-chat-call-btn{min-height:34px;border:1px solid #d9e8df;border-radius:11px;background:#f5fbf7;color:var(--ma-green);padding:0 9px;font-size:9px;font-weight:900;cursor:pointer}
.ma-chat-call-btn.video{background:#f2f6ff;color:#2b5c98;border-color:#dbe6f8}
.ma-chat-call-btn:disabled{opacity:.4;cursor:not-allowed}
.ma-customer-chat-notice{margin:10px 12px 0;padding:9px 11px;border-radius:11px;background:#fff6eb;color:#9a5d1b;font-size:8px;font-weight:800}
.ma-customer-chat-messages{flex:1;min-height:390px;overflow:auto;padding:18px;background:linear-gradient(180deg,#f8fbf9,#f1f6f3);display:flex;flex-direction:column;gap:9px}
.ma-chat-empty-state{margin:auto;max-width:310px;text-align:center;color:var(--ma-muted);font-size:9px;line-height:1.6}
.ma-chat-empty-state>div{width:48px;height:48px;display:grid;place-items:center;margin:0 auto 9px;border-radius:15px;background:#eaf8ef;font-size:20px}
.ma-chat-empty-state strong{display:block;color:var(--ma-text);font-size:12px}
.ma-chat-empty-state span{display:block;margin-top:4px}
.ma-customer-msg{max-width:min(78%,520px);padding:10px 12px;border-radius:16px 16px 16px 5px;background:#fff;border:1px solid #e2ebe6;box-shadow:0 4px 14px rgba(20,70,45,.05)}
.ma-customer-msg.own{align-self:flex-end;background:linear-gradient(135deg,#087e3f,#0ab952);color:#fff;border-color:#087e3f;border-radius:16px 16px 5px 16px}
.ma-customer-msg.agent{border-left:3px solid #ef6b2e}
.ma-customer-msg .ma-msg-author{display:block;margin-bottom:4px;font-size:7px;font-weight:950;opacity:.72;text-transform:uppercase;letter-spacing:.4px}
.ma-customer-msg .ma-msg-body{font-size:10px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.ma-customer-msg small{display:block;margin-top:5px;font-size:7px;opacity:.62}
.ma-customer-chat-compose{padding:10px;border-top:1px solid var(--ma-border);background:#fff}
.ma-customer-chat-quick{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:7px}
.ma-customer-chat-quick button{border:1px solid #e0e9e4;background:#f6f9f7;color:#4e5c55;border-radius:999px;padding:6px 9px;font-size:7px;font-weight:850;cursor:pointer}
.ma-customer-chat-form{display:flex;gap:7px;align-items:flex-end}
.ma-customer-chat-form textarea{flex:1;min-height:45px;max-height:120px;resize:vertical;border:1px solid #dce8e1;border-radius:13px;padding:10px 11px;outline:none;background:#fbfdfc;color:var(--ma-text);font-size:10px}
.ma-customer-chat-form textarea:focus{border-color:#8fcba3;box-shadow:0 0 0 3px rgba(18,189,91,.08);background:#fff}
.ma-customer-chat-form .ma-btn{min-height:45px;padding:0 16px}
.ma-customer-delivery-note{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:13px 15px;border-radius:15px;background:#eef9f2;border:1px solid #d8eee0;color:#4c6658;font-size:8px;line-height:1.6}
.ma-customer-delivery-note strong{color:#087e3f;font-size:9px;white-space:nowrap}
.ma-customer-call-overlay{position:fixed;inset:0;z-index:100500;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,31,23,.72);backdrop-filter:blur(12px)}
.ma-customer-call-overlay.open{display:flex}
.ma-customer-call-card{width:min(560px,100%);overflow:hidden;border-radius:28px;background:linear-gradient(160deg,#063c2f,#06281f);color:#fff;box-shadow:0 35px 120px rgba(0,0,0,.45)}
.ma-customer-call-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.ma-customer-call-head span{font-size:8px;font-weight:950;letter-spacing:1.5px;color:#9fc3b6}
.ma-customer-call-close{width:34px;height:34px;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:rgba(255,255,255,.06);color:#fff;cursor:pointer}
.ma-customer-call-body{padding:24px;text-align:center}
.ma-customer-call-avatar{width:82px;height:82px;margin:0 auto 12px;padding:4px;border-radius:50%;background:linear-gradient(135deg,#18b77b,#ef6b2e);box-shadow:0 20px 55px rgba(0,0,0,.28)}
.ma-customer-call-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid #fff}
.ma-customer-call-type{font-size:8px;font-weight:950;letter-spacing:2px;color:#a8c9be}
.ma-customer-call-body h2{margin:6px 0 3px;color:#fff;font-size:24px}
.ma-customer-call-body p{margin:0;color:#a8c9be;font-size:10px}
.ma-customer-video-stage{display:none;position:relative;margin-top:18px;aspect-ratio:16/10;overflow:hidden;border-radius:20px;background:#011711}
.ma-customer-video-stage.active{display:block}
.ma-customer-video-stage [data-ma-remote-video]{width:100%;height:100%;object-fit:cover;background:#000}
.ma-customer-video-stage [data-ma-local-video]{position:absolute;right:10px;bottom:10px;width:120px;height:88px;object-fit:cover;border:2px solid #fff;border-radius:12px;background:#000}
.ma-customer-call-actions{display:flex;justify-content:center;gap:8px;margin-top:20px;flex-wrap:wrap}
.ma-customer-call-action{min-width:48px;height:46px;border:1px solid rgba(255,255,255,.13);border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font-size:15px;cursor:pointer}
.ma-customer-call-action.accept{width:auto;padding:0 18px;border-radius:999px;background:#13ad69;font-size:9px;font-weight:950}
.ma-customer-call-action.decline,.ma-customer-call-action.end{width:auto;padding:0 18px;border-radius:999px;background:#d94b45;border-color:#d94b45;font-size:9px;font-weight:950}
.ma-customer-call-action.camera{background:#eff5ff;color:#2c5b95}
@media (max-width: 900px){
.ma-customer-chat-shell{grid-template-columns:1fr;min-height:700px}
.ma-customer-chat-list{border-right:0;border-bottom:1px solid var(--ma-border)}
.ma-customer-conversations{display:flex;overflow:auto}
.ma-customer-conversation{min-width:245px}
.ma-customer-chat-window{min-height:560px}
}
@media (max-width: 600px){
.ma-customer-chat-head{align-items:flex-start;flex-direction:column}
.ma-customer-chat-actions{width:100%}
.ma-chat-call-btn{flex:1}
.ma-customer-chat-messages{min-height:330px}
.ma-customer-chat-form{align-items:stretch}
.ma-customer-chat-form textarea{min-width:0}
.ma-customer-chat-form .ma-btn{padding:0 12px}
.ma-customer-delivery-note{flex-direction:column}
.ma-customer-delivery-note strong{white-space:normal}
}
.ma-wallet-plugin-card { margin:18px 0; padding:18px; border:1px solid var(--ma-border); border-radius:22px; background:#fff; overflow:hidden; }
.ma-product-open { cursor:pointer; }
.ma-product-open:focus { outline:3px solid rgba(15,132,76,.18); outline-offset:3px; }
.ma-product-modal { position:fixed; inset:0; z-index:999999; display:none; align-items:center; justify-content:center; padding:18px; }
.ma-product-modal.open { display:flex; }
.ma-product-modal-backdrop { position:absolute; inset:0; background:rgba(5,20,13,.72); backdrop-filter:blur(8px); }
.ma-product-modal-card { position:relative; z-index:2; width:min(900px,100%); max-height:min(88vh,760px); overflow:auto; display:grid; grid-template-columns:minmax(260px,42%) 1fr; background:#fff; border-radius:28px; box-shadow:0 30px 90px rgba(0,0,0,.28); }
.ma-product-modal-media { min-height:360px; background:#f3f7f4; display:flex; align-items:center; justify-content:center; }
.ma-product-modal-media img { width:100%; height:100%; max-height:520px; object-fit:cover; display:block; }
.ma-product-modal-content { padding:34px; }
.ma-product-modal-close { position:absolute; right:16px; top:16px; z-index:5; width:42px; height:42px; border:0; border-radius:50%; background:#fff; color:#183329; font-size:26px; cursor:pointer; box-shadow:0 8px 24px rgba(0,0,0,.12); }
.ma-product-modal-badge { display:inline-flex; padding:7px 11px; border-radius:999px; background:#eaf7f0; color:var(--ma-green); font-size:10px; font-weight:900; letter-spacing:.08em; }
.ma-product-modal-content h2 { margin:15px 0 8px; font-size:30px; line-height:1.15; color:#10251c; }
.ma-product-modal-price { font-size:23px; font-weight:900; color:var(--ma-green); margin-bottom:10px; }
.ma-product-modal-stock { display:inline-flex; margin-bottom:20px; padding:6px 10px; border-radius:999px; background:#eef8f2; color:#22724a; font-size:11px; font-weight:800; }
.ma-product-modal-description { color:#5f6d66; line-height:1.7; font-size:14px; }
.ma-product-modal-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
body.ma-modal-lock { overflow:hidden; }
@media (max-width:700px) {
.ma-product-modal { padding:10px; }
.ma-product-modal-card { grid-template-columns:1fr; max-height:92vh; border-radius:22px; }
.ma-product-modal-media { min-height:240px; max-height:300px; }
.ma-product-modal-content { padding:24px; }
.ma-product-modal-content h2 { font-size:24px; }
.ma-product-modal-actions .ma-btn { flex:1 1 100%; }
}
.ma-order-tracking-card{margin-top:16px;border:1px solid #dcece2;border-radius:20px;background:linear-gradient(145deg,#f8fcf9,#fff);overflow:hidden}
.ma-order-tracking-head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:19px 20px;border-bottom:1px solid #e7f0ea}
.ma-order-tracking-head h3{margin:5px 0 3px!important;font-size:17px!important;color:#14231b!important}.ma-order-tracking-head p{margin:0!important;font-size:10px!important;color:#7b8981!important}
.ma-tracking-rider{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:14px;background:#eef9f2;border:1px solid #d9eee1}.ma-tracking-rider img{width:39px;height:39px;border-radius:50%;object-fit:cover}.ma-tracking-rider span,.ma-tracking-rider strong{display:block}.ma-tracking-rider span{font-size:8px;color:#7d8b83}.ma-tracking-rider strong{font-size:10px;color:#087f3f;margin-top:2px}
.ma-tracking-steps{display:grid;grid-template-columns:repeat(6,1fr);padding:23px 20px 18px;position:relative;gap:8px}.ma-tracking-steps:before{content:"";position:absolute;left:9%;right:9%;top:42px;height:2px;background:#dce9e1}.ma-tracking-step{position:relative;z-index:1;text-align:center}.ma-tracking-marker{width:34px;height:34px;margin:0 auto 9px;border-radius:50%;display:grid;place-items:center;background:#edf2ef;border:4px solid #fff;box-shadow:0 0 0 1px #d7e5dd;color:#829087;font-size:10px;font-weight:900}.ma-tracking-step.is-done .ma-tracking-marker{background:#087f3f;color:#fff;box-shadow:0 0 0 1px #087f3f}.ma-tracking-step.is-active .ma-tracking-marker{background:#0ab952;color:#fff;box-shadow:0 0 0 5px rgba(10,185,82,.12),0 0 0 1px #0ab952}.ma-tracking-copy strong,.ma-tracking-copy span{display:block}.ma-tracking-copy strong{font-size:9px;color:#31443a}.ma-tracking-copy span{font-size:7px;line-height:1.45;color:#89958e;margin-top:3px}.ma-tracking-step.is-done .ma-tracking-copy strong{color:#087f3f}.ma-tracking-live-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 20px;background:#f0faf4;border-top:1px solid #e0eee5;font-size:9px;font-weight:800;color:#087f3f}.ma-tracking-live-bar i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#0ab952;margin-right:6px;box-shadow:0 0 0 4px rgba(10,185,82,.12)}.ma-tracking-live-bar a{color:#087f3f;font-weight:900}.ma-tracking-live-bar.muted{background:#f7faf8;color:#77847c}.ma-tracking-live-bar.muted i{background:#9aa69f;box-shadow:none}.ma-tracking-cancelled{margin:16px;padding:14px 16px;border-radius:13px;background:#fff4f4;border:1px solid #f0d5d5;color:#9f3e3e}.ma-tracking-cancelled strong,.ma-tracking-cancelled span{display:block}.ma-tracking-cancelled strong{font-size:10px}.ma-tracking-cancelled span{font-size:9px;margin-top:3px}
.ma-wallet-plugin-card-enhanced{overflow:hidden}.ma-wallet-plugin-head{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:18px 20px;border-bottom:1px solid #e7f0ea;background:linear-gradient(135deg,#f7fcf9,#fff)}.ma-wallet-plugin-head h3{margin:4px 0!important;font-size:16px!important;color:#14231b!important}.ma-wallet-plugin-head p{margin:0!important;font-size:9px!important;color:#7c8982!important}.ma-wallet-live{font-size:8px;font-weight:900;color:#087f3f;background:#e8f7ed;padding:7px 10px;border-radius:999px;white-space:nowrap}.ma-wallet-shortcode{padding:20px;background:#fff;overflow:auto}.ma-wallet-shortcode table,.ma-wallet-shortcode .table,.ma-wallet-shortcode form{max-width:100%!important;width:100%!important}.ma-wallet-shortcode img{max-width:100%}.ma-wallet-shortcode input,.ma-wallet-shortcode select,.ma-wallet-shortcode textarea,.ma-wallet-shortcode button{max-width:100%;box-sizing:border-box}.ma-wallet-shortcode button,.ma-wallet-shortcode .button,.ma-wallet-shortcode input[type=submit]{border-radius:10px!important}.ma-wallet-shortcode .woocommerce,.ma-wallet-shortcode .woocommerce-MyAccount-content,.ma-wallet-shortcode .wp-wallet,.ma-wallet-shortcode .wps-wallet,.ma-wallet-shortcode .wallet-container{width:100%!important;max-width:100%!important;float:none!important;margin-left:0!important;margin-right:0!important}.ma-wallet-shortcode .row,.ma-wallet-shortcode [class*=col-]{max-width:100%;box-sizing:border-box}.ma-wallet-shortcode pre{white-space:pre-wrap;word-break:break-word}.ma-wallet-empty{padding:25px;text-align:center;color:#77847c;background:#f7faf8;border-radius:14px;font-size:11px}
.ma-support-modern-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:16px}.ma-support-form-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}.ma-support-big-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#e9f8ef;color:#087f3f;font-size:21px;font-weight:900}.ma-support-form-head h2{margin:0 0 4px!important;font-size:18px!important;color:#14231b!important}.ma-support-form-head p{margin:0!important;font-size:10px!important;color:#7c8982!important}.ma-support-submit{min-width:170px}.ma-support-side{display:grid;gap:12px;align-content:start}.ma-support-contact-card{padding:24px;border-radius:20px;background:linear-gradient(145deg,#07502f,#0a944d);color:#fff;box-shadow:0 18px 35px rgba(8,127,63,.16)}.ma-support-contact-card h2{margin:7px 0!important;color:#fff!important;font-size:20px!important}.ma-support-contact-card p{font-size:10px!important;line-height:1.65!important;color:rgba(255,255,255,.78)!important;margin:0 0 16px!important}.ma-support-contact-card .ma-btn{background:#fff;color:#087f3f}.ma-support-mini-card{padding:16px;border-radius:16px;border:1px solid #e0ebe4;background:#fff}.ma-support-mini-card strong,.ma-support-mini-card span{display:block}.ma-support-mini-card strong{font-size:10px;color:#1d3026}.ma-support-mini-card span{font-size:9px;color:#7c8982;line-height:1.55;margin-top:5px}
@media(max-width:850px){.ma-tracking-steps{grid-template-columns:1fr 1fr;gap:15px}.ma-tracking-steps:before{display:none}.ma-order-tracking-head{align-items:flex-start;flex-direction:column}.ma-support-modern-grid{grid-template-columns:1fr}.ma-wallet-plugin-head{align-items:flex-start;flex-direction:column}}
@media(max-width:850px){.ma-wallet-feature-grid{grid-template-columns:repeat(2,1fr)}.ma-wallet-atm-card{padding:24px}.ma-wallet-atm-details{grid-template-columns:1fr 1fr}} @media(max-width:520px){.ma-wallet-feature-grid{grid-template-columns:1fr 1fr}.ma-wallet-atm-card{min-height:250px;padding:21px}.ma-wallet-atm-details{gap:10px}.ma-wallet-atm-balance{font-size:30px}} @media(max-width:520px){.ma-wallet-hero{min-height:175px;padding:22px}.ma-wallet-hero strong{font-size:30px}.ma-tracking-live-bar{align-items:flex-start;flex-direction:column}.ma-tracking-copy span{font-size:8px}.ma-wallet-shortcode{padding:12px}}
.ma-mobile-account-header,
.ma-mobile-bottom-nav{display:none}
.ma-settings-page-header .ma-settings-kicker,
.ma-settings-kicker{
color:#1fb86b;
font-size:10px;
line-height:1.2;
font-weight:900;
letter-spacing:1.7px;
text-transform:uppercase;
margin-bottom:8px;
}
.ma-settings-page-header h1{font-size:31px!important;letter-spacing:-.8px!important;margin-bottom:7px!important}
.ma-settings-page-header p{font-size:12px;color:#718078;max-width:680px}
.ma-settings-grid{
display:grid;
grid-template-columns:minmax(0,1.65fr) minmax(290px,.9fr);
gap:18px;
align-items:start;
}
.ma-settings-grid>.ma-card{margin:0!important}
.ma-settings-side{display:grid;gap:18px}
.ma-settings-status-card,.ma-security-card,.ma-account-action-card{border-radius:20px!important}
.ma-presence-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:5px}
.ma-presence-copy{display:flex;align-items:center;gap:12px}
.ma-presence-copy>div{display:grid;gap:3px}
.ma-presence-copy strong{font-size:18px;color:#14231b}
.ma-presence-copy span:last-child{font-size:10px;color:#7a8780}
.ma-presence-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#e9f9ef;position:relative}
.ma-presence-icon i{width:14px;height:14px;border-radius:50%;background:#27cf77;box-shadow:0 0 0 7px rgba(39,207,119,.10)}
.ma-presence-toggle{width:58px;height:32px;border-radius:999px;background:#20cc72;position:relative;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}
.ma-presence-toggle:after{content:"";position:absolute;width:24px;height:24px;right:4px;top:4px;border-radius:50%;background:#fff;box-shadow:0 2px 7px rgba(0,0,0,.16)}
.ma-settings-divider{height:1px;background:#e6eee9;margin:18px 0}
.ma-account-status-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;font-size:11px;color:#718078}
.ma-account-status-row strong{color:#14231b;font-weight:850}
.ma-security-card h3,.ma-account-action-card h3{font-size:18px;margin:0 0 7px;color:#14231b}
.ma-security-card p,.ma-account-action-card p{font-size:10px;line-height:1.65;color:#718078;margin:0}
.ma-security-status{margin-top:13px}
.ma-2fa-status{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#edf9f1;color:#087f3f;font-size:9px;font-weight:900}
.ma-security-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}
.ma-security-actions .ma-btn{font-size:10px!important;padding:10px 13px!important}
.ma-account-action-card{display:flex;align-items:center;justify-content:space-between;gap:15px}
.ma-settings-logout{display:inline-flex;align-items:center;justify-content:center;padding:10px 13px;border-radius:11px;background:#fff2f2;border:1px solid #f1d6d6;color:#ad3838!important;font-size:10px;font-weight:900;white-space:nowrap}
.ma-profile-header{border-bottom:1px solid #edf2ef;padding-bottom:18px;margin-bottom:18px}
.ma-profile-header img{width:72px!important;height:72px!important;border-radius:20px!important;object-fit:cover}
.ma-profile-header strong{font-size:15px!important}
.ma-profile-header span{font-size:10px!important}
@media (max-width: 767px){
.ma-customer-dashboard{
min-height:100dvh!important;
height:100dvh!important;
border-radius:0!important;
overflow:hidden!important;
}
.ma-dashboard-layout{
display:block!important;
height:100dvh!important;
min-height:100dvh!important;
overflow:hidden!important;
}
.ma-dashboard-sidebar,
.ma-sidebar-overlay,
.ma-topbar{
display:none!important;
}
.ma-customer-dashboard.ma-menu-open .ma-dashboard-sidebar{
display:flex!important;
position:fixed!important;
inset:0 auto 0 0!important;
width:min(82vw,310px)!important;
max-width:310px!important;
height:100dvh!important;
min-height:100dvh!important;
z-index:100002!important;
overflow-y:auto!important;
overflow-x:hidden!important;
padding:18px 15px calc(22px + env(safe-area-inset-bottom))!important;
box-shadow:20px 0 50px rgba(0,0,0,.25)!important;
transform:translateX(0)!important;
animation:maMobileDrawerIn .22s ease both;
}
.ma-customer-dashboard.ma-menu-open .ma-sidebar-overlay{
display:block!important;
position:fixed!important;
inset:0!important;
z-index:100001!important;
background:rgba(4,24,14,.48)!important;
backdrop-filter:blur(3px);
}
@keyframes maMobileDrawerIn{
from{transform:translateX(-104%);opacity:.7}
to{transform:translateX(0);opacity:1}
}
.ma-mobile-header-menu{
display:grid!important;
place-items:center!important;
flex:0 0 42px!important;
width:42px!important;
height:42px!important;
min-width:42px!important;
margin-left:2px!important;
border:1px solid #dce9e1!important;
border-radius:13px!important;
background:#fff!important;
color:#087f3f!important;
box-shadow:0 5px 15px rgba(8,127,63,.08)!important;
cursor:pointer!important;
font-size:20px!important;
line-height:1!important;
}
.ma-mobile-header-menu:active{transform:scale(.96)}
.ma-mobile-header-menu[aria-expanded="true"]{
background:#087f3f!important;
color:#fff!important;
border-color:#087f3f!important;
}
.ma-pull-refresh-indicator{
position:fixed;
left:50%;
top:7px;
z-index:100003;
transform:translate(-50%,-140%);
display:flex;
align-items:center;
gap:8px;
min-height:30px;
padding:7px 13px;
border:1px solid #dcebe2;
border-radius:999px;
background:rgba(255,255,255,.97);
box-shadow:0 8px 24px rgba(8,79,43,.10);
color:#087f3f;
font-size:10px;
font-weight:850;
opacity:0;
pointer-events:none;
transition:transform .18s ease,opacity .18s ease;
}
.ma-pull-refresh-indicator.is-visible{
transform:translate(-50%,0);
opacity:1;
}
.ma-pull-refresh-spinner{
width:13px;
height:13px;
border:2px solid #d7eadf;
border-top-color:#087f3f;
border-radius:50%;
display:inline-block;
}
.ma-pull-refresh-indicator.is-refreshing .ma-pull-refresh-spinner{
animation:maPullRefreshSpin .7s linear infinite;
}
@keyframes maPullRefreshSpin{to{transform:rotate(360deg)}}
.ma-dashboard-main{
width:100%!important;
height:100dvh!important;
min-height:100dvh!important;
max-height:100dvh!important;
overflow-y:auto!important;
overflow-x:hidden!important;
-webkit-overflow-scrolling:touch;
overscroll-behavior-y:auto!important;
touch-action:pan-y!important;
padding:0 14px 92px!important;
background:#f7faf8!important;
}
.ma-mobile-account-header{
position:sticky;
top:0;
z-index:100;
display:flex!important;
align-items:center;
gap:10px;
width:calc(100% + 28px);
margin-left:-14px;
padding:12px 14px;
background:rgba(255,255,255,.96);
border-bottom:1px solid #e7eee9;
box-shadow:0 4px 18px rgba(11,60,38,.05);
backdrop-filter:blur(16px);
}
.ma-mobile-account-avatar{
position:relative;
width:46px;
height:46px;
padding:0;
border:0;
background:transparent;
flex:0 0 46px;
cursor:default;
}
.ma-mobile-account-avatar img{
width:46px!important;height:46px!important;
border-radius:15px!important;
object-fit:cover;
display:block;
border:2px solid #e2f3e8;
}
.ma-mobile-online-dot{
position:absolute;
right:-1px;
bottom:0;
width:12px;height:12px;border-radius:50%;
background:#27cf77;
border:2px solid #fff;
box-shadow:0 0 0 2px rgba(39,207,119,.12);
}
.ma-mobile-account-info{
min-width:0;
flex:1;
border:0;
padding:0;
background:transparent;
text-align:left;
cursor:default;
}
.ma-mobile-account-info strong{
display:block;
max-width:190px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
color:#14231b;
font-size:13px;
font-weight:900;
}
.ma-mobile-account-info span{
display:flex;
align-items:center;
gap:5px;
margin-top:4px;
color:#7a8780;
font-size:9px;
font-weight:700;
}
.ma-mobile-status-dot{width:6px;height:6px;border-radius:50%;background:#27cf77;display:inline-block}
.ma-mobile-country{
display:flex;
align-items:center;
gap:5px;
flex-direction:column;
justify-content:center;
min-width:45px;
padding-left:7px;
border-left:1px solid #e5eee9;
}
.ma-mobile-country span{font-size:21px;line-height:1}
.ma-mobile-country small{font-size:7px;color:#718078;font-weight:850;max-width:50px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ma-mobile-bottom-nav{
position:fixed!important;
left:10px!important;
right:10px!important;
bottom:max(9px, env(safe-area-inset-bottom))!important;
z-index:99999!important;
display:grid!important;
grid-template-columns:repeat(5,1fr);
height:64px;
padding:6px 4px;
border:1px solid rgba(255,255,255,.68);
border-radius:22px;
background:rgba(7,92,53,.97);
box-shadow:0 15px 40px rgba(3,53,31,.24);
backdrop-filter:blur(18px);
}
.ma-mobile-nav-item{
position:relative;
min-width:0;
border:0;
border-radius:16px;
background:transparent;
color:rgba(255,255,255,.68);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:3px;
cursor:pointer;
font-family:inherit;
font-size:8px;
font-weight:850;
transition:.18s ease;
}
.ma-mobile-nav-item.ma-mobile-nav-active{
color:#fff;
background:rgba(255,255,255,.14);
}
.ma-mobile-nav-icon{
width:24px;height:24px;
display:grid;place-items:center;
font-size:15px;
line-height:1;
}
.ma-mobile-profile-nav-icon{
width:25px;height:25px;
border-radius:50%;
overflow:hidden;
border:1px solid rgba(255,255,255,.7);
}
.ma-mobile-profile-nav-icon img{width:100%;height:100%;object-fit:cover}
.ma-mobile-nav-badge{
position:absolute;
top:3px;
right:calc(50% - 18px);
min-width:15px;
height:15px;
padding:0 4px;
display:grid;
place-items:center;
border-radius:99px;
background:#ffb020;
color:#15351f;
border:2px solid #075c35;
font-size:7px;
font-weight:950;
}
.ma-panel{padding-top:14px}
.ma-page-header{margin:4px 0 15px!important}
.ma-page-header h1{font-size:23px!important}
.ma-page-header p{font-size:10px!important}
.ma-settings-page-header{padding-top:3px}
.ma-settings-page-header h1{font-size:25px!important}
.ma-settings-grid{grid-template-columns:1fr!important;gap:12px!important}
.ma-settings-side{gap:12px}
.ma-settings-grid .ma-card{border-radius:18px!important}
.ma-account-action-card{align-items:flex-start;flex-direction:column}
.ma-settings-logout{width:100%}
.ma-security-actions .ma-btn{flex:1}
.ma-photo-upload-box{flex-direction:column!important;align-items:flex-start!important}
.ma-photo-upload-box input{max-width:100%!important;width:100%!important}
.ma-settings-form{grid-template-columns:1fr!important}
.ma-settings-form .ma-full{grid-column:auto!important}
}
@media (max-width:390px){
.ma-mobile-account-header{padding-left:11px;padding-right:11px}
.ma-mobile-account-info strong{max-width:145px}
.ma-mobile-bottom-nav{left:6px!important;right:6px!important;border-radius:20px}
.ma-mobile-nav-item{font-size:7px}
.ma-mobile-nav-icon{font-size:14px}
}
.ma-wallet-account-number{position:relative;z-index:2;display:flex;align-items:center;gap:10px;margin-top:13px;padding-top:12px;border-top:1px solid rgba(255,255,255,.13)}
.ma-wallet-account-number span{font-size:7px;letter-spacing:1.3px;color:rgba(255,255,255,.52);font-weight:850}
.ma-wallet-account-number strong{font-size:12px;letter-spacing:1.6px;color:#fff;flex:1}
.ma-wallet-account-number button{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;border-radius:8px;padding:6px 9px;font-size:8px;font-weight:900;cursor:pointer}
.ma-wallet-action-grid{grid-template-columns:repeat(3,1fr)!important;max-width:none!important}
.ma-notification-trigger{position:relative;border:0;cursor:pointer}
.ma-notification-count,.ma-mobile-notification-badge{position:absolute;display:grid;place-items:center;min-width:16px;height:16px;padding:0 4px;border-radius:99px;background:#ffb020;color:#17351f;font-size:7px;font-weight:950}
.ma-notification-count{top:2px;right:0}.ma-mobile-notification-badge{top:-3px;right:-5px;border:2px solid #fff}
.ma-mobile-notification-button{display:none;position:relative;width:40px;height:40px;min-width:40px;border:1px solid #dce9e1;border-radius:13px;background:#fff;color:#087f3f;align-items:center;justify-content:center;font-size:17px;cursor:pointer}
.ma-notification-list{display:grid;gap:8px}.ma-notification-row{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #e5eee8;background:#fff;border-radius:16px;padding:14px 15px;cursor:pointer;transition:.18s ease}.ma-notification-row:hover{border-color:#bfe0ca;transform:translateY(-1px)}.ma-notification-row.is-unread{background:#f1faf4;border-color:#cce9d6}.ma-notification-icon{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:12px;background:#e9f8ef;font-size:17px}.ma-notification-copy{min-width:0;flex:1;display:grid;gap:3px}.ma-notification-copy strong{font-size:11px;color:#14231b}.ma-notification-copy span{font-size:9px;line-height:1.5;color:#6f7d75}.ma-notification-copy small{font-size:7px;color:#9aa59f}.ma-notification-row>i{width:8px;height:8px;border-radius:50%;background:#0ab952;opacity:0}.ma-notification-row.is-unread>i{opacity:1}.ma-notification-empty{padding:30px;text-align:center;border:1px dashed #dce9e1;border-radius:18px;color:#7a8780;background:#fff;font-size:10px}
.ma-transfer-search-row{display:grid;grid-template-columns:1fr auto;gap:8px}.ma-transfer-search-row input,.ma-transfer-amount input{width:100%;min-height:48px;border:1px solid var(--ma-border);border-radius:12px;padding:0 14px;font-size:14px}.ma-transfer-recipient{margin-top:14px;padding:14px;border:1px solid #cfe8d8;border-radius:16px;background:#f5fbf7}.ma-transfer-person{display:flex;align-items:center;gap:12px}.ma-transfer-person img{width:48px;height:48px;border-radius:14px;object-fit:cover}.ma-transfer-person strong,.ma-transfer-person span{display:block}.ma-transfer-person strong{font-size:13px;color:#14231b}.ma-transfer-person span{font-size:9px;color:#718078;margin-top:3px}.ma-transfer-details{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.ma-transfer-detail{padding:9px;border-radius:10px;background:#fff;border:1px solid #e5eee8}.ma-transfer-detail small,.ma-transfer-detail strong{display:block}.ma-transfer-detail small{font-size:7px;color:#89958e;text-transform:uppercase}.ma-transfer-detail strong{font-size:9px;color:#26382f;margin-top:3px;word-break:break-word}.ma-transfer-amount{margin-top:14px}.ma-transfer-amount label{margin-top:0}
@media(max-width:767px){.ma-mobile-notification-button{display:flex}.ma-wallet-action-grid{grid-template-columns:1fr 1fr!important}.ma-notification-trigger{display:none!important}.ma-transfer-search-row{grid-template-columns:1fr}.ma-wallet-account-number{flex-wrap:wrap}.ma-wallet-account-number strong{min-width:180px}}
@media(max-width:767px){
.ma-customer-dashboard .ma-mobile-drawer-nav{
display:flex!important;
visibility:visible!important;
opacity:1!important;
position:relative!important;
z-index:100004!important;
width:100%!important;
min-height:1px!important;
}
.ma-customer-dashboard .ma-mobile-drawer-link{
visibility:visible!important;
opacity:1!important;
}
}
.ma-mobile-drawer{display:none}
@media(max-width:767px){
.ma-mobile-drawer{
display:block;position:fixed;left:0;top:0;bottom:0;width:min(84vw,320px);
padding:18px 15px calc(22px + env(safe-area-inset-bottom));box-sizing:border-box;
background:linear-gradient(180deg,#075c35 0%,#064b2d 100%);color:#fff;
z-index:100003;overflow-y:auto;overflow-x:hidden;
transform:translateX(-105%);opacity:0;visibility:hidden;
transition:transform .24s ease,opacity .2s ease,visibility .2s ease;
box-shadow:20px 0 50px rgba(0,0,0,.28);
}
.ma-customer-dashboard.ma-menu-open .ma-mobile-drawer{transform:translateX(0);opacity:1;visibility:visible}
.ma-mobile-drawer-nav{display:flex!important;flex-direction:column!important;gap:6px!important}
.ma-mobile-drawer-nav .ma-sidebar-label{display:block!important;padding:13px 12px 7px!important;color:rgba(255,255,255,.48)!important}
.ma-mobile-drawer-link{
appearance:none!important;-webkit-appearance:none!important;width:100%!important;min-height:48px!important;
display:flex!important;align-items:center!important;gap:11px!important;padding:0 12px!important;
border:1px solid transparent!important;border-radius:15px!important;background:transparent!important;
color:rgba(255,255,255,.86)!important;text-align:left!important;font:750 12px/1 inherit!important;
cursor:pointer!important;position:relative!important;box-sizing:border-box!important;
}
.ma-mobile-drawer-link:hover,.ma-mobile-drawer-link:focus{background:rgba(255,255,255,.10)!important;color:#fff!important;outline:none!important}
.ma-mobile-drawer-link.ma-active{background:rgba(255,255,255,.17)!important;color:#fff!important;border-color:rgba(255,255,255,.08)!important}
.ma-mobile-drawer-link .ma-sidebar-icon{width:31px!important;height:31px!important;flex:0 0 31px!important;display:grid!important;place-items:center!important;border-radius:10px!important;background:rgba(255,255,255,.10)!important;font-size:14px!important}
.ma-mobile-drawer-link.ma-active .ma-sidebar-icon{background:rgba(255,255,255,.20)!important}
.ma-mobile-drawer-link .ma-sidebar-badge{margin-left:auto!important;min-width:20px!important;height:20px!important;padding:0 6px!important;display:inline-grid!important;place-items:center!important;border-radius:999px!important;background:#fff!important;color:#087f3f!important;font-size:9px!important;font-weight:900!important}
}
.ma-bell-icon{display:grid;place-items:center;color:#087f3f!important;line-height:0}
.ma-notification-trigger{color:#087f3f!important;background:linear-gradient(180deg,#ffffff,#f4fbf7)!important;border-color:#cfe7d7!important;box-shadow:0 7px 18px rgba(8,127,63,.10)!important}
.ma-notification-trigger .ma-bell-icon svg{display:block}
.ma-notification-trigger:hover{background:#eefaf3!important;color:#075f30!important;border-color:#9fd1b1!important}
.ma-notification-trigger[data-has-unread="1"] .ma-bell-icon{animation:maBellPulse 1.8s ease-in-out infinite}
@keyframes maBellPulse{0%,100%{transform:scale(1)}45%{transform:scale(1.08)}60%{transform:scale(.98)}}
.ma-mobile-drawer-head{display:none}
.ma-mobile-notification-button{color:#087f3f!important;background:linear-gradient(180deg,#ffffff,#f3fbf6)!important;border-color:#bfe0ca!important;box-shadow:0 7px 18px rgba(8,127,63,.12)!important}
.ma-mobile-notification-button .ma-bell-icon{color:#087f3f!important}
.ma-mobile-notification-button[data-has-unread="1"] .ma-bell-icon{animation:maBellPulse 1.8s ease-in-out infinite}
@media(max-width:767px){
.ma-mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 2px 15px;margin-bottom:7px;border-bottom:1px solid rgba(255,255,255,.10)}
.ma-mobile-drawer-brand{display:flex;align-items:center;gap:9px;color:#fff}
.ma-mobile-drawer-brand span{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.12);font-size:17px}
.ma-mobile-drawer-brand strong{font-size:12px;letter-spacing:.1px}
.ma-mobile-drawer-close{width:36px;height:36px;border-radius:11px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);color:#fff;font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer}
.ma-mobile-drawer-close:active{transform:scale(.95)}
.ma-mobile-bottom-nav{grid-template-columns:repeat(6,1fr)!important;height:68px!important;padding:5px 3px!important}
.ma-mobile-nav-item{font-size:7px!important;gap:2px!important}
.ma-mobile-nav-icon{font-size:14px!important;width:23px!important;height:23px!important}
.ma-mobile-nav-item.ma-mobile-nav-active{background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.09))!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.ma-mobile-notification-button{width:42px!important;height:42px!important;min-width:42px!important;border-radius:13px!important;font-size:0!important}
.ma-mobile-notification-button .ma-bell-icon svg{width:19px;height:19px}
.ma-mobile-notification-badge{top:-4px!important;right:-4px!important}
}
@media(max-width:390px){.ma-mobile-bottom-nav{height:64px!important}.ma-mobile-nav-item{font-size:6.5px!important}.ma-mobile-nav-icon{font-size:13px!important}}
.ma-field select,
.ma-field textarea{
width:100%!important;
min-height:43px!important;
padding:10px 12px!important;
border:1px solid #dfeae3!important;
border-radius:11px!important;
background:#fbfdfc!important;
color:var(--ma-text)!important;
outline:none!important;
box-shadow:none!important;
font-size:10px!important;
font-family:inherit!important;
box-sizing:border-box!important;
}
.ma-field textarea{min-height:95px!important;resize:vertical!important;line-height:1.55!important}
.ma-field select:focus,.ma-field textarea:focus{border-color:#9dd5af!important;background:#fff!important}
.ma-password-card h3{font-size:18px;margin:0 0 7px;color:#14231b}
.ma-password-card>p{font-size:10px;line-height:1.65;color:#718078;margin:0}
.ma-password-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ma-password-live{padding:10px 12px;border-radius:10px;background:#f3faf5;font-size:10px;font-weight:800}
.ma-profile-header{cursor:default!important}
@media (max-width:767px){
html:has(.ma-customer-dashboard),
body:has(.ma-customer-dashboard){width:100%!important;min-width:100%!important;margin:0!important;padding:0!important;overflow:hidden!important;background:#f7faf8!important}
body:has(.ma-customer-dashboard) header,
body:has(.ma-customer-dashboard) .site-header,
body:has(.ma-customer-dashboard) #masthead,
body:has(.ma-customer-dashboard) .main-header,
body:has(.ma-customer-dashboard) .top-header,
body:has(.ma-customer-dashboard) .mobile-header,
body:has(.ma-customer-dashboard) .elementor-location-header,
body:has(.ma-customer-dashboard) .ast-primary-header-bar,
body:has(.ma-customer-dashboard) nav:not(.ma-mobile-bottom-nav),
body:has(.ma-customer-dashboard) .site-footer,
body:has(.ma-customer-dashboard) footer{display:none!important}
body:has(.ma-customer-dashboard) #wpadminbar{display:none!important}
html.ma-marketyafrica-mobile-app,
html.ma-marketyafrica-mobile-app body{width:100%!important;height:100%!important;min-height:100%!important}
html.ma-marketyafrica-mobile-app{background:#f7faf8!important}
body.ma-marketyafrica-mobile-app{
margin:0!important;padding:0!important;overflow:hidden!important;background:#f7faf8!important;
}
body.ma-marketyafrica-mobile-app #wpadminbar{display:none!important}
body.ma-marketyafrica-mobile-app header,
body.ma-marketyafrica-mobile-app .site-header,
body.ma-marketyafrica-mobile-app #masthead,
body.ma-marketyafrica-mobile-app .main-header,
body.ma-marketyafrica-mobile-app .top-header,
body.ma-marketyafrica-mobile-app .mobile-header,
body.ma-marketyafrica-mobile-app .elementor-location-header,
body.ma-marketyafrica-mobile-app .ast-primary-header-bar,
body.ma-marketyafrica-mobile-app .site-navigation,
body.ma-marketyafrica-mobile-app .main-navigation,
body.ma-marketyafrica-mobile-app nav:not(.ma-mobile-bottom-nav){display:none!important}
body.ma-marketyafrica-mobile-app .site-footer,
body.ma-marketyafrica-mobile-app footer,
body.ma-marketyafrica-mobile-app .footer{display:none!important}
body.ma-marketyafrica-mobile-app #page,
body.ma-marketyafrica-mobile-app .site,
body.ma-marketyafrica-mobile-app .site-content,
body.ma-marketyafrica-mobile-app .content-area,
body.ma-marketyafrica-mobile-app .entry-content,
body.ma-marketyafrica-mobile-app .elementor,
body.ma-marketyafrica-mobile-app .elementor-section-wrap{
width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important;
}
body.ma-marketyafrica-mobile-app .ma-customer-dashboard{
position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;max-width:none!important;margin:0!important;padding:0!important;border-radius:0!important;z-index:2147483000!important;background:#f7faf8!important;
}
.ma-dashboard-main{padding-bottom:96px!important}
.ma-mobile-account-avatar,.ma-mobile-account-info{cursor:default!important}
.ma-mobile-account-avatar{pointer-events:none!important}
.ma-mobile-account-info{pointer-events:none!important}
.ma-password-grid{grid-template-columns:1fr!important}
.ma-field textarea{min-height:100px!important}
}
<style id="marketyafrica-demo-market-v2-4">
.ma-market-hero-card{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 18px;padding:22px 24px;border:1px solid #dfece4;border-radius:24px;background:linear-gradient(135deg,#f8fcf9 0%,#ffffff 58%,#effaf3 100%);box-shadow:0 14px 40px rgba(8,79,43,.06);position:relative;overflow:hidden}
.ma-market-hero-card:after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;right:-55px;top:-70px;background:rgba(31,184,107,.08)}
.ma-market-hero-card h2{margin:5px 0 7px!important;color:#12251b!important;font-size:22px!important;letter-spacing:-.5px!important;position:relative;z-index:1}
.ma-market-hero-card p{margin:0!important;max-width:720px;color:#6e7e75!important;font-size:10px!important;line-height:1.65!important;position:relative;z-index:1}
.ma-market-hero-stat{min-width:105px;padding:15px;border:1px solid #d8ebe0;border-radius:17px;background:rgba(255,255,255,.82);text-align:center;position:relative;z-index:1}
.ma-market-hero-stat strong,.ma-market-hero-stat span{display:block}.ma-market-hero-stat strong{font-size:25px;color:#087f3f}.ma-market-hero-stat span{margin-top:2px;font-size:8px;font-weight:800;color:#7a8981;text-transform:uppercase;letter-spacing:.7px}
.ma-demo-product-card{position:relative}.ma-demo-product-card .ma-product-image{height:170px}.ma-demo-product-card .ma-product-name{min-height:34px;font-size:10px}.ma-demo-product-card .ma-product-add{border:0;cursor:pointer;font-family:inherit;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.ma-demo-product-card .ma-product-add:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(8,127,63,.18)}.ma-demo-product-card .ma-product-add:active{transform:scale(.98)}
.ma-demo-product-card .ma-product-image:after{content:"";position:absolute;inset:auto 0 0;height:55px;background:linear-gradient(transparent,rgba(4,24,14,.14));pointer-events:none}.ma-demo-product-card img{background:#eef5f0}
@media (max-width:767px){.ma-market-hero-card{padding:16px;border-radius:19px;align-items:flex-start}.ma-market-hero-card h2{font-size:17px!important}.ma-market-hero-card p{font-size:9px!important}.ma-market-hero-stat{min-width:76px;padding:10px}.ma-market-hero-stat strong{font-size:19px}.ma-demo-products-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}.ma-demo-product-card{border-radius:13px}.ma-demo-product-card .ma-product-image{height:105px}.ma-demo-product-card .ma-product-body{padding:8px}.ma-demo-product-card .ma-product-name{font-size:8px;line-height:1.3;min-height:30px}.ma-demo-product-card .ma-product-badge{top:5px;left:5px;padding:4px 5px;font-size:6px}.ma-demo-product-card .ma-product-add{min-height:31px;margin-top:7px;border-radius:8px;font-size:7px;padding:4px}.ma-market-pagination{gap:5px;overflow-x:auto;padding-bottom:3px;justify-content:flex-start}.ma-market-page{min-width:30px;height:30px}.ma-market-page-summary{font-size:8px}}
@media (min-width:768px){.ma-demo-products-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}