/* ======================================================================
   CYMART VISUAL V16 — DARK SUNSET + LIGHT AIR
   Solo capa visual. No cambia textos, formularios, AJAX ni lógica.
   Se carga al final del <head> para respetar el funcionamiento existente.
   ====================================================================== */

:root{
  --cymart-radius:16px;
  --cymart-radius-lg:22px;
  --cymart-transition:.22s ease;
}

html{min-height:100%;}
body{
  min-height:100vh;
  position:relative;
  isolation:isolate;
  background:transparent !important;
}

body::before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-4 !important;
  pointer-events:none !important;
  opacity:1 !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:cover !important;
  mix-blend-mode:normal !important;
}

body::after{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-3 !important;
  pointer-events:none !important;
  background-size:auto !important;
  mix-blend-mode:normal !important;
}

/* ---------------- DARK MODE ---------------- */
body.cymart-theme-dark{
  color:#f5f7ff !important;
  background:transparent !important;
}
body.cymart-theme-dark::before{
  background-image:url('../images/cymart-visual/dark-desktop.png') !important;
}
body.cymart-theme-dark::after{
  background:
    linear-gradient(180deg,rgba(2,5,18,.26),rgba(2,5,18,.54)),
    radial-gradient(circle at 50% 25%,rgba(135,54,255,.08),transparent 45%) !important;
}

/* ---------------- LIGHT MODE ---------------- */
body.cymart-theme-light{
  color:#0d1b4c !important;
  background:transparent !important;
}
body.cymart-theme-light::before{
  background-image:url('../images/cymart-visual/light-desktop.png') !important;
}
body.cymart-theme-light::after{
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(242,248,255,.22)),
    radial-gradient(circle at 50% 30%,rgba(255,255,255,.12),transparent 52%) !important;
}

/* Main page surfaces stay transparent so the selected background is visible. */
body.cymart-theme-dark .bg-gray,
body.cymart-theme-dark .content,
body.cymart-theme-dark .main-content,
body.cymart-theme-dark .min-height,
body.cymart-theme-dark .page-content,
body.cymart-theme-light .bg-gray,
body.cymart-theme-light .content,
body.cymart-theme-light .main-content,
body.cymart-theme-light .min-height,
body.cymart-theme-light .page-content{
  background:transparent !important;
}

/* ======================================================================
   HEADER / NAVIGATION — same layout, new finish only
   ====================================================================== */
body.cymart-theme-dark header{
  background:rgba(3,7,22,.70) !important;
  backdrop-filter:blur(13px) saturate(120%);
  -webkit-backdrop-filter:blur(13px) saturate(120%);
}
body.cymart-theme-dark .header-top{
  background:linear-gradient(90deg,rgba(23,73,226,.93),rgba(104,35,208,.94),rgba(212,47,181,.91)) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 8px 22px rgba(7,4,35,.24) !important;
}
body.cymart-theme-dark .header-middle{
  background:linear-gradient(120deg,rgba(3,11,32,.87),rgba(18,10,47,.80)) !important;
  border:1px solid rgba(225,98,255,.70) !important;
  border-radius:13px !important;
  box-shadow:0 0 0 1px rgba(66,164,255,.13),0 10px 30px rgba(0,0,0,.28),0 0 25px rgba(181,62,255,.14) !important;
  backdrop-filter:blur(16px) saturate(120%);
  -webkit-backdrop-filter:blur(16px) saturate(120%);
}
body.cymart-theme-dark .header-middle::after{
  background:linear-gradient(90deg,transparent,#56cfff,#dc63ff,#ff9c83,transparent) !important;
  box-shadow:0 0 12px rgba(185,87,255,.50) !important;
}
body.cymart-theme-dark .header-top a,
body.cymart-theme-dark .header-top .nav-link,
body.cymart-theme-dark .header-middle a,
body.cymart-theme-dark .header-middle .nav-link{color:#f6f5ff !important;}

body.cymart-theme-light header{
  background:rgba(247,251,255,.64) !important;
  backdrop-filter:blur(15px) saturate(120%);
  -webkit-backdrop-filter:blur(15px) saturate(120%);
}
body.cymart-theme-light .header-top{
  background:linear-gradient(90deg,#2789ff 0%,#6b65f4 48%,#df50e9 78%,#ff80ad 100%) !important;
  border:0 !important;
  box-shadow:0 7px 22px rgba(74,105,210,.16) !important;
}
body.cymart-theme-light .header-top a,
body.cymart-theme-light .header-top .nav-link,
body.cymart-theme-light .header-top .text-muted{color:#fff !important;}
body.cymart-theme-light .header-middle{
  background:rgba(255,255,255,.82) !important;
  border:1px solid rgba(126,161,235,.34) !important;
  border-radius:15px !important;
  box-shadow:0 11px 30px rgba(54,90,167,.12),inset 0 1px 0 rgba(255,255,255,.80) !important;
  backdrop-filter:blur(18px) saturate(115%);
  -webkit-backdrop-filter:blur(18px) saturate(115%);
}
body.cymart-theme-light .header-middle::after{
  background:linear-gradient(90deg,transparent,#4cb8ff,#886cff,#d77aff,transparent) !important;
  box-shadow:0 0 10px rgba(95,126,255,.26) !important;
}
body.cymart-theme-light .header-middle a,
body.cymart-theme-light .header-middle .nav-link{color:#142052 !important;}

/* ======================================================================
   TITLES / BREADCRUMBS
   ====================================================================== */
body.cymart-theme-dark .page-title,
body.cymart-theme-dark .breadcrumb,
body.cymart-theme-dark .breadcrumb a,
body.cymart-theme-dark h1,
body.cymart-theme-dark h2,
body.cymart-theme-dark h3,
body.cymart-theme-dark h4,
body.cymart-theme-dark h5,
body.cymart-theme-dark h6{color:#f7f4ff !important;}

body.cymart-theme-light .page-title,
body.cymart-theme-light h1,
body.cymart-theme-light h2,
body.cymart-theme-light h3,
body.cymart-theme-light h4,
body.cymart-theme-light h5,
body.cymart-theme-light h6{color:#101b50 !important;}
body.cymart-theme-light .breadcrumb,
body.cymart-theme-light .breadcrumb a{color:#3767a8 !important;}

/* ======================================================================
   CARDS / PANELS / TABLES / MODALS
   Layout untouched; only surface, border, shadow and text colors.
   ====================================================================== */
body.cymart-theme-dark .card,
body.cymart-theme-dark .modal-content,
body.cymart-theme-dark .dropdown-menu,
body.cymart-theme-dark .list-group-item,
body.cymart-theme-dark .sidebar .cart,
body.cymart-theme-dark .table,
body.cymart-theme-dark .bg-white,
body.cymart-theme-dark .bg-light,
body.cymart-theme-dark .serchcontent{
  background:linear-gradient(145deg,rgba(5,16,39,.84),rgba(19,10,48,.79)) !important;
  border-color:rgba(121,149,255,.30) !important;
  color:#eff4ff !important;
  box-shadow:0 11px 28px rgba(0,0,0,.18) !important;
  backdrop-filter:blur(14px) saturate(112%);
  -webkit-backdrop-filter:blur(14px) saturate(112%);
}
body.cymart-theme-dark .card-product,
body.cymart-theme-dark .card-product .product-info{
  background:linear-gradient(135deg,rgba(6,25,54,.88),rgba(29,13,62,.80)) !important;
  border:1px solid rgba(83,160,255,.45) !important;
  border-radius:13px !important;
  box-shadow:0 9px 24px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.03) !important;
}
body.cymart-theme-dark .card-product:hover{
  border-color:rgba(238,94,255,.78) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.24),0 0 20px rgba(224,78,255,.16) !important;
}
body.cymart-theme-dark .card-product .service-name,
body.cymart-theme-dark .card-product .truncate-text,
body.cymart-theme-dark .card-product .text-muted,
body.cymart-theme-dark .text-muted{color:#c6d4ef !important;}

body.cymart-theme-light .card,
body.cymart-theme-light .modal-content,
body.cymart-theme-light .dropdown-menu,
body.cymart-theme-light .list-group-item,
body.cymart-theme-light .sidebar .cart,
body.cymart-theme-light .table,
body.cymart-theme-light .bg-white,
body.cymart-theme-light .bg-light,
body.cymart-theme-light .serchcontent{
  background:rgba(255,255,255,.83) !important;
  border-color:rgba(124,164,235,.30) !important;
  color:#132053 !important;
  box-shadow:0 10px 28px rgba(66,106,182,.10) !important;
  backdrop-filter:blur(15px) saturate(110%);
  -webkit-backdrop-filter:blur(15px) saturate(110%);
}
body.cymart-theme-light .card-product,
body.cymart-theme-light .card-product .product-info{
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(112,163,238,.34) !important;
  border-radius:13px !important;
  box-shadow:0 8px 24px rgba(78,120,195,.09),inset 0 1px 0 rgba(255,255,255,.92) !important;
}
body.cymart-theme-light .card-product:hover{
  border-color:rgba(106,111,248,.62) !important;
  box-shadow:0 12px 30px rgba(75,109,190,.14),0 0 18px rgba(126,91,255,.09) !important;
}
body.cymart-theme-light .card-product .service-name,
body.cymart-theme-light .card-product .truncate-text{color:#111d51 !important;}
body.cymart-theme-light .card-product .text-muted,
body.cymart-theme-light .text-muted{color:#536b97 !important;}

/* Table legibility across history/account pages. */
body.cymart-theme-dark .table th,
body.cymart-theme-dark .table td{border-color:rgba(123,152,220,.18) !important;color:#edf3ff !important;}
body.cymart-theme-light .table th,
body.cymart-theme-light .table td{border-color:rgba(111,151,216,.18) !important;color:#162151 !important;}
body.cymart-theme-dark .table-striped tbody tr:nth-of-type(odd){background:rgba(255,255,255,.025) !important;}
body.cymart-theme-light .table-striped tbody tr:nth-of-type(odd){background:rgba(68,119,220,.025) !important;}

/* ======================================================================
   SEARCH / FORM CONTROLS
   ====================================================================== */
body.cymart-theme-dark .card-search{
  background:linear-gradient(135deg,rgba(5,17,42,.88),rgba(21,11,52,.82)) !important;
  border:1px solid rgba(95,163,255,.58) !important;
  border-radius:13px !important;
  box-shadow:0 10px 26px rgba(0,0,0,.20),0 0 16px rgba(87,77,255,.08) !important;
}
body.cymart-theme-light .card-search{
  background:rgba(255,255,255,.84) !important;
  border:1px solid rgba(103,157,235,.40) !important;
  border-radius:13px !important;
  box-shadow:0 10px 27px rgba(59,103,184,.10) !important;
}

body.cymart-theme-dark .form-control,
body.cymart-theme-dark .custom-select,
body.cymart-theme-dark select,
body.cymart-theme-dark textarea,
body.cymart-theme-dark .chosen-container-single .chosen-single,
body.cymart-theme-dark .chosen-container .chosen-drop{
  color:#eef4ff !important;
  background:rgba(5,17,42,.80) !important;
  border-color:rgba(105,151,229,.35) !important;
  box-shadow:none !important;
}
body.cymart-theme-dark .form-control::placeholder{color:#8ea5c9 !important;}

body.cymart-theme-light .form-control,
body.cymart-theme-light .custom-select,
body.cymart-theme-light select,
body.cymart-theme-light textarea,
body.cymart-theme-light .chosen-container-single .chosen-single,
body.cymart-theme-light .chosen-container .chosen-drop{
  color:#172253 !important;
  background:rgba(255,255,255,.90) !important;
  border-color:rgba(111,151,220,.28) !important;
  box-shadow:none !important;
}
body.cymart-theme-light .form-control::placeholder{color:#7890b5 !important;}

/* ======================================================================
   BUTTONS — keep original labels/actions, update palette only
   ====================================================================== */
body.cymart-theme-dark .btn-primary,
body.cymart-theme-dark button.btn-primary{
  background:linear-gradient(135deg,#4467ff,#9b4dff) !important;
  border-color:rgba(157,107,255,.48) !important;
  color:#fff !important;
  box-shadow:0 7px 18px rgba(79,67,255,.18) !important;
}
body.cymart-theme-dark .btn-primary:hover{background:linear-gradient(135deg,#5579ff,#b05bff) !important;}
body.cymart-theme-dark .btn-secondary,
body.cymart-theme-dark button.btn-secondary{
  background:rgba(17,32,65,.92) !important;
  color:#eff5ff !important;
  border:1px solid rgba(106,155,234,.30) !important;
}

body.cymart-theme-light .btn-primary,
body.cymart-theme-light button.btn-primary{
  background:linear-gradient(135deg,#2c8cff,#7469f8) !important;
  border-color:rgba(72,122,230,.26) !important;
  color:#fff !important;
  box-shadow:0 7px 18px rgba(63,112,216,.14) !important;
}
body.cymart-theme-light .btn-primary:hover{background:linear-gradient(135deg,#247ff2,#8569f4) !important;}
body.cymart-theme-light .btn-secondary,
body.cymart-theme-light button.btn-secondary{
  background:rgba(241,247,255,.95) !important;
  color:#172253 !important;
  border:1px solid rgba(111,151,220,.30) !important;
}

/* ======================================================================
   PREMIUM RECHARGE PANEL — animated light ray around the full perimeter
   Dark = sunset pink/orange/lilac; Light = blue/purple.
   ====================================================================== */
@property --cymart-ray-angle{
  syntax:'<angle>';
  initial-value:0deg;
  inherits:false;
}

.cymart-recharge-panel{
  position:relative !important;
  isolation:isolate !important;
  clip-path:none !important;
  border-radius:20px !important;
  overflow:hidden !important;
  border:1px solid transparent !important;
  box-shadow:none !important;
}

.cymart-recharge-panel::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-2 !important;
  pointer-events:none !important;
  border:0 !important;
  clip-path:none !important;
  animation:none !important;
}

.cymart-recharge-panel::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:20 !important;
  pointer-events:none !important;
  padding:2px !important;
  border-radius:inherit !important;
  clip-path:none !important;
  background:conic-gradient(from var(--cymart-ray-angle),transparent 0deg 278deg,#ffffff 300deg,var(--cymart-ray-accent) 318deg,var(--cymart-ray-tail) 334deg,transparent 352deg 360deg) !important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0) !important;
  -webkit-mask-composite:xor !important;
  mask-composite:exclude !important;
  filter:drop-shadow(0 0 8px var(--cymart-ray-glow)) !important;
  animation:cymartPremiumBorderRay 4.1s linear infinite !important;
}

@keyframes cymartPremiumBorderRay{to{--cymart-ray-angle:360deg;}}

body.cymart-theme-dark .cymart-recharge-panel{
  --cymart-ray-accent:#ff84ca;
  --cymart-ray-tail:#9d67ff;
  --cymart-ray-glow:rgba(255,99,199,.72);
  background:linear-gradient(145deg,rgba(15,18,55,.82),rgba(38,16,59,.72)) !important;
  box-shadow:0 16px 38px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.07),0 0 20px rgba(207,94,255,.10) !important;
  backdrop-filter:blur(17px) saturate(120%);
  -webkit-backdrop-filter:blur(17px) saturate(120%);
}
body.cymart-theme-dark .cymart-recharge-panel::before{
  background:radial-gradient(circle at 88% 5%,rgba(255,127,118,.10),transparent 35%),radial-gradient(circle at 3% 100%,rgba(105,104,255,.11),transparent 34%) !important;
}
body.cymart-theme-dark .cymart-recharge-panel-title strong{color:#fff !important;text-shadow:none !important;}
body.cymart-theme-dark .cymart-recharge-panel-title small{color:#c1cbe4 !important;}
body.cymart-theme-dark .cymart-recharge-panel-orb{
  color:#b8ff9a !important;
  background:rgba(24,92,27,.50) !important;
  border:1px solid rgba(95,255,80,.65) !important;
  box-shadow:0 0 16px rgba(68,255,79,.19) !important;
}
body.cymart-theme-dark .cymart-recharge-panel-line{background:linear-gradient(90deg,rgba(255,255,255,.20),transparent) !important;box-shadow:none !important;}

body.cymart-theme-light .cymart-recharge-panel{
  --cymart-ray-accent:#5c7cff;
  --cymart-ray-tail:#c15cff;
  --cymart-ray-glow:rgba(87,112,255,.62);
  background:rgba(255,255,255,.76) !important;
  box-shadow:0 14px 36px rgba(67,109,190,.12),inset 0 1px 0 rgba(255,255,255,.95),0 0 20px rgba(121,92,255,.07) !important;
  backdrop-filter:blur(18px) saturate(112%);
  -webkit-backdrop-filter:blur(18px) saturate(112%);
}
body.cymart-theme-light .cymart-recharge-panel::before{
  background:radial-gradient(circle at 88% 5%,rgba(177,96,255,.09),transparent 35%),radial-gradient(circle at 3% 100%,rgba(73,170,255,.12),transparent 34%) !important;
}
body.cymart-theme-light .cymart-recharge-panel-title strong{color:#101b50 !important;text-shadow:none !important;}
body.cymart-theme-light .cymart-recharge-panel-title small{color:#60769f !important;}
body.cymart-theme-light .cymart-recharge-panel-orb{
  color:#fff !important;
  background:linear-gradient(135deg,#2787ff,#6e6cff) !important;
  border:1px solid rgba(93,128,255,.25) !important;
  box-shadow:0 7px 18px rgba(59,112,229,.20) !important;
}
body.cymart-theme-light .cymart-recharge-panel-line{background:linear-gradient(90deg,rgba(86,127,230,.24),transparent) !important;box-shadow:none !important;}

/* Recharge methods: keep Binance / bank identity but remove the old green HUD. */
.cymart-imei-recharge-actions .cymart-recharge-action{
  clip-path:none !important;
  border-radius:16px !important;
  transition:transform var(--cymart-transition),box-shadow var(--cymart-transition),border-color var(--cymart-transition) !important;
}
.cymart-imei-recharge-actions .cymart-recharge-action::before{
  inset:0 !important;
  border:0 !important;
  clip-path:none !important;
  border-radius:inherit !important;
}
.cymart-imei-recharge-actions .cymart-recharge-action::after{
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent) !important;
}
body.cymart-theme-dark .cymart-imei-recharge-actions .cymart-recharge-action{
  color:#fff !important;
  background:linear-gradient(135deg,rgba(8,20,48,.90),rgba(24,16,52,.88)) !important;
  border:1px solid rgba(112,153,255,.42) !important;
  box-shadow:0 9px 24px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04) !important;
}
body.cymart-theme-dark .cymart-recharge-binance{border-color:rgba(255,185,46,.55) !important;background:linear-gradient(135deg,rgba(52,37,9,.82),rgba(27,17,40,.88)) !important;}
body.cymart-theme-dark .cymart-recharge-transfer{border-color:rgba(50,174,255,.58) !important;background:linear-gradient(135deg,rgba(6,37,67,.86),rgba(24,17,61,.87)) !important;}
body.cymart-theme-dark .cymart-recharge-copy .cymart-recharge-kicker{color:#a8c8ef !important;text-shadow:none !important;}
body.cymart-theme-dark .cymart-recharge-binance .cymart-recharge-kicker{color:#ffd355 !important;}
body.cymart-theme-dark .cymart-recharge-transfer .cymart-recharge-kicker{color:#67d3ff !important;}
body.cymart-theme-dark .cymart-recharge-copy strong{color:#fff !important;text-shadow:none !important;}
body.cymart-theme-dark .cymart-recharge-copy small{color:#bac7df !important;}
body.cymart-theme-dark .cymart-recharge-arrow{border-color:rgba(180,112,255,.62) !important;color:#e4cbff !important;background:rgba(102,54,180,.14) !important;}

body.cymart-theme-light .cymart-imei-recharge-actions .cymart-recharge-action{
  color:#122053 !important;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(113,156,232,.28) !important;
  box-shadow:0 8px 24px rgba(74,114,185,.10),inset 0 1px 0 rgba(255,255,255,.94) !important;
}
body.cymart-theme-light .cymart-recharge-binance{background:linear-gradient(135deg,rgba(255,250,236,.94),rgba(255,255,255,.87)) !important;border-color:rgba(246,184,48,.36) !important;}
body.cymart-theme-light .cymart-recharge-transfer{background:linear-gradient(135deg,rgba(239,248,255,.95),rgba(255,255,255,.88)) !important;border-color:rgba(72,161,255,.35) !important;}
body.cymart-theme-light .cymart-recharge-copy .cymart-recharge-kicker{color:#3e79c0 !important;text-shadow:none !important;}
body.cymart-theme-light .cymart-recharge-binance .cymart-recharge-kicker{color:#d18b00 !important;}
body.cymart-theme-light .cymart-recharge-transfer .cymart-recharge-kicker{color:#1683da !important;}
body.cymart-theme-light .cymart-recharge-copy strong{color:#132053 !important;text-shadow:none !important;}
body.cymart-theme-light .cymart-recharge-copy small{color:#62789f !important;}
body.cymart-theme-light .cymart-recharge-arrow{border-color:rgba(77,134,242,.34) !important;color:#2457bd !important;background:rgba(255,255,255,.78) !important;box-shadow:0 6px 16px rgba(67,112,205,.10) !important;}

.cymart-recharge-action:hover{transform:translateY(-3px) !important;}

/* ======================================================================
   THEME SETTINGS MODAL / FOOTER / MISC VISUAL SURFACES
   ====================================================================== */
body.cymart-theme-dark .modal-theme-settings .bg-svg,
body.cymart-theme-dark .theme-settings-icon{
  background:rgba(8,15,38,.92) !important;
  border-color:rgba(164,84,255,.46) !important;
}
body.cymart-theme-light .modal-theme-settings .bg-svg,
body.cymart-theme-light .theme-settings-icon{
  background:rgba(255,255,255,.90) !important;
  border-color:rgba(104,151,231,.30) !important;
}
body.cymart-theme-dark footer,
body.cymart-theme-dark .footer-top,
body.cymart-theme-dark .footer-bottom{background:rgba(3,7,20,.84) !important;color:#dfe8fb !important;}
body.cymart-theme-light footer,
body.cymart-theme-light .footer-top,
body.cymart-theme-light .footer-bottom{background:rgba(249,252,255,.88) !important;color:#314873 !important;}

/* ======================================================================
   MOBILE — visual adaptation only; no structural redesign.
   ====================================================================== */
@media (max-width: 767.98px){
  body.cymart-theme-dark::before{background-image:url('../images/cymart-visual/dark-mobile.png') !important;background-position:center top !important;}
  body.cymart-theme-light::before{background-image:url('../images/cymart-visual/light-mobile.png') !important;background-position:center top !important;}

  body.cymart-theme-dark::after{background:linear-gradient(180deg,rgba(2,5,18,.22),rgba(2,5,18,.52)) !important;}
  body.cymart-theme-light::after{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(239,247,255,.16)) !important;}

  .cymart-recharge-panel{border-radius:16px !important;}
  .cymart-recharge-panel::after{padding:1.5px !important;}
  .card,.card-search,.card-product{backdrop-filter:blur(11px) saturate(108%);-webkit-backdrop-filter:blur(11px) saturate(108%);}
  body.cymart-theme-dark .header-middle,
  body.cymart-theme-light .header-middle{border-radius:11px !important;}
}

@media (prefers-reduced-motion: reduce){
  .cymart-recharge-panel::after{animation:none !important;}
  .cymart-recharge-action{transition:none !important;}
}

/* ======================================================================
   HIGH-SPECIFICITY COMPATIBILITY
   Some CYMART pages contain page-local <style> blocks after </head>.
   These selectors intentionally outrank those visual-only legacy rules.
   ====================================================================== */

/* IMEI order page: keep the same geometry, replace only the visual skin. */
body.cymart-theme-dark.cymart-imei-host,
body.cymart-theme-light.cymart-imei-host{
  background:transparent !important;
  background-image:none !important;
}
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page::before,
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page::after,
body.cymart-theme-light.cymart-imei-host .cymart-imei-page::before,
body.cymart-theme-light.cymart-imei-host .cymart-imei-page::after{
  opacity:0 !important;
  background:none !important;
  filter:none !important;
}

body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-search{
  background:linear-gradient(135deg,rgba(5,17,42,.88),rgba(24,12,54,.82)) !important;
  border:1px solid rgba(126,142,255,.56) !important;
  border-radius:13px !important;
  box-shadow:0 10px 26px rgba(0,0,0,.20),0 0 18px rgba(205,78,255,.08) !important;
  backdrop-filter:blur(14px) saturate(112%);
  -webkit-backdrop-filter:blur(14px) saturate(112%);
}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-search{
  background:rgba(255,255,255,.84) !important;
  border:1px solid rgba(101,156,235,.40) !important;
  border-radius:13px !important;
  box-shadow:0 10px 27px rgba(59,103,184,.10) !important;
  backdrop-filter:blur(14px) saturate(108%);
  -webkit-backdrop-filter:blur(14px) saturate(108%);
}

body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-search select.form-control,
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-search input.form-control{
  background:rgba(5,17,42,.82) !important;
  color:#edf4ff !important;
  border-color:rgba(104,151,230,.38) !important;
}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-search select.form-control,
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-search input.form-control{
  background:rgba(255,255,255,.91) !important;
  color:#172253 !important;
  border-color:rgba(111,151,220,.30) !important;
}
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-search .custom-control-label{color:#f1f5ff !important;}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-search .custom-control-label{color:#172253 !important;}

body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .group .title{color:#f7f4ff !important;text-shadow:none !important;}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .group .title{color:#101b50 !important;text-shadow:none !important;}

body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-product{
  background:linear-gradient(135deg,rgba(6,25,54,.88),rgba(29,13,62,.80)) !important;
  border:1px solid rgba(114,142,255,.47) !important;
  border-radius:11px !important;
  box-shadow:0 9px 24px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.03) !important;
  color:#eef5ff !important;
}
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-product:hover{
  border-color:rgba(240,97,255,.78) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.24),0 0 18px rgba(220,70,255,.16) !important;
}
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-product .searchme{color:#f6f8ff !important;}
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .card-product .text-muted{color:#aebedb !important;}
body.cymart-theme-dark.cymart-imei-host .cymart-imei-page .col-group-icon .bg-gray{
  background:linear-gradient(180deg,rgba(35,75,145,.82),rgba(35,30,110,.78)) !important;
  color:#56d4ff !important;
  text-shadow:0 0 9px rgba(58,200,255,.42) !important;
}

body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-product{
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(110,160,234,.36) !important;
  border-radius:11px !important;
  box-shadow:0 8px 24px rgba(76,116,190,.09),inset 0 1px 0 rgba(255,255,255,.94) !important;
  color:#172253 !important;
}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-product:hover{
  border-color:rgba(112,104,246,.58) !important;
  box-shadow:0 11px 28px rgba(75,109,190,.13),0 0 18px rgba(125,93,255,.08) !important;
}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-product .searchme{color:#142052 !important;}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .card-product .text-muted{color:#62769b !important;}
body.cymart-theme-light.cymart-imei-host .cymart-imei-page .col-group-icon .bg-gray{
  background:linear-gradient(180deg,#e7f4ff,#dceaff) !important;
  color:#2589ed !important;
  text-shadow:none !important;
}

body.cymart-theme-dark.cymart-imei-host #modal-order .modal-content,
body.cymart-theme-dark.cymart-imei-host #modal-order .modal-header,
body.cymart-theme-dark.cymart-imei-host #modal-order .modal-body{
  background:linear-gradient(145deg,rgba(5,16,39,.97),rgba(22,10,47,.96)) !important;
  color:#edf4ff !important;
  border-color:rgba(117,146,255,.32) !important;
}
body.cymart-theme-light.cymart-imei-host #modal-order .modal-content,
body.cymart-theme-light.cymart-imei-host #modal-order .modal-header,
body.cymart-theme-light.cymart-imei-host #modal-order .modal-body{
  background:rgba(255,255,255,.96) !important;
  color:#172253 !important;
  border-color:rgba(111,151,220,.28) !important;
}

/* Order History: override its page-local dark-only visual block in both themes. */
body.cymart-theme-dark:has(.history-container) .card-table-history{
  background:linear-gradient(145deg,rgba(5,16,39,.88),rgba(21,10,47,.84)) !important;
  border:1px solid rgba(115,146,255,.38) !important;
  border-radius:14px !important;
  box-shadow:0 12px 32px rgba(0,0,0,.20),0 0 18px rgba(180,70,255,.07) !important;
  color:#edf4ff !important;
  backdrop-filter:blur(15px) saturate(112%);
  -webkit-backdrop-filter:blur(15px) saturate(112%);
}
body.cymart-theme-light:has(.history-container) .card-table-history{
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(111,151,220,.32) !important;
  border-radius:14px !important;
  box-shadow:0 12px 30px rgba(65,103,176,.10) !important;
  color:#172253 !important;
  backdrop-filter:blur(15px) saturate(108%);
  -webkit-backdrop-filter:blur(15px) saturate(108%);
}
body.cymart-theme-dark:has(.history-container) .table-order-history{background:rgba(4,13,31,.54) !important;border-color:rgba(114,145,218,.20) !important;}
body.cymart-theme-light:has(.history-container) .table-order-history{background:rgba(255,255,255,.54) !important;border-color:rgba(111,151,220,.20) !important;}
body.cymart-theme-dark:has(.history-container) #tcs-table thead,
body.cymart-theme-dark:has(.history-container) #tcs-table thead tr{background:linear-gradient(90deg,rgba(12,27,57,.94),rgba(35,17,69,.92)) !important;}
body.cymart-theme-light:has(.history-container) #tcs-table thead,
body.cymart-theme-light:has(.history-container) #tcs-table thead tr{background:rgba(232,242,255,.92) !important;}
body.cymart-theme-dark:has(.history-container) #tcs-table thead th{color:#aee6ff !important;border-bottom-color:rgba(114,152,235,.32) !important;}
body.cymart-theme-light:has(.history-container) #tcs-table thead th{color:#245aa8 !important;border-bottom-color:rgba(111,151,220,.26) !important;}
body.cymart-theme-dark:has(.history-container) #tcs-table tbody tr{background:rgba(5,15,35,.72) !important;color:#edf4ff !important;border-color:rgba(105,138,204,.14) !important;}
body.cymart-theme-dark:has(.history-container) #tcs-table tbody tr:nth-child(even){background:rgba(16,16,50,.64) !important;}
body.cymart-theme-light:has(.history-container) #tcs-table tbody tr{background:rgba(255,255,255,.72) !important;color:#172253 !important;border-color:rgba(111,151,220,.14) !important;}
body.cymart-theme-light:has(.history-container) #tcs-table tbody tr:nth-child(even){background:rgba(241,247,255,.76) !important;}
body.cymart-theme-dark:has(.history-container) #tcs-table td{color:#e7f0ff !important;border-color:rgba(105,138,204,.14) !important;}
body.cymart-theme-light:has(.history-container) #tcs-table td{color:#172253 !important;border-color:rgba(111,151,220,.14) !important;}
body.cymart-theme-dark:has(.history-container) #tcs-table select,
body.cymart-theme-dark:has(.history-container) #tcs-table .form-control,
body.cymart-theme-dark:has(.history-container) .form-control{background:rgba(6,18,43,.92) !important;color:#edf4ff !important;border-color:rgba(111,151,220,.35) !important;}
body.cymart-theme-light:has(.history-container) #tcs-table select,
body.cymart-theme-light:has(.history-container) #tcs-table .form-control,
body.cymart-theme-light:has(.history-container) .form-control{background:rgba(255,255,255,.94) !important;color:#172253 !important;border-color:rgba(111,151,220,.30) !important;}
body.cymart-theme-dark:has(.history-container) .dropdown-menu,
body.cymart-theme-dark:has(.history-container) .modal-content{background:linear-gradient(145deg,#081630,#160e33) !important;border-color:rgba(119,146,225,.35) !important;color:#edf4ff !important;}
body.cymart-theme-light:has(.history-container) .dropdown-menu,
body.cymart-theme-light:has(.history-container) .modal-content{background:rgba(255,255,255,.97) !important;border-color:rgba(111,151,220,.28) !important;color:#172253 !important;}

/* Generic links and pagination last, because the legacy dark stylesheet sets some to black. */
body.cymart-theme-dark a{color:#dce8ff;}
body.cymart-theme-dark a:hover{color:#fff;}
body.cymart-theme-light a{color:#245aa8;}
body.cymart-theme-light a:hover{color:#183e7c;}
body.cymart-theme-dark .page-link{background:rgba(7,18,42,.90) !important;color:#eaf2ff !important;border-color:rgba(113,150,220,.25) !important;}
body.cymart-theme-light .page-link{background:rgba(255,255,255,.94) !important;color:#245aa8 !important;border-color:rgba(111,151,220,.25) !important;}

body.cymart-theme-dark .btn-success{background:#16b96a !important;color:#fff !important;border-color:transparent !important;}
body.cymart-theme-dark .btn-danger{background:#e54862 !important;color:#fff !important;border-color:transparent !important;}
body.cymart-theme-dark .btn-warning{background:#ffc928 !important;color:#171717 !important;border-color:transparent !important;}
body.cymart-theme-light .btn-success{background:#12b96a !important;color:#fff !important;border-color:transparent !important;}
body.cymart-theme-light .btn-danger{background:#e54862 !important;color:#fff !important;border-color:transparent !important;}
body.cymart-theme-light .btn-warning{background:#ffc928 !important;color:#171717 !important;border-color:transparent !important;}

/* ======================================================================
   V16.1 PATCH — closer to approved mockups (images 4 and 5)
   - fix invisible login/menu text in light mode
   - remove remaining old login neon scene
   - push IMEI pages closer to the approved light/dark targets
   ====================================================================== */

/* ---------- light header/menu readability ---------- */
body.cymart-theme-light .header-middle,
body.cymart-theme-light .header-middle .navbar,
body.cymart-theme-light .header-middle .navbar-nav,
body.cymart-theme-light .header-middle .dropdown-menu{
  color:#17244f !important;
}
body.cymart-theme-light .header-middle a,
body.cymart-theme-light .header-middle .nav-link,
body.cymart-theme-light .header-middle .dropdown-toggle,
body.cymart-theme-light .header-middle .navbar-mastermenu > .nav-item > .nav-link,
body.cymart-theme-light .header-middle .navbar-expand-lg .navbar-nav .nav-link,
body.cymart-theme-light .header-middle .text-muted,
body.cymart-theme-light .header-middle span,
body.cymart-theme-light.page-login .header-middle a,
body.cymart-theme-light.page-login .header-middle .nav-link,
body.cymart-theme-light.page-login .header-middle .dropdown-toggle{
  color:#17244f !important;
  text-shadow:0 1px 2px rgba(255,255,255,.72) !important;
  opacity:1 !important;
}
body.cymart-theme-light .header-middle i,
body.cymart-theme-light .header-middle .lg-icon i,
body.cymart-theme-light .header-middle .fa,
body.cymart-theme-light .header-middle .fal,
body.cymart-theme-light .header-middle .far{
  color:#5569a0 !important;
}
body.cymart-theme-light .header-middle .btn-secondary,
body.cymart-theme-light .header-middle .bg-secondary{
  color:#17244f !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(123,158,228,.34) !important;
}

/* ---------- login page: kill legacy neon scene and old decoration ---------- */
body.page-login.cymart-theme-light .page-login,
body.page-login.cymart-theme-dark .page-login{
  background:transparent !important;
  min-height:820px !important;
  isolation:isolate !important;
}
body.page-login.cymart-theme-light .page-login::before,
body.page-login.cymart-theme-light .page-login::after,
body.page-login.cymart-theme-light .page-login .cymart-center-glow,
body.page-login.cymart-theme-light .page-login .cymart-login-background,
body.page-login.cymart-theme-dark .page-login::before,
body.page-login.cymart-theme-dark .page-login::after,
body.page-login.cymart-theme-dark .page-login .cymart-center-glow,
body.page-login.cymart-theme-dark .page-login .cymart-login-background{
  display:none !important;
  content:none !important;
  background:none !important;
  box-shadow:none !important;
  filter:none !important;
}
body.page-login.cymart-theme-light .page-login > form,
body.page-login.cymart-theme-dark .page-login > form{
  position:relative !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.page-login.cymart-theme-light .page-login > form::before,
body.page-login.cymart-theme-dark .page-login > form::before{
  display:none !important;
  content:none !important;
}
body.page-login.cymart-theme-light .page-login .login-panel{
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(122,161,236,.36) !important;
  border-radius:26px !important;
  box-shadow:0 24px 60px rgba(90,121,185,.14), inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter:blur(18px) saturate(110%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(110%) !important;
}
body.page-login.cymart-theme-dark .page-login .login-panel{
  background:linear-gradient(145deg,rgba(22,20,54,.78),rgba(58,28,72,.54)) !important;
  border:1px solid rgba(255,177,207,.42) !important;
  border-radius:26px !important;
  box-shadow:0 26px 60px rgba(7,5,24,.35), inset 0 1px 0 rgba(255,255,255,.10), 0 0 26px rgba(219,104,255,.10) !important;
  backdrop-filter:blur(18px) saturate(116%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(116%) !important;
}
body.page-login.cymart-theme-light .page-login .login-brand,
body.page-login.cymart-theme-light .page-login .login-header .page-title,
body.page-login.cymart-theme-light .page-login .login-subtitle,
body.page-login.cymart-theme-light .page-login .security-note,
body.page-login.cymart-theme-light .page-login .security-note span,
body.page-login.cymart-theme-light .page-login .text-right,
body.page-login.cymart-theme-light .page-login .text-right .cursor-pointer{
  color:#1a2756 !important;
  text-shadow:0 1px 2px rgba(255,255,255,.52) !important;
}
body.page-login.cymart-theme-dark .page-login .login-brand,
body.page-login.cymart-theme-dark .page-login .login-header .page-title,
body.page-login.cymart-theme-dark .page-login .login-subtitle,
body.page-login.cymart-theme-dark .page-login .security-note,
body.page-login.cymart-theme-dark .page-login .security-note span,
body.page-login.cymart-theme-dark .page-login .text-right,
body.page-login.cymart-theme-dark .page-login .text-right .cursor-pointer{
  color:#f8f3ff !important;
}
body.page-login.cymart-theme-light .page-login .input-group,
body.page-login.cymart-theme-light .page-login .input-group-prepend,
body.page-login.cymart-theme-light .page-login .input-group-text,
body.page-login.cymart-theme-light .page-login .input-group .form-control,
body.page-login.cymart-theme-light .page-login .input-captcha,
body.page-login.cymart-theme-light .page-login .input-captcha input{
  background:rgba(255,255,255,.93) !important;
  color:#17244f !important;
  border-color:rgba(110,156,234,.34) !important;
}
body.page-login.cymart-theme-dark .page-login .input-group,
body.page-login.cymart-theme-dark .page-login .input-group-prepend,
body.page-login.cymart-theme-dark .page-login .input-group-text,
body.page-login.cymart-theme-dark .page-login .input-group .form-control,
body.page-login.cymart-theme-dark .page-login .input-captcha,
body.page-login.cymart-theme-dark .page-login .input-captcha input{
  background:rgba(10,18,46,.82) !important;
  color:#eef4ff !important;
  border-color:rgba(122,147,240,.34) !important;
}
body.page-login.cymart-theme-light .page-login .loginbuttons{
  background:linear-gradient(135deg,#2d8cff,#7a69f8) !important;
  color:#fff !important;
}
body.page-login.cymart-theme-dark .page-login .loginbuttons{
  background:linear-gradient(135deg,#5f63ff,#b25eff) !important;
  color:#fff !important;
}

/* ---------- IMEI pages closer to approved light / dark comps ---------- */
body.cymart-theme-light .cymart-imei-page,
body.cymart-theme-dark .cymart-imei-page,
body.cymart-theme-light .cymart-imei-page .page-container,
body.cymart-theme-dark .cymart-imei-page .page-container,
body.cymart-theme-light .cymart-imei-page .service-list,
body.cymart-theme-dark .cymart-imei-page .service-list,
body.cymart-theme-light .cymart-imei-page .service-list-box,
body.cymart-theme-dark .cymart-imei-page .service-list-box,
body.cymart-theme-light .cymart-imei-page .h-100.d-flex.w-100.flex-column,
body.cymart-theme-dark .cymart-imei-page .h-100.d-flex.w-100.flex-column{
  background:transparent !important;
  box-shadow:none !important;
}
body.cymart-theme-light .cymart-imei-page .group.active,
body.cymart-theme-dark .cymart-imei-page .group.active{
  background:transparent !important;
}
body.cymart-theme-light .cymart-imei-page .group .title,
body.cymart-theme-dark .cymart-imei-page .group .title{
  font-weight:700 !important;
  margin-bottom:14px !important;
}
body.cymart-theme-light .cymart-imei-page .group .title span{
  color:#172a62 !important;
  text-shadow:0 1px 2px rgba(255,255,255,.48) !important;
}
body.cymart-theme-dark .cymart-imei-page .group .title span{
  color:#ffffff !important;
}

/* light page closer to approved mockup */
body.cymart-theme-light .cymart-imei-page .cymart-recharge-panel{
  background:rgba(255,255,255,.68) !important;
  border-radius:24px !important;
  box-shadow:0 24px 58px rgba(91,120,188,.12), inset 0 1px 0 rgba(255,255,255,.96), 0 0 26px rgba(115,156,255,.09) !important;
}
body.cymart-theme-light .cymart-imei-page .card-search{
  background:rgba(255,255,255,.70) !important;
  border:1px solid rgba(118,160,236,.30) !important;
  border-radius:22px !important;
  box-shadow:0 18px 40px rgba(88,118,185,.10) !important;
}
body.cymart-theme-light .cymart-imei-page .card-product{
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(118,160,236,.28) !important;
  border-radius:20px !important;
  box-shadow:0 16px 34px rgba(89,118,182,.08), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
body.cymart-theme-light .cymart-imei-page .col-group-icon .bg-gray{
  background:linear-gradient(180deg,#4aa0ff,#8a83ff) !important;
  color:#ffffff !important;
  border-radius:14px 0 0 14px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45) !important;
}
body.cymart-theme-light .cymart-imei-page .badge-success{
  background:#17c77b !important;
  color:#fff !important;
}
body.cymart-theme-light .cymart-imei-page .badge-warning{
  background:#ffcf32 !important;
  color:#242424 !important;
}

/* dark page closer to approved mockup */
body.cymart-theme-dark .cymart-imei-page .cymart-recharge-panel{
  background:linear-gradient(145deg,rgba(34,25,66,.62),rgba(93,53,86,.30)) !important;
  border-radius:24px !important;
  box-shadow:0 30px 70px rgba(8,4,27,.34), inset 0 1px 0 rgba(255,255,255,.11), 0 0 32px rgba(255,141,208,.10) !important;
}
body.cymart-theme-dark .cymart-imei-page .card-search{
  background:linear-gradient(145deg,rgba(52,35,83,.46),rgba(57,39,90,.34)) !important;
  border:1px solid rgba(255,164,210,.36) !important;
  border-radius:20px !important;
  box-shadow:0 20px 42px rgba(8,4,27,.22), 0 0 18px rgba(255,149,195,.08) !important;
}
body.cymart-theme-dark .cymart-imei-page .card-product{
  background:linear-gradient(145deg,rgba(52,36,86,.52),rgba(46,35,86,.34)) !important;
  border:1px solid rgba(237,121,255,.36) !important;
  border-radius:18px !important;
  box-shadow:0 16px 34px rgba(7,4,24,.24), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
body.cymart-theme-dark .cymart-imei-page .col-group-icon .bg-gray{
  background:linear-gradient(180deg,#2c5396,#223168) !important;
  color:#58d6ff !important;
  border-radius:14px 0 0 14px !important;
  text-shadow:0 0 9px rgba(88,214,255,.42) !important;
}
body.cymart-theme-dark .cymart-imei-page .badge-success{
  background:#15be73 !important;
  color:#fff !important;
}
body.cymart-theme-dark .cymart-imei-page .badge-warning{
  background:#ffcf32 !important;
  color:#222 !important;
}

/* footer slight cleanup so it no longer reads as old theme */
body.cymart-theme-light footer,
body.cymart-theme-light .footer-top,
body.cymart-theme-light .footer-bottom{
  background:rgba(248,251,255,.78) !important;
  backdrop-filter:blur(14px) saturate(108%) !important;
  -webkit-backdrop-filter:blur(14px) saturate(108%) !important;
}
body.cymart-theme-dark footer,
body.cymart-theme-dark .footer-top,
body.cymart-theme-dark .footer-bottom{
  background:rgba(12,12,34,.70) !important;
  backdrop-filter:blur(14px) saturate(112%) !important;
  -webkit-backdrop-filter:blur(14px) saturate(112%) !important;
}

/* ======================================================================
   V16.2 PATCH — visible perimeter light ray for Recarga de créditos
   More compatible fallback than the previous conic-gradient only approach.
   ====================================================================== */
.cymart-recharge-panel{
  overflow:hidden !important;
}

/* static luminous border */
body.cymart-theme-dark .cymart-recharge-panel{
  border:1px solid rgba(255,168,214,.34) !important;
  box-shadow:0 20px 46px rgba(8,4,27,.28), inset 0 1px 0 rgba(255,255,255,.08), 0 0 22px rgba(255,132,202,.10) !important;
}
body.cymart-theme-light .cymart-recharge-panel{
  border:1px solid rgba(123,146,255,.28) !important;
  box-shadow:0 18px 42px rgba(86,118,189,.10), inset 0 1px 0 rgba(255,255,255,.95), 0 0 18px rgba(98,121,255,.08) !important;
}
body.cymart-theme-dark .cymart-recharge-panel::before,
body.cymart-theme-light .cymart-recharge-panel::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  pointer-events:none !important;
  border-radius:inherit !important;
  padding:1px !important;
  background:linear-gradient(120deg, rgba(255,255,255,.10), rgba(255,255,255,.02)) !important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0) !important;
  -webkit-mask-composite:xor !important;
  mask-composite:exclude !important;
  filter:none !important;
  animation:none !important;
}

/* animated beam */
.cymart-recharge-panel::after{
  content:"" !important;
  position:absolute !important;
  z-index:3 !important;
  pointer-events:none !important;
  border-radius:999px !important;
  box-shadow:0 0 10px currentColor, 0 0 24px currentColor !important;
  animation:cymartBorderBeam 4.6s linear infinite !important;
}
body.cymart-theme-dark .cymart-recharge-panel::after{
  color:#ff9fd5 !important;
  background:linear-gradient(90deg,rgba(255,255,255,.0), #ffd8ea 20%, #ff86c6 55%, #9f69ff 100%) !important;
}
body.cymart-theme-light .cymart-recharge-panel::after{
  color:#7d86ff !important;
  background:linear-gradient(90deg,rgba(255,255,255,0), #ffffff 18%, #7caeff 52%, #b36dff 100%) !important;
}

@keyframes cymartBorderBeam {
  0% {
    top:2px; left:7%; width:140px; height:4px; transform:none;
  }
  24% {
    top:2px; left:calc(100% - 147px); width:140px; height:4px; transform:none;
  }
  25% {
    top:7%; left:auto; right:2px; width:4px; height:92px; transform:none;
  }
  49% {
    top:calc(100% - 99px); left:auto; right:2px; width:4px; height:92px; transform:none;
  }
  50% {
    top:auto; bottom:2px; left:calc(100% - 147px); right:auto; width:140px; height:4px; transform:none;
  }
  74% {
    top:auto; bottom:2px; left:7%; right:auto; width:140px; height:4px; transform:none;
  }
  75% {
    top:calc(100% - 99px); left:2px; right:auto; bottom:auto; width:4px; height:92px; transform:none;
  }
  99% {
    top:7%; left:2px; right:auto; bottom:auto; width:4px; height:92px; transform:none;
  }
  100% {
    top:2px; left:7%; width:140px; height:4px; transform:none;
  }
}

/* smaller beam on mobile so it still looks elegant */
@media (max-width: 767.98px){
  @keyframes cymartBorderBeam {
    0% { top:2px; left:8%; width:86px; height:4px; }
    24% { top:2px; left:calc(100% - 92px); width:86px; height:4px; }
    25% { top:8%; right:2px; left:auto; width:4px; height:70px; }
    49% { top:calc(100% - 76px); right:2px; left:auto; width:4px; height:70px; }
    50% { bottom:2px; left:calc(100% - 92px); top:auto; right:auto; width:86px; height:4px; }
    74% { bottom:2px; left:8%; top:auto; right:auto; width:86px; height:4px; }
    75% { top:calc(100% - 76px); left:2px; right:auto; bottom:auto; width:4px; height:70px; }
    99% { top:8%; left:2px; width:4px; height:70px; }
    100% { top:2px; left:8%; width:86px; height:4px; }
  }
}

/* ======================================================================
   V16.5 FINAL LOGIN CANVAS OVERRIDE
   This is intentionally global/high-specificity because login.tpl has its
   own late inline CSS. It does NOT depend on the body page/tpl class.
   The old neon canvas becomes transparent so the selected site background
   continues through the complete login area.
   ====================================================================== */
html body .page-login.m-auto.max-360,
html body div.page-login.m-auto.max-360,
html body .page-login {
  background-color:transparent !important;
  background-image:none !important;
  background:none !important;
  box-shadow:none !important;
}

/* Remove the old purple/orange floor, glow and generated decorative layer. */
html body .page-login.m-auto.max-360::before,
html body .page-login.m-auto.max-360::after,
html body div.page-login.m-auto.max-360::before,
html body div.page-login.m-auto.max-360::after,
html body .page-login::before,
html body .page-login::after {
  content:none !important;
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  background:none !important;
  background-image:none !important;
  box-shadow:none !important;
  filter:none !important;
}

html body .page-login .cymart-login-background,
html body .page-login .cymart-center-glow,
html body .page-login [class*="cymart-orbit"],
html body .page-login [class*="cymart-floor"],
html body .page-login [class*="cymart-light-trail"],
html body .page-login [class*="cymart-particle"],
html body .page-login [class*="cymart-star"] {
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  background:none !important;
  box-shadow:none !important;
  filter:none !important;
}

/* Preserve only the login form/card over the selected global background. */
html body .page-login > form,
html body .page-login > form.card {
  position:relative !important;
  z-index:4 !important;
}

/* Light login card: readable, soft glass, no old canvas. */
html body.cymart-theme-light .page-login .login-panel,
html body:not(.cymart-theme-dark) .page-login .login-panel {
  background:rgba(255,255,255,.90) !important;
  color:#17244f !important;
  border:1px solid rgba(128,164,232,.34) !important;
  box-shadow:0 22px 55px rgba(77,108,172,.16),inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter:blur(16px) saturate(110%) !important;
  -webkit-backdrop-filter:blur(16px) saturate(110%) !important;
}

/* Dark login card: translucent so the sunset remains visible. */
html body.cymart-theme-dark .page-login .login-panel {
  background:linear-gradient(145deg,rgba(25,20,55,.82),rgba(64,32,72,.62)) !important;
  color:#f7f3ff !important;
  border:1px solid rgba(255,159,213,.40) !important;
  box-shadow:0 24px 62px rgba(5,4,20,.34),inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter:blur(17px) saturate(116%) !important;
  -webkit-backdrop-filter:blur(17px) saturate(116%) !important;
}

/* Readability of the actual login text/fields. */
html body.cymart-theme-light .page-login .login-brand,
html body.cymart-theme-light .page-login .login-header .page-title,
html body.cymart-theme-light .page-login .login-subtitle,
html body.cymart-theme-light .page-login .security-note,
html body.cymart-theme-light .page-login .security-note span,
html body:not(.cymart-theme-dark) .page-login .login-brand,
html body:not(.cymart-theme-dark) .page-login .login-header .page-title,
html body:not(.cymart-theme-dark) .page-login .login-subtitle,
html body:not(.cymart-theme-dark) .page-login .security-note,
html body:not(.cymart-theme-dark) .page-login .security-note span {
  color:#17244f !important;
  text-shadow:0 1px 2px rgba(255,255,255,.68) !important;
}

html body.cymart-theme-dark .page-login .login-brand,
html body.cymart-theme-dark .page-login .login-header .page-title,
html body.cymart-theme-dark .page-login .login-subtitle,
html body.cymart-theme-dark .page-login .security-note,
html body.cymart-theme-dark .page-login .security-note span {
  color:#f8f4ff !important;
  text-shadow:0 1px 3px rgba(0,0,0,.42) !important;
}

/* ======================================================================
   V16.6 — LIGHT TEXT CONTRAST + REAL ROTATING BORDER RAY
   ====================================================================== */

/* ---------- light mode text contrast ---------- */
html body.cymart-theme-light .page-login .input-group .form-control,
html body.cymart-theme-light .page-login .input-captcha input,
html body.cymart-theme-light .page-login input[type="text"],
html body.cymart-theme-light .page-login input[type="email"],
html body.cymart-theme-light .page-login input[type="password"],
html body:not(.cymart-theme-dark) .page-login .input-group .form-control,
html body:not(.cymart-theme-dark) .page-login .input-captcha input {
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
  text-shadow:0 1px 1px rgba(255,255,255,.55) !important;
  opacity:1 !important;
}

html body.cymart-theme-light .page-login .form-control::placeholder,
html body.cymart-theme-light .page-login .input-captcha input::placeholder,
html body:not(.cymart-theme-dark) .page-login .form-control::placeholder,
html body:not(.cymart-theme-dark) .page-login .input-captcha input::placeholder {
  color:#56627c !important;
  -webkit-text-fill-color:#56627c !important;
  opacity:1 !important;
  text-shadow:none !important;
}

html body.cymart-theme-light .page-login .login-subtitle,
html body.cymart-theme-light .page-login .security-note,
html body.cymart-theme-light .page-login .security-note span,
html body.cymart-theme-light .page-login .text-right,
html body.cymart-theme-light .page-login .text-right a,
html body.cymart-theme-light .page-login .text-right .cursor-pointer,
html body:not(.cymart-theme-dark) .page-login .login-subtitle,
html body:not(.cymart-theme-dark) .page-login .security-note,
html body:not(.cymart-theme-dark) .page-login .security-note span,
html body:not(.cymart-theme-dark) .page-login .text-right,
html body:not(.cymart-theme-dark) .page-login .text-right a,
html body:not(.cymart-theme-dark) .page-login .text-right .cursor-pointer {
  color:#151c31 !important;
  text-shadow:0 1px 1px rgba(255,255,255,.68) !important;
  opacity:1 !important;
}

html body.cymart-theme-light .cymart-imei-page .card-product,
html body.cymart-theme-light .cymart-imei-page .card-product *:not(.badge):not(i),
html body.cymart-theme-light .cymart-imei-page .card-search,
html body.cymart-theme-light .cymart-imei-page .card-search label {
  color:#17244f !important;
  text-shadow:0 1px 1px rgba(255,255,255,.45) !important;
}

/* ---------- robust rotating perimeter ray ---------- */
html body .cymart-recharge-panel {
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  border:0 !important;
  background:transparent !important;
  border-radius:24px !important;
  z-index:0 !important;
}

/* rotating gradient layer: transform-only animation for browser compatibility */
html body .cymart-recharge-panel::before {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:-130% !important;
  z-index:0 !important;
  pointer-events:none !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  -webkit-mask:none !important;
  mask:none !important;
  filter:none !important;
  transform-origin:50% 50% !important;
  animation:cymartRechargeRaySpin 4.1s linear infinite !important;
}

html body.cymart-theme-light .cymart-recharge-panel::before,
html body:not(.cymart-theme-dark) .cymart-recharge-panel::before {
  background:conic-gradient(
    from 0deg,
    rgba(255,255,255,0) 0deg 252deg,
    rgba(255,255,255,0) 268deg,
    #ffffff 286deg,
    #86c7ff 300deg,
    #617cff 315deg,
    #a967ff 330deg,
    rgba(255,255,255,0) 346deg 360deg
  ) !important;
}

html body.cymart-theme-dark .cymart-recharge-panel::before {
  background:conic-gradient(
    from 0deg,
    rgba(255,255,255,0) 0deg 252deg,
    rgba(255,255,255,0) 268deg,
    #ffffff 286deg,
    #ffb0dc 300deg,
    #ff7fbd 315deg,
    #9a6bff 330deg,
    rgba(255,255,255,0) 346deg 360deg
  ) !important;
}

/* inner surface. It covers the rotating layer except for a clean 2px ring */
html body .cymart-recharge-panel::after {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:2px !important;
  z-index:1 !important;
  pointer-events:none !important;
  width:auto !important;
  height:auto !important;
  top:2px !important;
  right:2px !important;
  bottom:2px !important;
  left:2px !important;
  padding:0 !important;
  border-radius:22px !important;
  animation:none !important;
  transform:none !important;
  box-shadow:none !important;
  filter:none !important;
}

html body.cymart-theme-light .cymart-recharge-panel::after,
html body:not(.cymart-theme-dark) .cymart-recharge-panel::after {
  background:rgba(250,252,255,.93) !important;
  border:1px solid rgba(255,255,255,.55) !important;
}

html body.cymart-theme-dark .cymart-recharge-panel::after {
  background:linear-gradient(145deg,rgba(31,24,62,.94),rgba(50,26,65,.90)) !important;
  border:1px solid rgba(255,255,255,.07) !important;
}

/* keep actual panel contents above both pseudo layers */
html body .cymart-recharge-panel > * {
  position:relative !important;
  z-index:2 !important;
}

/* glow that follows the overall panel without detaching from the border */
html body.cymart-theme-light .cymart-recharge-panel,
html body:not(.cymart-theme-dark) .cymart-recharge-panel {
  box-shadow:0 18px 42px rgba(71,109,187,.12), 0 0 18px rgba(103,119,255,.12) !important;
}

html body.cymart-theme-dark .cymart-recharge-panel {
  box-shadow:0 22px 48px rgba(7,4,24,.30), 0 0 22px rgba(255,116,192,.10) !important;
}

@keyframes cymartRechargeRaySpin {
  from { transform:rotate(0deg) !important; }
  to   { transform:rotate(360deg) !important; }
}

@media (max-width:767.98px) {
  html body .cymart-recharge-panel {
    border-radius:18px !important;
  }
  html body .cymart-recharge-panel::after {
    inset:2px !important;
    border-radius:16px !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  html body .cymart-recharge-panel::before {
    animation:cymartRechargeRaySpin 8s linear infinite !important;
  }
}

/* ======================================================================
   V16.7 FINAL — LIGHT LOGIN SURFACES + SVG PERIMETER RAY
   ====================================================================== */

/* LIGHT MODE: breadcrumb/header strip on login must be light with dark text */
html body.cymart-theme-light .cymart-login-breadcrumb-area,
html body:not(.cymart-theme-dark) .cymart-login-breadcrumb-area {
  background:rgba(255,255,255,.88) !important;
  color:#17223f !important;
  border-color:rgba(122,158,226,.30) !important;
  box-shadow:0 8px 24px rgba(83,112,170,.10) !important;
  backdrop-filter:blur(14px) saturate(108%) !important;
  -webkit-backdrop-filter:blur(14px) saturate(108%) !important;
}
html body.cymart-theme-light .cymart-login-breadcrumb-area *,
html body:not(.cymart-theme-dark) .cymart-login-breadcrumb-area * {
  color:#17223f !important;
  text-shadow:0 1px 1px rgba(255,255,255,.70) !important;
  opacity:1 !important;
}

/* LIGHT MODE: footer becomes light, text dark */
html body.cymart-theme-light .cymart-login-footer,
html body.cymart-theme-light .cymart-login-footer .footer-top,
html body.cymart-theme-light .cymart-login-footer .footer-bottom,
html body:not(.cymart-theme-dark) .cymart-login-footer,
html body:not(.cymart-theme-dark) .cymart-login-footer .footer-top,
html body:not(.cymart-theme-dark) .cymart-login-footer .footer-bottom {
  background:rgba(249,252,255,.94) !important;
  color:#17223f !important;
  border-color:rgba(123,158,226,.24) !important;
  box-shadow:none !important;
}
html body.cymart-theme-light .cymart-login-footer p,
html body.cymart-theme-light .cymart-login-footer span,
html body.cymart-theme-light .cymart-login-footer div,
html body.cymart-theme-light .cymart-login-footer li,
html body.cymart-theme-light .cymart-login-footer h1,
html body.cymart-theme-light .cymart-login-footer h2,
html body.cymart-theme-light .cymart-login-footer h3,
html body.cymart-theme-light .cymart-login-footer h4,
html body.cymart-theme-light .cymart-login-footer h5,
html body.cymart-theme-light .cymart-login-footer h6,
html body.cymart-theme-light .cymart-login-footer a,
html body.cymart-theme-light .cymart-login-footer .nav-link,
html body:not(.cymart-theme-dark) .cymart-login-footer p,
html body:not(.cymart-theme-dark) .cymart-login-footer span,
html body:not(.cymart-theme-dark) .cymart-login-footer div,
html body:not(.cymart-theme-dark) .cymart-login-footer li,
html body:not(.cymart-theme-dark) .cymart-login-footer h1,
html body:not(.cymart-theme-dark) .cymart-login-footer h2,
html body:not(.cymart-theme-dark) .cymart-login-footer h3,
html body:not(.cymart-theme-dark) .cymart-login-footer h4,
html body:not(.cymart-theme-dark) .cymart-login-footer h5,
html body:not(.cymart-theme-dark) .cymart-login-footer h6,
html body:not(.cymart-theme-dark) .cymart-login-footer a,
html body:not(.cymart-theme-dark) .cymart-login-footer .nav-link {
  color:#17223f !important;
  text-shadow:none !important;
  opacity:1 !important;
}
html body.cymart-theme-light .cymart-login-footer .btn-newsletter,
html body:not(.cymart-theme-dark) .cymart-login-footer .btn-newsletter {
  background:rgba(255,255,255,.95) !important;
  color:#17223f !important;
  border:1px solid rgba(122,96,235,.46) !important;
}

/* Disable every previous pseudo-element ray implementation. The new ray is SVG. */
html body .cymart-recharge-panel::before,
html body .cymart-recharge-panel::after {
  content:none !important;
  display:none !important;
  animation:none !important;
}

/* Restore actual panel surface after disabling pseudo inner layers. */
html body.cymart-theme-light .cymart-recharge-panel,
html body:not(.cymart-theme-dark) .cymart-recharge-panel {
  position:relative !important;
  overflow:visible !important;
  isolation:isolate !important;
  background:rgba(250,252,255,.91) !important;
  border:1px solid rgba(128,158,235,.22) !important;
  border-radius:24px !important;
  box-shadow:0 18px 42px rgba(71,109,187,.12) !important;
}
html body.cymart-theme-dark .cymart-recharge-panel {
  position:relative !important;
  overflow:visible !important;
  isolation:isolate !important;
  background:linear-gradient(145deg,rgba(31,24,62,.92),rgba(50,26,65,.87)) !important;
  border:1px solid rgba(255,156,211,.18) !important;
  border-radius:24px !important;
  box-shadow:0 22px 48px rgba(7,4,24,.30) !important;
}

/* Explicit SVG border ray: reliable across browsers and independent of pseudo-elements. */
html body .cymart-recharge-ray-svg {
  display:block !important;
  position:absolute !important;
  inset:-2px !important;
  width:calc(100% + 4px) !important;
  height:calc(100% + 4px) !important;
  z-index:50 !important;
  pointer-events:none !important;
  overflow:visible !important;
  border-radius:inherit !important;
}
html body .cymart-recharge-ray-base,
html body .cymart-recharge-ray-beam {
  fill:none !important;
  vector-effect:non-scaling-stroke !important;
}
html body .cymart-recharge-ray-base {
  stroke-width:1.4 !important;
}
html body.cymart-theme-light .cymart-recharge-ray-base,
html body:not(.cymart-theme-dark) .cymart-recharge-ray-base {
  stroke:rgba(108,130,255,.24) !important;
}
html body.cymart-theme-dark .cymart-recharge-ray-base {
  stroke:rgba(255,141,205,.22) !important;
}
html body .cymart-recharge-ray-beam {
  stroke-width:3.2 !important;
  stroke-linecap:round !important;
  stroke-dasharray:155 845 !important;
  stroke-dashoffset:0 !important;
  animation:cymartSvgPerimeterRay 4.2s linear infinite !important;
}
html body.cymart-theme-light .cymart-recharge-ray-beam,
html body:not(.cymart-theme-dark) .cymart-recharge-ray-beam {
  stroke:#708cff !important;
  filter:drop-shadow(0 0 4px #ffffff) drop-shadow(0 0 8px #647cff) drop-shadow(0 0 12px #a567ff) !important;
  animation:cymartSvgPerimeterRay 4.2s linear infinite, cymartSvgRayLightColor 4.2s ease-in-out infinite !important;
}
html body.cymart-theme-dark .cymart-recharge-ray-beam {
  stroke:#ff8fc9 !important;
  filter:drop-shadow(0 0 4px #ffffff) drop-shadow(0 0 8px #ff75bd) drop-shadow(0 0 12px #9b69ff) !important;
  animation:cymartSvgPerimeterRay 4.2s linear infinite, cymartSvgRayDarkColor 4.2s ease-in-out infinite !important;
}
html body .cymart-recharge-panel > :not(.cymart-recharge-ray-svg) {
  position:relative !important;
  z-index:2 !important;
}

@keyframes cymartSvgPerimeterRay {
  from { stroke-dashoffset:0; }
  to { stroke-dashoffset:-1000; }
}
@keyframes cymartSvgRayLightColor {
  0%,100% { stroke:#72b6ff; }
  50% { stroke:#a96dff; }
}
@keyframes cymartSvgRayDarkColor {
  0%,100% { stroke:#ff99cf; }
  50% { stroke:#9f6dff; }
}

@media (max-width:767.98px) {
  html body .cymart-recharge-ray-beam {
    stroke-width:2.7 !important;
    stroke-dasharray:125 875 !important;
  }
}
