:root{
  --xp-blue:#245edb;
  --xp-blue2:#1941a5;
  --xp-green:#3c9f31;
  --xp-cream:#ece9d8;
  --xp-border:#7f9db9;
  --xp-link:#0000ee;
  --xp-panel:#d6e5f5;
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden}
body{
  margin:0;
  min-width:320px;
  color:#111;
  font-family:Tahoma,"Microsoft Sans Serif",Arial,sans-serif;
  font-size:12px;
  background:#72b9ee;
}
button,input,textarea,select{font-family:Tahoma,"Microsoft Sans Serif",Arial,sans-serif}
button{cursor:pointer}
a{color:#0000ee}
a:visited{color:#551a8b}
.xp-desktop{
  position:fixed;
  inset:0 0 32px;
  overflow:hidden;
  background:linear-gradient(#66b4ed 0 58%,#6fba50 58% 100%);
}
.xp-desktop::before{
  content:"";
  position:absolute;
  z-index:0;
  left:-8%;
  right:38%;
  bottom:-19%;
  height:52%;
  background:#6dba45;
  border-radius:50% 70% 0 0/72% 72% 0 0;
  transform:rotate(-4deg);
  box-shadow:inset 0 18px 30px #8bd05f;
}
.xp-desktop::after{
  content:"";
  position:absolute;
  z-index:0;
  right:-18%;
  bottom:-28%;
  width:78%;
  height:58%;
  background:#54a83e;
  border-radius:60% 0 0 0/65% 0 0 0;
  transform:rotate(4deg);
  box-shadow:inset 0 18px 28px #78c556;
}
.desktop-icons{
  position:absolute;
  z-index:2;
  top:12px;
  right:10px;
  display:grid;
  gap:9px;
  width:82px;
}
.desktop-icon{
  display:grid;
  justify-items:center;
  gap:3px;
  width:78px;
  min-height:70px;
  padding:3px 2px;
  color:#fff;
  font-size:11px;
  text-align:center;
  text-shadow:1px 1px 2px #000;
  background:transparent;
  border:1px solid transparent;
  box-shadow:none;
}
.desktop-icon:hover,.desktop-icon:focus-visible{
  background:#316ac566;
  border:1px dotted #fff;
  outline:0;
}
.desktop-icon-art{
  position:relative;
  display:block;
  width:38px;
  height:38px;
}
.icon-ie{
  color:#0a43a6;
  font:italic 900 37px/38px Arial,sans-serif;
  text-shadow:-1px -1px #fff,1px 1px #65a6ff;
}
.icon-ie::after{
  content:"";
  position:absolute;
  left:0;
  top:16px;
  width:38px;
  height:8px;
  border-top:3px solid #f0bf25;
  border-radius:50%;
  transform:rotate(-16deg);
}
.icon-folder,.start-folder{
  width:38px;
  height:28px;
  margin-top:7px;
  background:#f4cd3c;
  border:1px solid #9c7c13;
  box-shadow:inset 2px 2px #fff1a3;
}
.icon-folder::before,.start-folder::before{
  content:"";
  position:absolute;
  top:-6px;
  right:3px;
  width:18px;
  height:7px;
  background:#f4cd3c;
  border:1px solid #9c7c13;
  border-bottom:0;
}
.icon-document{
  width:30px;
  height:37px;
  margin:auto;
  background:#fff;
  border:1px solid #777;
  box-shadow:2px 2px 0 #7c94ad;
}
.icon-document::before{
  content:"";
  position:absolute;
  right:5px;
  left:5px;
  top:8px;
  height:2px;
  background:#245edb;
  box-shadow:0 6px #245edb,0 12px #245edb,0 18px #888;
}
.icon-mail{
  width:38px;
  height:28px;
  margin-top:7px;
  background:#f8f8f8;
  border:1px solid #686868;
  box-shadow:2px 2px 0 #7f91a5;
}
.icon-mail::before,.icon-mail::after{
  content:"";
  position:absolute;
  top:4px;
  width:24px;
  height:1px;
  background:#777;
}
.icon-mail::before{left:0;transform:rotate(31deg)}
.icon-mail::after{right:0;transform:rotate(-31deg)}

.app-window{
  position:fixed;
  z-index:20;
  margin:0;
  min-width:330px;
  min-height:220px;
  max-width:calc(100vw - 18px);
  max-height:calc(100vh - 42px);
  box-shadow:2px 3px 8px #002a6b88;
}
.app-window[hidden]{display:none!important}
.app-window.maximized{
  top:1px!important;
  right:1px!important;
  bottom:33px!important;
  left:1px!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  transform:none!important;
}
.app-window .title-bar{touch-action:none;user-select:none}
.app-window .title-bar-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.app-window .window-body{
  height:calc(100% - 30px);
  overflow:auto;
  margin:8px;
}
.store-window .window-body{margin:0}

.store-shell{
  display:grid;
  grid-template-rows:auto auto auto minmax(0,1fr) auto;
  min-height:0;
  background:#fff;
}
.browser-menu{
  display:flex;
  align-items:center;
  gap:3px;
  min-height:24px;
  padding:2px 5px;
  background:#ece9d8;
  border-bottom:1px solid #aca899;
}
.browser-menu button{
  min-width:0;
  padding:2px 7px;
  color:#111;
  background:transparent;
  border:0;
  box-shadow:none;
}
.browser-menu button:hover,.browser-menu button:focus-visible{
  color:#fff;
  background:#316ac5;
  outline:0;
}
.classic-menu-popup{
  position:fixed;
  z-index:2200;
  min-width:185px;
  padding:2px;
  direction:rtl;
  background:#ece9d8;
  border:1px solid #7b796f;
  box-shadow:inset 1px 1px #fff,inset -1px -1px #aca899,2px 2px 3px #0005;
}
.classic-menu-popup[hidden]{display:none!important}
.classic-menu-popup button{
  display:flex;
  align-items:center;
  width:100%;
  min-height:25px;
  padding:3px 22px 3px 8px;
  color:#111;
  text-align:right;
  white-space:nowrap;
  background:transparent;
  border:0;
  box-shadow:none;
}
.classic-menu-popup button:hover,
.classic-menu-popup button:focus-visible{
  color:#fff;
  background:#316ac5;
  outline:0;
}
.classic-menu-separator{
  height:1px;
  margin:3px 2px;
  background:#aca899;
  border-bottom:1px solid #fff;
}
.browser-menu button.menu-open{
  color:#fff;
  background:#316ac5;
}

.browser-toolbar{
  display:flex;
  align-items:center;
  gap:2px;
  min-height:47px;
  padding:3px 5px;
  background:#ece9d8;
  border-top:1px solid #fff;
  border-bottom:1px solid #aca899;
}
.browser-toolbar button{
  display:grid;
  grid-template-columns:26px auto;
  align-items:center;
  gap:2px;
  min-width:78px;
  height:38px;
  padding:1px 5px;
  background:transparent;
  border:1px solid transparent;
  box-shadow:none;
}
.browser-toolbar button:hover,.browser-toolbar button:focus-visible{
  background:#f6f3e8;
  border:1px solid #c2bfb2;
  outline:0;
}
.toolbar-separator{
  width:1px;
  height:34px;
  margin:0 3px;
  background:#aca899;
  box-shadow:1px 0 #fff;
}
.tb-icon{
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  font:bold 22px/1 Arial,sans-serif;
}
.tb-icon.back{color:#42a239}
.tb-icon.forward{color:#8b8b8b}
.tb-icon.home{color:#e6532e;font-size:24px}
.tb-icon.search{color:#245edb}
.tb-icon.star{color:#f0b900;text-shadow:1px 1px #7d6600}
.tb-icon.folder{color:#d8a900}
.address-bar{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:29px;
  padding:3px 5px;
  color:#333;
  background:#ece9d8;
  border-top:1px solid #fff;
  border-bottom:1px solid #aca899;
}
.address-box{
  display:flex;
  align-items:center;
  gap:5px;
  flex:1;
  min-width:0;
  height:22px;
  padding:1px 4px;
  color:#111;
  overflow:hidden;
  white-space:nowrap;
  background:#fff;
  border:1px inset #7f9db9;
}
.address-ie{
  color:#1554b0;
  font:bold italic 17px Arial,sans-serif;
}
.address-bar>button{
  min-width:65px;
  height:23px;
  padding:1px 6px;
}
.go-arrow{color:#39a532;font-weight:900}

.store-content{
  display:grid;
  grid-template-columns:205px minmax(0,1fr);
  min-height:0;
  overflow:auto;
  background:#fff;
}
.explorer-pane{
  min-height:100%;
  padding:10px;
  background:linear-gradient(180deg,#6f9be9,#6c8fd7 48%,#637ac0);
  border-left:1px solid #5a72ad;
}
.xp-side-group{
  overflow:hidden;
  margin-bottom:12px;
  background:#d6e4f6;
  border-radius:5px 5px 0 0;
  box-shadow:0 1px 0 #516ba9;
}
.xp-side-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:5px 8px;
  color:#24519b;
  font-weight:700;
  background:linear-gradient(90deg,#fff,#c6d9f7);
}
.xp-side-title span{
  display:grid;
  place-items:center;
  width:16px;
  height:16px;
  color:#fff;
  background:#648bd4;
  border-radius:50%;
}
.xp-side-group>button{
  display:flex;
  align-items:center;
  gap:7px;
  width:100%;
  min-height:28px;
  padding:4px 8px;
  color:#0b3a83;
  text-align:right;
  background:transparent;
  border:0;
  box-shadow:none;
}
.xp-side-group>button:hover,.xp-side-group>button:focus-visible{
  color:#0000ee;
  text-decoration:underline;
  outline:0;
}
.mini-icon{
  position:relative;
  flex:0 0 16px;
  width:16px;
  height:16px;
}
.service-mini{background:#fff;border:1px solid #3e6cb1}
.service-mini::after{content:"";position:absolute;inset:4px 2px;background:#4b83d4}
.folder-mini{background:#f4cc38;border:1px solid #927710}
.mail-mini{background:#fff;border:1px solid #666}
.doc-mini{background:#fff;border:1px solid #777}
.doc-mini::after{content:"";position:absolute;left:3px;right:3px;top:4px;height:1px;background:#245edb;box-shadow:0 3px #245edb,0 6px #888}
.side-details{
  display:grid;
  gap:4px;
  padding:7px 9px 10px;
  color:#333;
}
.side-details strong{color:#163d83}
.side-details a{direction:ltr;text-align:right}

.store-main{
  min-width:0;
  padding:13px 15px 18px;
  background:#fff;
}
.old-web-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:3px 0 10px;
  border-bottom:1px solid #b8b8b8;
}
.old-web-header h1{
  margin:0 0 3px;
  color:#003399;
  font-size:24px;
  font-weight:700;
}
.old-web-header p{
  margin:0;
  color:#333;
}
.cart-shortcut{
  min-width:120px;
  white-space:nowrap;
}
.notice-bar{
  margin:10px 0;
  padding:7px 9px;
  color:#111;
  background:#ffffe1;
  border:1px solid #c8c8a0;
}
.classic-section-title{
  display:flex;
  align-items:baseline;
  gap:12px;
  padding:5px 7px;
  color:#fff;
  background:#316ac5;
  border:1px solid #174789;
}
.classic-section-title span{font-weight:700}
.classic-section-title small{color:#eef5ff}

.service-list{
  margin-top:0;
  border:1px solid #9e9e9e;
  border-top:0;
}
.service-list-head,.service-card{
  display:grid;
  grid-template-columns:minmax(280px,1fr) 110px 90px 105px 70px;
  align-items:center;
}
.service-list-head{
  min-height:24px;
  color:#111;
  background:#ece9d8;
  border-bottom:1px solid #aca899;
}
.service-list-head span{
  height:23px;
  padding:4px 6px;
  border-left:1px solid #aca899;
  box-shadow:inset 1px 1px #fff;
}
.service-card{
  position:relative;
  min-height:58px;
  background:#fff;
  border-bottom:1px solid #e1e1e1;
}
.service-card:nth-of-type(even){background:#f9fbfd}
.service-card:hover{background:#e8f1ff}
.service-card.selected{background:#d9e8fb}
.service-card>*{padding:5px 7px}
.service-title{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  height:100%;
  color:#0000ee;
  text-align:right;
  background:transparent;
  border:0;
  box-shadow:none;
}
.service-title:hover,.service-title:focus-visible{text-decoration:underline;outline:1px dotted #333;outline-offset:-2px}
.service-title span{display:block;min-width:0}
.service-title strong,.service-title small{display:block}
.service-title strong{font-size:12px}
.service-title small{
  margin-top:3px;
  color:#555;
  font-weight:400;
  text-decoration:none;
}
.file-icon{
  position:relative;
  flex:0 0 26px;
  width:26px;
  height:31px;
  background:#fff;
  border:1px solid #697d95;
  box-shadow:1px 1px 0 #aec2d9;
}
.file-icon::before{
  content:"";
  position:absolute;
  right:4px;
  left:4px;
  top:7px;
  height:2px;
  background:#326bc2;
  box-shadow:0 6px #66a044,0 12px #d05238;
}
.service-meta{color:#333}
.money{
  display:inline-flex;
  direction:ltr;
  align-items:baseline;
  gap:4px;
  color:#000;
  font-size:12px;
  font-weight:700;
  unicode-bidi:isolate;
}
.currency{font-size:11px}
.service-card>.add-service{margin:5px;min-width:58px}
.service-card>.add-service.default{font-weight:700}
.service-hidden-details{display:none}

.merchant-info{margin-top:13px}
.merchant-links{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px 18px;
}
.merchant-links button{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:3px 4px;
  color:#0000ee;
  text-align:right;
  background:transparent;
  border:0;
  box-shadow:none;
}
.merchant-links button:hover{text-decoration:underline}
.merchant-links span{margin-top:2px;color:#555;font-size:11px;text-decoration:none}
.status-bar{
  margin:0;
  padding:2px 3px;
  background:#ece9d8;
  border-top:1px solid #aca899;
}

.classic-dialog{background:#ece9d8}
.dialog-heading{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
  padding-bottom:9px;
  border-bottom:1px solid #aaa;
}
.dialog-heading h2{margin:0 0 3px;font-size:16px}
.dialog-heading p{margin:0;color:#555}
.big-folder-icon{
  position:relative;
  width:46px;
  height:34px;
  background:#f2c83b;
  border:1px solid #8b7115;
  box-shadow:inset 2px 2px #fff0a0;
}
.big-folder-icon::before{
  content:"";
  position:absolute;
  right:3px;
  top:-8px;
  width:22px;
  height:9px;
  background:#f2c83b;
  border:1px solid #8b7115;
  border-bottom:0;
}
.cart-items{display:grid;gap:3px}
.cart-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:8px;
  align-items:center;
  padding:6px;
  background:#fff;
  border:1px solid #b5b5b5;
}
.cart-row strong{color:#000}
.cart-row .money{font-size:12px}
.empty-state{
  padding:18px;
  color:#555;
  text-align:center;
  background:#fff;
  border:1px inset #b5b5b5;
}
.cart-total,.order-total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:8px;
  padding:7px;
  background:#fff;
  border:1px solid #b5b5b5;
}
.dialog-actions{
  display:flex;
  justify-content:flex-end;
  gap:7px;
  margin-top:11px;
}
.wrap-actions{flex-wrap:wrap}
.order-body{overflow:auto}
.field-row-stacked{display:grid;gap:3px;margin:7px 0}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
input,textarea{width:100%}
input[type="tel"]{
  height:23px;
  padding:3px 4px;
  color:#222;
  background:#fff;
  border:1px solid #7f9db9;
  border-radius:0;
  appearance:none;
}
input[aria-invalid="true"],textarea[aria-invalid="true"]{
  border-color:#c51b1b!important;
  box-shadow:inset 0 0 0 1px #f3aaaa;
}
textarea{resize:vertical}
.order-reference-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:4px 0 8px;
  padding:5px 7px;
  background:#fff;
  border:1px inset #b5b5b5;
}
.order-reference-row strong{
  direction:ltr;
  unicode-bidi:isolate;
  color:#003399;
  font-family:"Courier New",monospace;
}
.terms-accept{
  display:flex;
  align-items:flex-start;
  gap:6px;
  margin-top:8px;
  padding:6px;
  background:#fff;
  border:1px solid #b6b6b6;
}
.terms-accept input{width:auto;margin-top:2px}
.terms-accept input[aria-invalid="true"]{outline:2px solid #c51b1b}
.order-summary{display:grid;gap:3px}
.order-summary-row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:4px 0;
  border-bottom:1px dotted #999;
}
.order-policy-confirm p{margin:4px 0 6px}
.order-policy-confirm button{
  padding:0;
  color:#0000ee;
  text-decoration:underline;
  background:transparent;
  border:0;
  box-shadow:none;
}
.order-status{min-height:18px;margin-top:7px;color:#075d0b}

.policies-window .window-body{margin:0}
.policies-layout{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  height:calc(100% - 30px);
  min-height:0;
  overflow:hidden!important;
  background:#fff;
}
.policy-sidebar{
  min-height:0;
  padding:14px 12px;
  color:#173a78;
  overflow:auto;
  background:linear-gradient(180deg,#dceaff,#c6d9f4);
  border-left:1px solid #8ba3c1;
}
.help-logo{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin:0 auto 8px;
  color:#fff;
  font:bold 34px Georgia,serif;
  background:#326bc2;
  border:2px outset #9dbcf0;
  border-radius:50%;
}
.policy-sidebar h2{margin:0 0 4px;text-align:center;font-size:16px}
.policy-sidebar>p{margin:0 0 12px;color:#4e627d;text-align:center}
.policy-nav{display:grid;gap:1px}
.policy-nav button{
  min-height:31px;
  padding:5px 7px;
  color:#0b3f91;
  text-align:right;
  background:transparent;
  border:0;
  box-shadow:none;
}
.policy-nav button::before{content:"›";margin-left:6px;color:#3a6ab4}
.policy-nav button:hover,.policy-nav button:focus-visible{
  color:#0000ee;
  text-decoration:underline;
  outline:1px dotted #333;
}
.policy-nav button.active{
  color:#fff;
  font-weight:700;
  text-decoration:none;
  background:#316ac5;
  outline:0;
}
.policy-nav button.active::before{color:#fff}
.policy-content{
  min-width:0;
  overflow:auto;
  padding:18px 24px 28px;
  background:#fff;
}
.policy-pane{display:none;max-width:820px}
.policy-pane.active{display:block}
.policy-pane h2{
  margin:0 0 4px;
  color:#003399;
  font-size:24px;
  border-bottom:1px solid #999;
  padding-bottom:7px;
}
.policy-pane h3{
  margin:17px 0 5px;
  color:#003399;
  font-size:14px;
}
.policy-pane p{margin:5px 0;line-height:1.8}
.policy-updated{color:#666;font-size:11px}

.contact-header{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.contact-avatar,.about-logo,.start-user-icon{
  display:grid;
  place-items:center;
  color:#fff;
  background:#2864bd;
  border:2px outset #98b8ee;
}
.contact-avatar{width:50px;height:50px;font-size:25px}
.contact-header h2{margin:0 0 3px;font-size:17px}
.contact-header p{margin:0;color:#555}
.contact-list{display:grid;gap:5px}
.contact-list a,.contact-list button{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:8px;
  align-items:center;
  width:100%;
  padding:6px;
  color:#0000ee;
  text-align:right;
  background:#fff;
  border:1px solid #b2b2b2;
  box-shadow:none;
}
.contact-list a:hover,.contact-list button:hover{background:#e7f0ff}
.contact-list span{color:#333}
.contact-list strong{overflow-wrap:anywhere}
.small-note{color:#555;font-size:11px}

#serviceDetails h2{
  margin:2px 0 8px;
  color:#003399;
  font-size:18px;
  line-height:1.4;
}
#serviceDetails fieldset{margin:9px 0}
#serviceDetails p{line-height:1.6}

.about-box{text-align:center;background:#ece9d8}
.about-logo{width:64px;height:64px;margin:4px auto 9px;font-size:32px}
.about-box h2{margin:5px 0;font-size:17px}
.about-box hr{border:0;border-top:1px solid #aaa;border-bottom:1px solid #fff}

.start-menu{
  position:absolute;
  right:0;
  bottom:0;
  z-index:500;
  width:390px;
  color:#111;
  background:#fff;
  border:2px solid #2459ad;
  border-bottom:0;
  border-radius:7px 7px 0 0;
  box-shadow:4px -4px 12px #0b285b77;
}
.start-user{
  display:flex;
  align-items:center;
  gap:9px;
  padding:7px 10px;
  color:#fff;
  background:linear-gradient(180deg,#4a90e5,#245ab8);
  font-size:14px;
}
.start-user-icon{width:40px;height:40px;font-size:22px;border-radius:4px}
.start-columns{display:grid;grid-template-columns:1.15fr .85fr}
.start-primary{padding:7px;background:#fff}
.start-secondary{padding:7px;background:#dbe9f9;border-right:1px solid #acc0dc}
.start-primary button,.start-secondary button{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  min-height:40px;
  padding:5px 6px;
  text-align:right;
  background:transparent;
  border:0;
  box-shadow:none;
}
.start-primary button:hover,.start-secondary button:hover{color:#fff;background:#316ac5}
.start-primary b{
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 32px;
  width:32px;
  height:32px;
}
.start-ie{color:#1554b0!important;font:bold italic 30px Arial!important;background:transparent!important}
.start-folder{height:23px!important;margin:0!important}
.start-mail{color:#fff!important;background:#d67819!important}
.start-primary span{display:block}
.start-primary small{display:block;color:#69798c}
.start-primary button:hover small{color:#e6f0ff}
.start-footer{
  display:flex;
  justify-content:flex-start;
  gap:8px;
  padding:5px 8px;
  background:#245ab8;
}
.start-footer button{color:#fff;background:#e88a2c;border-color:#fff}

.xp-taskbar{
  position:fixed;
  right:0;
  bottom:0;
  left:0;
  z-index:1000;
  display:flex;
  align-items:center;
  gap:4px;
  height:32px;
  padding:2px 5px 2px 0;
  color:#fff;
  background:linear-gradient(180deg,#3d91eb 0%,#1760c7 45%,#1253b1 100%);
  border-top:1px solid #6ca9ec;
}
.start-button{
  display:flex;
  align-items:center;
  gap:5px;
  align-self:stretch;
  min-width:92px;
  padding:0 14px 0 9px;
  color:#fff;
  font-size:14px;
  font-style:italic;
  font-weight:900;
  background:linear-gradient(180deg,#66bf55,#2d9637 55%,#23752b);
  border:1px solid #1a611f;
  border-radius:0 14px 14px 0;
  box-shadow:inset 0 0 0 1px #8edb83;
}
.windows-mark{
  display:grid;
  place-items:center;
  width:21px;
  height:21px;
  color:#fff;
  font-style:normal;
  transform:rotate(-7deg);
}
.task-buttons{
  display:flex;
  gap:3px;
  min-width:0;
  flex:1;
  overflow:hidden;
}
.task-button{
  min-width:120px;
  max-width:190px;
  height:26px;
  overflow:hidden;
  color:#fff;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap;
  background:linear-gradient(#4f91dd,#2866bd);
  border:1px solid #0d3f94;
  box-shadow:inset 0 0 0 1px #6fa7e9;
}
.task-button.active{background:linear-gradient(#1f5aaa,#174a91)}
.tray{
  display:flex;
  align-items:center;
  gap:7px;
  height:27px;
  padding:0 8px;
  color:#fff;
  direction:ltr;
  background:#0d8bd3;
  border:1px solid #0871b3;
  box-shadow:inset 1px 1px #43bdf2;
}
.tray-icon{font-size:10px}
.tray time{min-width:42px}


.icon-payment{
  display:grid;
  place-items:center;
  width:38px;
  height:30px;
  margin-top:5px;
  color:#173d77;
  font:bold 11px Tahoma,sans-serif;
  background:linear-gradient(#f7f7f7,#cdd9e8);
  border:1px solid #66778b;
  box-shadow:inset 2px 2px #fff,2px 2px 0 #6f8298;
}
.icon-payment::before{content:"";position:absolute;left:5px;right:5px;top:6px;height:5px;background:#2f6cb8}
.payment-mini{background:#eef4fb;border:1px solid #54769f}
.payment-mini::after{content:"ر.س";position:absolute;inset:0;display:grid;place-items:center;font-size:7px;color:#173d77}
.payment-body{background:#ece9d8}
.payment-header{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:9px;
  padding:5px 2px 9px;
  border-bottom:1px solid #aaa;
}
.payment-header h2{margin:0 0 2px;font-size:18px}
.payment-header p{margin:0;color:#555}
.payment-shield{
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  color:#fff;
  font:bold 24px Arial,sans-serif;
  background:#3d8b3d;
  border:2px outset #a6d9a6;
  border-radius:2px;
}
.checkout-steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin:7px 0 10px;
  border:1px solid #9b9b9b;
  background:#fff;
}
.checkout-steps span{
  padding:6px 8px;
  text-align:center;
  border-left:1px solid #c8c8c8;
}
.checkout-steps span:last-child{border-left:0}
.checkout-steps .done{color:#296b28;background:#edf7e9}
.checkout-steps .active{color:#fff;font-weight:700;background:#316ac5}
.payment-methods{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.payment-method{
  display:grid;
  grid-template-columns:auto 38px minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-height:58px;
  padding:7px 9px;
  background:#fff;
  border:1px solid #9d9d9d;
}
.payment-method.active-method{border-color:#316ac5;box-shadow:inset 0 0 0 1px #9bb8e8}
.payment-method.disabled-method{color:#777;background:#f2f2f2}
.payment-method strong,.payment-method small{display:block}
.payment-method small{margin-top:3px;color:#337033}
.disabled-method small{color:#777}
.method-icon{
  display:grid;
  place-items:center;
  width:34px;
  height:30px;
  font-size:18px;
  background:#e8eef7;
  border:1px solid #788aa0;
}
.method-radio{
  width:13px;
  height:13px;
  border:1px solid #999;
  border-radius:50%;
  background:#eee;
}
.bank-details{margin-top:9px}
.bank-logo-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
  padding-bottom:8px;
  border-bottom:1px solid #c0c0c0;
}
.bank-logo{
  display:grid;
  place-items:center;
  width:52px;
  height:34px;
  color:#fff;
  font:bold 15px Arial,sans-serif;
  background:#155a4b;
  border:2px outset #77aa9e;
}
.bank-logo-row strong,.bank-logo-row small{display:block}
.bank-logo-row small{margin-top:2px;color:#666}
.bank-data{margin:0}
.bank-data>div{
  display:grid;
  grid-template-columns:125px minmax(0,1fr);
  min-height:32px;
  border-bottom:1px solid #d1d1d1;
}
.bank-data dt{padding:7px;background:#f2f2f2;font-weight:700}
.bank-data dd{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
  margin:0;
  padding:4px 7px;
  background:#fff;
}
.bank-data dd span{overflow-wrap:anywhere}
.bank-data button{flex:0 0 auto;min-width:50px}
.bank-note{
  margin:8px 0 1px;
  padding:6px 8px;
  background:#ffffe1;
  border:1px solid #c8c8a0;
}
.payment-order-summary{margin-top:9px}
.payment-proof-form fieldset{margin-top:9px}
.payment-proof-form input[type="file"]{
  width:100%;
  padding:4px;
  color:#111;
  background:#fff;
  border:1px solid #7f9db9;
}
.payment-proof-form small{color:#555}
.receipt-preview{
  display:flex;
  align-items:center;
  gap:8px;
  margin:7px 0;
  padding:7px;
  color:#174a28;
  background:#eef8ed;
  border:1px solid #91b58d;
}
.receipt-preview::before{content:"✓";font-weight:900}
.payment-confirm{
  display:flex;
  align-items:flex-start;
  gap:6px;
  margin-top:8px;
  padding:6px;
  background:#fff;
  border:1px solid #bbb;
}
.payment-confirm input{width:auto;margin-top:2px}
.payment-warning{
  margin-top:9px;
  padding:7px 9px;
  color:#5d531e;
  background:#fffde7;
  border:1px solid #c7b65e;
}
.payment-window input[aria-invalid="true"]{outline:1px solid #c51b1b}

@media(max-width:900px){
  .desktop-icons{right:6px;top:6px}
  .store-content{grid-template-columns:175px minmax(0,1fr)}
  .service-list-head,.service-card{
    grid-template-columns:minmax(220px,1fr) 90px 78px 90px 62px;
  }
  .policies-layout{grid-template-columns:190px minmax(0,1fr)}
}
@media(max-width:700px){
  body{overflow:hidden}
  .xp-desktop{bottom:32px}
  .desktop-icons{grid-template-columns:repeat(4,74px);width:auto;right:4px;left:4px}
  .desktop-icon{width:74px}
  .app-window{
    top:2px!important;
    right:2px!important;
    bottom:34px!important;
    left:2px!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    transform:none!important;
    min-width:0;
  }
  .app-window .title-bar-controls button{min-width:28px;min-height:28px}
  .browser-menu{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:0;
  }
  .browser-menu button{min-width:0;min-height:30px;padding:0 3px}
  .browser-toolbar{overflow-x:auto;min-height:43px}
  .browser-toolbar button{flex:0 0 68px;grid-template-columns:1fr;gap:0;height:36px}
  .browser-toolbar button span:last-child{font-size:10px}
  .toolbar-separator{display:none}
  .tb-icon{width:auto;height:18px;font-size:17px}
  .address-bar>span{display:none}
  .address-bar>button{min-width:56px}
  .store-content{grid-template-columns:1fr}
  .explorer-pane{display:none}
  .store-main{padding:8px}
  .old-web-header{display:block}
  .old-web-header h1{font-size:19px}
  .cart-shortcut{margin-top:7px}
  .service-list{
    overflow:visible;
    border-top:1px solid #9e9e9e;
  }
  .service-list-head{display:none}
  .service-card{
    min-width:0;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "title title"
      "duration revisions"
      "price action";
    gap:0;
    padding:0;
    background:#fff;
    border-bottom:1px solid #a9a9a9;
  }
  .service-card:nth-of-type(even){background:#f8fbff}
  .service-card .service-title{
    grid-area:title;
    min-height:58px;
    padding:7px 6px;
    border-bottom:1px dotted #b8b8b8;
  }
  .service-card>.service-meta{
    padding:6px;
    color:#444;
    background:transparent;
  }
  .service-card>.service-meta:nth-of-type(1){grid-area:duration}
  .service-card>.service-meta:nth-of-type(2){grid-area:revisions;text-align:left}
  .service-card>.service-meta:nth-of-type(1)::before{content:"المدة: ";font-weight:700}
  .service-card>.service-meta:nth-of-type(2)::before{content:"التعديلات: ";font-weight:700}
  .service-card>.money{
    grid-area:price;
    align-self:center;
    padding:7px 6px;
    font-size:13px;
  }
  .service-card>.add-service{
    grid-area:action;
    align-self:center;
    min-width:92px;
    margin:4px 6px;
  }
  .merchant-links{grid-template-columns:1fr}
  .field-grid{grid-template-columns:1fr}
  .payment-methods{grid-template-columns:1fr}
  .bank-data>div{grid-template-columns:1fr}
  .bank-data dt{border-bottom:1px solid #ddd}
  .checkout-steps span{padding:5px 3px;font-size:10px}
  .policies-layout{grid-template-columns:1fr;height:calc(100% - 30px)}
  .policy-sidebar{
    min-height:auto;
    max-height:180px;
    border-left:0;
    border-bottom:1px solid #8ba3c1;
  }
  .help-logo,.policy-sidebar>p{display:none}
  .policy-sidebar h2{text-align:right;margin-bottom:5px}
  .policy-nav{
    display:flex;
    gap:2px;
    overflow-x:auto;
  }
  .policy-nav button{
    flex:0 0 auto;
    min-height:34px;
    white-space:nowrap;
  }
  .policy-content{padding:12px 14px 22px}
  .policy-pane h2{font-size:20px}
  .dialog-actions button,.merchant-links button{min-height:34px}
  .start-menu{width:min(390px,100vw)}
  .tray span:not(.tray-icon){display:none}
  .task-button{min-width:88px}
}
/* Reliable local XP artwork: replaces text-glyph icons and generated wallpaper */
.xp-desktop{
  background:#5b9bd4 url("assets/desktop-background.jpg?v=3") center center/cover no-repeat!important;
}
.xp-desktop::before,.xp-desktop::after{display:none!important}

.desktop-icon-art,
.tb-icon,
.mini-icon,
.start-primary b,
.payment-shield,
.method-icon,
.contact-avatar,
.about-logo{
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
}

.desktop-icon-art{
  width:42px!important;
  height:42px!important;
  margin:0!important;
  border:0!important;
  box-shadow:none!important;
  background-color:transparent!important;
  color:transparent!important;
  font-size:0!important;
}
.desktop-icon-art::before,.desktop-icon-art::after{display:none!important}
.icon-ie{background-image:url("assets/icons/ie.svg?v=3")!important}
.icon-folder{background-image:url("assets/icons/folder.svg?v=3")!important}
.icon-document{background-image:url("assets/icons/document.svg?v=3")!important}
.icon-payment{background-image:url("assets/icons/payment.svg?v=3")!important}
.icon-mail{background-image:url("assets/icons/mail.svg?v=3")!important}

.tb-icon{
  width:27px!important;
  height:27px!important;
  min-width:27px;
  color:transparent!important;
  font-size:0!important;
  text-shadow:none!important;
  background-size:25px 25px!important;
}
.tb-icon.back{background-image:url("assets/icons/back.svg?v=3")!important}
.tb-icon.forward{background-image:url("assets/icons/forward.svg?v=3")!important}
.tb-icon.home{background-image:url("assets/icons/home.svg?v=3")!important}
.tb-icon.search{background-image:url("assets/icons/search.svg?v=3")!important}
.tb-icon.star{background-image:url("assets/icons/star.svg?v=3")!important}
.tb-icon.folder{background-image:url("assets/icons/cart.svg?v=3")!important}

.mini-icon{
  flex:0 0 18px!important;
  width:18px!important;
  height:18px!important;
  border:0!important;
  box-shadow:none!important;
  background-color:transparent!important;
  color:transparent!important;
  font-size:0!important;
}
.mini-icon::before,.mini-icon::after{display:none!important}
.service-mini,.doc-mini{background-image:url("assets/icons/document.svg?v=3")!important}
.folder-mini{background-image:url("assets/icons/folder.svg?v=3")!important}
.mail-mini{background-image:url("assets/icons/mail.svg?v=3")!important}
.payment-mini{background-image:url("assets/icons/payment.svg?v=3")!important}

.start-primary b{
  flex:0 0 34px!important;
  width:34px!important;
  height:34px!important;
  margin:0!important;
  border:0!important;
  box-shadow:none!important;
  background-color:transparent!important;
  color:transparent!important;
  font-size:0!important;
}
.start-primary b::before,.start-primary b::after{display:none!important}
.start-ie{background-image:url("assets/icons/ie.svg?v=3")!important}
.start-folder{background-image:url("assets/icons/folder.svg?v=3")!important}
.start-mail{background-image:url("assets/icons/mail.svg?v=3")!important}
.start-payment{background-image:url("assets/icons/payment.svg?v=3")!important}

.payment-shield{
  background:#fff url("assets/icons/shield.svg?v=3") center/38px 38px no-repeat!important;
  color:transparent!important;
  font-size:0!important;
}
.bank-method-icon{
  background:#fff url("assets/icons/bank.svg?v=3") center/28px 28px no-repeat!important;
  color:transparent!important;
  font-size:0!important;
}
.card-method-icon{
  background:#f2f2f2 url("assets/icons/card.svg?v=3") center/28px 28px no-repeat!important;
  color:transparent!important;
  font-size:0!important;
}
.contact-avatar{
  background:#eaf2fb url("assets/icons/mail.svg?v=3") center/36px 36px no-repeat!important;
  color:transparent!important;
  font-size:0!important;
}
.about-logo{
  background:#eaf2fb url("assets/icons/ie.svg?v=3") center/48px 48px no-repeat!important;
  color:transparent!important;
  font-size:0!important;
}

@media(max-width:700px){
  .tb-icon{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    background-size:22px 22px!important;
    margin:auto;
  }
  .desktop-icon-art{width:38px!important;height:38px!important}
}

/* Explicit XP window-control icons: xp.css English aria selectors do not match Arabic labels */
.title-bar-controls button[data-action]{
  position:relative!important;
  overflow:hidden!important;
  border:1px solid #fff!important;
  box-shadow:inset 0 0 0 1px #174b9b!important;
  background:linear-gradient(180deg,#86b6f3 0%,#3976d2 45%,#1e56b6 100%)!important;
}
.title-bar-controls button[data-action="close"]{
  box-shadow:inset 0 0 0 1px #9d311d!important;
  background:linear-gradient(180deg,#f5a076 0%,#e15d35 45%,#bf361d 100%)!important;
}
.title-bar-controls button[data-action]:hover{
  filter:brightness(1.1);
}
.title-bar-controls button[data-action]::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:2px!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:14px 14px!important;
}
.title-bar-controls button[data-action="minimize"]::after{background-image:url("assets/icons/minimize.svg?v=3")!important}
.title-bar-controls button[data-action="maximize"]::after{background-image:url("assets/icons/maximize.svg?v=3")!important}
.title-bar-controls button[data-action="close"]::after{background-image:url("assets/icons/close.svg?v=3")!important}

.windows-mark{
  width:22px!important;
  height:22px!important;
  font-size:0!important;
  background:url("assets/icons/windows.svg?v=3") center/20px 20px no-repeat!important;
  transform:none!important;
}
.tray-icon{
  display:inline-block;
  width:17px;
  height:17px;
  font-size:0!important;
  background:url("assets/icons/network.svg?v=3") center/16px 16px no-repeat!important;
}
.start-user-icon{
  width:40px!important;
  height:40px!important;
  color:transparent!important;
  font-size:0!important;
  background:#3f79c5 url("assets/icons/user.svg?v=3") center/36px 36px no-repeat!important;
}

/* === RTL Windows XP visual corrections === */
.xp-taskbar{
  direction:rtl;
  gap:2px!important;
  height:32px!important;
  padding:1px 0 1px 0!important;
  background:
    linear-gradient(180deg,#3887e8 0%,#245edb 9%,#245edb 88%,#1941a5 100%)!important;
  border-top:1px solid #5da5f4!important;
  box-shadow:inset 0 1px 0 #7bb8f6!important;
}

.start-button{
  align-self:center!important;
  justify-content:flex-start!important;
  min-width:88px!important;
  height:30px!important;
  padding:0 8px 0 10px!important;
  gap:4px!important;
  font:700 13px Tahoma,"Microsoft Sans Serif",Arial,sans-serif!important;
  font-style:normal!important;
  text-shadow:1px 1px 1px #1f5f20!important;
  color:#fff!important;
  background:
    linear-gradient(180deg,#75d66f 0%,#3bb33f 12%,#24922f 63%,#1f7d28 100%)!important;
  border:1px solid #16651c!important;
  border-right:0!important;
  border-radius:15px 0 0 15px!important;
  box-shadow:
    inset 0 1px 0 #a8efa4,
    inset 0 -1px 0 #145d1b!important;
}

.start-button:hover,
.start-button:focus-visible{
  background:
    linear-gradient(180deg,#83e27d 0%,#45c14a 12%,#2aa43a 63%,#238632 100%)!important;
  outline:0!important;
}

.start-button:active{
  background:
    linear-gradient(180deg,#22852d 0%,#2f9d35 58%,#55bd54 100%)!important;
}

.windows-mark{
  flex:0 0 20px!important;
  width:20px!important;
  height:20px!important;
  margin:0!important;
  background-size:19px 19px!important;
}

.task-buttons{
  direction:rtl;
  display:flex!important;
  align-items:center!important;
  gap:2px!important;
  min-width:0!important;
  flex:1!important;
  height:30px!important;
  padding:2px 0!important;
}

.xp-taskbar .task-button{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:5px!important;
  min-width:118px!important;
  max-width:185px!important;
  height:26px!important;
  padding:0 7px!important;
  margin:0!important;
  overflow:hidden!important;
  color:#fff!important;
  font:400 11px Tahoma,"Microsoft Sans Serif",Arial,sans-serif!important;
  line-height:24px!important;
  text-align:right!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  background:linear-gradient(180deg,#5ca4ef 0%,#367fd4 45%,#2b6fc6 100%)!important;
  border:1px solid #174b9b!important;
  border-radius:2px!important;
  box-shadow:inset 0 1px 0 #83b8ef!important;
}

.xp-taskbar .task-button:hover{
  background:linear-gradient(180deg,#70b5f7 0%,#438ddd 45%,#327bd0 100%)!important;
}

.xp-taskbar .task-button.active,
.xp-taskbar button.task-button.active{
  color:#fff!important;
  background:linear-gradient(180deg,#2b67bb 0%,#1f55a7 48%,#19498f 100%)!important;
  border-color:#123f83!important;
  box-shadow:
    inset 1px 1px 0 #173d78,
    inset -1px -1px 0 #4f87d3!important;
}

.xp-taskbar .task-button::before{
  content:"";
  flex:0 0 16px;
  width:16px;
  height:16px;
  background-position:center;
  background-repeat:no-repeat;
  background-size:16px 16px;
}
.xp-taskbar .task-button[data-window-id="storeWindow"]::before,
.xp-taskbar .task-button[data-window-id="aboutWindow"]::before{
  background-image:url("assets/icons/ie.svg?v=3");
}
.xp-taskbar .task-button[data-window-id="cartWindow"]::before{
  background-image:url("assets/icons/cart.svg?v=3");
}
.xp-taskbar .task-button[data-window-id="orderWindow"]::before,
.xp-taskbar .task-button[data-window-id="contactWindow"]::before{
  background-image:url("assets/icons/mail.svg?v=3");
}
.xp-taskbar .task-button[data-window-id="paymentWindow"]::before{
  background-image:url("assets/icons/payment.svg?v=3");
}
.xp-taskbar .task-button[data-window-id="policiesWindow"]::before,
.xp-taskbar .task-button[data-window-id="serviceWindow"]::before{
  background-image:url("assets/icons/document.svg?v=3");
}

.tray{
  direction:ltr!important;
  flex:0 0 auto!important;
  justify-content:center!important;
  gap:5px!important;
  height:30px!important;
  min-width:72px!important;
  padding:0 7px!important;
  margin:0!important;
  color:#fff!important;
  background:linear-gradient(180deg,#27a5eb 0%,#168bd5 55%,#0b75bf 100%)!important;
  border:0!important;
  border-right:1px solid #0b5f9d!important;
  border-radius:0!important;
  box-shadow:
    inset 1px 0 0 #58c2f7,
    inset 0 1px 0 #58c2f7!important;
}
.tray time{
  min-width:42px!important;
  font:400 11px Tahoma,"Microsoft Sans Serif",Arial,sans-serif!important;
}
.tray-icon{
  flex:0 0 16px!important;
  width:16px!important;
  height:16px!important;
}

/* Mirror IE navigation semantics for Arabic RTL. */
.browser-toolbar{
  direction:rtl!important;
  gap:1px!important;
  min-height:44px!important;
  padding:2px 4px!important;
  background:#ece9d8!important;
}
.browser-toolbar button{
  grid-template-columns:25px auto!important;
  min-width:68px!important;
  height:36px!important;
  padding:1px 4px!important;
  gap:3px!important;
  border-radius:0!important;
}
.browser-toolbar button:hover,
.browser-toolbar button:focus-visible{
  background:#f6f3e8!important;
  border-color:#aca899!important;
}
.tb-icon{
  width:25px!important;
  height:25px!important;
  min-width:25px!important;
  background-size:24px 24px!important;
}
.tb-icon.back{
  background-image:url("assets/icons/forward.svg?v=3")!important;
}
.tb-icon.forward{
  background-image:url("assets/icons/back.svg?v=3")!important;
}
.toolbar-separator{
  height:32px!important;
  margin:0 2px!important;
}
.address-bar{
  direction:rtl!important;
  gap:4px!important;
  min-height:27px!important;
  padding:2px 4px!important;
}
.address-box{
  direction:ltr!important;
  height:22px!important;
  padding:1px 4px!important;
}
.address-bar>button{
  min-width:58px!important;
  height:22px!important;
  padding:0 5px!important;
}
.go-arrow{
  display:inline-block!important;
  transform:scaleX(-1)!important;
}

/* Keep taskbar geometry coherent on mobile without oversized controls. */
@media(max-width:700px){
  .xp-taskbar{
    height:32px!important;
  }
  .start-button{
    min-width:78px!important;
    height:30px!important;
    padding:0 6px 0 8px!important;
    font-size:12px!important;
  }
  .windows-mark{
    width:18px!important;
    height:18px!important;
    flex-basis:18px!important;
    background-size:17px 17px!important;
  }
  .xp-taskbar .task-button{
    min-width:78px!important;
    max-width:120px!important;
    height:26px!important;
    padding:0 5px!important;
    font-size:10px!important;
  }
  .tray{
    min-width:58px!important;
    padding:0 5px!important;
  }
  .browser-toolbar{
    min-height:42px!important;
    padding:2px!important;
  }
  .browser-toolbar button{
    flex:0 0 58px!important;
    min-width:58px!important;
    height:36px!important;
    padding:1px 2px!important;
  }
}

/* Pixel-fit correction: avoid half-pixel vertical blur in the XP taskbar. */
.xp-taskbar{padding:0 0 1px 0!important}
.start-button{
  justify-content:center!important;
}
