/* PPOB Ocean — visual layer. Preserves the existing PHP forms, routes and widgets. */
:root{color-scheme:light!important;--color-theme:#2665ec;--color-theme-secondary:#64c5ff;--color-theme-soft:#dcecff;--color-blue:#2665ec;--ocean:#2462ed;--ocean-dark:#113bb1;--ocean-cyan:#38baf5;--ocean-gradient:linear-gradient(125deg,#173fbe 0%,#2774f0 61%,#50c4fa 100%);--ink:#162a52;--muted:#7b8caa;--surface:#fff;--canvas:#f3f7ff;--stroke:#e6eefb;--lift:0 8px 30px rgba(25,71,156,.08)}
*,*::before,*::after{box-sizing:border-box}html{background:#e9f1ff}body.ppob-mobile{color:var(--ink)!important;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;font-size:14px;line-height:1.5;background:var(--canvas)!important;min-height:100dvh;max-width:500px;margin:0 auto!important;position:relative;overflow-x:hidden;box-shadow:0 0 55px rgba(17,52,122,.09)}
body.ppob-mobile a{color:var(--ocean);text-decoration:none}body.ppob-mobile a:focus-visible,body.ppob-mobile button:focus-visible,body.ppob-mobile input:focus-visible,body.ppob-mobile select:focus-visible{outline:3px solid #84c5ff!important;outline-offset:3px}body.ppob-mobile a:active,body.ppob-mobile button:active{transform:scale(.986)}body.ppob-mobile img{max-width:100%;object-fit:contain}body.ppob-mobile .text-primary,body.ppob-mobile .text-blue{color:var(--ocean)!important}body.ppob-mobile .bg-primary{background:var(--ocean-gradient)!important;color:#fff}body.ppob-mobile .bg-success{background:#168ac2!important}body.ppob-mobile .text-success{color:#138cb3!important}body.ppob-mobile .btn{border-radius:12px;font-weight:700;min-height:40px;white-space:normal}body.ppob-mobile .btn-primary,body.ppob-mobile .btn.btn-primary,body.ppob-mobile .btn-success{background:var(--ocean-gradient)!important;border:0!important;color:#fff!important;box-shadow:0 5px 15px rgba(40,103,221,.17)}body.ppob-mobile .btn-outline-primary{color:#245ce5!important;border-color:#b9d2ff!important;background:#f5f9ff!important}body.ppob-mobile .badge-primary{background:#e8f1ff!important;color:#2359cf!important}body.ppob-mobile .badge-success{background:#def7f4!important;color:#087c79!important}
body.ppob-mobile .appHeader{width:100%;max-width:500px;left:50%;right:auto;transform:translateX(-50%);background:var(--ocean-gradient)!important;min-height:66px;box-shadow:none;color:#fff!important;border:0!important}body.ppob-mobile .appHeader:before{width:100%;left:50%;transform:translateX(-50%);background:#173fbe!important}body.ppob-mobile .appHeader .left,body.ppob-mobile .appHeader .right{height:66px}body.ppob-mobile .appHeader .pageTitle,body.ppob-mobile .appHeader .headerButton,body.ppob-mobile .appHeader ion-icon{color:#fff!important}body.ppob-mobile .appHeader .pageTitle{font-size:15px;font-weight:800;letter-spacing:-.3px}body.ppob-mobile .appHeader .headerButton{min-width:42px;min-height:42px}body.ppob-mobile .appHeader.ppob-topbar{min-height:92px;align-items:flex-start;padding-top:12px}body.ppob-mobile .appHeader.ppob-topbar .left{left:17px;top:10px;height:62px;gap:10px}body.ppob-mobile .appHeader.ppob-topbar .right{right:17px;top:10px;height:62px}body.ppob-mobile .ppob-brand-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:15px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.25);color:#fff;font-size:24px}body.ppob-mobile .ppob-greeting{display:flex;flex-direction:column;line-height:1.27;gap:4px;min-width:0}body.ppob-mobile .ppob-greeting small{color:#d4ebff;font-size:11px;font-weight:500;letter-spacing:.1px}body.ppob-mobile .ppob-greeting strong{font-size:16px;color:#fff;max-width:255px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}body.ppob-mobile .ppob-notice{position:relative;width:43px;height:43px;display:grid;place-items:center;border-radius:15px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25)}body.ppob-mobile .ppob-notice ion-icon{font-size:23px}
body.ppob-mobile #appCapsule{max-width:500px;width:100%;min-height:calc(100dvh - 140px);padding:84px 16px 108px;margin:0 auto!important;background:var(--canvas)}body.ppob-mobile.rgs-home #appCapsule{padding-top:85px!important}body.ppob-mobile .extraHeader{left:50%;transform:translateX(-50%);width:100%;max-width:500px;background:#1c58d6!important;box-shadow:none}body.ppob-mobile .extraHeader .nav-tabs .nav-link{color:#e2efff}body.ppob-mobile .extraHeader .nav-tabs .nav-link.active{color:#205ae2!important;background:#fff!important;border-radius:12px 12px 0 0}body.ppob-mobile .extraHeader+#appCapsule{padding-top:132px}body.ppob-mobile .section{padding-right:0;padding-left:0;margin-left:0;margin-right:0}body.ppob-mobile .section.full{padding-right:0;padding-left:0}body.ppob-mobile .section-title,body.ppob-mobile .listview-title{font-size:16px!important;font-weight:800!important;letter-spacing:-.4px;color:var(--ink)!important;padding:18px 2px 12px!important}body.ppob-mobile .card,body.ppob-mobile .listview,body.ppob-mobile .wide-block,body.ppob-mobile .stat-box,body.ppob-mobile .modal-content{background:#fff;border:1px solid var(--stroke);border-radius:18px!important;box-shadow:var(--lift);overflow:hidden;color:var(--ink)}body.ppob-mobile .card .card-body{padding:16px}body.ppob-mobile .listview li:not(:last-child){border-color:var(--stroke)}body.ppob-mobile .listview .item{padding:12px 14px;min-height:57px}body.ppob-mobile .listview .in{min-width:0}body.ppob-mobile .listview .icon-box{border-radius:13px}body.ppob-mobile .profile.rgs-bg-texture{background:var(--ocean-gradient)!important;border-radius:21px;padding:24px 14px;margin-bottom:14px;box-shadow:0 10px 25px rgba(40,104,221,.18)}body.ppob-mobile .profile .name,body.ppob-mobile .profile h3,body.ppob-mobile .profile .subtext{color:#fff!important}body.ppob-mobile .profile-menu .money-info{border-radius:16px}body.ppob-mobile .alert{border-radius:14px!important;border:1px solid #cfe0ff;background:#eaf3ff;color:#2855a6;padding:12px 14px}body.ppob-mobile .alert-danger{background:#fff1f2!important;color:#b32740!important;border-color:#ffc4ce!important}body.ppob-mobile .form-control,body.ppob-mobile input:not([type=checkbox]):not([type=radio]):not([type=hidden]),body.ppob-mobile select,body.ppob-mobile textarea{border:1px solid #dbe6f6;background:#fff;border-radius:12px;min-height:45px;color:var(--ink);box-shadow:none;font-size:14px;max-width:100%}body.ppob-mobile input:focus,body.ppob-mobile select:focus,body.ppob-mobile textarea:focus{border-color:#4286f3!important;box-shadow:0 0 0 3px rgba(50,119,240,.11)!important}body.ppob-mobile .form-group label,body.ppob-mobile .input-wrapper .label{font-weight:700;color:#304769;font-size:12px;margin-bottom:5px}body.ppob-mobile .modal{max-width:500px;left:50%;transform:translateX(-50%)}body.ppob-mobile .modal-dialog{max-width:calc(100% - 20px);margin:auto}body.ppob-mobile .table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}body.ppob-mobile .table{color:var(--ink);font-size:12px}body.ppob-mobile .table thead{background:#eaf2ff;color:#164db6}body.ppob-mobile .table td,body.ppob-mobile .table th{vertical-align:middle;border-color:var(--stroke)}body.ppob-mobile .nav-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}body.ppob-mobile .nav-tabs .nav-link{font-size:12px;white-space:nowrap;padding:10px}body.ppob-mobile .modal .modal-header{background:#f5f9ff}body.ppob-mobile .section.bg-white{background:transparent!important}body.ppob-mobile .rgs-info .card{margin:10px 0}body.ppob-mobile .infinite-menu{max-width:100%;overflow-x:auto}body.ppob-mobile .carousel-single img,body.ppob-mobile .carousel-multiple img{object-fit:cover;border-radius:14px;max-height:225px}body.ppob-mobile .owl-carousel .owl-stage-outer{border-radius:14px}
/* Home: full markup refresh, separate from transactional selectors */
.ppob-dashboard .ppob-hero{position:relative;isolation:isolate;overflow:hidden;padding:20px 19px 17px;border-radius:24px;background:var(--ocean-gradient);color:#fff;box-shadow:0 13px 30px rgba(23,91,204,.25);margin:1px 0 15px}.ppob-dashboard .ppob-hero:before{content:"";position:absolute;z-index:-1;right:-68px;top:-100px;width:260px;height:260px;border:1px solid rgba(255,255,255,.22);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.05),0 0 0 65px rgba(255,255,255,.04)}.ppob-dashboard .ppob-hero-label{display:flex;gap:8px;align-items:center;font-size:12px;color:#e2efff;font-weight:600}.ppob-dashboard .ppob-hero-label ion-icon{font-size:17px}.ppob-dashboard .ppob-balance{font-size:30px;line-height:1.25;font-weight:850;letter-spacing:-1.1px;color:#fff;padding-top:8px;font-variant-numeric:tabular-nums;word-break:break-word}.ppob-dashboard .ppob-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 16px}.ppob-dashboard .ppob-hero-actions a{display:flex;gap:7px;align-items:center;justify-content:center;background:#fff;border-radius:12px;padding:10px 7px;color:#1554c9;font-size:12px;font-weight:800;min-height:42px}.ppob-dashboard .ppob-hero-actions a:last-child{color:#fff;background:rgba(255,255,255,.19);border:1px solid rgba(255,255,255,.25)}.ppob-dashboard .ppob-hero-actions ion-icon{font-size:18px}.ppob-dashboard .ppob-hero-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.18);padding-top:12px;color:#e3efff;font-size:11px}.ppob-dashboard .ppob-hero-foot strong{color:#fff;font-size:13px}.ppob-dashboard .ppob-section-title{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0 12px}.ppob-dashboard .ppob-section-title h2{font-size:16px;line-height:1.35;letter-spacing:-.35px;font-weight:800;color:var(--ink);margin:0}.ppob-dashboard .ppob-section-title a{font-size:12px;font-weight:750;flex-shrink:0}.ppob-dashboard .ppob-services{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:7px;row-gap:17px;background:#fff;border:1px solid var(--stroke);border-radius:21px;padding:19px 9px 18px;box-shadow:var(--lift);margin-bottom:16px}.ppob-dashboard .ppob-service{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:7px;color:#324565!important;text-align:center;min-width:0}.ppob-dashboard .ppob-service .ppob-icon{height:48px;width:48px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(145deg,#e5f4ff,#e6ebff);color:#286ce9;transition:transform .18s ease}.ppob-dashboard .ppob-service:nth-child(5n+2) .ppob-icon{background:#e3f8ff;color:#098ebc}.ppob-dashboard .ppob-service:nth-child(5n+3) .ppob-icon{background:#eaeaff;color:#625cde}.ppob-dashboard .ppob-service:nth-child(5n+4) .ppob-icon{background:#edf2ff;color:#4669d8}.ppob-dashboard .ppob-service:nth-child(5n+5) .ppob-icon{background:#eaf7ff;color:#267eec}.ppob-dashboard .ppob-service:active .ppob-icon{transform:scale(.95)}.ppob-dashboard .ppob-icon ion-icon{font-size:25px}.ppob-dashboard .ppob-service span:last-child{font-size:10px;font-weight:700;line-height:1.34;overflow-wrap:anywhere}.ppob-dashboard .ppob-upgrade{display:flex;gap:10px;align-items:center;border:1px solid #bcd9ff;border-radius:16px;padding:12px;margin-bottom:16px;background:linear-gradient(115deg,#ebf6ff,#f7faff);color:#1c4da6}.ppob-dashboard .ppob-upgrade .rocket{font-size:24px;display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:#d6ecff;flex-shrink:0}.ppob-dashboard .ppob-upgrade strong{display:block;font-size:12px}.ppob-dashboard .ppob-upgrade small{display:block;color:#6482ae;font-size:11px}.ppob-dashboard .ppob-upgrade ion-icon:last-child{margin-left:auto;font-size:19px;flex-shrink:0}.ppob-dashboard .ppob-tile{background:#fff;border:1px solid var(--stroke);border-radius:18px;padding:13px;margin-bottom:16px;box-shadow:var(--lift)}.ppob-dashboard .ppob-promo-empty{display:flex;align-items:center;gap:12px;min-height:76px;padding:15px;color:#4770aa;background:linear-gradient(115deg,#edf6ff,#f7fbff);border-radius:13px;font-size:12px}.ppob-dashboard .ppob-promo-empty ion-icon{font-size:28px;color:#3783e8}.ppob-dashboard .ppob-promo-img{width:100%;height:160px;object-fit:cover!important;border-radius:13px}.ppob-dashboard .ppob-reward-strip{display:flex;gap:11px;overflow-x:auto;scrollbar-width:none}.ppob-dashboard .ppob-reward{flex:0 0 114px;background:#f1f7ff;border:1px solid #dceaff;border-radius:12px;padding:9px;min-width:0;color:var(--ink)}.ppob-dashboard .ppob-reward img{width:100%;height:77px;object-fit:cover;border-radius:8px}.ppob-dashboard .ppob-reward strong{display:block;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ppob-dashboard .ppob-reward small{color:#1d62d3}.ppob-dashboard .ppob-info{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid #eef2fa}.ppob-dashboard .ppob-info:last-child{border-bottom:0}.ppob-dashboard .ppob-info-icon{display:grid;place-items:center;flex:0 0 34px;height:34px;background:#e8f2ff;color:#296ae0;border-radius:11px;font-size:19px}.ppob-dashboard .ppob-info strong{font-size:12px;display:block;color:var(--ink)}.ppob-dashboard .ppob-info small{font-size:10px;color:#8a98af;display:block;margin:2px 0}.ppob-dashboard .ppob-info p{font-size:11px;color:#617593;line-height:1.55;margin:0}.ppob-dashboard .ppob-empty{border:1px dashed #c9dffa;border-radius:12px;background:#f7fbff;display:flex;align-items:center;gap:10px;padding:15px;color:#6880a7;font-size:12px}.ppob-dashboard .ppob-empty ion-icon{font-size:20px;color:#3d80dd}
body.ppob-mobile .appBottomMenu{width:100%;max-width:500px;left:50%;right:auto;transform:translateX(-50%);bottom:0;height:73px;padding-bottom:env(safe-area-inset-bottom);border:1px solid var(--stroke);border-bottom:0;border-radius:19px 19px 0 0;background:#fff!important;box-shadow:0 -8px 28px rgba(36,83,166,.08)!important;overflow:visible;z-index:1000}body.ppob-mobile .appBottomMenu .item{border:0!important;flex:1;min-width:0;border-radius:0!important}body.ppob-mobile .appBottomMenu .item .col{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px}body.ppob-mobile .appBottomMenu .item ion-icon{font-size:21px;color:#99a9c1!important}body.ppob-mobile .appBottomMenu .item strong{font-size:10px;color:#99a9c1!important;font-weight:650}body.ppob-mobile .appBottomMenu .item.active ion-icon,body.ppob-mobile .appBottomMenu .item.active strong{color:#2468e8!important}body.ppob-mobile .appBottomMenu .item .bd{bottom:auto;border:0;border-radius:0;display:grid;place-items:center}body.ppob-mobile .appBottomMenu .item .action-button{top:-17px!important;width:52px!important;height:52px!important;background:var(--ocean-gradient)!important;border:4px solid #fff!important;border-radius:17px!important;box-shadow:0 7px 20px rgba(28,91,215,.28)!important}body.ppob-mobile .appBottomMenu .item .action-button ion-icon{color:#fff!important;font-size:23px}body.ppob-mobile #loader{background:#f5f9ff!important;z-index:9999}body.ppob-mobile #loader .spinner-border{color:#2b71ed!important}
body.ppob-mobile .rgs-home .card,body.ppob-mobile.rgs-home .card{border-radius:18px!important}body.ppob-mobile .bg-danger,body.ppob-mobile .text-danger{--color-theme: #ef526a}body.ppob-mobile .rewards-bg{background:var(--ocean-gradient)!important}body.ppob-mobile .rgs-upgrade-level.bg-primary{background:var(--canvas)!important}body.ppob-mobile .btn:not(:disabled),body.ppob-mobile .appBottomMenu a{transition:transform .18s,box-shadow .18s}body.ppob-mobile .swal2-popup{border-radius:20px!important}body.ppob-mobile .section .form-button-group{max-width:500px;left:50%;transform:translateX(-50%)}
@media(max-width:360px){.ppob-dashboard .ppob-services{padding-left:6px;padding-right:6px;gap:13px 3px}.ppob-dashboard .ppob-icon{width:43px!important;height:43px!important}.ppob-dashboard .ppob-service span:last-child{font-size:9px}.ppob-dashboard .ppob-balance{font-size:27px}}@media(min-width:501px){body.ppob-mobile{border-left:1px solid #dce8fc;border-right:1px solid #dce8fc}}@media(prefers-reduced-motion:reduce){body.ppob-mobile *,body.ppob-mobile *::before,body.ppob-mobile *::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.ppob-svg-sprite{position:absolute;left:-9999px;width:0;height:0;overflow:hidden}.ppob-svg{display:inline-block;vertical-align:-.12em;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round;flex-shrink:0}.ppob-brand-icon .ppob-svg{width:24px;height:24px}.ppob-notice .ppob-svg{width:22px;height:22px}.ppob-hero-label .ppob-svg{width:17px;height:17px}.ppob-hero-actions .ppob-svg{width:18px;height:18px}.ppob-hero-foot .ppob-svg{width:14px;height:14px}.ppob-section-title .ppob-svg{width:13px;height:13px}.ppob-icon .ppob-svg{width:25px;height:25px}.ppob-upgrade .rocket .ppob-svg{width:24px;height:24px}.ppob-upgrade>.ppob-svg{width:18px;height:18px;margin-left:auto}.ppob-promo-empty .ppob-svg{width:28px;height:28px}.ppob-info-icon .ppob-svg{width:19px;height:19px}.ppob-empty .ppob-svg{width:20px;height:20px}body.ppob-mobile .appBottomMenu .item .ppob-svg{width:21px;height:21px;color:#99a9c1!important}body.ppob-mobile .appBottomMenu .item.active .ppob-svg{color:#2468e8!important}body.ppob-mobile .appBottomMenu .item .action-button .ppob-svg{width:23px;height:23px;color:#fff!important}body.ppob-mobile .ppob-service .ppob-svg{color:inherit}body.ppob-mobile .ppob-topbar .ppob-svg{color:#fff}
