
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');

[data-status]{display:inline-flex;align-items:center;gap:5px;padding: 2px 7px;border-radius: 11px;font-weight:500;white-space:nowrap;}
.service-id {background: #e0e7ff;color: #4338ca;padding: 2px 8px;border-radius: 3px;}
.stage{display:grid;place-items:center;margin-bottom:16px;}
.card{box-shadow: var(--shadow-2);width:100%;background:var(--color-3);border-radius:18px;border:var(--border);overflow:hidden;}
.card__head{display:flex;gap:12px;align-items:flex-start;padding:16px 16px 14px;}
.tile{width:44px;height:44px;border-radius:12px;border:var(--border);color:var(--color-1);display:grid;place-items:center;flex-shrink:0;}
.head__body{flex:1;min-width:0;}
.head__meta{display:flex;align-items:center;gap:6px;margin-bottom:4px;}
.meta__service{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--color-7);text-transform:uppercase;}
.meta__dot{width:3px;height:3px;border-radius:99px;background:var(--color-7);opacity:.5;}
.meta__date{font-size:12px;color:var(--color-7);}
.head__title{margin:0;font-size:15px;line-height:1.3;color:var(--color-1);}
.pulse-dot{width:6px;height:6px;border-radius:99px;background:currentColor;display:inline-block;margin-right:4px;animation:pulseDot 1.6s ease-in-out infinite;}
@keyframes pulseDot{0%,100%{opacity:1;}50%{opacity:.3;}}
.strip{margin-bottom: 10px;margin:0 16px;padding:10px 14px;background:var(--accent-light);border-radius:12px;display:flex;align-items:center;gap:10px;}
.strip__icon{color:var(--color-7);flex-shrink:0;}
.strip__link{flex:1;min-width:0;font-size:13px;color:var(--primary);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.strip__copy{appearance:none;border:0;background:#ffa50020;display:inline-flex;align-items:center;gap:5px;padding:4px 6px;border-radius:7px;color:#ffa500;font-size:12px;font-weight:600;cursor:pointer;}
.strip__copy:hover{background:var(--primary-soft);color:var(--accent-dark);}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 16px;}
.stat{display:flex;flex-direction:column;gap:3px;}
.stat__label{font-size:10px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--color-7);}
.stat__value{font-size:15px;font-weight:500;color:var(--color-1);}
.actions{display:flex;gap:8px;padding:12px 16px 16px;}
.btn--ghost{flex:1;background:var(--accent-light);color:var(--color-1);border:var(--border);border-radius:11px;height:42px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background .15s;}
.btn--ghost:hover{background:var(--primary-soft);color:var(--primary);}
.ord-modal-dialog{max-width:520px;}
.ord-modal-content{background:var(--color-3)!important;border:var(--border)!important;border-radius:20px!important;overflow:hidden!important;box-shadow:0 24px 60px rgba(0,0,0,.2)!important;position:relative;}
.ord-modal-content::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary),var(--accent));z-index:1;}
.ord-modal-head{display:flex;align-items:center;justify-content:space-between;padding:15px;}
.ord-modal-head-left{display:flex;align-items:center;gap:12px;}
.ord-modal-icon{width:42px;height:42px;border-radius:11px;background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
.ord-modal-title{font-size:16px;font-weight:800;color:var(--color-1);line-height:1.2;}
.ord-modal-id{font-size:13px;color:var(--color-7);font-weight:600;margin-top:3px;display:flex;align-items:center;gap:6px;}
.ord-copy-btn{background:none;border:none;cursor:pointer;color:var(--color-7);font-size:13px;padding:2px 5px;border-radius:5px;transition:color .15s;}
.ord-copy-btn:hover{color:var(--primary);}
.ord-close{background:none;border:none;font-size:22px;color:var(--color-7);cursor:pointer;line-height:1;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:background .15s;}
.ord-close:hover{background:var(--accent-light);color:var(--color-1);}
.ord-status-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 22px;background:var(--accent-light);border-top:var(--border);border-bottom:var(--border);}
.ord-date{font-size:12.5px;color:var(--color-7);display:flex;align-items:center;gap:5px;}
.ord-modal-body{padding:15px;}
.ord-info-card{background:var(--accent-light);border:var(--border);border-radius:12px;overflow:hidden;margin-bottom:14px;}
.ord-info-row{display:flex;align-items:flex-start;justify-content:space-between;padding:10px 14px;gap:12px;border-bottom:var(--border);}
.ord-info-label{font-size:12px;font-weight:700;color:var(--color-7);display:flex;align-items:center;gap:6px;white-space:nowrap;flex-shrink:0;}
.ord-info-label i{font-size:13px;color:var(--primary);}
.ord-info-row:last-child{border-bottom:none;}
.ord-info-val{font-size:13px;font-weight:600;color:var(--color-1);text-align:right;word-break:break-all;}
.ord-info-link{font-size:13px;font-weight:600;color:var(--primary);text-align:right;word-break:break-all;text-decoration:none;}
.ord-info-link:hover{text-decoration:underline;color:var(--primary-h);}
.ord-stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px;}

.ord-stat-box{background:var(--accent-light);border:var(--border);border-radius:12px;padding:6px 8px;}
.ord-stat-label{display:block;font-size:10.5px;font-weight:700;color:var(--color-7);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;}
.ord-stat-val{display:block;font-size:20px;font-weight:600;color:var(--color-1);}
.ord-cancel-reason{display:flex;align-items:center;gap:8px;padding:11px 14px;background:rgba(239,68,68,.07);border:1px solid rgba(239,68,68,.2);border-radius:10px;color:#991b1b;font-size:13px;font-weight:500;margin-bottom:14px;}
:root.dark-mode .ord-cancel-reason{color:#fca5a5;background:rgba(239,68,68,.1);}
.ord-extra-field{margin-bottom:12px;}
.ord-extra-label{display:block;font-size:12px;font-weight:700;color:var(--color-7);margin-bottom:5px;text-transform:uppercase;letter-spacing:.4px;}
.ord-modal-foot{display:flex;flex-wrap:wrap;gap:8px;padding:15px;border-top:var(--border);}
 
.ord-btn-reorder{display:inline-flex;align-items:center;gap:7px;color: var(--button-color)!important;
    background-color: var(--accent);font-weight:700;padding:10px 18px;border-radius:10px;text-decoration:none!important;box-shadow:var(--btn-shadow);transition:opacity .2s;border:none;cursor:pointer;}
.ord-btn-reorder:hover{opacity:.9;}
.ord-btn-refill{display:inline-flex;align-items:center;gap:7px;background:rgba(16,185,129,.1);color:#065f46!important;font-weight:700;padding:10px 18px;border-radius:10px;text-decoration:none!important;border:1px solid rgba(16,185,129,.25);cursor:pointer;transition:background .15s;}
.ord-btn-refill:hover{background:rgba(16,185,129,.18);}
:root.dark-mode .ord-btn-refill{color:#34d399!important;background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.25);}
.ord-btn-cancel{display:inline-flex;align-items:center;gap:7px;background:rgba(239,68,68,.08);color:#991b1b!important;font-weight:700;padding:10px 18px;border-radius:10px;text-decoration:none!important;border:1px solid rgba(239,68,68,.2);transition:background .15s;}
.ord-btn-cancel:hover{background:rgba(239,68,68,.15);}
:root.dark-mode .ord-btn-cancel{color:#fca5a5!important;}
.ord-refilling{font-size:13px;color:var(--color-7);display:flex;align-items:center;padding:10px 0;}
.ord-btn-refill.disabled{opacity:.5;cursor:not-allowed;}


@media(max-width:500px){.ord-modal-dialog{margin:10px;}.ord-stats-grid{grid-template-columns:1fr 1fr;}.ord-btn-refill,.ord-btn-cancel{width:100%;justify-content:center;}}
.sub-head__body{flex:1;min-width:0;}
.sub-card{background:var(--color-3);border-radius:18px;border:var(--border);overflow:hidden;width:100%;}
.sub-card__head{display:flex;gap:12px;align-items:flex-start;padding:16px;}
.sub-head__meta{display:flex;align-items:center;gap:6px;margin-bottom:3px;}
.sub-meta__id{font-size:11px;font-weight:700;color:var(--color-7);cursor:pointer;}
.sub-meta__dot{width:3px;height:3px;border-radius:99px;background:var(--color-7);opacity:.5;}
.sub-meta__date{font-size:11px;color:var(--color-7);}
.sub-head__title{margin:0;font-size:14px;font-weight:700;line-height:1.3;color:var(--color-1);}
.sub-username{font-size:12.5px;color:var(--primary);font-weight:600;margin-top:3px;display:flex;align-items:center;gap:4px;}
.sub-pulse-dot{width:6px;height:6px;border-radius:99px;background:currentColor;display:inline-block;margin-right:4px;animation:pulseDot 1.6s ease-in-out infinite;}
.sub-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:12px 16px;border-top:var(--border);}
.sub-stat{display:flex;flex-direction:column;gap:2px;}
.sub-stat__label{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--color-7);}
.sub-stat__val{font-size:14px;font-weight:700;color:var(--color-1);}
.sub-dates{display:flex;justify-content:space-between;padding:8px 16px;background:var(--accent-light);font-size:12px;color:var(--color-7);font-weight:500;gap:8px;}
.sub-dates span{display:flex;align-items:center;gap:5px;}
.sub-actions{display:flex;gap:8px;padding:12px 16px 16px;flex-wrap:wrap;border-top:var(--border);}
.sub-ghost-btn{flex:1;background:var(--color-4);color:var(--color-1);border:var(--border);border-radius:11px;height:40px;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background .15s;}
.sub-ghost-btn:hover{background:var(--primary-soft);color:var(--primary);}
.sub-action-btn{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13px;font-family:'Manrope',sans-serif;padding:8px 14px;border-radius:10px;text-decoration:none!important;transition:background .15s;}
.sub-cancel-btn{background:rgba(239,68,68,.08);color:#991b1b!important;border:1px solid rgba(239,68,68,.2);}
.sub-cancel-btn:hover{background:rgba(239,68,68,.15);}
.sub-resume-btn{background:rgba(16,185,129,.1);color:#065f46!important;border:1px solid rgba(16,185,129,.25);}
.sub-resume-btn:hover{background:rgba(16,185,129,.18);}
.sub-reorder-btn{background:var(--btn-grad);color:#fff!important;border:none;box-shadow:var(--btn-shadow);}
.sub-reorder-btn:hover{opacity:.9;}

.clamp-2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.clamp-2-url{overflow-wrap:anywhere;word-break:break-word;}
@media (max-width: 691.98px) {
    .well.well-float {
        
        background: var(--bg-white);
    }
}

:root {
    --bf-sidebar-w: 260px;
    --bf-sidebar-bg: #ffffff;
    --bf-sidebar-fg: #0d0d12;
    --bf-sidebar-muted: rgba(13,13,18,0.55);
    --bf-sidebar-border: rgba(13,13,18,0.07);
    --bf-sidebar-hover: #F4F4F6;
    --bf-sidebar-active-bg: #F4F4F6;
    --bf-sidebar-active-fg: #0d0d12;
    --bf-accent: #7c6cf0;
    --bf-accent-soft: rgba(255,122,26,0.10);
  }
  .dark-mode :root, html.dark-mode {
    --bf-sidebar-bg: #0f0f12;
    --bf-sidebar-fg: #f4f4f6;
    --bf-sidebar-muted: rgba(244,244,246,0.55);
    --bf-sidebar-border: rgba(255,255,255,0.07);
    --bf-sidebar-hover: rgba(255,255,255,0.05);
    --bf-sidebar-active-bg: rgba(255,255,255,0.06);
    --bf-sidebar-active-fg: #ffffff;
  }
ul.dropdown-menu.orders {
    bottom: unset !important;
}
  body.has-sidebar #main-content,
  body.has-sidebar > footer:not(.footer-top) {
    margin-left: 0;
  }
  @media (min-width: 992px) {
    body.has-sidebar #main-content {
      margin-left: var(--bf-sidebar-w);
    }
    body.has-sidebar .navbar.navbar-default.navbar-static-top { display: none; }
    body.has-sidebar .mob-nav { display: none; }
  }
  body.has-sidebar > nav.navbar.navbar-default.navbar-static-top { display: none !important; }
  .bf-topbar { display: none; }
  @media (max-width: 991.98px) {
    body.has-sidebar .bf-topbar--mobile {
      display: flex;
      position: sticky;
      top: 0;
      z-index: 1040;
      align-items: center;
      gap: 12px;
      height: 56px;
      padding: 0 14px;
      background: var(--bf-sidebar-bg);
      border-bottom: 0.5px solid var(--bf-sidebar-border);
    }
    .bf-topbar__hamburger {
      appearance: none; border: 0; background: transparent;
      width: 40px; height: 40px; border-radius: 10px;
      color: var(--bf-sidebar-fg); cursor: pointer;
      display: inline-grid; place-items: center;
    }
    .bf-topbar__hamburger:hover { background: var(--bf-sidebar-hover); }
    .bf-topbar__hamburger i { font-size: 18px; }
    .bf-topbar__brand {
      flex: 1; min-width: 0;
      font-size: 16px; letter-spacing: -0.01em;
      color: var(--bf-sidebar-fg); text-decoration: none;
      display: inline-flex; align-items: center; gap: 2px;
    }
    .bf-topbar__brand img { height: 26px; width: auto; }
    .bf-topbar__balance {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 8px 12px; border-radius: 10px;
      background: var(--bf-sidebar-hover);
      color: var(--bf-sidebar-fg); text-decoration: none;
       font-weight: 700;
    }
    .bf-topbar__balance i {}
  }

 
  .bf-sidebar {
    position: fixed;
    top: 0; left: 0; bottom: 0;
    width: var(--bf-sidebar-w);
    z-index: 1050;
    background: var(--bf-sidebar-bg);
    border-right: 0.5px solid var(--bf-sidebar-border);
    display: flex;
    flex-direction: column;
    color: var(--bf-sidebar-fg);
    transition: transform 220ms cubic-bezier(.2,.7,.2,1);
  }
  .bf-brand {
    display: flex; align-items: center; gap: 10px;
    padding: 16px 16px 14px;
    text-decoration: none;
    border-bottom: 0.5px solid var(--bf-sidebar-border);
  }
  .bf-brand__mark {
    width: 32px; height: 32px;
    border-radius: 8px;
    border: var(--border);
    color: #fff;
    display: grid; place-items: center;
    font-size: 14px; font-weight: 800;
    flex-shrink: 0;
    overflow: hidden;
  }
  .bf-brand__mark img { width: 100%; height: 100%; object-fit: cover; }
  .bf-brand__name {font-size: 15px;color: var(--bf-sidebar-fg);white-space: nowrap; overflow: hidden; text-overflow: ellipsis;letter-spacing: .2px;}
  .bf-brand__name img { height: 22px; width: auto; }
  .bf-nav {flex: 1;overflow-y: auto;padding: 8px 10px 12px;scrollbar-width: thin;scrollbar-color: rgba(0,0,0,0.15) transparent;}
  .bf-nav::-webkit-scrollbar { width: 6px; }
  .bf-nav::-webkit-scrollbar-thumb {background: rgba(0,0,0,0.12);border-radius: 4px;}

  .bf-nav__section + .bf-nav__section { margin-top: 14px; }

  .bf-nav__heading {font-size: 10.5px;font-weight: 700;letter-spacing: 0.08em;text-transform: uppercase;color: var(--bf-sidebar-muted);padding: 8px 12px 6px;}

  .bf-nav__list {
    list-style: none;
    margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 2px;
  }

  .bf-nav__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    border-radius: 9px;
    text-decoration: none;
    color: var(--bf-sidebar-fg);
    
    
    line-height: 1.2;
    transition: background .12s ease, color .12s ease;
    position: relative;
  }
  .bf-nav__item:hover {
    background: var(--bf-sidebar-hover);
    color: var(--bf-sidebar-fg);
    text-decoration: none;
  }
  .bf-nav__item.is-active {
    background: var(--bf-sidebar-active-bg);
    color: var(--bf-sidebar-active-fg);
  }
  .bf-nav__item.is-active::before {
    content: '';
    position: absolute;
    left: 4px; top: 8px; bottom: 8px;
    width: 2px; border-radius: 2px;
    background: var(--bf-sidebar-active-fg);
  }

  .bf-nav__icon {
    width: 18px;
    font-size: 16px;
    text-align: center;
    color: var(--bf-sidebar-muted);
    flex-shrink: 0;
  }
  .bf-nav__item.is-active .bf-nav__icon { }

  .bf-nav__label {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .bf-nav__badge {
    background: linear-gradient(135deg, #f59e0b, #ef4444);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 999px;
    letter-spacing: 0.02em;
  }

  /* ── sidebar footer (balance + profile) ── */
  .bf-sidebar__foot {
    border-top: 0.5px solid var(--bf-sidebar-border);
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .bf-balance {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--accent-light);
    color: var(--bf-sidebar-fg);
    text-decoration: none;
    transition: background .12s;
    border: var(--border);
  }
  .bf-balance:hover { text-decoration: none; color: var(--bf-sidebar-fg); border: var(--border);
    background: transparent;}
  .bf-balance__label {flex: 1;font-size: 11px;font-weight: 700;text-transform: uppercase;letter-spacing: 0.06em;color: var(--bf-sidebar-muted);}
  .bf-balance__value {
    font-size: 14px; font-weight: 600;
    color: var(--bf-sidebar-fg);
    font-variant-numeric: tabular-nums;
  }
  .bf-balance i {
    font-size: 16px;
  }

  .bf-profile {
    position: relative;
  }
  .bf-profile__btn {
    width: 100%;
    appearance: none;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    cursor: pointer;
    color: var(--bf-sidebar-fg);
    text-align: left;
    transition: background .12s;
  }
  .bf-profile__btn:hover { background: var(--bf-sidebar-hover); }
  .bf-profile__avatar {
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--accent);
    color: #fff;
    display: grid; place-items: center;
    font-size: 13px; font-weight: 700;
    flex-shrink: 0;
    text-transform: uppercase;
  }
  .bf-profile__meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.2;
  }
  .bf-profile__name {
     font-weight: 600;
    color: var(--bf-sidebar-fg);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .bf-profile__sub {
    font-size: 11px;
    color: var(--bf-sidebar-muted);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .bf-profile__caret {
    color: var(--bf-sidebar-muted);
    font-size: 12px;
    flex-shrink: 0;
  }
  .bf-profile__menu {
    width: calc(100% - 0px);
    min-width: 200px;
    margin-bottom: 6px;
    padding: 6px;
    border-radius: 12px;
    border: 0.5px solid var(--bf-sidebar-border);
    box-shadow: 0 12px 36px rgba(0,0,0,0.12);
  }
  .bf-profile__menu > li > a {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    
    color: var(--bf-sidebar-fg);
  }
  .bf-profile__menu > li > a:hover {
    background: var(--bf-sidebar-hover);
  }
  .bf-profile__menu > li > a i {
    width: 16px; text-align: center;
    color: var(--bf-sidebar-muted);
  }
  .bf-profile__menu .divider {
    margin: 4px 6px;
    background: var(--bf-sidebar-border);
  }

  .bf-sidebar-backdrop {
    display: none;
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 1045;
    opacity: 0;
    transition: opacity .2s;
  }
  @media (max-width: 991.98px) {
    .bf-sidebar {
      transform: translateX(-100%);
      box-shadow: 0 0 40px rgba(0,0,0,0.12);
    }
    body.bf-sidebar-open .bf-sidebar {
      transform: translateX(0);
    }
    body.bf-sidebar-open .bf-sidebar-backdrop {
      display: block;
      opacity: 1;
    }
    .mob-nav { z-index: 1030; }
  }

  [dir="rtl"] .bf-sidebar,
  body.rtl .bf-sidebar,
  html[lang="ar"] .bf-sidebar {
    right: 0;
    border-right: 0;
    border-left: 0.5px solid var(--bf-sidebar-border);
  }
  @media (min-width: 992px) {
    [dir="rtl"] body.has-sidebar #main-content,
    body.rtl.has-sidebar #main-content,
    html[lang="ar"] body.has-sidebar #main-content {
      
    }
  }
  [dir="rtl"] .bf-nav__item.is-active::before,
  body.rtl .bf-nav__item.is-active::before {
    left: auto; right: 4px;
  }
  @media (max-width: 991.98px) {
    [dir="rtl"] .bf-sidebar,
    body.rtl .bf-sidebar { transform: translateX(100%); }
    [dir="rtl"] body.bf-sidebar-open .bf-sidebar,
    body.rtl.bf-sidebar-open .bf-sidebar { transform: translateX(0); }
  }
:root.white-mode {
  --color-1:              #0d1117;
  --color-2:              #fafafa;
  --color-3:              #ffffff;
  --color-4:              #f5f3ff;
  --color-5:              #e5e7eb;
  --color-6:              #ef4444;
  --color-7:              #4b5563;
  --white:                #ffffff;
  --color-9:              #e5e7eb;
  --shadow:               0 4px 20px rgba(95,77,238,.10), 0 1px 4px rgba(0,0,0,.06);
  --shadow-2:             0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05);
  --shadow-500:           0 2px 8px rgba(95,77,238,.08), 0 1px 3px rgba(0,0,0,.05);
  --border:               1px solid #f1f1f3;
  --color-10:             #fee2e2;
  --color-11:             #f8f7ff;
  --color-12:             #5f4dee;
  --td-range-bg:          #5f4dee;
  --color-btn-primary:    #5f4dee;
  --color-btn-text-primary: #ffffff;
  --color-btn-primary-hover: #4535c7;
  --body-background:      #fff;
  --table-striped:        #f5f3ff;
  --button-color:         #ffffff;
  --reload-1s:            linear-gradient(110deg,#ede9ff 8%,#f5f3ff 18%,#ede9ff 33%);
  --border-radius:        10px;
  --code-color:           #5f4dee;
  --code-back:            #ede9ff;
  --color-1-10:           rgba(95,77,238,.10);
  --btn-disabled:         #d1d5db;
  --btn-disabled-text:    #9ca3af;
  --color-bg:             #f8f7ff;

  /* New tokens */
  --accent: #000;
  --accent-dark:          #4535c7;
  --accent-light: #f6f6f6;
  --text-dark:            #0d1117;
  --text-mid:             oklch(55.6% 0 0);
  --text-light:           #9ca3af;
  --bg-white:             #ffffff;
  --bg-soft: #f6f6f6;
  --border-color:         #f1f1f3;
  --shadow-sm:            0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05);
  --shadow-md:            0 4px 20px rgba(95,77,238,.10), 0 1px 4px rgba(0,0,0,.06);
  --shadow-lg:            0 10px 40px rgba(95,77,238,.15), 0 2px 8px rgba(0,0,0,.08);
  --radius:               16px;
  --radius-sm:            10px;
}

/* ============================================================
   DARK MODE
   ============================================================ */
:root.dark-mode {
  --color-1:              #f1f5f9;
  --color-2:              #000;
  --color-3:              #13131a;
  --color-4:              #0d0d14;
  --color-5:              #2d2d3d;
  --color-6:              #f87171;
  --color-7:              #94a3b8;
  --white:                #13131a;
  --color-9:              #1e1e2e;
  --shadow:               0 4px 20px rgba(95,77,238,.20), 0 1px 4px rgba(0,0,0,.3);
  --shadow-2:             inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 0 1px rgba(255,255,255,.04);
  --border:               1px solid var(--bf-sidebar-border);
  --color-10:             rgba(239,68,68,.15);
  --color-11:             #0d0d14;
  --color-12:             #7c6cf0;
  --td-range-bg:          #7c6cf0;
  --color-btn-primary:    #7c6cf0;
  --color-btn-text-primary: #ffffff;
  --color-btn-primary-hover: #6b5de0;
  --color-a:              #a78bfa;
  --body-background:      #000;
  --table-striped:        #0f0f18;
  --button-color:         #ffffff;
  --reload-1s:            linear-gradient(110deg,#1a1a2e 8%,#252540 18%,#1a1a2e 33%);
  --border-radius:        10px;
  --code-color:           #a78bfa;
  --code-back:            rgba(167,139,250,.15);
  --color-1-10:           rgba(124,108,240,.15);
  --btn-disabled:         #2d2d3d;
  --btn-disabled-text:    #64748b;
  --color-bg:             #000;

  /* New tokens dark */
  --accent:               #7c6cf0;
  --accent-dark:          #6b5de0;
  --accent-light:         rgba(124,108,240,.15);
  --text-dark:            #f1f5f9;
  --text-mid:             #94a3b8;
  --text-light:           #64748b;
  --bg-white:             #0f0f12;
  --bg-soft:              #0d0d14;
  --border-color:         #1e1e2e;
  --shadow-sm:            0 1px 3px rgba(0,0,0,.3), 0 1px 2px rgba(0,0,0,.2);
  --shadow-md:            0 4px 20px rgba(124,108,240,.20), 0 1px 6px rgba(0,0,0,.3);
  --shadow-lg:            0 10px 40px rgba(124,108,240,.25), 0 2px 10px rgba(0,0,0,.4);
  --radius:               16px;
  --radius-sm:            10px;
}


:lang(ar) {
  font-family: 'Cairo', 'Nunito', sans-serif;
}
input.select2-selection.select2-selection--single.form-control {
/* box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);*/
}

.brand-pi, span.fab.fa-pinterest { color:#BD081C; }
i.fab.fa-tiktok.brand-tt, i.fab.fa-twitter.brand-x { color:var(--text-dark); }

.prefs-modal {
  border-radius:var(--radius);
  border:0;
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  background:var(--bg-white);
}
.prefs-header {
  padding:16px 20px;
  border-bottom:var(--border);
  background:var(--bg-white);
}
.prefs-title {
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  font-size:16px;
  color:var(--text-dark);
}
.prefs-emoji { font-size:18px; }
.prefs-close { font-size:26px; opacity:.6; cursor:pointer; }
.prefs-close:hover { opacity:1; }
.prefs-body { padding:18px; background:var(--bg-soft); }
.prefs-card {
  background:var(--bg-white);
  border-radius:var(--radius);
  padding:16px;
  margin-bottom:14px;
  border:var(--border);
  box-shadow:var(--shadow-sm);
}
.prefs-card-title { font-weight:800; color:var(--text-dark); margin-bottom:10px; font-size:13px; text-transform:uppercase; letter-spacing:.04em; }
.prefs-list {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(32%,1fr));
  gap:2px;
  max-height:280px;
  overflow:auto;
  padding-right:4px;
  -webkit-overflow-scrolling:touch;
}
.prefs-list::-webkit-scrollbar { width:6px; }
.prefs-list::-webkit-scrollbar-track { background:var(--bg-soft); border-radius:6px; }
.prefs-list::-webkit-scrollbar-thumb { background:var(--accent); border-radius:6px; }
.prefs-item {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  text-decoration:none !important;
  color:var(--text-dark);
  transition:background .12s ease, transform .05s ease, border-color .12s;
  border:var(--border);
  margin:3px;
  cursor:pointer;
}
.prefs-item:hover {
  background:var(--accent-light);
  border-color:var(--accent);
  transform:translateY(-1px);
}
.prefs-item:active { transform:scale(0.995); }
.prefs-left { display:flex; align-items:center; gap:10px; }
.prefs-flag { width:22px; display:inline-flex; justify-content:center; opacity:.9; }
.prefs-text { font-weight:600; color:var(--text-dark); font-size:13px; }
.prefs-muted { color:var(--text-light); font-weight:500; font-size:12px; }
.prefs-check { color:#22c55e; font-weight:900; }
.prefs-item.is-active {
  border-color:var(--accent);
  background:var(--accent-light);
  box-shadow:0 0 0 3px rgba(95,77,238,.12);
}
.prefs-special { background-color:#fffbeb; }
a.prefs-item.prefs-special .prefs-text { color:#92400e; }
.prefs-special:hover { background:#fef3c7; border-color:#fde68a; }


@media(max-width:500px) {
 
  p.bf-sub { padding:0 10px; }
  .alert.alert-dismissible.alert-danger.below { border-radius:0; }
  
  .low-balance-box { border-radius:0 !important; }
}

button.navbar-toggle.collapsed:hover { background:var(--accent-light); }
.checkbox label { display:flex; align-items:center; gap:4px; }

a.btn.btn-xs.btn-primary:hover {
  background:transparent;
  color:var(--accent);
  border:1px solid var(--accent);
}
.btn:focus { outline:none; }


a.ticket.view {
  text-decoration:none;
  color:var(--accent);
  padding:2px 0;
  border-radius:8px;
  white-space:nowrap;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-weight:600;
}

@media(min-width:850px){
  .col-md-8.col-md-offset-2.new.\32 { width:100%; margin-top:0; }
  .col-lg-3.col-md-6.col-12 { width:33.33%; }
}

.payment-container {
  padding:24px 0;
  width:100%;
  display:flex;
  justify-content:center;
}
.payment-card {
  border-radius:var(--radius);
  width:100%;
  max-width:500px;
}
.payment-header { margin-bottom:20px; text-align:center; }
.payment-header h3 { margin:0 0 8px; color:var(--text-dark); font-weight:800; }
.payment-header p { margin:0; color:var(--text-mid); }

.amount-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:20px; }
.pay-btn {
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:var(--bg-white);
  color:var(--text-dark);
  padding:14px 18px;
  border-radius:var(--radius-sm);
  text-decoration:none;
  font-weight:600;
  transition:all .2s ease;
  border:var(--border);
  box-shadow:var(--shadow-sm);
}
.pay-btn:hover {
  background:var(--accent);
  color:#fff;
  transform:translateY(-2px);
  text-decoration:none;
  box-shadow:var(--shadow-md);
  border-color:var(--accent);
}
.pay-btn i { font-size:12px; opacity:.4; }
.payment-footer { text-align:center; border-top:var(--border); padding-top:20px; }
.payment-footer p { margin-bottom:14px; color:var(--text-mid); }
.ticket-link {
  background:var(--bg-soft);
  padding:5px 14px;
  border-radius:8px;
  text-decoration:none;
  font-weight:600;
  margin:0 4px;
  border:var(--border);
  color:var(--text-dark);
  transition:all .15s;
  font-size:13px;
}
.ticket-link:hover { background:var(--accent); color:#fff; text-decoration:none; border-color:var(--accent); }
.payment-methods-img {
  box-shadow:var(--shadow-sm);
  height:auto;
  border-radius:8px;
  filter:grayscale(20%);
  transition:filter .3s;
}
.payment-methods-img:hover { filter:grayscale(0%); }


.title.user-balance.funds { color:var(--text-dark); margin-right:14px; font-weight:800; }
li.funds { display:flex; align-items:center; justify-content:space-between; }

.panel-showcase { padding:56px 15px; background:var(--bg-white); }
.showcase-container { max-width:1200px; margin:0 auto; }
.showcase-header { text-align:center; margin-bottom:36px; }
.showcase-header h2 { font-size:26px; font-weight:800; color:var(--text-dark); }
.showcase-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; }
.showcase-item { text-align:center; }
.image-box {
  position:relative; width:100%; aspect-ratio:4/3;
  border-radius:var(--radius); overflow:hidden;
  border:var(--border); box-shadow:var(--shadow-sm);
  cursor:pointer; background:var(--bg-soft);
  transition:box-shadow .2s;
}
.image-box:hover { box-shadow:var(--shadow-md); }
.image-box img { width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .4s ease; }
.image-box:hover img { transform:scale(1.04); }
.overlay {
  position:absolute; top:0; left:0; width:100%; height:100%;
  background:rgba(13,17,23,.45); display:flex;
  align-items:center; justify-content:center; opacity:0; transition:opacity .3s;
}
.overlay span { color:#fff; border:1px solid rgba(255,255,255,.8); padding:8px 20px; border-radius:20px; font-size:13px; font-weight:600; }
.image-box:hover .overlay { opacity:1; }
.showcase-item h3 { margin-top:14px; font-size:16px; font-weight:700; color:var(--text-dark); }
@media(max-width:600px){ .showcase-grid { grid-template-columns:1fr; } }

/* Platform brand */
.platform-info { display:flex; align-items:center; gap:14px; font-weight:700; font-size:15px; }
.platform-info i { font-size:15px; }
.brand-ig { color:#E1306C; }
.brand-tt { color:var(--text-dark); }
.brand-fb { color:#1877F2; }
.brand-yt { color:#FF0000; }
.brand-x  { color:var(--text-dark); }
.brand-tg { color:#26A5E4; }
.brand-sp { color:#1DB954; }
.brand-db { color:#5865F2; }
.brand-li { color:#0A66C2; }
.brand-tw { color:#9146FF; }
.brand-sc { color:#FFFC00; text-shadow:0 0 1px #000; }


.skeleton {
  background:var(--reload-1s);
  background-size:200% 100%;
  animation:shine 1.5s linear infinite;
  color:transparent !important;
  border-radius:var(--radius-sm);
  min-height:1em;
  will-change:background-position;
  transform:translateZ(0);
}
@keyframes shine { to { background-position-x:-200%; } }


ul.footer-nav.6 {
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:10px;
}


button.services-list-filter i { width:20px; }
.platform-buttons.social {
  grid-template-columns:none;
  overflow-x:auto;
  overflow-y:hidden;
  display:flex;
  gap:7px;
}
.platform-selection.social { margin:1px 0; }
.well.social { padding:8px 15px; }
.fa-spotify { color:#1DB954; }

/* == SERVICE LIST == */
.service-list { list-style:none; padding:0; margin:0; gap:4px; display:grid; grid-template-columns:1fr 1fr; }
.service-list li {
  padding:9px 10px;
  background:var(--bg-soft);
  border-radius:var(--radius-sm);
  font-size:13px;
  font-weight:500;
  color:var(--text-mid);
  display:flex;
  align-items:center;
  gap:12px;
  transition:.15s;
  border:var(--border);
}
.service-list li:hover { background:var(--accent-light); color:var(--accent); border-color:var(--accent); }
.service-list li i { font-size:13px; color:var(--accent); width:14px; }


.dropdown-menu li { float:none; display:block; }


.payment-methods {
  list-style:none;
  padding:0;
  margin-top:14px;
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}
.payment-methods li img {
  height:26px;
  transition:opacity .2s;
  border-radius:6px;
  border:var(--border);
  background:var(--bg-soft);
}
.payment-methods li img:hover { opacity:.85; }

.mob-nav-link li.active {
  background:var(--accent-light);
  border-radius:var(--radius-sm);
}
i.mob-nav-icon { font-size:19px; }

.list.nav.nav-pills {
  margin-top:0px;
}

.list.nav.nav-pills .neworder-item { flex:1; list-style:none; margin:1px; }
@media (min-width: 850px) {
    .list.nav.nav-pills .neworder-item {
        width: -webkit-fill-available;
    }
}

.order-status-wrap { display:flex; flex-wrap:wrap; align-items:flex-start; min-height:72px; }
.order-status-wrap .order-status-left { flex:0 0 25%; max-width:25%; padding-right:10px; }
.order-status-wrap .order-status-right { flex:0 0 75%; max-width:75%; padding-left:10px; }
.status { margin-bottom:0; text-align:center; padding:5px 10px; border-radius:20px; color:#fff; font-size:12px; font-weight:700; display:inline-block; }
.status-pending    { background:#f59e0b; }
.status-in-progress { background:var(--accent); }
.status-refund     { background:#f97316; }
.status-completed  { background:#22c55e; }
.status-procesing  { background:#0891b2; }
.status-canceled   { background:#ef4444; }
.status-partial    { background:#14b8a6; }

.navbar-badge.open { position:relative; }
#currencies-list {
  position:absolute; top:82%; left:0; z-index:1050;
  display:block; min-width:160px; border-radius:var(--radius-sm);
}
#currencies-list:not(.show) { display:none; }
.dropdown-toggle[aria-expanded="true"] + .dropdown-menu,
.open .dropdown-menu {
  display:block !important; bottom:100%; right:0; border-radius:10px;
}
.title.user-balance { cursor:pointer; }
@media(min-width:1300px){
.navbar-default .navbar-nav > li > a:hover{ border-radius: 10px; }
}

@media(max-width:1300px){
  .navbar-collapsed { overflow:auto !important; position:fixed; }
  .navbar-collapse { position:fixed; }
 
  .navbar-default .navbar-nav > .active > a { border-radius:0; }
}

.max-w-full { margin-top:20px; }
#faq .title { margin-bottom:40px; }
.text-center { text-align:center; }
@media(max-width:767px){ #faq .panel-heading a { padding-right:40px; } }
#faq .panel-heading a {
  display:block; padding:14px 18px; font-size:15px; font-weight:600;
  position:relative; text-decoration:none !important;
  background:var(--bg-soft); border:var(--border); border-radius:var(--radius-sm);
  color:var(--text-dark); transition:background .15s, color .15s;
}
#faq .panel-heading a:hover { background:var(--accent-light); color:var(--accent); }
.panel-title { margin:0; font-size:17px; color:var(--text-dark); font-weight:700; }
#faq .panel-heading { border:0; padding:0; }
#faq .panel-body {
  margin-top:10px; padding:18px; border-radius:var(--radius-sm);
  font-size:13px; line-height:1.55; color:var(--text-mid);
  background:var(--bg-soft); border:var(--border);
}
#faq .panel-default { background:0 0; border:0; margin-bottom:6px; }

.amount-button {
  display:inline-block; background:var(--accent); color:#fff;
  padding:.75rem 1rem 7.5px; border-radius:var(--radius-sm);
  text-decoration:none; font-weight:700; transition:background .15s; text-align:center; margin-bottom:4px;
}
a.amount-button:hover { color:#fff; background:var(--accent-dark); text-decoration:none; }
i.navbar-icon.far.fa-external-link { font-size:11px; }

.platform-buttons.services { display:flex; flex-direction:column; align-items:flex-start; }
.platform-buttons.services button { justify-content:space-between; border:1px dashed var(--border-color); }
.platform-buttons.services .service-icon { font-size:13px; margin-right:8px; color:var(--accent); line-height:1; }
.platform-buttons.services .service-text { overflow:hidden; text-overflow:ellipsis; text-align:left; white-space:nowrap; font-size:12px; }
.platform-buttons.services button:hover { border-color:var(--accent); border-style:solid; background:var(--accent-light); }
@media(max-width:1024px){ .platform-buttons.services { grid-template-columns:repeat(1,1fr); } }


.table-striped > li:nth-of-type(odd) { background:var(--table-striped); }
.table-striped > tr:nth-of-type(odd) { background:var(--table-striped); }

.form-control[readonly]:focus { box-shadow:none; }

a.btn.btn-sm.btn-primary { line-height:2.32; }

@media(min-width:1100px){ .col-lg-3.col-md-6.col-12 { width:25%; } }

@media(max-width:500px){
  .container.relative.z-10.mx-auto.px-4 { padding:0; }
  .rounded-3xl { border-radius:0; }
  .well { border-radius: !important;}

  
  .row.kpi-row { width:100%; }
  
  .well.blog { margin:14px 0; }
  .alert-success,.alert-info { margin-right:14px; margin-left:14px; }
  
}

.dark-mode-toggle-container { padding:0 10px; display:flex; align-items:center; justify-content:center; margin-top:6px; }
.toggle-switch {
  position:relative; display:inline-block; width:140px; height:34px; margin:5px 0;
  cursor:pointer; background:var(--bg-soft);
  border-radius:34px; transition:background .3s; border:var(--border); box-shadow:var(--shadow-sm);
}
.toggle-switch input { opacity:0; width:0; height:0; }
.slider { position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background:transparent; transition:.3s; border-radius:34px; }
.slider.round:before {
  position:absolute; content:""; height:26px; width:50%; left:4px; bottom:4px;
  transition:.3s; border-radius:24px; box-shadow:var(--shadow-sm);
  color:var(--text-dark); background:var(--bg-white);
}
input:checked + .slider.round:before { transform:translateX(65px); background:var(--accent); }
.mode-label { position:absolute; top:50%; transform:translateY(-50%); font-size:12px; font-weight:700; color:var(--text-light); transition:opacity .3s, color .3s; }
.light-label { left:10px; }
.dark-label  { right:10px; opacity:0; }

*,:after,:before { box-sizing:border-box; border:0 solid var(--border-color); }

a { text-decoration:inherit; color:var(--accent); }
a:hover { text-decoration:none; }

input:where([type=button]),input:where([type=reset]),input:where([type=submit]) {
  -webkit-appearance:button; background-color:transparent; background-image:none;
}

img,svg { vertical-align:middle; }
img { max-width:100%; height:auto; }
img.social-network { height:16px; margin:10px; }

.absolute { position:absolute; }
.relative { position:relative; }
.bottom-\[-10px\] { bottom:-10px; }
.bottom-\[-20px\] { bottom:-20px; }
.bottom-\[-5px\] { bottom:-5px; }
.left-0 { left:0; }
.left-\[-15px\] { left:-15px; }
.left-\[-1px\] { left:-1px; }
.left-\[-5px\] { left:-5px; }
.right-\[-15px\] { right:-15px; }
.right-\[-5px\] { right:-5px; }
.top-\[-10px\] { top:-10px; }
.top-\[-5px\] { top:-5px; }
.mb-1 { margin-bottom:.25rem; }
.mb-6 { margin-bottom:3rem; }
.mb-8 { margin-bottom:2rem; }
.mr-2 { margin-right:.5rem; }
.mt-\[-40px\] { margin-top:-40px; }
.block { display:block; }
.space-y-2>:not([hidden])~:not([hidden]) {
  --tw-space-y-reverse:0;
  margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom:calc(.5rem * var(--tw-space-y-reverse));
  border:none; background-color:var(--bg-white);
  border-radius:var(--radius-sm); box-shadow:var(--shadow-sm);
}
.self-center { align-self:center; }
.overflow-hidden { overflow:hidden; }
.rounded-2xl { border-radius:var(--radius); }
.rounded-3xl { border-radius:var(--radius); }
.rounded-full { border-radius:9999px; }
.border { border-width:1px; }
.bg-white { background-color:var(--bg-white); }
.bg-pink-100,.bg-red-100 { background-color:var(--accent-light); color:var(--accent); }
.text-blue-500 { color:var(--accent); }

.bg-gradient-to-b { background-image:linear-gradient(to bottom,var(--tw-gradient-stops)); }
.to-40\% { --tw-gradient-to-position:40%; }
.p-1 { padding:.25rem; }
.p-1\.5 { padding:.375rem; }
.p-2 { padding:.5rem; }
.p-4 { padding:1rem; }
.p-6 { padding:1.5rem; }
.px-2 { padding-left:.5rem; padding-right:.5rem; }
.pb-8 { padding-bottom:2rem; }
.pt-\[65px\] { padding-top:60px; }
.text-center { text-align:center; }
.text-2xl { font-size:1.5rem; line-height:2rem; }
.text-3xl { font-size:16px; line-height:2.25rem; }
.text-4xl { font-size:2.25rem; line-height:2.5rem; }
.text-5xl { font-size:3rem; line-height:1; }
.font-bold { font-weight:700; }
.font-medium { font-weight:500; font-size:16px; text-align:center; }

a.flex.items-center.gap-2.bg-brand { text-decoration:none; }

.guide-container {
  max-width:900px; margin:40px auto; padding:20px;
  background:var(--bg-white); border-radius:var(--radius);
  border:var(--border); box-shadow:var(--shadow-sm);
}
.guide-header h1 { font-size:26px; color:var(--text-dark); border-bottom:2px solid var(--border-color); padding-bottom:14px; margin-bottom:28px; font-weight:800; }
.accordion-item { margin-bottom:10px; border-radius:var(--radius-sm); overflow:hidden; }
.accordion-header {
  background:var(--bg-soft); padding:14px 18px; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center;
  font-weight:700; font-size:15px; color:var(--text-dark); transition:background .15s;
  border:var(--border); border-radius:var(--radius-sm);
}
.accordion-header:hover { background:var(--accent-light); color:var(--accent); border-color:var(--accent); }
.accordion-icon { font-size:20px; transition:transform .25s; }
.accordion-item.active .accordion-header { background:var(--accent); color:#fff; border-color:var(--accent); }
.accordion-item.active .accordion-icon { transform:rotate(45deg); }
.accordion-content { padding:16px; background:var(--bg-white); border:var(--border); border-top:0; display:none; border-radius:0 0 var(--radius-sm) var(--radius-sm); }
.accordion-content p { line-height:1.6; margin-bottom:10px; color:var(--text-mid); }
.tip-box { background:#fffbeb; color:#92400e; padding:14px; border-radius:6px; margin-top:14px; border-left:4px solid #f59e0b; }
.accordion-content ol { padding-left:20px; }
.accordion-content li { margin-bottom:10px; color:var(--text-mid); }

li.list-group-item { background:transparent; }
li.list-group-item > a { color:var(--text-dark); font-weight:500; }

.payment-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:12px; }
@media(min-width:768px){ .payment-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.payment-form {
  width:100%; border:var(--border); background:transparent;
  border-radius:var(--radius-sm); padding:8px;
  display:flex; align-items:center; gap:10px; cursor:pointer; text-align:left;
  transition:transform .08s ease, box-shadow .15s, border-color .15s;
}
.payment-form:hover { transform:translateY(-1px); box-shadow:var(--shadow-sm); border-color:var(--accent); }
.payment-form.is-active { border-color:var(--accent); box-shadow:0 0 0 3px rgba(95,77,238,.12); }
.payment-logo { width:36px; height:36px; object-fit:contain; border-radius:8px; background:var(--bg-soft); padding:4px; }
.payment-logo-fallback { width:36px; height:36px; border-radius:8px; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; font-weight:700; }
.payment-name { font-weight:700; line-height:1.2; color:var(--text-dark); font-size:13px; }


.prefs-list::-webkit-scrollbar { width:6px; }
.prefs-list::-webkit-scrollbar-track { background:var(--bg-soft); border-radius:6px; }
.prefs-list::-webkit-scrollbar-thumb { background:var(--accent); border-radius:6px; }
.prefs-list::-webkit-scrollbar-thumb:hover { background:var(--accent-dark); }

textarea#message { min-height:80px; field-sizing:content; }
textarea#field-orderform-fields-comment::-webkit-scrollbar { width:6px; }
textarea#field-orderform-fields-comment::-webkit-scrollbar-track { background:var(--bg-soft); border-radius:0 var(--radius-sm) 0 0; }
textarea#field-orderform-fields-comment::-webkit-scrollbar-thumb { background:var(--accent); border-radius:6px; }

#toggle {
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  cursor:pointer; font-size:13px; color:var(--accent); user-select:none; font-weight:600;
}




i.fa-regular.fa-copy { background:var(--accent-light); padding:5px; border-radius:4px; cursor:pointer; color:var(--accent); }
i.fa-regular.fa-copy:hover { background:var(--accent); color:#fff; }


.auth-link { color:var(--accent); text-decoration:underline; text-underline-offset:3px; font-weight:600; }
.auth-bottom { text-align:center; margin:14px 0 0; color:var(--text-mid); font-size:13px; }


i.fab.fa-tiktok.brand-tt, i.fab.fa-twitter.brand-x { color:var(--text-dark); }


.SocialMethods_socials__title__Grtm2 {
  width:100%; display:flex; flex-direction:row; flex-wrap:nowrap;
  align-items:center; column-gap:28px; margin-top:0;
}
.SocialMethods_socials__title__Grtm2 .SocialMethods_title__line__lARwK { height:1px; width:100%; background:var(--border-color); }
.SocialMethods_socials__title__Grtm2 p { white-space:nowrap; color:var(--text-light); font-size:12px; font-weight:600; }


.select2-container--default .select2-results > .select2-results__options { max-height:440px !important; overflow-y:auto; border-radius:0 0 var(--radius-sm) var(--radius-sm); }
.select2-container--default .select2-results__option[aria-selected=true] { background-color:var(--accent-light) !important; }
.select2-container .select2-selection__id-3 { min-width:20px !important; }
span.select2-selection__text { color:var(--text-dark); }
span.select2-selection__id.select2-selection__id-4.badge { min-width:34px; width:50px; }


ul.nav.nav-pills.pull-right { padding-right:0; padding-left:0; }
ul.nav.nav-pills { padding-right:0; padding-left:0; }


.best-seller-header { font-size:1.05em; margin-top:14px; margin-bottom:8px; font-weight:800; display:flex; align-items:center; color:var(--text-dark); gap:8px; }


.services-list-filter.active { border-color:var(--accent); font-weight:700; background:var(--accent-light); color:var(--accent); }


ul#currencies-list > li > a { margin:4px 8px; padding:3px 14px; background:var(--bg-soft); border-radius:20px; display:block; color:var(--text-dark); font-weight:600; font-size:13px; }
ul#currencies-list > li > a.active { background:var(--accent); color:#fff; }


i#mode-icon { color:var(--text-dark); }
a#dark-mode-button { text-decoration:none; }
a.dropdown-toggle { text-decoration:none; }


a.nav-logout-btn { color:#ef4444 !important; font-weight:600; }



.btn.btn-default:focus,.btn.btn-default:active:focus {
  outline:none !important; box-shadow:0 0 0 3px rgb(161 161 161 / 20%) !important;
  color:var(--button-color); background-color:var(--accent-dark); border-color:var(--accent-dark);
}
.btn-primary:focus,.btn-primary:active:focus {
  outline:none !important; box-shadow:0 0 0 3px rgb(161 161 161 / 20%) !important;
  color:var(--button-color); background-color:var(--accent-dark); border-color:var(--accent-dark);
}

.info { margin-bottom:14px; }


.text-sm.text-slate-600.leading-relaxed { text-align:center; font-size:14px; font-weight:500; padding:10px; color:var(--text-mid); }
.h2-glorify { font-size:32px; font-weight:700; }
.home-title p { text-align:center; }

i.fad.fa-key,i.fad.fa-user {
  font-size:15px; color:var(--button-color); background:var(--accent);
  border-radius:var(--radius-sm); width:37px; height:35px;
  align-items:center; display:flex; justify-content:center;
}

button.btn.btn-primary.btn-favorite { padding:0 10px; height:21px; background:var(--accent); border:none; }
span.fas.fa-star { color:#ff0000; }

.neworder-item a { display:inline-flex !important; align-items:center; gap:4px; width:100%; }
.neworder-item a svg { height:15px; width:15px; }


.col-md-6.login { display:flex; justify-content:center; }

.whatsapp-button { bottom:7px !important; right:7px !important; position:absolute; }

a.btn-payments {
  display:inline-block; background:var(--bg-white); color:var(--text-dark);
  border:var(--border); padding:.375rem 1rem; border-radius:var(--radius-sm);
  text-decoration:none; font-weight:600; transition:all .15s;
}
a.btn-payments:hover { background:var(--accent-light); color:var(--accent); border-color:var(--accent); }

.select2-container--default .select2-results__option[aria-selected=true] { background-color:var(--accent-light) !important; }

td[data-status="in progress"] { color:var(--accent); font-weight:700; }

.alert-modern { border-radius:var(--radius-sm); padding:14px; margin-bottom:16px; box-shadow:var(--shadow-sm); background-color:var(--bg-soft); border:var(--border); }

.details-btn:active { transform:translateY(0); }


.flex { display:flex; }
.w-full { width:100%; }
.justify-center { justify-content:center; }

a.flex.items-center.justify-center.w-full.px-3.py-2.space-x-1 { text-decoration:none; display:flex; align-items:center; }
.flex.text-sm.font-medium.border-b.divide-x.sa_border.sa_divide { padding:9px; margin:0 0 10px; border-radius:var(--radius-sm); }

.social-media-frame { border:var(--border); border-radius:var(--radius-sm); padding:12px; background:var(--bg-white); margin-bottom:16px; color:var(--text-light); }

.pull-right-middle .fa-arrow-right { color:var(--accent); }

.nav .open > a,.nav .open > a:hover,.nav .open > a:focus { background:var(--accent-light); border-color:var(--accent); }

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus { color:var(--text-dark); background:var(--bg-soft); }

@media(max-width:767px){
  .navbar-default .navbar-nav .open .dropdown-menu > li > a { color:var(--text-mid); }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover { color:var(--accent); background:var(--accent-light); }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a { background:var(--bg-soft); }
}

.navbar-collapsed-before .navbar-toggle { display:block; }
.navbar-collapsed-before .navbar-nav { width:100%; }
.navbar-collapsed-before .navbar-nav li { width:100%; }
.navbar-collapsed-before .navbar-nav li a { padding-top:10px; padding-bottom:10px; margin:0; }
.navbar-collapsed-before .navbar-right { width:100%; float:left !important; }

.navbar-toggle[aria-expanded="true"] i.fa-list::before { content:"\f00d"; }
.navbar-toggle i { transition:transform .25s ease-in-out; }
.navbar-toggle[aria-expanded="true"] i { transform:rotate(90deg); }

.mass-alert { margin-bottom:18px; }
.mass-alert .alert { margin-bottom:0; border-radius:0; }
.mass-alert .alert:first-child { border-top-left-radius:var(--radius-sm); border-top-right-radius:var(--radius-sm); }
.mass-alert .alert:last-child { border-bottom-right-radius:var(--radius-sm); border-bottom-left-radius:var(--radius-sm); }

.rtl-nav input.form-control { border-radius:0 var(--radius-sm) var(--radius-sm) 0 !important; }

section h2 { text-align:center; font-size:26px; font-weight:800; color:var(--text-dark); }

@media(max-width:500px){ .low-balance-box { border-radius:0 !important; } }

.well.user { margin-bottom:14px; }

.col-lg-12.new { width:100%; }
@media (min-width: 990px) {
    .col-lg-12.new {
        width: 86%;
    }
}
@media(max-width:1300px){
  .rtl-navbar .navbar-nav { float:right !important; width:100%; margin-right:0; }
  .rtl-navbar .navbar-nav li { width:100%; }
  .rtl-navbar .navbar-header { float:none; margin-right:0; }
  .rtl-navbar .navbar-brand { float:right; padding-right:15px; }
}

.filter-header { display:flex; justify-content:space-between; align-items:center; padding:5px; }
.filter-header h2 { font-size:17px; color:var(--text-dark); font-weight:700; }
@media(max-width:1300px){ .filter-header h2 { font-size:14px; } }
@media(max-width:1300px){
  #toggleFilterButton { font-size:12px; padding:5px 10px; }
}
#filterSection { transition:max-height .4s; overflow:hidden; max-height:500px; }
.filter-toggle {
  background:var(--text-dark); color:#fff; border:none;
  border-radius:var(--radius-sm); padding:5px 16px; cursor:pointer;
  font-size:13px; display:flex; align-items:center; gap:6px;
}
.filter-toggle i { margin-left:6px; }
.fa-chevron-up:before { content:"\f077"; }

.low-balance-box {
  background:#fffbeb; border:1px solid #fde68a; border-radius:var(--radius-sm);
  padding:16px; display:flex; align-items:center; justify-content:space-between;
  gap:14px; margin-bottom:16px;
}
.low-balance-text { display:flex; flex-direction:column; color:#92400e; }
.low-balance-text strong { font-size:14px; font-weight:800; }
.low-balance-text span { font-size:12px; }
.low-balance-btn { background:var(--accent); color:#fff; padding:9px 18px; border-radius:8px; font-weight:700; text-decoration:none; white-space:nowrap; transition:all .15s; }
.low-balance-btn:hover { background:var(--accent-dark); color:#fff; text-decoration:none; }



@media screen and (max-width: 767px) {
    .mob-nav {
        display: block;
    }
}
.mob-nav {
    display: none;
}
@media screen and (max-width: 767px) {
    .mob-nav {
        display: block;
    }
}
.mob-nav {
    z-index: 5000;
    position: fixed;
    right: 0;
    bottom: 0rem;
    left: 0;
    margin: 0 auto;
}
.mob-nav {
    display: none;
}
@media screen and (max-width: 767px) {
    .mob-nav {
        display: block;
    }
}
.mob-nav {
    padding: 0px;
}
ul.mob-nav-link {
    position: relative;
    width: 100%;
    list-style: none;
    padding: 5px !important;
    margin: 0px !important;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: flex-start;
    z-index: 2000;
    background: var(--color-3);
    border-top: var(--border);
  border-radius: 0px 20px 0 0;
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.12);
}


.how-section {
  background: var(--bg-dark);
  padding: 100px 0;
  position: relative;
  overflow: hidden;
}
.how-section::before {
  content: '';
  position: absolute;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(95,77,238,0.18) 0%, transparent 70%);
  top: -100px; right: -100px;
  border-radius: 50%;
  pointer-events: none;
}
.how-section .section-title { color: #fff; }
.how-section .section-label { color: #a78bfa; }
.how-section .section-desc  { color: rgba(255,255,255,0.6); }

.step-card {
  text-align: center;
  padding: 20px;
  position: relative;
}
.step-num {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 11px; font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #5f4dee;
  margin-bottom: 1rem;
}
.step-circle {
  width: 80px; height: 80px;
  border-radius: 50%;
  background: rgba(95,77,238,0.15);
  border: 2px dashed rgba(95,77,238,0.4);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1.25rem;
  font-size: 28px; color: #a78bfa;
  transition: all 0.3s;
}
.step-card:hover .step-circle {
  background: #5f4dee;
  border-color: #5f4dee;
  color: #fff;
  animation: spin-slow 3s linear infinite;
}
@keyframes spin-slow { to { transform: rotate(360deg); } }
.step-card h5 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px; font-weight: 700;
  color: #fff;
  margin-bottom: 10px;
}
.step-card p {
  font-size: 14px;
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
  margin: 0;
}


.step-connector {
  position: absolute;
  top: 60px; right: -15%;
  width: 30%;
  height: 2px;
  background: linear-gradient(to right, rgba(95,77,238,0.4), transparent);
}
@media (max-width: 768px) {
  .step-connector { display: none; }
}

.testimonials-section {
  background: #fff;
  padding: 100px 0;
}
.testimonial-card {
  background: #f8f7ff;
  border-radius: 14px;
  padding: 32px 28px;
  border: 1.5px solid #e9e9f0;
  height: 100%;
  transition: all 0.25s;
}
.testimonial-card:hover {
  border-color: #5f4dee;
  box-shadow: 0 8px 30px rgba(95,77,238,0.12);
}
.stars {
  color: #f59e0b;
  font-size: 14px;
  margin-bottom: 1rem;
  letter-spacing: 2px;
}
.testimonial-card p {
  font-size: 15px;
  color: #4b5563;
  line-height: 1.75;
  font-style: italic;
  margin-bottom: 1.5rem;
}
.t-author {
  display: flex;
  align-items: center;
  gap: 12px;
}
.t-avatar {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, #5f4dee, #a78bfa);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; color: #fff; font-size: 15px;
  flex-shrink: 0;
}
.t-name {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px; font-weight: 700;
  color: #0d1117;
}
.t-role {
  font-size: 12px;
  color: #9ca3af;
}

@media (min-width: 1300px) {

ul.nav.navbar-nav.navbar-left-block {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 0 5px;
    justify-content: flex-end;
    align-items: center;
    height: 60px;
}
  
  
     .navbar-default .navbar-nav > li > a {
    padding: 4px 9px;
}
}

.page-title {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.02em;
    margin: 0;
}
.page-sub {
    font-size: 13px;
    margin-top: 2px;
      margin-bottom: 10px;
}
a:focus,
a:focus-visible {
  outline: none;
  box-shadow: none;
  border-color: transparent;
}

  @media (max-width: 767px) {
  .whatsapp-container {
    display: none !important;
  }
}

.fav {
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media screen and (max-width: 767px) {
    aside#bfSidebar {
        margin-bottom: 65px;
    }
}
@media (min-width: 691.98px) {
    .stage {
        display: none !important;
    }
  
}
@media (max-width: 850px) {h1.page-title.pc {display: none;}}

