/* RioPing V5 Live DOM fix: visual-only overrides for audited production HTML. */
:root{--rio-navy:#0a1c37;--rio-blue:#247cf0;--rio-ice:#eaf5ff;--rio-radius:22px;--rio-shadow:0 16px 38px rgba(20,60,113,.09)}
body{background:radial-gradient(ellipse 90% 380px at 50% 0,#dfefff 0%,transparent 100%),#f4f8ff;color:#142b4a}
.shell{max-width:960px;padding:18px 18px 112px}
header{position:relative;padding:12px 16px;margin:0 0 20px;border:1px solid #e3ecfa;border-radius:22px;background:rgba(255,255,255,.86);box-shadow:0 10px 30px rgba(25,74,135,.06)}
.brand-icon{width:52px;height:52px;border-radius:16px;box-shadow:0 5px 18px #1b6ed52b}.brand-name{color:#0d2d58}.tag{background:#e8f2ff;color:#1464c7;font-weight:700}
.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#0a1b34 0%,#103f78 66%,#1675c4 100%);border:1px solid #23588d;border-radius:28px;padding:28px 30px;color:white;box-shadow:0 20px 42px #113b7730}
.hero:before{content:"";position:absolute;left:-80px;top:-115px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,#7bcfff40,transparent 70%);pointer-events:none}
.hero-top{position:relative}.hero-logo{width:70px;height:70px;border-radius:19px;box-shadow:0 8px 30px #0004}.hero .small,.hero p{color:#c3dcf5}.hero h1{font-size:clamp(22px,4vw,31px);line-height:1.5;margin:18px 0 6px}
.panel{border-color:#e2ebf7;border-radius:var(--rio-radius);box-shadow:var(--rio-shadow);background:#fff}
#login{max-width:510px;margin:26px auto;padding:28px}#login h2{color:#0e396b}#login input{border-radius:14px}
#dashboard .welcome{background:linear-gradient(100deg,#e6f3ff,#fff);border:1px solid #d9eafb;border-radius:20px;padding:14px 18px;box-shadow:0 10px 22px #1c66b50b;font-size:16px}#dashboard .welcome b{color:#145fb2}#logout{background:#e9f0fa;color:#274b74;padding:8px 15px}
.stats{gap:14px}.stats>.panel{position:relative;overflow:hidden;min-height:140px;padding:23px;border-radius:23px}.stats>.panel:first-child{background:linear-gradient(135deg,#10294b,#135da4);color:white;border-color:#205d95}.stats>.panel:first-child .small{color:#c8e4ff}.stats>.panel:first-child strong{color:white}.stats strong{font-size:clamp(23px,5vw,32px);font-weight:800;color:#176cdb}
#dashboard h2{font-size:20px;color:#173e6e;margin:24px 0 14px}
.tabs{max-width:960px;bottom:10px;left:12px;right:12px;width:calc(100% - 24px);border:1px solid #dce8f7;border-radius:21px;padding:8px 8px max(8px,env(safe-area-inset-bottom));box-shadow:0 12px 38px #163c6630;backdrop-filter:blur(14px);background:#ffffffed}.tab{border-radius:13px;transition:background .18s,color .18s}.tab.selected{background:#e9f3ff;color:#126bdc}.nav-icon{font-size:23px}
#services{display:grid;gap:16px}.service{position:relative;overflow:hidden;border-radius:24px!important;border:1px solid #dae7f7!important;background:linear-gradient(160deg,#fff 70%,#f0f7ff)!important;box-shadow:var(--rio-shadow)!important;padding:22px!important}.service:before{content:"";position:absolute;right:0;top:0;width:5px;height:100%;background:linear-gradient(#78c8ff,#247cf0)}.service h3{font-size:18px;color:#153f72}.service .line{border-color:#e9eff8}.service .progress,.progress{height:10px;background:#e6eef8;border-radius:20px}.service .bar,.bar{background:linear-gradient(90deg,#2381f4,#70c9ff);border-radius:20px}.service .link{background:#1877e8;border-radius:13px;font-weight:700}
#shop-catalog .panel{border-radius:22px;transition:transform .2s,box-shadow .2s}#shop-catalog .panel:hover{transform:translateY(-2px);box-shadow:0 18px 34px #164f8b18}
button,.link{transition:background .18s,transform .18s}button:active,.link:active{transform:scale(.98)}button:focus-visible,.link:focus-visible,input:focus-visible{outline:3px solid #8acaff;outline-offset:3px}
footer{color:#7b8da6;text-align:center;padding:28px 0 16px}
@media(min-width:760px){#services{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:34px 38px}}
@media(max-width:520px){.shell{padding:12px 12px 108px}header{padding:10px 12px;margin-bottom:14px}.brand-icon{width:44px;height:44px}.brand-name{font-size:19px}.tag{font-size:10px;padding:6px 9px}.hero{padding:22px 20px;border-radius:24px}.hero-logo{width:58px;height:58px}.stats>.panel{padding:16px;min-height:118px}.stats strong{font-size:23px}.service{padding:17px!important}.tabs{bottom:7px;left:8px;right:8px;width:calc(100% - 16px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
/* RIOPING_V52_SHOP_START */
/* RioPing V5.2 — shop presentation only; existing JS checkout stays authoritative. */
#page-shop{padding-bottom:calc(116px + env(safe-area-inset-bottom,0px));}
#page-shop>h2{font-family:Tahoma,Arial,sans-serif!important;font-weight:800;letter-spacing:0;line-height:1.65;font-size:clamp(21px,4vw,27px);color:#12355e;margin:8px 0 4px}
#page-shop>.muted{font-family:Tahoma,Arial,sans-serif!important;font-size:13px;line-height:1.9;color:#63778e;margin:0 0 17px}
#shop-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr));gap:14px;align-items:start}
#shop-catalog .shop-card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:0;margin:0!important;padding:20px!important;border:1px solid #dce8f7!important;border-radius:23px!important;background:#fff!important;box-shadow:0 12px 30px rgba(20,69,128,.07)!important;min-width:0;direction:rtl;font-family:Tahoma,Arial,sans-serif!important}
#shop-catalog .shop-card:before{content:"";position:absolute;inset:0 0 0 auto;width:4px;background:linear-gradient(180deg,#73c9ff,#2479e8);border-radius:0 23px 23px 0}
#shop-catalog .shop-card h3{margin:0 0 13px!important;padding:0 0 14px;border-bottom:1px solid #e8eff7;font-family:Tahoma,Arial,sans-serif!important;font-size:19px!important;font-weight:800;line-height:1.7;color:#173c67;overflow-wrap:anywhere}
#shop-catalog .shop-card .line{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0!important;margin:0!important;min-height:38px;border:0!important;background:transparent!important;font-family:Tahoma,Arial,sans-serif!important;font-size:13px!important;line-height:1.7}
#shop-catalog .shop-card .line span{color:#71849b;font-weight:400}
#shop-catalog .shop-card .line strong{color:#173451;font-size:14px;font-weight:700;text-align:left;unicode-bidi:plaintext}
#shop-catalog .shop-card .line:nth-last-of-type(1){border-top:1px solid #e8eff7!important;margin-top:10px!important;padding-top:14px!important}
#shop-catalog .shop-card .line:nth-last-of-type(1) strong{color:#116bdc;font-size:21px!important;font-weight:800}
#shop-catalog .shop-card>button{width:100%;min-height:48px;margin:15px 0 0!important;padding:10px 16px!important;border-radius:14px!important;background:linear-gradient(100deg,#1267e7,#2385ef)!important;color:#fff!important;font:700 14px Tahoma,Arial,sans-serif!important;box-shadow:0 6px 15px rgba(26,111,221,.15);cursor:pointer}
#shop-catalog .shop-card>button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}
#shop-catalog .shop-card>button:focus-visible{outline:3px solid #80cfff;outline-offset:3px}
#shop-message{font-family:Tahoma,Arial,sans-serif!important;font-size:13px;line-height:1.8}
@media(max-width:600px){#shop-catalog{grid-template-columns:minmax(0,1fr);gap:12px}#shop-catalog .shop-card{padding:17px!important}#shop-catalog .shop-card h3{font-size:18px!important}#page-shop{padding-bottom:calc(132px + env(safe-area-inset-bottom,0px))}}
@media(prefers-reduced-motion:no-preference){#shop-catalog .shop-card{transition:box-shadow .18s ease,transform .18s ease}#shop-catalog .shop-card:focus-within{box-shadow:0 16px 34px rgba(20,69,128,.13)!important}}

/* RIOPING_V52_SHOP_END */

/* RioPing V5.2.2 — compact catalog, presentation only. */
#page-shop { font-family: Vazirmatn, Tahoma, Arial, sans-serif !important; }
#page-shop h2, #page-shop p, #shop-catalog, #shop-message {font-family:Vazirmatn,Tahoma,Arial,sans-serif !important;letter-spacing:normal !important}
#shop-catalog {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:14px;align-items:start}
#shop-catalog .shop-card {display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 8px;align-content:start;min-height:0 !important;height:auto !important;margin:0 !important;padding:18px !important;border-radius:22px !important;overflow:hidden;box-sizing:border-box}
#shop-catalog .shop-card > h3 {grid-column:1/-1;margin:0 !important;padding:0 0 12px !important;font-family:Vazirmatn,Tahoma,Arial,sans-serif !important;font-size:17px !important;font-weight:800 !important;line-height:1.7 !important;border-bottom:1px solid #e6edf6;text-align:right}
#shop-catalog .shop-card > .line {display:flex !important;flex-direction:column !important;justify-content:flex-start !important;align-items:center !important;gap:5px !important;min-width:0 !important;margin:0 !important;padding:10px 3px !important;border:1px solid #e7eef8 !important;border-radius:13px !important;background:#f6faff !important;text-align:center !important;line-height:1.5 !important}
#shop-catalog .shop-card > .line > span {font-size:11px !important;color:#65768c !important}
#shop-catalog .shop-card > .line > strong {font-family:Vazirmatn,Tahoma,Arial,sans-serif !important;font-size:13px !important;font-weight:700 !important;color:#183858 !important;white-space:normal;overflow-wrap:anywhere;text-align:center !important}
#shop-catalog .shop-card > .line:nth-of-type(4) {grid-column:1/-1;display:flex !important;flex-direction:row !important;justify-content:space-between !important;align-items:center !important;padding:12px 14px !important;border:0 !important;background:#eaf4ff !important}
#shop-catalog .shop-card > .line:nth-of-type(4) > span {font-size:12px !important}
#shop-catalog .shop-card > .line:nth-of-type(4) > strong {font-size:19px !important;color:#1264cc !important;font-weight:800 !important}
#shop-catalog .shop-card > button {grid-column:1/-1;width:100% !important;min-height:46px !important;margin:0 !important;padding:10px 12px !important;border-radius:13px !important;font-family:Vazirmatn,Tahoma,Arial,sans-serif !important;font-size:14px !important;font-weight:700 !important;line-height:1.6 !important}
body:has(#page-shop:not([hidden])) .shell {padding-bottom:max(130px,calc(115px + env(safe-area-inset-bottom))) !important}
@media(max-width:400px){#shop-catalog .shop-card{padding:14px !important;gap:9px 6px}#shop-catalog .shop-card > h3{font-size:15px !important}#shop-catalog .shop-card > .line > strong{font-size:12px !important}#shop-catalog .shop-card > .line:nth-of-type(4) > strong{font-size:17px !important}}

