/* RekGo mobile UI: shared, composable styles */
.rg-page-title{margin-bottom:18px}
.rg-page-title>p:first-child{font-size:11px;font-weight:800;letter-spacing:.13em;color:var(--blue)}
.rg-page-title h1{letter-spacing:-.05em}
.rg-history-tabs{display:flex;gap:9px;overflow-x:auto;padding:2px 1px 15px;scrollbar-width:none}
.rg-history-tabs::-webkit-scrollbar{display:none}
.rg-history-tabs a{display:flex;align-items:center;gap:8px;flex:none;border:1px solid var(--line);border-radius:999px;padding:10px 14px;text-decoration:none;color:var(--fg);font-size:12px;font-weight:800;background:var(--glass)}
.rg-history-tabs span{background:rgba(23,105,244,.10);border-radius:999px;padding:2px 7px;color:var(--blue)}
.rg-history-stack{display:grid;gap:13px}
.rg-history-card{padding:19px!important;scroll-margin-top:16px}
.rg-history-head{display:flex;align-items:center;gap:11px}
.rg-history-symbol{width:43px;height:43px;display:grid;place-items:center;flex:none;border-radius:14px;font-size:23px;background:rgba(23,105,244,.1);color:var(--blue)}
.rg-symbol-transfer{background:rgba(24,169,135,.11);color:#0a9875}
.rg-symbol-rekber{background:rgba(143,99,230,.11);color:#8255cc}
.rg-history-heading{flex:1;min-width:0}
.rg-history-heading h2{font-size:17px;margin:0!important}
.rg-history-heading p{font-size:12px;color:var(--muted);margin:2px 0 0;line-height:1.35}
.rg-action-link{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:rgba(23,105,244,.1);text-decoration:none;color:var(--blue);font-size:12px;font-weight:800;white-space:nowrap}
.rg-action-link span{font-size:18px;line-height:1}
.rg-action-link:hover{background:rgba(23,105,244,.18)}
.rg-history-empty{text-align:center;padding:18px 12px 5px}
.rg-history-empty>span{display:grid;place-items:center;width:38px;height:38px;margin:0 auto 7px;border-radius:13px;background:rgba(98,135,182,.08);color:var(--muted);font-size:22px}
.rg-history-empty strong{display:block;font-size:13px}
.rg-history-empty p{font-size:12px;color:var(--muted);margin:3px 0 0;line-height:1.4}
.rg-history-card .rg-records:not(:empty){margin-top:12px}
.rg-history-card .rg-record{padding:12px 0}
.nav a[aria-current=page]{background:rgba(23,105,244,.14);color:var(--blue);box-shadow:inset 0 0 0 1px rgba(23,105,244,.08)}
.nav a{transition:background .22s ease,color .22s ease,transform .22s ease}
.nav a:active{transform:scale(.96)}
@media(max-width:700px){.rg-page-title h1{font-size:27px}.rg-history-card{padding:15px!important}.rg-history-head{gap:9px}.rg-history-symbol{width:37px;height:37px;border-radius:12px;font-size:20px}.rg-history-heading h2{font-size:16px}.rg-history-heading p{font-size:11px}.rg-action-link{padding:9px 10px;font-size:11px}.rg-history-empty{padding:13px 8px 2px}.rg-history-stack{gap:11px}.rg-history-tabs{gap:7px}.rg-history-tabs a{padding:9px 11px}}
@media(max-width:360px){.rg-history-symbol{display:none}.rg-action-link{padding:8px}.rg-history-heading h2{font-size:15px}}
@media(prefers-reduced-motion:reduce){.nav a{transition:none}}

.rg-wallet{min-height:0!important;padding:22px!important}.rg-wallet-caption{margin:16px 0 4px;font-size:13px}.rg-wallet .rg-amount{margin:0 0 22px!important}
.rg-wallet-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border-top:1px solid #ffffff50;padding-top:15px}
.rg-wallet-stats small,.rg-wallet-stats strong{display:block;overflow-wrap:anywhere}.rg-wallet-stats small{font-size:11px;opacity:.8}.rg-wallet-stats strong{font-size:13px}
.rg-section-heading{margin:22px 0 12px}.rg-section-heading h2{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rg-shortcuts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.rg-shortcuts>a{min-width:0;display:flex;align-items:center;flex-direction:column;text-align:center;gap:4px;padding:15px 6px;background:var(--glass);border:1px solid var(--line);border-radius:17px;text-decoration:none;color:var(--fg)}
.rg-shortcuts strong{font-size:13px}.rg-shortcuts small{font-size:10px;color:var(--muted)}
.rg-shortcut-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:#1769f422;color:var(--blue);font-size:23px;margin-bottom:5px}
.rg-dashboard-activity{margin-top:18px}.rg-dashboard-activity-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.rg-dashboard-activity-head h2{margin:0!important}.rg-dashboard-activity-head p{margin:3px 0 0}
@media(max-width:700px){.rg-shortcuts{gap:7px}.rg-shortcuts>a{padding:12px 2px}.rg-shortcuts strong{font-size:12px}.rg-shortcut-icon{width:36px;height:36px}.rg-wallet{padding:18px!important}.rg-dashboard-activity-head h2{font-size:17px}}
@media(max-width:360px){.rg-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Compact panels shared by account, transfer, QRIS and admin */
.rg-compact-panel{padding:20px!important}
.rg-panel-spaced{margin-top:13px}
.rg-compact-panel .rg-history-head{margin-bottom:10px}
.rg-compact-panel form{margin-top:13px}
.rg-compact-panel form button{width:100%}
.rg-compact-panel .rg-records{margin-top:12px}
.rg-inline-notice{padding:12px 14px;border-radius:13px;background:rgba(221,155,49,.10);border:1px solid rgba(221,155,49,.19);color:var(--fg);font-size:12px;line-height:1.55}
.rg-state-chip{padding:6px 10px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}
.rg-state-ready{background:rgba(16,170,119,.12);color:#07835d}
.rg-state-off{background:rgba(213,144,39,.12);color:#ae740d}
.rg-profile-head{display:flex;align-items:center;gap:14px}
.rg-profile-head h2{margin:0!important}.rg-profile-head p{margin:2px 0}.rg-profile-head small{font-size:12px}
.rg-settings-fold{margin-top:17px;border-top:1px solid var(--line);padding-top:12px}
.rg-settings-fold>summary{cursor:pointer;display:flex;justify-content:space-between;font-size:13px;font-weight:800;color:var(--blue)}
.rg-settings-fold[open]>summary span{transform:rotate(180deg)}
.rg-settings-fold form{margin-top:12px}
@media(max-width:700px){.rg-compact-panel{padding:16px!important}.rg-profile-head{gap:11px}.rg-state-chip{font-size:10px;padding:5px 8px}}

/* Dashboard header and navigation between user and admin contexts */
.rg-dash-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.rg-dash-top .rg-page-heading{margin:0}
.rg-dash-admin{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 15px;border-radius:14px;border:1px solid var(--soft-border);background:var(--surface);box-shadow:0 5px 20px rgba(20,75,155,.07);color:var(--fg);text-decoration:none;font-size:13px;font-weight:800;white-space:nowrap}
.rg-dash-admin:hover{background:rgba(23,105,244,.10);color:var(--blue)}
.rg-dash-top .rg-page-title h1{overflow-wrap:anywhere}
.rg-wallet .rg-wallet-stats>div{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.rg-wallet .rg-wallet-stats strong{font-weight:800}
.rg-shortcuts>a{box-shadow:0 8px 25px rgba(28,81,150,.08)}
.rg-shortcuts>a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
@media(max-width:700px){.rg-dash-top{align-items:flex-start;gap:11px}.rg-dash-admin{padding:9px 12px;font-size:12px}.rg-dash-top .rg-page-title h1{font-size:26px}}

/* Consistent button holders for page switches and actions */
.rg-dash-admin,.rg-action-link{display:inline-flex!important;align-items:center!important;justify-content:center;gap:9px;text-decoration:none!important;border:1px solid rgba(65,118,200,.18)!important;border-radius:999px!important;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(218,234,255,.78))!important;color:#155dc5!important;box-shadow:0 5px 15px rgba(34,90,155,.09),inset 0 1px rgba(255,255,255,.9)!important;font-weight:800;min-height:42px;padding:10px 16px!important;line-height:1.2;white-space:nowrap;transition:transform .2s ease,box-shadow .2s ease}
.rg-dash-admin:hover,.rg-action-link:hover{transform:translateY(-2px);box-shadow:0 9px 22px rgba(34,90,155,.15)!important}
.rg-dash-admin:active,.rg-action-link:active{transform:scale(.97)}
.rg-dash-admin span:first-child{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(23,105,244,.12)}
.rg-dash-top{align-items:center}
html[data-theme=dark] .rg-dash-admin,html[data-theme=dark] .rg-action-link{background:linear-gradient(145deg,rgba(35,67,105,.96),rgba(20,47,78,.94))!important;color:#c6e0ff!important;border-color:rgba(126,177,241,.25)!important}
@media(max-width:700px){.rg-dash-admin{min-height:40px;font-size:12px;padding:9px 13px!important}.rg-action-link{min-height:36px;font-size:11px;padding:8px 11px!important}.rg-dash-top{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.rg-dash-admin,.rg-action-link{transition:none}}

/* Admin dashboard mobile layout: compact cards and unobstructed bottom nav */
.rg-admin-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.rg-admin-grid>a{min-width:0!important;min-height:132px!important;padding:17px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;text-decoration:none!important;color:var(--fg)!important;gap:4px!important;transition:transform .2s ease,box-shadow .2s ease}
.rg-admin-grid>a:hover{transform:translateY(-2px)}
.rg-admin-grid>a .rg-icon{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:12px;background:rgba(23,105,244,.10);color:var(--blue);font-size:22px;margin:0 0 6px}
.rg-admin-grid>a h2{margin:0!important;font-size:15px!important;line-height:1.3}
.rg-admin-grid>a p{margin:0!important;font-size:12px!important;line-height:1.4!important;color:var(--muted)}
.wrap{padding-bottom:max(150px,calc(env(safe-area-inset-bottom) + 145px))!important}
.rg-admin-nav{overflow-x:auto;scrollbar-width:none;gap:3px}
.rg-admin-nav::-webkit-scrollbar{display:none}
.rg-admin-nav>a{flex:1;min-width:0;text-align:center;white-space:nowrap}
@media(max-width:850px){.rg-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:700px){.rg-admin-grid{gap:10px!important}.rg-admin-grid>a{min-height:115px!important;padding:13px!important}.rg-admin-grid>a .rg-icon{width:34px;height:34px;font-size:20px;margin-bottom:3px}.rg-admin-grid>a h2{font-size:14px!important}.rg-admin-grid>a p{font-size:11px!important}.rg-dash-top>.rg-dash-admin{display:inline-flex!important;align-self:flex-start}}
@media(max-width:370px){.rg-admin-nav>a{font-size:10px;padding:6px 3px}}
