/* CYMART V16.63 — config-faithful service modal. No invented Server/Remote fields. */
#cymart-native-service-buffer{display:none!important;visibility:hidden!important;position:absolute!important;left:-99999px!important;top:-99999px!important;width:1px!important;height:1px!important;overflow:hidden!important;}
#modal-order #serviceDetails2[data-cymart-service-preview="1"]{opacity:1!important;visibility:visible!important;min-height:180px;}
#modal-order .cymart-service-preview{margin:0!important;gap:0;}
#modal-order .cymart-service-preview .card-place-retail-order{height:100%;padding:18px;border-radius:12px;}
#modal-order .cymart-service-preview .placeorder-field,#modal-order .cymart-service-preview .placeorder-details{padding:8px;}
#modal-order .cymart-service-preview .cymart-preview-field{margin-bottom:14px;}
#modal-order .cymart-service-preview .cymart-preview-field label{display:block;font-weight:600;margin-bottom:7px;}
#modal-order .cymart-service-preview .cymart-preview-value{width:100%;min-height:46px;}
#modal-order .cymart-service-preview textarea.cymart-preview-value{min-height:110px;resize:vertical;}
#modal-order .cymart-service-preview .cymart-preview-order{min-height:48px;opacity:1!important;cursor:pointer!important;filter:none!important;}
#modal-order .cymart-service-preview .cymart-preview-price{font-size:20px;font-weight:700;padding:2px 0 12px;border-bottom:2px solid rgba(63,113,255,.6);}
#modal-order .cymart-service-preview .cymart-preview-time{padding-top:10px;}
#modal-order .cymart-service-preview .cymart-preview-info{margin-top:16px;line-height:1.55;overflow-wrap:anywhere;}
#modal-order .cymart-service-preview .cymart-preview-info img{max-width:100%;height:auto;}
#modal-order .cymart-v16-60-restored{margin-bottom:14px;}
@media (max-width:767.98px){
  #modal-order .cymart-service-preview .placeorder-field,#modal-order .cymart-service-preview .placeorder-details{flex:0 0 100%;max-width:100%;padding:6px 0;}
  #modal-order .cymart-service-preview .card-place-retail-order{padding:14px;}
}

#modal-order .cymart-preview-imei-row{display:flex;align-items:center;gap:8px;}
#modal-order .cymart-preview-imei-row .cymart-preview-value{min-width:0;flex:1 1 auto;}
#modal-order .cymart-preview-imei-row input[readonly]{flex:0 0 50px;width:50px!important;max-width:50px!important;}

/* V16.62: the provisional action must never look disabled/spinning. */
#modal-order .cymart-preview-order,
#modal-order .cymart-preview-order:hover,
#modal-order .cymart-preview-order:focus,
#modal-order .cymart-preview-order:active{
  opacity:1!important;
  cursor:pointer!important;
  filter:none!important;
  pointer-events:auto!important;
}
#modal-order .cymart-preview-order::before,
#modal-order .cymart-preview-order::after{animation:none!important;}

/* The IMEI check digit is read-only, but visually part of the same active field. */
#modal-order .cymart-preview-imei-row input[readonly],
#modal-order .input-imei input[name="imei2"],
#modal-order .input-imei #imei2{
  opacity:1!important;
  cursor:default!important;
}

/* Never display the synthetic legacy capacity sentence ("You can order max..."). */
#modal-order #maxo:empty{display:none!important;}


/* ======================================================================
   V16.62 — IMEI pair stays on ONE LINE on phones and desktop.
   Older V16.16/V16.17 mobile rules forced every form-control to 100% and
   allowed .d-flex rows to wrap. We normalize the real IMEI row in JS and
   override those rules here with a later, higher-specificity stylesheet.
   ====================================================================== */
html body #modal-order .cymart-imei-inline-row {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  width:100% !important;
  max-width:100% !important;
  gap:8px !important;
}

html body #modal-order .cymart-imei-inline-row > input#imei1,
html body #modal-order .cymart-imei-inline-row > input[name="imei1"],
html body #modal-order .cymart-imei-inline-row > input[data-cymart-target-name="imei1"] {
  display:block !important;
  flex:1 1 0 !important;
  width:0 !important;
  min-width:0 !important;
  max-width:none !important;
  margin:0 !important;
}

html body #modal-order .cymart-imei-inline-row > input#imei2,
html body #modal-order .cymart-imei-inline-row > input[name="imei2"],
html body #modal-order .cymart-imei-inline-row > input[data-cymart-target-name="imei2"] {
  display:block !important;
  flex:0 0 50px !important;
  width:50px !important;
  min-width:50px !important;
  max-width:50px !important;
  margin:0 !important;
  text-align:center !important;
}

/* If a rare bulk-IMEI service also has the ADD button, keep the two IMEI
   inputs together on row 1 and put ADD on row 2 instead of crushing them. */
html body #modal-order .cymart-imei-inline-row.cymart-imei-has-add {
  flex-wrap:wrap !important;
}
html body #modal-order .cymart-imei-inline-row.cymart-imei-has-add > #IMEI_ADD,
html body #modal-order .cymart-imei-inline-row.cymart-imei-has-add > [name="IMEI_ADD"] {
  flex:0 0 100% !important;
  width:100% !important;
  max-width:100% !important;
  margin:6px 0 0 !important;
}

@media (max-width: 767.98px) {
  html body #modal-order .cymart-imei-inline-row {
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    gap:7px !important;
  }
  html body #modal-order .cymart-imei-inline-row.cymart-imei-has-add {
    flex-wrap:wrap !important;
  }
  html body #modal-order .cymart-imei-inline-row > input#imei1,
  html body #modal-order .cymart-imei-inline-row > input[name="imei1"],
  html body #modal-order .cymart-imei-inline-row > input[data-cymart-target-name="imei1"] {
    flex:1 1 0 !important;
    width:0 !important;
    min-width:0 !important;
    max-width:none !important;
  }
  html body #modal-order .cymart-imei-inline-row > input#imei2,
  html body #modal-order .cymart-imei-inline-row > input[name="imei2"],
  html body #modal-order .cymart-imei-inline-row > input[data-cymart-target-name="imei2"] {
    flex:0 0 48px !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
  }
}

@media (max-width: 360px) {
  html body #modal-order .cymart-imei-inline-row { gap:6px !important; }
  html body #modal-order .cymart-imei-inline-row > input#imei2,
  html body #modal-order .cymart-imei-inline-row > input[name="imei2"],
  html body #modal-order .cymart-imei-inline-row > input[data-cymart-target-name="imei2"] {
    flex-basis:44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
  }
}

/* V16.63: while a real native order is being prepared/submitted, keep the
   visible preview action visually active instead of inheriting disabled/spinner
   opacity from legacy button rules. */
#modal-order .cymart-preview-order[aria-busy="true"]{
  opacity:1!important;
  filter:none!important;
  cursor:wait!important;
  pointer-events:auto!important;
}

/* ======================================================================
   V16.64 — required-field validation + successful order confirmation.
   ====================================================================== */
#modal-order .cymart-required-star{color:#dc3545;font-weight:800;margin-left:3px;}
#modal-order .cymart-field-invalid{border-color:#dc3545!important;box-shadow:0 0 0 3px rgba(220,53,69,.12)!important;}
#modal-order .cymart-validation-message{margin-top:7px;padding:8px 10px;border-radius:8px;background:rgba(220,53,69,.10);color:#a51f2d;font-size:.88rem;font-weight:600;line-height:1.35;}
html[data-theme='dark'] #modal-order .cymart-validation-message{background:rgba(255,92,110,.13);color:#ff9caa;}

#modal-order #custom-alert.cymart-order-success-overlay{
  position:fixed!important;inset:0!important;display:none;align-items:center;justify-content:center;
  padding:24px!important;background:rgba(238,244,255,.82)!important;
  -webkit-backdrop-filter:blur(18px) saturate(135%);backdrop-filter:blur(18px) saturate(135%);
  overflow:auto;isolation:isolate;z-index:999999!important;
}
body.cymart-theme-dark #modal-order #custom-alert.cymart-order-success-overlay,
html[data-theme='dark'] #modal-order #custom-alert.cymart-order-success-overlay{
  background:rgba(4,10,29,.82)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
}
#modal-order #custom-alert.cymart-order-success-overlay[style*="display: block"],
#modal-order #custom-alert.cymart-order-success-overlay[style*="display:block"]{display:flex!important;}


#modal-order .cymart-order-success-card{
  position:relative;overflow:hidden;text-align:center;
  width:min(680px,100%);margin:auto;padding:40px 38px 34px;border-radius:30px;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,251,255,.90));
  color:#0d1f4f;border:1px solid rgba(255,255,255,.82);
  box-shadow:0 30px 90px rgba(83,104,177,.20),0 0 0 1px rgba(129,155,255,.10) inset,0 10px 35px rgba(94,92,230,.12);
  -webkit-backdrop-filter:blur(18px) saturate(135%);backdrop-filter:blur(18px) saturate(135%);
}
body.cymart-theme-dark #modal-order .cymart-order-success-card,
html[data-theme='dark'] #modal-order .cymart-order-success-card{
  background:linear-gradient(180deg,rgba(16,23,58,.88),rgba(12,18,47,.92));
  color:#f4f7ff;border:1px solid rgba(104,141,255,.38);
  box-shadow:0 38px 110px rgba(0,0,0,.42),0 0 0 1px rgba(117,149,255,.10) inset,0 0 36px rgba(111,78,255,.28);
}
#modal-order .cymart-order-success-orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(.2px);opacity:.95;}
#modal-order .cymart-order-success-orb-a{width:170px;height:170px;left:-54px;top:42px;background:radial-gradient(circle,rgba(186,216,255,.38) 0%,rgba(186,216,255,.18) 55%,rgba(186,216,255,0) 74%);}
#modal-order .cymart-order-success-orb-b{width:210px;height:210px;right:-90px;bottom:-78px;background:radial-gradient(circle,rgba(224,182,255,.28) 0%,rgba(224,182,255,.15) 55%,rgba(224,182,255,0) 74%);}
body.cymart-theme-dark #modal-order .cymart-order-success-orb-a,
html[data-theme='dark'] #modal-order .cymart-order-success-orb-a{background:radial-gradient(circle,rgba(60,117,255,.20) 0%,rgba(60,117,255,.10) 55%,rgba(60,117,255,0) 76%);}
body.cymart-theme-dark #modal-order .cymart-order-success-orb-b,
html[data-theme='dark'] #modal-order .cymart-order-success-orb-b{background:radial-gradient(circle,rgba(148,98,255,.26) 0%,rgba(148,98,255,.13) 55%,rgba(148,98,255,0) 76%);}
#modal-order .cymart-order-success-confetti{position:absolute;inset:0;pointer-events:none;z-index:1;}
#modal-order .cymart-order-confetti{position:absolute;display:block;border-radius:4px;opacity:.95;box-shadow:0 4px 10px rgba(47,79,193,.12);}
#modal-order .cymart-order-confetti-1{width:14px;height:14px;left:33%;top:68px;background:#27c2d9;transform:rotate(45deg);}
#modal-order .cymart-order-confetti-2{width:13px;height:13px;left:39%;top:102px;background:#5aa5ff;transform:rotate(45deg);}
#modal-order .cymart-order-confetti-3{width:16px;height:9px;right:32%;top:72px;background:#aa49ff;transform:rotate(-45deg);border-radius:3px;}
#modal-order .cymart-order-confetti-4{width:12px;height:12px;right:35%;top:110px;background:#5aa5ff;transform:rotate(45deg);}
#modal-order .cymart-order-confetti-5{width:12px;height:12px;right:28%;top:100px;background:#31cf71;transform:rotate(45deg);}
#modal-order .cymart-order-confetti-6{width:10px;height:10px;left:41%;top:74px;background:#7c63ff;transform:rotate(45deg);}

#modal-order .cymart-order-success-icon{
  position:relative;z-index:2;width:130px;height:130px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;
}
#modal-order .cymart-order-success-icon-ring{
  position:absolute;inset:8px;border-radius:50%;border:8px solid rgba(112,231,161,.40);
  box-shadow:0 0 0 15px rgba(79,221,138,.10),0 12px 36px rgba(28,201,104,.16);
}
#modal-order .cymart-order-success-icon-core{
  position:relative;z-index:1;width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 38%,#f8fff9 0%,#ebfff1 58%,#dcffea 100%);
  box-shadow:0 10px 24px rgba(26,190,99,.16);
}
#modal-order .cymart-order-success-icon-svg{width:44px;height:44px;display:block;overflow:visible;}
#modal-order .cymart-order-success-icon-svg path{
  fill:none;stroke:#13b857;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;
}
body.cymart-theme-dark #modal-order .cymart-order-success-icon-ring,
html[data-theme='dark'] #modal-order .cymart-order-success-icon-ring{
  border-color:rgba(112,231,161,.34);box-shadow:0 0 0 15px rgba(79,221,138,.09),0 0 32px rgba(34,214,101,.20);
}
body.cymart-theme-dark #modal-order .cymart-order-success-icon-core,
html[data-theme='dark'] #modal-order .cymart-order-success-icon-core{
  background:radial-gradient(circle at 50% 38%,#f7fff8 0%,#ecfff4 58%,#deffec 100%);
  box-shadow:0 12px 28px rgba(18,205,96,.18),0 10px 32px rgba(2,8,26,.28);
}
#modal-order .cymart-order-success-title{
  position:relative;z-index:2;margin:4px 0 16px;font-size:clamp(1.8rem,2.7vw,2.35rem);
  line-height:1.12;font-weight:800;letter-spacing:-.03em;color:#102659;
}
body.cymart-theme-dark #modal-order .cymart-order-success-title,
html[data-theme='dark'] #modal-order .cymart-order-success-title{color:#ffffff;}

#modal-order .cymart-order-success-message{
  position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:12px;
  margin:0 auto 18px!important;padding:17px 18px!important;border-radius:16px;border:1px solid rgba(81,218,139,.22);
  background:linear-gradient(180deg,rgba(234,249,239,.96),rgba(221,247,229,.92));color:#128745;
  font-size:1.05rem;font-weight:700;line-height:1.35;box-shadow:none;
}
#modal-order .cymart-order-success-message:empty{display:none!important;}
#modal-order .cymart-order-success-message:before{
  content:'✓';flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#2ed96b,#12b357);color:#fff;font-weight:900;font-size:18px;box-shadow:0 7px 18px rgba(19,179,87,.25);
}
body.cymart-theme-dark #modal-order .cymart-order-success-message,
html[data-theme='dark'] #modal-order .cymart-order-success-message{
  background:linear-gradient(180deg,rgba(25,73,64,.72),rgba(18,61,53,.68));border-color:rgba(52,203,132,.18);color:#f4fff8;
}

#modal-order .cymart-order-status{
  position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  margin:4px auto 24px;padding:14px 20px 14px 18px;border-radius:999px;
  background:linear-gradient(180deg,#fbf0cb,#f8eab5);color:#91620c;max-width:100%;
  box-shadow:0 10px 28px rgba(215,180,78,.16);
}
#modal-order .cymart-order-status:before{
  content:'◔';display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;
  font-size:15px;font-weight:900;color:#b8810f;background:rgba(255,255,255,.35);
}
#modal-order .cymart-order-status span{font-weight:500;}
#modal-order .cymart-order-status strong{font-weight:800;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.36);}
body.cymart-theme-dark #modal-order .cymart-order-status,
html[data-theme='dark'] #modal-order .cymart-order-status{
  background:linear-gradient(180deg,rgba(109,77,17,.90),rgba(87,61,13,.88));color:#ffd86c;box-shadow:0 10px 30px rgba(0,0,0,.22);
}
body.cymart-theme-dark #modal-order .cymart-order-status strong,
html[data-theme='dark'] #modal-order .cymart-order-status strong{background:rgba(255,214,96,.10);}

#modal-order #replyjson{position:relative;z-index:2;}
#modal-order .cymart-order-success-actions{position:relative;z-index:2;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:4px;}
#modal-order .cymart-order-success-actions .btn{
  position:relative;min-height:56px;display:inline-flex;align-items:center;justify-content:center;
  padding:15px 24px;border-radius:16px;font-weight:800;font-size:1rem;border:1px solid transparent;
  transition:transform .18s ease,box-shadow .22s ease,filter .22s ease,border-color .22s ease,background .22s ease;color .22s ease;
  overflow:hidden;text-decoration:none!important;
}
#modal-order .cymart-order-success-actions .btn:before{
  content:'';position:absolute;inset:0 auto 0 -120%;width:55%;background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.36) 50%,rgba(255,255,255,0) 100%);
  transition:transform .42s ease;pointer-events:none;
}
#modal-order .cymart-order-success-actions .btn:hover{transform:translateY(-2px) scale(1.01);filter:saturate(1.06);}
#modal-order .cymart-order-success-actions .btn:hover:before{transform:translateX(255%);}
#modal-order .cymart-order-success-actions .btn:active{transform:translateY(0) scale(.985);}
#modal-order .cymart-stay-here{
  min-width:210px;border-color:rgba(70,96,185,.18);background:linear-gradient(180deg,#0d225a,#04163b);color:#fff;
  box-shadow:0 15px 35px rgba(18,36,93,.24);
}
#modal-order .cymart-stay-here:hover{box-shadow:0 18px 38px rgba(18,36,93,.28);}
body:not(.cymart-theme-dark) #modal-order .cymart-stay-here,
html:not([data-theme='dark']) #modal-order .cymart-stay-here{color:#fff;}
body.cymart-theme-dark #modal-order .cymart-stay-here,
html[data-theme='dark'] #modal-order .cymart-stay-here{
  background:linear-gradient(180deg,rgba(8,18,44,.90),rgba(5,13,32,.94));border-color:rgba(85,124,255,.22);box-shadow:0 18px 42px rgba(0,0,0,.26);
}
#modal-order .cymart-history-button{
  min-width:320px;padding-right:54px;background:linear-gradient(135deg,#2f89ff,#6a42ff);border:0!important;color:#fff!important;
  box-shadow:0 18px 42px rgba(86,93,255,.28);
}
#modal-order .cymart-history-button:after{
  content:'→';position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:1.45rem;font-weight:900;line-height:1;transition:transform .18s ease;
}
#modal-order .cymart-history-button:hover:after{transform:translate(4px,-50%);}
body.cymart-theme-dark #modal-order .cymart-history-button,
html[data-theme='dark'] #modal-order .cymart-history-button{box-shadow:0 18px 44px rgba(88,66,255,.34);}

@media (max-width:575.98px){
  #modal-order #custom-alert.cymart-order-success-overlay{padding:18px!important;}
  #modal-order .cymart-order-success-card{padding:28px 18px 22px;border-radius:24px;}
  #modal-order .cymart-order-success-icon{width:104px;height:104px;margin-bottom:18px;}
  #modal-order .cymart-order-success-icon .sa-tip{left:24px;top:58px;width:24px;}
  #modal-order .cymart-order-success-icon .sa-long{right:19px;top:51px;width:48px;}
  #modal-order .cymart-order-success-title{font-size:1.72rem;}
  #modal-order .cymart-order-success-message{padding:14px 14px!important;font-size:.98rem;}
  #modal-order .cymart-order-status{padding:12px 16px;font-size:.96rem;}
  #modal-order .cymart-order-success-actions{flex-direction:column;gap:12px;}
  #modal-order .cymart-order-success-actions .btn{width:100%;min-width:0;}
  #modal-order .cymart-history-button{padding-right:52px;}
}


/* CYMART V16.67: short native-load state. No fake fields are ever rendered. */
#modal-order #serviceDetails2 .cymart-v1667-loading{
  min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  width:100%;color:var(--heading,#17234f);text-align:center;padding:28px 18px;
}
#modal-order #serviceDetails2 .cymart-v1667-spinner{
  width:34px;height:34px;border-radius:50%;border:3px solid rgba(91,104,255,.20);border-top-color:#7064ff;
  animation:cymart-v1667-spin .65s linear infinite;
}
@keyframes cymart-v1667-spin{to{transform:rotate(360deg)}}
html[data-theme='dark'] #modal-order #serviceDetails2 .cymart-v1667-loading,
body.cymart-theme-dark #modal-order #serviceDetails2 .cymart-v1667-loading{color:#fff}

/* CYMART V16.70 — validación visible de campos antes de enviar la orden */
#modal-order .cymart-order-field-error{
  border-color:#e5484d !important;
  box-shadow:0 0 0 2px rgba(229,72,77,.14) !important;
}
#modal-order .alert.alert-danger{
  display:block;
  margin:0 0 12px;
}

/* CYMART V16.71 — native-order validation feedback */
#modal-order .cymart-order-validation{
  display:none;
  margin:0 0 12px!important;
  padding:10px 12px;
  border:1px solid rgba(229,72,77,.32);
  border-radius:9px;
  background:rgba(229,72,77,.08);
  color:#9d2630;
  font-weight:600;
}
html[data-theme='dark'] #modal-order .cymart-order-validation,
body.cymart-theme-dark #modal-order .cymart-order-validation{
  color:#ffb7bd;
  background:rgba(229,72,77,.13);
}

/* CYMART V16.86 — regression fix: never expose the legacy inline spinner panel.
   AJAX/service loading continues normally; only this obsolete visual layer stays hidden. */
#modal-order #loader2{display:none!important;pointer-events:none!important;visibility:hidden!important;}
#modal-order #loader2 .ajax-responsive.loading{display:none!important;}