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

/* HALO — minimal geometric palette */
/* Type: IBM Plex Sans Arabic (single geometric grotesque voice) */
:root {
  --halo-font: 'IBM Plex Sans Arabic', 'Segoe UI', Tahoma, sans-serif;
  --halo-font-head: 'IBM Plex Sans Arabic', sans-serif;
  --halo-bg: #F7F8FB;
  --halo-surface: #FFFFFF;
  --halo-surface-2: #F1F3F9;
  --halo-border: #E6E9F2;
  --halo-text: #1E2233;
  --halo-muted: #7B8199;
  --halo-accent: #6E5BD6;
  --halo-accent-ink: #FFFFFF;
  --halo-radius: 12px;
  --halo-radius-sm: 8px;
  --halo-radius-lg: 16px;
  --halo-radius-xl: 20px;
  --halo-shadow: 0 6px 20px rgba(30,34,51,.05);
  --halo-accent-strong: color-mix(in srgb, var(--halo-accent) 65%, #000);
  --halo-lift: 0 12px 28px rgba(30,34,51,.10);
  --halo-focus: 0 0 0 3px color-mix(in srgb, var(--halo-accent) 40%, transparent);
  --halo-ease: cubic-bezier(.2,.6,.2,1);
  --halo-green: #2FA36B;
  --halo-red: #E05260;
  --halo-blue: #3B82F6;
  --halo-yellow: #E0A83B;
  --tp-green: var(--halo-green);
  --tp-red: var(--halo-red);
  --tp-blue: var(--halo-blue);
  --tp-yellow: var(--halo-yellow);
}
html.halo-dark, html.dark {
  --halo-bg: #14161F;
  --halo-surface: #1C1F2B;
  --halo-surface-2: #242838;
  --halo-border: #2E3346;
  --halo-text: #EEF0F6;
  --halo-muted: #9AA1B8;
  --halo-shadow: 0 6px 20px rgba(0,0,0,.4);
  --halo-accent-strong: color-mix(in srgb, var(--halo-accent) 85%, #FFF);
  --halo-lift: 0 14px 34px rgba(0,0,0,.45);
}
/* ===== COMPONENTS ===== */
* { box-sizing: border-box; }
body { margin:0; background: var(--halo-bg); color: var(--halo-text); font-family: var(--halo-font); font-size:14px; line-height:1.55; overflow-x:hidden; }
a { color: var(--halo-accent-strong); text-decoration: none; transition: color .15s; }
a:hover { color: var(--halo-accent); }
h1,h2,h3,h4,h5,h6 { font-family:var(--halo-font-head); font-weight:600; margin:0 0 .5em; }
h1,h2 { letter-spacing:-.02em; }
img { max-width:100%; }
.halo-hidden, .hidden { display:none !important; }
.halo-ltr { direction:ltr; }
[dir="rtl"] .halo-flip { transform: scaleX(-1); }

/* Shell / layout */
.halo-shell { display:flex; min-height:100vh; }
.halo-sidebar {
  width:250px; flex:0 0 250px; background:var(--halo-surface); border-inline-end:1px solid var(--halo-border);
  display:flex; flex-direction:column; justify-content:space-between; padding:18px 14px; position:sticky; top:0; height:100vh; overflow-y:auto;
}
.halo-sidebar .logo { display:block; font-weight:800; font-size:20px; margin:6px 8px 18px; color:var(--halo-text); }
.halo-menu { display:flex; flex-direction:column; gap:4px; }
.halo-menu-item { display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:10px; color:var(--halo-text); font-weight:600; font-size:14px; transition:.15s; }
.halo-menu-item i { width:20px; text-align:center; color:var(--halo-muted); }
.halo-menu-item:hover { background:var(--halo-surface-2); }
.halo-menu-item.active { background:var(--halo-accent); color:var(--halo-accent-ink); }
.halo-menu-item.active i { color:var(--halo-accent-ink); }
.halo-side-bottom { display:flex; flex-direction:column; gap:12px; margin-top:16px; }
.halo-theme-toggle { display:flex; background:var(--halo-surface-2); border-radius:10px; padding:4px; gap:4px; }
.halo-theme-toggle button { flex:1; border:0; background:transparent; color:var(--halo-muted); padding:7px; border-radius:8px; cursor:pointer; font-family:inherit; font-size:12px; font-weight:600; }
.halo-theme-toggle button.active { background:var(--halo-surface); color:var(--halo-text); box-shadow:var(--halo-shadow); }
.halo-user-chip { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; background:var(--halo-surface-2); border-radius:10px; color:var(--halo-text); }
.halo-user-chip small { display:block; color:var(--halo-muted); font-size:12px; }

.halo-main { flex:1; min-width:0; display:flex; flex-direction:column; }
.halo-header {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 24px; background:var(--halo-surface); border-bottom:1px solid var(--halo-border); position:sticky; top:0; z-index:20;
}
.halo-header .logo { font-weight:800; font-size:18px; color:var(--halo-text); }
.halo-header-actions { display:flex; align-items:center; gap:10px; }
.halo-icon-btn { width:38px; height:38px; border-radius:10px; border:1px solid var(--halo-border); background:var(--halo-surface); color:var(--halo-text); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.halo-menu-btn { display:none; }
.halo-balance { display:inline-flex; align-items:center; gap:8px; background:color-mix(in srgb, var(--halo-accent) 14%, transparent); border:1px solid color-mix(in srgb, var(--halo-accent) 35%, transparent); padding:8px 14px; border-radius:99px; font-weight:700; cursor:pointer; }
.halo-container { width:100%; max-width:1180px; margin:0 auto; padding:26px 22px 60px; }
.halo-footer { text-align:center; padding:22px; color:var(--halo-muted); font-size:13px; border-top:1px solid var(--halo-border); }

/* Public (logged-out) top bar */
.halo-public-header { display:flex; align-items:center; justify-content:space-between; padding:16px 28px; background:var(--halo-surface); border-bottom:1px solid var(--halo-border); flex-wrap:wrap; gap:12px; }
.halo-public-nav { display:flex; gap:18px; flex-wrap:wrap; }
.halo-public-nav a { color:var(--halo-text); font-weight:600; }

/* Page title */
.halo-page-title { display:flex; align-items:center; gap:10px; font-size:22px; font-weight:800; margin-bottom:18px; }
.halo-page-title i { color:var(--halo-accent); }

/* Cards / wells */
.halo-card, .halo-well { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:22px; box-shadow:none; margin-bottom:20px; overflow:hidden; }
.halo-card-title { display:flex; align-items:center; gap:8px; font-weight:700; font-size:16px; margin-bottom:14px; }
.halo-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.halo-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }

/* Buttons */
.halo-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--halo-accent); color:var(--halo-accent-ink); border:1px solid transparent; padding:11px 20px; border-radius:var(--halo-radius-sm); font-family:inherit; font-weight:600; font-size:14px; cursor:pointer; transition:background-color .15s, border-color .15s; }
.halo-btn:hover { background:var(--halo-accent-strong); }
.halo-btn.outline, .halo-btn.ghost { background:transparent; color:var(--halo-text); border-color:var(--halo-border); }
.halo-btn.block { width:100%; }
.halo-btn.sm { padding:7px 12px; font-size:13px; }
.halo-btn.danger { background:var(--halo-red); color:#fff; }
.halo-btn.success { background:var(--halo-green); color:#fff; }

/* Forms */
.halo-form-group { margin-bottom:16px; }
.halo-form-group label, .halo-label { display:block; margin-bottom:6px; font-weight:600; font-size:13px; color:var(--halo-text); }
.halo-input, .halo-form-group input, .halo-form-group select, .halo-form-group textarea {
  width:100%; padding:12px 14px; border:1.5px solid var(--halo-border); border-radius:var(--halo-radius-sm); background:var(--halo-surface-2); color:var(--halo-text); font-family:inherit; font-size:14px; transition:border-color .15s, background-color .15s;
}
.halo-form-group textarea { resize:vertical; }
.halo-input:focus,
.halo-form-group input:focus, .halo-form-group select:focus, .halo-form-group textarea:focus { outline:none; border-color:var(--halo-accent); background:var(--halo-surface); box-shadow:none; }
.halo-input-group { display:flex; gap:8px; }
.halo-input-group .halo-input { flex:1; }
.halo-checkbox-row { display:flex; align-items:center; gap:8px; }
.halo-checkbox-row input { width:auto; }
.halo-hint { color:var(--halo-muted); font-size:12.5px; }

/* Forms: global mobile sizing (! to beat gate.css & panel styles) */
@media (max-width:600px){
  .halo-form-group { margin-bottom:11px; }
  .halo-form-group label, .halo-label { font-size:12.5px !important; margin-bottom:4px; }
  .halo-input, .halo-form-group input, .halo-form-group select, .halo-form-group textarea {
    font-size:13px !important; padding:10px 12px !important; border-radius:12px !important;
  }
}
@media (max-width:420px){
  .halo-form-group { margin-bottom:9px; }
  .halo-form-group label, .halo-label { font-size:12px !important; margin-bottom:3px; }
  .halo-input, .halo-form-group input, .halo-form-group select, .halo-form-group textarea {
    font-size:12.5px !important; padding:8px 10px !important; border-radius:10px !important;
  }
  .halo-input-wrap i { font-size:12px; inset-inline-start:10px; }
  .halo-input-wrap .halo-input { padding-inline-start:30px !important; }
}

/* Alerts */
.halo-alert { padding:13px 16px; border-radius:10px; margin-bottom:16px; border:1px solid transparent; font-size:13.5px; }
.halo-alert.success { background:color-mix(in srgb,var(--halo-green) 12%,transparent); border-color:color-mix(in srgb,var(--halo-green) 35%,transparent); color:var(--halo-green); }
.halo-alert.error, .halo-alert.danger { background:color-mix(in srgb,var(--halo-red) 12%,transparent); border-color:color-mix(in srgb,var(--halo-red) 35%,transparent); color:var(--halo-red); }
.halo-alert.info { background:color-mix(in srgb,var(--halo-blue) 12%,transparent); border-color:color-mix(in srgb,var(--halo-blue) 35%,transparent); color:var(--halo-blue); }

/* Stats */
.halo-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px; }
.halo-stat { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:16px; box-shadow:var(--halo-shadow); }
.halo-stat-top { display:flex; align-items:center; justify-content:space-between; color:var(--halo-muted); font-size:12.5px; font-weight:600; }
.halo-stat-top i { color:var(--halo-accent); font-size:18px; }
.halo-stat-val { font-size:22px; font-weight:800; margin-top:8px; }

.halo-badge { display:inline-block; background:var(--halo-surface-2); border:1px solid var(--halo-border); border-radius:99px; padding:4px 12px; font-size:12px; font-weight:600; }

/* Toolbar (filter + search) */
.halo-toolbar { display:flex; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.halo-toolbar select { flex:0 0 auto; min-width:180px; }
.halo-toolbar form { flex:1; min-width:220px; }

/* Order list */
.halo-order-list { display:flex; flex-direction:column; gap:14px; }
.halo-order { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:16px 18px; box-shadow:var(--halo-shadow); }
.halo-order-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.halo-order-actions { display:flex; align-items:center; gap:8px; }
.halo-order-id { font-weight:800; cursor:pointer; }
.halo-order-act { width:30px; height:30px; border-radius:8px; background:var(--halo-surface-2); display:inline-flex; align-items:center; justify-content:center; color:var(--halo-muted); position:relative; cursor:pointer; }
.halo-order-act .halo-tooltip { position:absolute; bottom:120%; left:50%; transform:translateX(-50%); background:var(--halo-text); color:var(--halo-bg); padding:4px 8px; border-radius:6px; font-size:11px; white-space:nowrap; opacity:0; pointer-events:none; transition:.15s; }
.halo-order-act:hover .halo-tooltip { opacity:1; }
.halo-status { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:99px; font-size:12.5px; font-weight:700; background:var(--halo-surface-2); }
.halo-status.pending { color:var(--halo-yellow); }
.halo-status.completed { color:var(--halo-green); }
.halo-status.canceled { color:var(--halo-red); }
.halo-status.partial { color:var(--halo-blue); }
.halo-status.processing { color:var(--halo-muted); }
.halo-status.progress { width:min(240px,50%); }
.halo-progress { width:100%; background:var(--halo-surface-2); border-radius:99px; height:22px; position:relative; overflow:hidden; }
.halo-progress-bar { position:absolute; inset:0 auto 0 0; background:var(--halo-accent); }
.halo-progress span { position:relative; z-index:1; display:block; text-align:center; font-size:11.5px; font-weight:700; line-height:22px; }
.halo-order-body > div { margin:4px 0; font-size:13.5px; }
.halo-order-body .halo-link { cursor:pointer; word-break:break-all; }
.halo-order-meta { display:flex; gap:18px; flex-wrap:wrap; margin-top:8px; color:var(--halo-muted); font-size:13px; }
.halo-order-meta b { color:var(--halo-text); }
.halo-order-foot { margin-top:12px; display:flex; gap:10px; flex-wrap:wrap; }

/* Services */
.halo-cat-title { display:flex; align-items:center; gap:8px; font-weight:800; margin:22px 0 10px; font-size:15px; }
.halo-service { display:flex; justify-content:space-between; gap:14px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:14px 16px; margin-bottom:10px; box-shadow:var(--halo-shadow); }
.halo-service-name { font-weight:700; margin-bottom:6px; word-wrap:break-word; overflow-wrap:break-word; }
.halo-service-feats { display:flex; gap:14px; flex-wrap:wrap; color:var(--halo-muted); font-size:12.5px; }
.halo-service-feats b { color:var(--halo-text); }
.halo-service-tags { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.halo-tag { font-size:11px; padding:2px 8px; border-radius:99px; background:var(--halo-surface-2); font-weight:600; }
.halo-service-right { text-align:end; display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.halo-service-price { font-weight:800; font-size:16px; color:var(--halo-accent-strong); }
.halo-favbox { cursor:pointer; color:var(--halo-accent); }

/* Neworder layout */
.halo-order-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:20px; align-items:start; overflow:hidden; }
.halo-order-grid > * { min-width:0; }
.halo-search-box { position:relative; margin-bottom:14px; }
.halo-search-results { margin-top:8px; max-height:260px; overflow:auto; display:none; }
.halo-search-results.open { display:block; }
.halo-search-results .halo-service { cursor:pointer; }
.halo-service-detail { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:18px; box-shadow:var(--halo-shadow); position:sticky; top:80px; min-height:120px; overflow:hidden; word-wrap:break-word; }
.halo-service-detail .empty { color:var(--halo-muted); text-align:center; padding:30px 0; }
.halo-detail-row { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px dashed var(--halo-border); font-size:13.5px; }
.halo-detail-row b { font-weight:700; }

/* Amount presets */
.halo-amounts { display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
.halo-amount { flex:1; min-width:60px; text-align:center; padding:10px; border:1px solid var(--halo-border); border-radius:10px; cursor:pointer; font-weight:700; background:var(--halo-surface-2); }
.halo-amount:hover, .halo-amount.active { background:var(--halo-accent); color:var(--halo-accent-ink); }

/* Payment / history */
.halo-history { display:flex; flex-direction:column; gap:10px; }
.halo-history-box { border:1px solid var(--halo-border); border-radius:10px; padding:12px 14px; }
.halo-history-top { display:flex; justify-content:space-between; font-weight:700; }
.halo-history-bottom { color:var(--halo-muted); font-size:12.5px; margin-top:4px; }
.halo-color-green { color:var(--halo-green); }
.halo-color-red { color:var(--halo-red); }

/* Account */
.halo-user-info { display:flex; align-items:center; justify-content:space-between; gap:14px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:18px; box-shadow:var(--halo-shadow); margin-bottom:20px; flex-wrap:wrap; }
.halo-avatar { width:56px; height:56px; border-radius:50%; background:var(--halo-accent); color:var(--halo-accent-ink); display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:800; }
.halo-user-info-left { display:flex; align-items:center; gap:14px; }

/* Affiliates */
.halo-aff-box { display:flex; gap:20px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.halo-aff-url { cursor:pointer; background:var(--halo-surface-2); border:1px dashed var(--halo-border); border-radius:10px; padding:12px 14px; word-break:break-all; margin-top:10px; }
.halo-aff-ring { width:120px; height:120px; }
.halo-aff-ring .bg { fill:none; stroke:var(--halo-surface-2); stroke-width:3; }
.halo-aff-ring .bar { fill:none; stroke:var(--halo-accent); stroke-width:3; stroke-linecap:round; stroke-dasharray:100 100; transform:rotate(-90deg); transform-origin:center; }
.halo-aff-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:20px; }
.halo-aff-stat { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:10px; padding:14px; text-align:center; }
.halo-aff-stat .k { color:var(--halo-muted); font-size:12px; }
.halo-aff-stat .v { font-size:20px; font-weight:800; margin-top:6px; }
.halo-table { width:100%; border-collapse:collapse; }
.halo-table th, .halo-table td { padding:10px 12px; border-bottom:1px solid var(--halo-border); text-align:start; font-size:13.5px; }
.halo-table th { color:var(--halo-muted); font-weight:700; }

/* Child panels */
.halo-panel-list { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.halo-panel { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); overflow:hidden; box-shadow:var(--halo-shadow); }
.halo-panel img { width:100%; height:150px; object-fit:cover; }
.halo-panel-body { padding:14px; }

/* Tickets */
.halo-subjects { display:flex; gap:10px; margin-bottom:16px; }
.halo-subject { flex:1; text-align:center; padding:12px; border:1px solid var(--halo-border); border-radius:10px; cursor:pointer; font-weight:600; }
.halo-subject.active { border-color:var(--halo-accent); background:color-mix(in srgb,var(--halo-accent) 12%,transparent); }
.halo-ticket-list { display:flex; flex-direction:column; gap:10px; }
.halo-ticket { display:block; border:1px solid var(--halo-border); border-radius:10px; padding:12px 14px; color:var(--halo-text); }
.halo-ticket.active { border-color:var(--halo-accent); }
.halo-ticket-top { display:flex; justify-content:space-between; gap:8px; }
.halo-msg-list { display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
.halo-msg { max-width:78%; padding:12px 14px; border-radius:12px; }
.halo-msg .meta { display:block; margin-top:8px; font-size:11.5px; color:var(--halo-muted); }
.halo-msg.right { align-self:flex-end; background:color-mix(in srgb,var(--halo-accent) 14%,transparent); border:1px solid color-mix(in srgb,var(--halo-accent) 30%,transparent); }
.halo-msg.left { align-self:flex-start; background:var(--halo-surface-2); border:1px solid var(--halo-border); }
.halo-ticket-img { max-width:180px; border-radius:8px; margin-bottom:8px; display:block; }

/* Blog */
.halo-blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.halo-blog { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); overflow:hidden; box-shadow:var(--halo-shadow); display:flex; flex-direction:column; }
.halo-blog img { width:100%; height:160px; object-fit:cover; }
.halo-blog-body { padding:16px; display:flex; flex-direction:column; gap:8px; flex:1; }
.halo-blog-title { font-weight:700; }
.halo-blog-text { color:var(--halo-muted); font-size:13px; flex:1; }
.halo-prose { line-height:1.75; }
.halo-prose img { border-radius:10px; }

/* Updates */
.halo-update { display:flex; justify-content:space-between; gap:12px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:10px; padding:12px 16px; margin-bottom:8px; }
.halo-update .date { color:var(--halo-muted); font-size:12px; }

/* API docs */
.halo-code { background:#0d1117; color:#c9d1d9; border-radius:0 0 10px 10px; padding:16px; overflow:auto; direction:ltr; font-size:12.5px; }
.halo-code-top { display:flex; justify-content:space-between; background:var(--halo-surface-2); padding:8px 14px; border-radius:10px 10px 0 0; font-weight:700; font-size:12px; }

/* Auth screens */
.halo-auth-alt { display:block; text-align:center; margin-top:14px; color:var(--halo-muted); font-size:13px; }
.halo-verify-inputs { display:flex; gap:10px; justify-content:center; margin:18px 0; }
.halo-verify-inputs input { width:46px; height:56px; text-align:center; font-size:22px; font-weight:800; border:1px solid var(--halo-border); border-radius:10px; background:var(--halo-surface); color:var(--halo-text); }

/* Pagination */
.halo-pagination { display:flex; gap:6px; justify-content:center; margin-top:24px; flex-wrap:wrap; list-style:none; padding:0; }
.halo-pagination li a { display:inline-flex; min-width:38px; height:38px; align-items:center; justify-content:center; padding:0 10px; border:1px solid var(--halo-border); border-radius:10px; color:var(--halo-text); }
.halo-pagination li.active a { background:var(--halo-accent); color:var(--halo-accent-ink); border-color:transparent; }

/* Dropdown (custom) */
.halo-dd { position:relative; }
.halo-dd-btn { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:11px 13px; border:1px solid var(--halo-border); border-radius:10px; background:var(--halo-surface); cursor:pointer; }
.halo-dd-menu { position:absolute; inset-inline:0; top:calc(100% + 6px); background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:10px; box-shadow:var(--halo-shadow); max-height:280px; overflow:auto; z-index:30; display:none; }
.halo-dd.open .halo-dd-menu { display:block; }
.halo-dd-item { padding:10px 13px; cursor:pointer; }
.halo-dd-item:hover { background:var(--halo-surface-2); }

/* Toast */
.halo-toast { position:fixed; bottom:24px; inset-inline-start:50%; transform:translateX(-50%) translateY(20px); background:var(--halo-text); color:var(--halo-bg); padding:12px 18px; border-radius:10px; display:flex; align-items:center; gap:10px; opacity:0; pointer-events:none; transition:.25s; z-index:9999; }
.halo-toast.halo-toast-show { opacity:1; transform:translateX(-50%) translateY(0); }
.halo-toast-success { background:var(--halo-green); color:#fff; }
.halo-toast-error { background:var(--halo-red); color:#fff; }

/* Dialog / modal */
.halo-dialog, .halo-modal { position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; z-index:9998; padding:16px; }
.halo-dialog[data-open], .halo-modal[data-open] { display:flex; }
.halo-dialog-box, .halo-modal-box { background:var(--halo-surface); border-radius:var(--halo-radius-lg); width:100%; max-width:460px; overflow:hidden; }
.halo-modal-top { display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--halo-border); font-weight:700; }
.halo-modal-close { cursor:pointer; color:var(--halo-muted); }
.halo-dialog-title { padding:18px 18px 0; font-weight:700; font-size:16px; }
.halo-dialog-body, .halo-modal-center { padding:16px 18px; }
.halo-dialog-actions, .halo-modal-bottom { display:flex; gap:10px; justify-content:flex-end; padding:0 18px 18px; }

/* Notifications drawer */
.halo-notify { position:fixed; top:0; inset-inline-end:0; width:340px; max-width:90vw; height:100vh; background:var(--halo-surface); border-inline-start:1px solid var(--halo-border); transform:translateX(110%); transition:.25s; z-index:9997; padding:18px; overflow-y:auto; }
[dir="rtl"] .halo-notify { transform:translateX(-110%); }
.halo-notify.open { transform:translateX(0); }
.halo-notify-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; font-weight:700; }

/* Unlicensed banner */
.halo-unlicensed-banner { display:none; background:var(--halo-red); color:#fff; text-align:center; padding:10px; font-weight:600; }
html.unsmm-unlicensed .halo-unlicensed-banner { display:block; }

/* Responsive */
@media (max-width:900px) {
  .halo-grid-2, .halo-grid-3, .halo-order-grid, .halo-aff-stats, .halo-panel-list, .halo-blog-grid { grid-template-columns:1fr; }
  .halo-stats { grid-template-columns:repeat(2,1fr); }
  .halo-sidebar { position:fixed; inset-inline-start:0; top:0; z-index:60; transform:translateX(-110%); transition:.25s; }
  [dir="rtl"] .halo-sidebar { transform:translateX(110%); }
  .halo-shell.sidebar-open .halo-sidebar { transform:translateX(0); }
  .halo-menu-btn { display:inline-flex; }
  .halo-sidebar-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:55; }
  .halo-shell.sidebar-open .halo-sidebar-backdrop { display:block; }
}
@media (max-width:560px){
  .halo-stats { grid-template-columns:1fr; }
  .halo-service-detail { position:static; }
  .halo-aff-stats { grid-template-columns:repeat(2,1fr); }
}

/* ===== REFINEMENTS (states · focus · depth · motion) ===== */
/* حركة حالة خفيفة فقط (منتج) — بلا تسلسل ظهور، وتحترم تقليل الحركة */
.halo-btn, .halo-menu-item, .halo-icon-btn, .halo-order-act, .halo-amount,
.halo-subject, .halo-pagination li a, .halo-dd-btn {
  transition: background .15s, color .15s, border-color .15s, box-shadow .2s;
}
.halo-service, .halo-order, .halo-panel, .halo-blog {
  transition: border-color .15s, box-shadow .2s, transform .2s;
}

/* تركيز لوحة المفاتيح واضح على كل عنصر تفاعلي (وصولية) */
.halo-btn:focus-visible, a:focus-visible, .halo-menu-item:focus-visible,
.halo-icon-btn:focus-visible, .halo-amount:focus-visible, .halo-subject:focus-visible,
.halo-pagination li a:focus-visible, .halo-dd-btn:focus-visible, .halo-order-act:focus-visible,
.halo-favbox:focus-visible, .halo-theme-toggle button:focus-visible {
  outline: none; box-shadow: var(--halo-focus);
}

/* حالات الأزرار: ضغط · تعطيل · تحميل */
.halo-btn:active { transform: translateY(1px); }
.halo-btn:disabled, .halo-btn[disabled], .halo-btn.disabled {
  opacity: .5; cursor: not-allowed; pointer-events: none;
}
.halo-btn.loading { color: transparent !important; pointer-events: none; position: relative; }
.halo-btn.loading::after {
  content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid color-mix(in srgb, currentColor 35%, transparent); border-top-color: currentColor;
  animation: halo-spin .6s linear infinite;
}
@keyframes halo-spin { to { transform: rotate(360deg); } }

/* عمق: رفع لطيف للبطاقات التفاعلية عند المرور (القوائم القابلة للنقر فقط) */
.halo-order:hover, .halo-service:hover, .halo-panel:hover, .halo-blog:hover {
  border-color: color-mix(in srgb, var(--halo-accent) 25%, var(--halo-border));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.halo-search-results .halo-service:hover { transform: none; }   /* داخل قائمة بحث ثابتة */

/* المفتاح الجانبي النشط: مؤشّر حالة أوضح */
.halo-icon-btn:hover { border-color: var(--halo-accent); color: var(--halo-accent-strong); }

/* موبايل: ارتفاع القائمة الجانبية يطابق الشاشة المرئية (يمنع اقتصاص أسفلها) */
@media (max-width:900px) {
  .halo-sidebar { height: 100vh; height: 100dvh; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .halo-order:hover, .halo-service:hover, .halo-panel:hover, .halo-blog:hover, .halo-btn:active { transform: none; }
}

/* ============================================================= *
 *  HALO — top-nav shell (بلا شريط جانبي) — يميّز Halo بنيويًا     *
 * ============================================================= */
.halo-app { min-height:100vh; display:flex; flex-direction:column; }
.halo-topnav {
  display:flex; align-items:center; gap:14px; padding:10px 20px; background:var(--halo-surface);
  border-bottom:1px solid var(--halo-border); position:sticky; top:0; z-index:30; flex-wrap:nowrap;
}
.halo-brand { flex:0 0 auto; font-weight:800; font-size:19px; color:var(--halo-text); display:inline-flex; align-items:center; }
.halo-nav-toggle { display:none; margin-inline-start:auto; width:38px; height:38px; border-radius:10px;
  border:1px solid var(--halo-border); background:var(--halo-surface); color:var(--halo-text); cursor:pointer; font-size:16px; }
/* القائمة تأخذ الوسط وتُمرَّر أفقيًا بدل الالتفاف لأسطر تتراكب فوق بعضها */
.halo-topmenu { display:flex; gap:4px; flex:1 1 auto; min-width:0; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; }
.halo-topmenu::-webkit-scrollbar { height:0; display:none; }
.halo-topmenu-item { flex:0 0 auto; white-space:nowrap; display:inline-flex; align-items:center; gap:8px; padding:9px 14px; border-radius:99px;
  color:var(--halo-muted); font-weight:600; font-size:13.5px; transition:.15s; }
.halo-topmenu-item i { font-size:14px; }
.halo-topmenu-item:hover { background:var(--halo-surface-2); color:var(--halo-text); }
.halo-topmenu-item.active { background:color-mix(in srgb, var(--halo-accent) 14%, transparent); color:var(--halo-accent-strong); }
.halo-topactions { display:flex; align-items:center; gap:10px; margin-inline-start:auto; }
.halo-theme-toggle-top { display:flex; background:var(--halo-surface-2); border-radius:99px; padding:3px; gap:2px; }
.halo-theme-toggle-top button { width:32px; height:30px; border:0; background:transparent; color:var(--halo-muted);
  border-radius:99px; cursor:pointer; font-size:12px; }
.halo-theme-toggle-top button.active { background:var(--halo-surface); color:var(--halo-text); box-shadow:var(--halo-shadow); }
@media (max-width:900px) {
  .halo-topnav { flex-wrap:wrap; }
  .halo-brand { order:1; }
  /* الإشعارات + الحساب بجانب زرّ القائمة، وزرّ القائمة في الطرف */
  .halo-topactions { order:2; margin-inline-start:auto; gap:8px; }
  .halo-nav-toggle { display:inline-flex; align-items:center; justify-content:center; order:3; margin-inline-start:0; }
  .halo-topmenu { display:none; width:100%; flex:1 1 100%; flex-direction:column; flex-wrap:nowrap; gap:2px; order:4; overflow-x:visible; margin-top:6px; }
  .halo-topmenu.open { display:flex; }
  .halo-topmenu-item { width:100%; border-radius:10px; padding:11px 14px; }
  .halo-topmenu-item i { width:20px; text-align:center; font-size:15px; }
  .halo-user-dd .halo-user-name { max-width:80px; }
  /* الرصيد: آخر عنصر داخل القائمة، بعرض كامل كصفّ من صفوف القائمة */
  .halo-topmenu .halo-balance { width:100%; justify-content:space-between; margin-top:6px; border-radius:10px; padding:11px 14px; }
}

/* ===== HALO — الطلبات كشبكة بطاقات فسيحة (بدل القائمة الرأسية) ===== */
.halo-orders-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:14px; }
.halo-ocard { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius);
  padding:16px; display:flex; flex-direction:column; gap:9px; }
.halo-ocard-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.halo-ocard-id { font-weight:800; cursor:pointer; }
.halo-ocard-pct { font-weight:800; font-size:32px; line-height:1; letter-spacing:-.02em; color:var(--halo-text); }
.halo-ocard-pct small { font-size:15px; color:var(--halo-muted); font-weight:700; }
.halo-ocard-name { font-weight:600; font-size:13.5px; }
.halo-ocard-link { color:var(--halo-muted); font-size:12.5px; cursor:pointer; word-break:break-all; }
.halo-ocard-meta { display:grid; grid-template-columns:1fr 1fr; gap:6px 14px; font-size:12.5px; color:var(--halo-muted); }
.halo-ocard-meta b { color:var(--halo-text); }
.halo-ocard-date { font-size:12px; color:var(--halo-muted); }
.halo-ocard-foot { display:flex; gap:8px; flex-wrap:wrap; margin-top:auto; padding-top:4px; }
.halo-report-btn { font-size:12px; color:var(--halo-muted); padding:4px 8px; border:1px solid var(--halo-border); border-radius:8px; cursor:pointer; transition:color .15s, border-color .15s; background:none; }
.halo-report-btn:hover { color:var(--halo-red); border-color:var(--halo-red); }
@media (max-width:560px){ .halo-orders-grid { grid-template-columns:1fr; } }

/* Halo: الخدمات كشبكة بطاقات (تطابق هوية الشبكة الفسيحة) */
.halo-service-group { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:10px; }
.halo-service-group .halo-service { margin-bottom:0; }
@media (max-width:560px){ .halo-service-group { grid-template-columns:1fr; } }

/* ===== إخفاء/إظهار الرصيد + دمج مبدّل العملة داخل شارة الرصيد ===== */
.halo-balance { gap: 8px; flex:0 0 auto; }
.halo-bal-toggle { cursor:pointer; }
.halo-eye { font-size: 13px; opacity: .65; margin-inline-start: 2px; }
/* مبدّل العملة مدمج داخل شارة الرصيد بلا حدود، يبدو جزءًا منها */
.halo-cur-inline { appearance:none; -webkit-appearance:none; border:0; background:transparent; color:var(--halo-accent-strong);
  font-family:inherit; font-weight:800; font-size:12.5px; cursor:pointer; padding:0 2px; margin-inline-start:4px;
  border-inline-start:1px solid color-mix(in srgb, var(--halo-accent) 30%, transparent); padding-inline-start:8px; }
.halo-cur-inline:focus { outline:none; }
.halo-cur-inline option { color:var(--halo-text); background:var(--halo-surface); }
/* عند الإخفاء: طمس مبلغ الشريط العلوي وقيمة الرصيد في إحصائيات «طلب جديد» معًا */
html.halo-bal-hidden .halo-bal-amt,
html.halo-bal-hidden .halo-bal-sensitive { filter:blur(7px); user-select:none; pointer-events:none; }
.halo-balance:hover .halo-eye { opacity: 1; }
.halo-bal-amt { transition: filter .15s; }
.halo-bal-hidden .halo-bal-amt { filter: blur(7px); user-select: none; }

/* مبدّل العملة في الهيدر (يظهر عند تعدّد العملات) */
.halo-cur-select { height: 38px; border: 1px solid var(--halo-border); border-radius: 10px; background: var(--halo-surface); color: var(--halo-text); font: inherit; font-size: 12.5px; font-weight: 600; padding: 0 8px; cursor: pointer; max-width: 110px; }

/* عناصر الإعلانات داخل جرس الهيدر + نقطة غير مقروء */
.halo-icon-btn { position: relative; }
.halo-notif-dot { position: absolute; top: 7px; inset-inline-end: 7px; width: 8px; height: 8px; border-radius: 50%; background: var(--halo-red); box-shadow: 0 0 0 2px var(--halo-surface); }
.halo-notif-item { display: flex; gap: 10px; align-items: flex-start; padding: 12px 6px; border-bottom: 1px solid var(--halo-border); }
.halo-notif-item:last-child { border-bottom: 0; }
.halo-notif-item > i { color: var(--halo-accent-strong); font-size: 16px; margin-top: 2px; }
.halo-notif-item.unread { background: color-mix(in srgb, var(--halo-accent) 8%, transparent); }
.halo-notif-c b { display: block; font-size: 13.5px; margin-bottom: 3px; }
.halo-notif-c span { display: block; font-size: 12.5px; color: var(--halo-muted); white-space: pre-line; line-height: 1.5; }

/* ============================================================= *
 *  توافق مع الأصناف التي يحقنها محرّك البانل (غير المسبوقة)       *
 *  form-control / alert / well / btn / service-dropdown ...      *
 * ============================================================= */
#fields .form-group, .neworder-form .form-group { margin-bottom: 14px; }
#fields label, .form-group > label, .control-label { display:block; margin-bottom:6px; font-weight:600; font-size:13px; color:var(--halo-text); }
.form-control { width:100%; padding:11px 13px; border:1px solid var(--halo-border); border-radius:var(--halo-radius-sm); background:var(--halo-surface); color:var(--halo-text); font-family:inherit; font-size:14px; transition:border-color .15s; }
.form-control:focus { outline:none; border-color:var(--halo-accent); box-shadow:var(--halo-focus); }
textarea.form-control { resize:vertical; min-height:90px; }
select.form-control { appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239AA1B8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:calc(100% - 12px) center; padding-inline-end:32px; }
[dir="rtl"] select.form-control { background-position:12px center; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; cursor:pointer; padding:11px 18px; border-radius:var(--halo-radius-sm); font-family:inherit; font-weight:700; font-size:14px; text-decoration:none; }
.btn-main, .btn-primary { background:var(--halo-accent); color:var(--halo-accent-ink); }
.btn-main:hover, .btn-primary:hover { filter:brightness(.96); }
.btn-block { width:100%; }
.btn-sm, .btn-xs, .btn-min { padding:7px 12px; font-size:13px; }
.btn-default { background:transparent; color:var(--halo-text); border-color:var(--halo-border); }

/* Panel engine: layout helpers */
.row { display:flex; flex-wrap:wrap; gap:12px; }
.col-md-6 { flex:1 1 calc(50% - 6px); min-width:0; }
.help-block { display:block; margin-top:4px; font-size:12px; color:var(--halo-muted); }
.input-group { display:flex; gap:0; }
.input-group .form-control { flex:1; border-start-end-radius:0; border-end-end-radius:0; }
.input-group .input-group-btn .btn { border-start-start-radius:0; border-end-start-radius:0; height:100%; }
[dir="rtl"] .input-group .form-control { border-radius:var(--halo-radius); border-start-start-radius:0; border-end-start-radius:0; }
[dir="rtl"] .input-group .input-group-btn .btn { border-radius:var(--halo-radius); border-start-end-radius:0; border-end-end-radius:0; }
.form-group__checkbox { display:flex; align-items:center; gap:8px; margin:6px 0; }
.form-group__checkbox-label { display:flex; align-items:center; cursor:pointer; }
.form-group__label-title { font-size:13px; cursor:pointer; }
.checkmark, .radiomark { width:18px; height:18px; border:1.5px solid var(--halo-border); border-radius:4px; display:inline-block; position:relative; }
.radiomark { border-radius:50%; }
input[type="checkbox"]:checked + .checkmark, input[type="radio"]:checked + .radiomark { background:var(--halo-accent); border-color:var(--halo-accent); }
.form-check-input { display:none; }

/* ── Panel engine: global mobile overrides (catches ALL injected elements) ── */
@media (max-width:600px){
  .row { flex-direction:column; gap:8px; }
  .col-md-6 { flex:1 1 100%; }
  .form-control { font-size:13px !important; padding:10px 12px !important; border-radius:12px !important; }
  select.form-control { padding-inline-end:30px !important; background-position:calc(100% - 10px) center; }
  [dir="rtl"] select.form-control { background-position:10px center; }
  #fields .form-group, .neworder-form .form-group { margin-bottom:10px !important; }
  #fields label, .form-group > label, .control-label { font-size:12.5px !important; margin-bottom:4px !important; }
  textarea.form-control { min-height:70px; }
  .btn { font-size:13px !important; padding:9px 14px !important; border-radius:12px !important; }
  .btn-sm, .btn-xs, .btn-min { font-size:12px !important; padding:6px 10px !important; }
  .category-dropdown-item, .service-dropdown-item { padding:9px 11px !important; font-size:13px !important; }
  .service-dropdown-name .s-name { font-size:12.5px !important; }
  .service-dropdown-bottom, .service-dropdown-info { font-size:11.5px !important; gap:8px; }
}
@media (max-width:420px){
  .form-control { font-size:12.5px !important; padding:8px 10px !important; border-radius:10px !important; }
  select.form-control { padding-inline-end:28px !important; }
  #fields .form-group, .neworder-form .form-group { margin-bottom:8px !important; }
  #fields label, .form-group > label, .control-label { font-size:11.5px !important; margin-bottom:3px !important; }
  textarea.form-control { min-height:55px; }
  .btn { font-size:12px !important; padding:8px 12px !important; border-radius:10px !important; }
  .btn-sm, .btn-xs, .btn-min { font-size:11px !important; padding:5px 8px !important; }
  .category-dropdown-item, .service-dropdown-item { padding:8px 10px; font-size:12px; border-radius:8px; }
  .service-dropdown-name .s-name { font-size:11.5px; }
  .service-dropdown-price { font-size:12px; }
  .service-dropdown-bottom, .service-dropdown-info { font-size:10.5px; gap:6px; }
}
.border-10 { border-radius:var(--halo-radius); }
.alert { padding:13px 16px; border-radius:var(--halo-radius); margin-bottom:16px; border:1px solid transparent; font-size:13.5px; }
.alert-danger, .alert-error { background:color-mix(in srgb,var(--halo-red) 12%,transparent); border-color:color-mix(in srgb,var(--halo-red) 35%,transparent); color:var(--halo-red); }
.alert-success { background:color-mix(in srgb,var(--halo-green) 12%,transparent); border-color:color-mix(in srgb,var(--halo-green) 35%,transparent); color:var(--halo-green); }
.alert .close { float:inline-end; border:0; background:none; color:inherit; font-size:18px; cursor:pointer; line-height:1; }
.well { background:var(--halo-surface-2); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:16px; margin-bottom:16px; }
.category-dropdown-item, .service-dropdown-item { padding:11px 13px; border-radius:10px; cursor:pointer; border:1px solid transparent; margin-bottom:4px; background:var(--halo-surface); }
.category-dropdown-item:hover, .service-dropdown-item:hover, .category-dropdown-item.active, .service-dropdown-item.active { background:var(--halo-surface-2); border-color:color-mix(in srgb,var(--halo-accent) 30%,var(--halo-border)); }
.service-dropdown-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.service-dropdown-name .s-name { font-weight:700; font-size:13.5px; }
.service-dropdown-price { font-weight:800; color:var(--halo-accent-strong); white-space:nowrap; }
.service-dropdown-price small { color:var(--halo-muted); font-weight:500; font-size:11px; }
.service-dropdown-bottom, .service-dropdown-info { display:flex; gap:14px; flex-wrap:wrap; margin-top:6px; color:var(--halo-muted); font-size:12px; }
.service-dropdown-info b { color:var(--halo-text); }
.service-features { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.service-features-item { font-size:11px; padding:2px 8px; border-radius:99px; background:var(--halo-surface-2); font-weight:600; }


/* ===== صفحة تسجيل الدخول (هبوط) — Halo v4 ===== */
.halo-auth { max-width:1120px; margin:0 auto; padding:8px 0 40px; overflow-x:hidden; }
.halo-auth-hero { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:stretch; padding:32px 0 48px; min-height:520px; }

/* visual panel */
.halo-auth-hero-visual { position:relative; border-radius:var(--halo-radius-xl); overflow:hidden; display:flex; flex-direction:column; justify-content:center; padding:40px 36px; min-height:480px; }
.halo-auth-mesh { position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 60% 50% at 20% 30%, color-mix(in srgb, var(--halo-accent) 22%, transparent), transparent),
    radial-gradient(ellipse 50% 60% at 80% 70%, color-mix(in srgb, #3B82F6 18%, transparent), transparent),
    radial-gradient(ellipse 40% 40% at 50% 50%, color-mix(in srgb, var(--halo-accent) 6%, transparent), transparent),
    var(--halo-surface);
  border:1px solid var(--halo-border); border-radius:inherit; }

/* floating stat cards */
.halo-auth-float-cards { position:absolute; inset:0; z-index:1; pointer-events:none; }
.halo-auth-fcard { position:absolute; display:flex; align-items:center; gap:12px; padding:14px 18px; border-radius:14px;
  background:var(--halo-surface); border:1px solid var(--halo-border); box-shadow:0 8px 32px rgba(0,0,0,.08);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); pointer-events:auto; animation:haloFloat 6s ease-in-out infinite; }
.halo-auth-fcard i { font-size:18px; color:var(--halo-accent); flex-shrink:0; }
.halo-auth-fcard b { display:block; font-size:20px; font-weight:800; letter-spacing:-.02em; line-height:1.1; }
.halo-auth-fcard span { display:block; font-size:11px; color:var(--halo-muted); margin-top:1px; }
.halo-auth-fcard--1 { top:8%; inset-inline-start:8%; animation-delay:0s; }
.halo-auth-fcard--2 { top:8%; inset-inline-end:8%; animation-delay:-2s; }
.halo-auth-fcard--3 { bottom:12%; inset-inline-end:10%; animation-delay:-4s; }
@keyframes haloFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-2px); } }

/* hero text overlay */
.halo-auth-hero-text { position:relative; z-index:2; padding-top:16px; }
.halo-auth-hero-text h1 { font-size:38px; font-weight:800; line-height:1.15; letter-spacing:-.03em; margin:0 0 14px; }
.halo-auth-hero-text p { font-size:16px; color:var(--halo-muted); margin:0 0 20px; line-height:1.6; }
.halo-auth-plat-row { display:flex; gap:8px; flex-wrap:wrap; }
.halo-auth-plat-dot { width:36px; height:36px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--halo-accent) 8%, var(--halo-surface)); border:1px solid var(--halo-border); font-size:15px; color:var(--halo-muted);
  transition:all .2s var(--halo-ease); }
.halo-auth-plat-dot:hover { color:var(--halo-accent); border-color:var(--halo-accent); transform:translateY(-2px); }

.halo-auth-cta { font-size:15px; padding:14px 28px; }

/* auth wrapper + title (signup, 2fa, confirm, reset pages) */
.halo-auth-wrap { max-width:460px; margin:0 auto; padding:32px 16px; }
.halo-auth-title { font-size:22px; font-weight:700; margin-bottom:20px; text-align:center; }

/* login card */
.halo-auth-card { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius-lg);
  box-shadow:0 1px 2px rgba(0,0,0,.04), 0 8px 40px color-mix(in srgb, var(--halo-accent) 5%, rgba(0,0,0,.06)); padding:30px;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.halo-auth-card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.halo-auth-card-title { display:flex; align-items:center; gap:10px; font-size:19px; font-weight:800; margin:0; }
.halo-auth-card-title i { color:var(--halo-accent); }
.halo-auth-input-wrap, .halo-input-wrap { position:relative; }
.halo-input-wrap i { position:absolute; top:50%; inset-inline-start:13px; transform:translateY(-50%); font-size:14px; color:var(--halo-muted); pointer-events:none; z-index:1; }
.halo-input-wrap .halo-input { padding-inline-start:38px; }
.halo-auth-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:6px 0 16px; flex-wrap:wrap; }
.halo-auth-link, .halo-auth-alt a { color:var(--halo-accent-strong); font-weight:700; font-size:13px; transition:opacity .15s; }
.halo-auth-link:hover, .halo-auth-alt a:hover { opacity:.8; }
.halo-auth-submit { margin-top:8px; font-weight:700; letter-spacing:-.01em; }
.halo-auth-alt { text-align:center; margin-top:16px; font-size:13.5px; color:var(--halo-muted); }
.halo-auth-divider { display:flex; align-items:center; gap:14px; margin:20px 0 16px; color:var(--halo-muted); font-size:12px; font-weight:600; }
.halo-auth-divider::before, .halo-auth-divider::after { content:''; flex:1; height:1px; background:var(--halo-border); }
.halo-auth-google { display:flex; justify-content:center; }
.halo-auth-google > div { display:flex; justify-content:center; }

/* numbers strip */
.halo-auth-numbers { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; padding:8px 0 0; }
.halo-auth-num { display:flex; align-items:center; gap:14px; padding:20px 22px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius);
  transition:all .2s var(--halo-ease); }
.halo-auth-num:hover { border-color:color-mix(in srgb, var(--halo-accent) 30%, var(--halo-border)); transform:translateY(-2px); }
.halo-auth-num-ic { width:46px; height:46px; border-radius:13px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
  background:color-mix(in srgb, var(--halo-accent) 10%, transparent); color:var(--halo-accent-strong); font-size:18px; }
.halo-auth-num b { display:block; font-size:24px; font-weight:800; letter-spacing:-.025em; line-height:1.1; }
.halo-auth-num span { display:block; font-size:12px; color:var(--halo-muted); margin-top:3px; }

/* bento features */
.halo-auth-bento { padding:56px 0 8px; }
.halo-auth-bento-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.halo-auth-bcard { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:26px;
  transition:all .25s var(--halo-ease); position:relative; overflow:hidden; }
.halo-auth-bcard::before { content:''; position:absolute; top:0; inset-inline-start:0; width:3px; height:0; background:var(--halo-accent); border-radius:0 3px 3px 0; transition:height .25s var(--halo-ease); }
.halo-auth-bcard:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.halo-auth-bcard:hover::before { height:100%; }
.halo-auth-bcard--wide { grid-column:span 2; }
.halo-auth-bcard--full { grid-column:1 / -1; }
.halo-auth-bcard-ic { width:46px; height:46px; border-radius:13px; display:inline-flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--halo-accent) 12%, transparent); color:var(--halo-accent-strong); font-size:20px; margin-bottom:16px; }
.halo-auth-bcard h3 { font-size:16px; font-weight:700; margin:0 0 8px; }
.halo-auth-bcard p { font-size:13.5px; color:var(--halo-muted); line-height:1.65; margin:0; }

/* platforms */
.halo-auth-platforms { padding:56px 0 8px; }
.halo-auth-plat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.halo-auth-plat { display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; padding:24px 16px;
  background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); color:inherit;
  text-decoration:none; transition:all .2s var(--halo-ease); position:relative; overflow:hidden; }
.halo-auth-plat::after { content:''; position:absolute; bottom:0; inset-inline:0; height:2px; background:var(--halo-accent); transform:scaleX(0); transition:transform .2s var(--halo-ease); }
.halo-auth-plat:hover { transform:translateY(-2px); border-color:var(--halo-accent); box-shadow:0 6px 18px rgba(0,0,0,.08); }
.halo-auth-plat:hover::after { transform:scaleX(1); }
.halo-auth-plat-ic { width:54px; height:54px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center;
  font-size:24px; color:var(--halo-accent-strong); background:color-mix(in srgb, var(--halo-accent) 8%, var(--halo-surface-2)); }
.halo-auth-plat-n { font-weight:800; font-size:15px; }
.halo-auth-plat-s { font-size:11.5px; color:var(--halo-muted); }

/* how-it-works steps */
.halo-auth-how { padding:56px 0 8px; }
.halo-auth-timeline { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.halo-auth-tl-step { display:flex; flex-direction:column; gap:14px; padding:28px 24px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); transition:all .2s var(--halo-ease); }
.halo-auth-tl-step:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.halo-auth-tl-n { flex:0 0 40px; width:40px; height:40px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--halo-accent) 12%, transparent); color:var(--halo-accent-strong); font-weight:800; font-size:16px; }
.halo-auth-tl-content h3 { font-size:16px; font-weight:700; margin:0 0 6px; }
.halo-auth-tl-content p { font-size:13.5px; color:var(--halo-muted); line-height:1.6; margin:0; }

/* testimonials */
.halo-auth-testimonials { padding:56px 0 8px; }
.halo-auth-testimonials .halo-auth-h2 { text-align:center; margin-bottom:28px; }
.halo-auth-testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.halo-auth-testi { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:26px;
  transition:all .25s var(--halo-ease); }
.halo-auth-testi:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.halo-auth-testi-head { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.halo-auth-testi-av { width:42px; height:42px; border-radius:50%; color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; flex-shrink:0;
  box-shadow:0 2px 8px rgba(0,0,0,.12); }
.halo-auth-testi-head b { font-size:14px; display:block; }
.halo-auth-testi-head span { font-size:11.5px; color:var(--halo-muted); }
.halo-auth-testi-stars { color:#f5b301; font-size:13px; margin-bottom:10px; display:flex; gap:2px; }
.halo-auth-testi p { font-size:14px; line-height:1.7; color:var(--halo-muted); margin:0; font-style:italic; }

/* pricing */
.halo-auth-pricing { padding:56px 0 8px; }
.halo-auth-pricing .halo-auth-h2 { text-align:center; margin-bottom:6px; }
.halo-auth-pricing-sub { text-align:center; font-size:15px; color:var(--halo-muted); margin:0 0 32px; }
.halo-auth-price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.halo-auth-price-card { background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:30px 24px; text-align:center;
  transition:all .25s var(--halo-ease); position:relative; }
.halo-auth-price-card:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.halo-auth-price-card.featured { border-color:var(--halo-accent); background:color-mix(in srgb, var(--halo-accent) 3%, var(--halo-surface));
  box-shadow:0 0 0 1px var(--halo-accent), 0 8px 32px color-mix(in srgb, var(--halo-accent) 12%, transparent); }
.halo-auth-price-badge { position:absolute; top:-12px; inset-inline-start:50%; transform:translateX(-50%); background:var(--halo-accent); color:var(--halo-accent-ink); font-size:11px; font-weight:700; padding:5px 16px; border-radius:20px; white-space:nowrap;
  box-shadow:0 4px 12px color-mix(in srgb, var(--halo-accent) 30%, transparent); }
[dir="rtl"] .halo-auth-price-badge { transform:translateX(50%); }
.halo-auth-price-ic { font-size:30px; color:var(--halo-accent); margin-bottom:14px; }
.halo-auth-price-card h3 { font-size:15px; font-weight:700; margin:0 0 10px; }
.halo-auth-price-val { font-size:32px; font-weight:800; color:var(--halo-accent); margin-bottom:18px; letter-spacing:-.02em; }
.halo-auth-price-val span { font-size:14px; font-weight:400; color:var(--halo-muted); }
.halo-auth-price-card ul { list-style:none; padding:0; margin:0 0 20px; text-align:start; }
.halo-auth-price-card li { font-size:13.5px; padding:6px 0; color:var(--halo-text); display:flex; align-items:center; gap:8px; }
.halo-auth-price-card li i { color:var(--halo-accent); font-size:11px; }

/* faq */
.halo-auth-faq { padding:56px 0 8px; max-width:720px; margin:0 auto; }
.halo-auth-faq-item { border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:2px 20px; margin-bottom:10px; background:var(--halo-surface); transition:all .2s var(--halo-ease); }
.halo-auth-faq-item[open] { border-color:color-mix(in srgb, var(--halo-accent) 40%, var(--halo-border)); box-shadow:0 4px 16px color-mix(in srgb, var(--halo-accent) 6%, transparent); }
.halo-auth-faq-item summary { cursor:pointer; font-weight:700; font-size:14.5px; padding:16px 0; list-style:none; display:flex; justify-content:space-between; align-items:center; }
.halo-auth-faq-item summary::after { content:'+'; font-size:18px; color:var(--halo-muted); transition:transform .25s var(--halo-ease); }
.halo-auth-faq-item[open] summary::after { content:'−'; transform:rotate(180deg); }
.halo-auth-faq-item p { margin:0 0 16px; font-size:13.5px; color:var(--halo-muted); line-height:1.7; }

/* cta band */
.halo-auth-cta-band { text-align:center; padding:56px 32px; margin:48px 0 8px; border-radius:var(--halo-radius-lg);
  background:color-mix(in srgb, var(--halo-accent) 4%, var(--halo-surface)); border:1px solid color-mix(in srgb, var(--halo-accent) 18%, var(--halo-border));
  position:relative; overflow:hidden; }
.halo-auth-cta-band::before { content:''; position:absolute; top:0; inset-inline:0; height:2px; background:var(--halo-accent); opacity:.4; }
.halo-auth-cta-band::after { content:''; position:absolute; top:-80px; inset-inline-end:-80px; width:200px; height:200px; border-radius:50%; background:color-mix(in srgb, var(--halo-accent) 6%, transparent); pointer-events:none; }
.halo-auth-cta-band h2 { font-size:28px; font-weight:800; margin:0 0 10px; letter-spacing:-.02em; }
.halo-auth-cta-band p { font-size:15px; color:var(--halo-muted); margin:0 0 24px; }

/* auth h2 */
.halo-auth-h2 { text-align:center; font-size:26px; font-weight:800; margin:0 0 28px; letter-spacing:-.02em; }

/* responsive */
@media (max-width:820px){
  .halo-auth-hero { grid-template-columns:1fr; gap:24px; min-height:auto; padding:20px 0 32px; }
  .halo-auth-hero-visual { min-height:320px; padding:24px; }
  .halo-auth-hero-text h1 { font-size:28px; }
  .halo-auth-fcard--1 { top:6%; inset-inline-start:5%; }
  .halo-auth-fcard--2 { top:6%; inset-inline-end:5%; }
  .halo-auth-fcard--3 { bottom:10%; inset-inline-end:8%; top:auto; }
  .halo-auth-card { order:-1; }
  .halo-auth-numbers { grid-template-columns:repeat(2,1fr); }
  .halo-auth-bento-grid { grid-template-columns:1fr; }
  .halo-auth-bcard--wide, .halo-auth-bcard--full { grid-column:span 1; }
  .halo-auth-plat-grid { grid-template-columns:repeat(2,1fr); }
  .halo-auth-timeline { grid-template-columns:1fr; }
  .halo-auth-testi-grid { grid-template-columns:1fr; }
  .halo-auth-price-grid { grid-template-columns:1fr; max-width:340px; margin-inline:auto; }
}
@media (max-width:480px){
  .halo-auth { padding-inline:4px; }
  .halo-auth-hero-visual { min-height:280px; padding:16px; }
  .halo-auth-hero-text { padding-top:20px; }
  .halo-auth-hero-text h1 { font-size:22px; }
  .halo-auth-fcard { padding:8px 12px; border-radius:10px; gap:8px; }
  .halo-auth-fcard b { font-size:15px; }
  .halo-auth-fcard span { font-size:9px; }
  .halo-auth-fcard i { font-size:14px; }
  .halo-auth-fcard--1 { top:5%; inset-inline-start:4%; }
  .halo-auth-fcard--2 { top:5%; inset-inline-end:4%; }
  .halo-auth-fcard--3 { bottom:8%; inset-inline-end:6%; top:auto; }
  .halo-auth-numbers { grid-template-columns:1fr; }
  .halo-auth-plat-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .halo-auth-plat-row { justify-content:center; }
  .halo-auth-card { padding:20px; }
}

/* ألوان شارات مميّزات الخدمة (نقل من ثيم master) */
.service-features-item.guaranteed, .service-features-item.discounted { background:color-mix(in srgb,var(--halo-green) 15%,transparent); color:var(--halo-green); }
.service-features-item.faster { background:color-mix(in srgb,var(--halo-blue) 15%,transparent); color:var(--halo-blue); }
.service-features-item.recommended { background:color-mix(in srgb,var(--halo-accent) 15%,transparent); color:var(--halo-accent-strong); }
.service-features-item.canceled { background:color-mix(in srgb,var(--halo-red) 15%,transparent); color:var(--halo-red); }
.service-features-item.timed { background:color-mix(in srgb,var(--halo-yellow) 18%,transparent); color:var(--halo-yellow); }
.service-features-item.slow { background:var(--halo-surface-2); color:var(--halo-muted); }

/* أزرار أيقونة فقط (خدمات) + زر الخروج الواضح + حواف تمرير القائمة */
.halo-icon-only { width:38px; padding-inline:0; justify-content:center; }
.halo-logout { color:var(--halo-red); }
.halo-logout:hover { background:color-mix(in srgb,var(--halo-red) 12%,transparent); border-color:color-mix(in srgb,var(--halo-red) 35%,transparent); }
/* تلميح بصري لإمكانية تمرير القائمة أفقيًا (تدرّج خفيف على الحافة القابلة للتمرير) */
.halo-topnav.scroll-end .halo-topmenu { -webkit-mask-image:linear-gradient(to left, transparent, #000 32px); mask-image:linear-gradient(to left, transparent, #000 32px); }
[dir="rtl"] .halo-topnav.scroll-end .halo-topmenu { -webkit-mask-image:linear-gradient(to right, transparent, #000 32px); mask-image:linear-gradient(to right, transparent, #000 32px); }
.halo-logout { color:var(--halo-red); }

/* زر تسجيل الدخول عبر Google */
.halo-auth-google { margin-top:12px; display:flex; justify-content:center; }
.halo-auth-google > div { width:100%; }

/* ===== قائمة منسدلة مخصّصة بالأيقونات (فئة/خدمة) ===== */
.halo-cdd-native { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.halo-cdd { position:relative; }
.halo-cdd-sel { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; padding:11px 13px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); color:var(--halo-text); cursor:pointer; font-size:14px; }
.halo-cdd-name { display:inline-flex; align-items:center; gap:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.halo-cdd.open .halo-cdd-sel { border-color:var(--halo-accent); box-shadow:var(--halo-focus); }
.halo-cdd-panel { display:none; position:absolute; z-index:50; top:calc(100% + 6px); inset-inline:0; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); box-shadow:var(--halo-lift); max-height:340px; overflow:auto; padding:6px; }
.halo-cdd.open .halo-cdd-panel { display:block; }
.halo-cdd-search { margin-bottom:6px; position:sticky; top:0; }
.halo-cdd-item { display:flex; align-items:center; gap:9px; padding:9px 11px; border-radius:10px; cursor:pointer; font-size:13.5px; }
.halo-cdd-item:hover, .halo-cdd-item.active { background:var(--halo-surface-2); }
.halo-cdd-ic { display:inline-flex; width:18px; justify-content:center; align-items:center; color:var(--halo-accent-strong); flex-shrink:0; }
.halo-cdd-ic img { width:18px; height:18px; object-fit:contain; }

/* ===== قائمة اسم الحساب المنسدلة (Halo) ===== */
.halo-user-dd { flex:0 0 auto; }
.halo-user-dd .halo-topuser { width:38px; height:38px; border-radius:10px; border:1px solid var(--halo-border); background:var(--halo-surface); color:var(--halo-text); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; font-family:inherit; padding:0; }
.halo-user-dd .halo-topuser i:first-child { font-size:16px; }
.halo-user-dd .halo-user-name { display:none; }
.halo-user-dd .halo-dd-caret { display:none; }
.halo-dd-caret { font-size:11px; color:var(--halo-muted); transition:transform .15s; }
.halo-user-dd.open .halo-dd-caret { transform:rotate(180deg); }
.halo-user-menu { inset-inline-start:auto !important; inset-inline-end:0; min-width:230px; padding:6px; }
.halo-user-menu .halo-dd-item { display:flex; align-items:center; gap:9px; border-radius:10px; font-size:13.5px; }
.halo-user-menu .halo-dd-item i { width:18px; text-align:center; color:var(--halo-accent-strong); }
.halo-dd-sep { height:1px; background:var(--halo-border); margin:6px 4px; }
.halo-dd-label { font-size:11px; font-weight:700; color:var(--halo-muted); padding:4px 9px 6px; }
.halo-dd-theme-row { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; padding:0 4px 4px; }
.halo-dd-theme-row button { display:flex; flex-direction:column; align-items:center; gap:4px; padding:9px 4px; border:1px solid var(--halo-border); border-radius:10px; background:var(--halo-surface); color:var(--halo-muted); cursor:pointer; font-family:inherit; font-size:11.5px; font-weight:600; }
.halo-dd-theme-row button i { font-size:15px; }
.halo-dd-theme-row button.active { border-color:var(--halo-accent); color:var(--halo-accent-strong); background:color-mix(in srgb,var(--halo-accent) 10%,transparent); }
.halo-dd-logout { color:var(--halo-red) !important; }
.halo-dd-logout i { color:var(--halo-red) !important; }
.halo-dd-logout:hover { background:color-mix(in srgb,var(--halo-red) 10%,transparent) !important; }
/* حركة انسيابية للتمرير الأفقي */
.halo-topmenu { scroll-behavior:auto; }

/* عنصر طريقة الدفع داخل القائمة المنسدلة (اسم + وصف/رسوم) */
.halo-cdd-pay { display:flex; flex-direction:column; gap:2px; min-width:0; }
.halo-cdd-pay b { font-weight:700; font-size:13.5px; }
.halo-cdd-pay small { color:var(--halo-muted); font-size:11.5px; }


/* أيقونة الفئة + زر نسخ رقم الخدمة (صفحة الخدمات) */
.halo-cat-ico, .halo-svc-cat-ico { display:inline-flex; align-items:center; }
.halo-cat-ico span, .halo-svc-cat-ico span { font-size:16px; }
.halo-cat-ico-img { width:20px; height:20px; object-fit:contain; vertical-align:middle; }
.halo-svc-cat-ico .halo-cat-ico-img { width:16px; height:16px; }
.halo-svc-copy { border:0; background:transparent; color:var(--halo-muted); cursor:pointer; padding:2px 4px; font-size:12px; border-radius:6px; }
.halo-svc-copy:hover { color:var(--halo-accent); background:var(--halo-surface-2); }

/* ===== تحسينات متقدّمة لتسجيل الدخول ===== */
.halo-auth-promo .halo-grad { background:linear-gradient(135deg, var(--halo-accent), color-mix(in srgb, var(--halo-accent) 65%, #8b7bd6)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.halo-auth-hero { position:relative; }
.halo-auth-hero::before { content:''; position:absolute; inset:-24px -40px; z-index:-1; pointer-events:none; border-radius:26px;
  background-image:radial-gradient(circle at 20% 30%, color-mix(in srgb,var(--halo-accent) 8%,transparent) 0%, transparent 50%),
                    radial-gradient(circle at 80% 70%, color-mix(in srgb,var(--halo-accent) 6%,transparent) 0%, transparent 50%); }

/* تنبيه قابل للإغلاق */
.halo-alert { position:relative; overflow:hidden; }
.halo-alert-close { position:absolute; top:8px; inset-inline-end:10px; border:0; background:transparent; color:inherit; font-size:20px; line-height:1; cursor:pointer; opacity:.6; padding:0 4px; }
.halo-alert-close:hover { opacity:1; }
[dir="rtl"] .halo-alert { padding-inline-end:34px; }
[dir="ltr"] .halo-alert { padding-inline-end:34px; }

/* وقت إتاحة إعادة التعبئة */
.halo-refil-time { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:var(--halo-muted); background:var(--halo-surface-2); padding:6px 11px; border-radius:99px; }

/* مبدّل إشعارات (toggle switch من checkbox) */
.halo-switch-input { appearance:none; -webkit-appearance:none; width:40px; height:22px; border-radius:99px; background:var(--halo-border); position:relative; cursor:pointer; transition:background .2s; vertical-align:middle; flex-shrink:0; }
.halo-switch-input::before { content:''; position:absolute; top:2px; inset-inline-start:2px; width:18px; height:18px; border-radius:50%; background:#fff; transition:inset-inline-start .2s; box-shadow:0 1px 2px rgba(0,0,0,.25); }
.halo-switch-input:checked { background:var(--halo-accent); }
.halo-switch-input:checked::before { inset-inline-start:20px; }
.halo-switch-input:disabled { opacity:.45; cursor:not-allowed; }

/* شارة المستوى + إحصائيات الحساب */
.halo-level-badge { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; color:var(--halo-accent-strong); background:color-mix(in srgb,var(--halo-accent) 14%,transparent); padding:3px 10px; border-radius:99px; margin-inline-start:6px; }
.halo-acct-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); gap:12px; margin-bottom:20px; }
.halo-acct-stat { display:flex; align-items:center; gap:12px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:14px 16px; }
.halo-acct-stat > i { font-size:20px; color:var(--halo-accent-strong); }
.halo-acct-stat b { display:block; font-size:17px; font-weight:800; }
.halo-acct-stat span { font-size:12px; color:var(--halo-muted); }

/* تعليمات طريقة الدفع المختارة (الجزء بعد ~) */
.halo-pay-instructions { margin-bottom:14px; padding:11px 14px; border-radius:var(--halo-radius); background:color-mix(in srgb,var(--halo-accent) 8%,transparent); border:1px solid color-mix(in srgb,var(--halo-accent) 20%,transparent); color:var(--halo-text); font-size:13px; line-height:1.6; }

/* ===== توحيد أحجام العناصر على الهاتف ===== */
@media (max-width:560px){
  .halo-container { padding:16px 13px 44px; }
  .halo-page-title { font-size:19px; margin-bottom:14px; }
  .halo-page-title i { font-size:18px; }
  .halo-card, .halo-well { padding:15px; margin-bottom:14px; }
  .halo-card-title { font-size:15px; margin-bottom:12px; }
  .halo-stats { grid-template-columns:repeat(2,1fr); gap:10px; }
  .halo-stat { padding:12px 14px; }
  .halo-stat-val { font-size:18px; }
  .halo-btn { padding:10px 14px; font-size:13px; }
  .halo-btn.block { width:100%; }
  .halo-form-group label { font-size:12.5px; }
  .halo-input, .halo-form-group input, .halo-form-group select, .halo-form-group textarea { font-size:14px; padding:10px 12px; }
  .halo-order-grid, .halo-grid-2, .halo-grid-3 { grid-template-columns:1fr; gap:14px; }
  .halo-service { flex-wrap:wrap; }
  .halo-service-right { width:100%; justify-content:space-between; margin-top:8px; }
  .halo-toolbar { flex-direction:column; }
  .halo-toolbar > * { width:100%; }

  /* Panel engine form classes — mobile sizing (! to beat panel CSS) */
  #fields .form-group, .neworder-form .form-group { margin-bottom:10px !important; }
  #fields label, .form-group > label, .control-label { font-size:12.5px !important; margin-bottom:4px !important; }
  .form-control { font-size:13px !important; padding:10px 12px !important; border-radius:12px !important; }
  textarea.form-control { min-height:70px; }

  /* Panel engine buttons — compact on mobile */
  .btn { font-size:13px !important; padding:9px 14px !important; }
  .btn-xs { font-size:11px !important; padding:5px 9px !important; }
  .btn-sm { font-size:12px !important; padding:7px 11px !important; }
}

/* إصلاح حجم القائمة المخصّصة داخل شريط أدوات الخدمات */
.halo-toolbar .halo-cdd { flex:0 0 auto; min-width:220px; max-width:340px; }
.halo-toolbar .halo-cdd-name { max-width:100%; }
@media (max-width:560px){ .halo-toolbar .halo-cdd { min-width:0; max-width:none; width:100%; } }

/* قائمة اللغات داخل قائمة الحساب */
.halo-dd-langs { display:flex; flex-wrap:wrap; gap:5px; padding:0 4px 4px; }
.halo-dd-lang { font-size:12.5px; font-weight:600; color:var(--halo-text); background:var(--halo-surface-2); padding:6px 11px; border-radius:8px; }
.halo-dd-lang:hover { background:color-mix(in srgb,var(--halo-accent) 12%,transparent); }
.halo-dd-lang.active { background:var(--halo-accent); color:var(--halo-accent-ink); }

/* ===== Halo: تناسق الهيدر وصفحة طلب جديد على الهاتف ===== */
@media (max-width:600px){
  .halo-topactions { gap:6px; }
  .halo-icon-btn { width:34px; height:34px; }
  .halo-balance { padding:6px 10px; gap:5px; font-size:12px; }
  .halo-bal-amt { font-size:12.5px; }
  .halo-eye { font-size:12px; }
  .halo-cur-inline { font-size:11px; padding-inline-start:6px; margin-inline-start:2px; }
  .halo-user-dd .halo-topuser { width:34px; height:34px; }
  .halo-nav-toggle { width:34px; height:34px; }
  .halo-user-menu { min-width:210px; }
}
@media (max-width:560px){
  .halo-stats { grid-template-columns:repeat(2,1fr); gap:9px; }
  .halo-stat { padding:11px 13px; }
  .halo-stat-top { font-size:11.5px; }
  .halo-stat-val { font-size:16px; }
  .halo-order-grid { grid-template-columns:1fr; gap:12px; }
  .halo-search-results { max-height:220px; }
  .halo-cdd-panel { max-height:280px; }
  /* orbit-order-compact-done: فورم طلب جديد أكثر إحكامًا على الهاتف */
  .halo-order-grid .halo-card { padding:14px 13px; }
  .halo-form-group { margin-bottom:11px; }
  .halo-form-group label { margin-bottom:4px; }
  .halo-input, .halo-form-group input, .halo-form-group select, .halo-form-group textarea { padding:9px 11px; }
  .halo-search-box { margin-bottom:10px; }
  .halo-stat-top i { font-size:13px; }
  .halo-service-detail { padding:14px; }
  .halo-service-detail .halo-service-name { font-size:13px; }
  .halo-detail-row { font-size:12.5px; padding:6px 0; }
  .halo-order-grid .halo-btn.block { padding:11px; margin-top:2px; }

  /* Panel engine form — extra compact at 420px */
  #fields .form-group, .neworder-form .form-group { margin-bottom:8px; }
  #fields label, .form-group > label, .control-label { font-size:12px; margin-bottom:3px; font-weight:600; }
  .form-control { font-size:13px; padding:9px 11px; border-radius:10px; }
  .btn { font-size:12px; padding:8px 12px; border-radius:10px; }

  /* CDD custom dropdown — compact */
  .halo-cdd-sel { padding:9px 11px; font-size:13px; min-height:auto; }
  .halo-cdd-name { font-size:13px; }
  .halo-cdd-item { padding:8px 10px; font-size:13px; }
  .halo-cdd-search { padding:8px 10px; font-size:13px; }
}


/* ===== orbit neworder: stat links + how-to (flat idiom) ===== */
.halo-stat-accent { background:color-mix(in srgb,var(--halo-accent) 8%,var(--halo-surface)); border-color:color-mix(in srgb,var(--halo-accent) 30%,var(--halo-border)); }
.halo-stat-link { display:inline-flex; align-items:center; gap:6px; margin-top:10px; font-size:12px; font-weight:600; color:var(--halo-accent-strong); }
.halo-stat-link:hover { gap:9px; }
.halo-howto { margin-top:16px; background:var(--halo-surface-2); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:18px; }
.halo-howto-title { display:flex; align-items:center; gap:8px; font-weight:600; font-size:15px; margin-bottom:14px; }
.halo-howto-title i { color:var(--halo-accent); }
.halo-howto-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.halo-howto-list li { display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--halo-muted); line-height:1.5; }
.halo-howto-list li span { flex:0 0 22px; width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  background:var(--halo-surface); border:1px solid var(--halo-border); color:var(--halo-accent-strong); font-weight:600; font-size:11px; }

/* Add Funds — accepted methods strip (flat) */
.halo-pay-accept { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:18px; padding:12px 14px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface-2); }
.halo-pay-accept-t { font-size:12px; font-weight:600; color:var(--halo-muted); }
.halo-pay-accept-ic { display:flex; gap:12px; font-size:22px; color:var(--halo-muted); }
.halo-pay-accept-ic i:hover { color:var(--halo-accent); }

/* UI size switcher + ticket lightbox */
:root[data-size="compact"] { font-size:13px; }
:root[data-size="large"] { font-size:16px; }
.halo-size-toggle { display:flex; background:var(--halo-surface-2); border-radius:var(--halo-radius); padding:4px; gap:4px; }
.halo-size-toggle button { flex:1; border:0; background:transparent; color:var(--halo-muted); padding:6px 8px; border-radius:10px; cursor:pointer; font-family:inherit; font-weight:600; }
.halo-size-toggle button.active { background:var(--halo-surface); color:var(--halo-text); }
.halo-size-toggle button[data-size-btn="compact"]{ font-size:11px; } .halo-size-toggle button[data-size-btn="normal"]{ font-size:13px; } .halo-size-toggle button[data-size-btn="large"]{ font-size:15px; }
.halo-zoomable { cursor:zoom-in; border-radius:12px; transition:transform .2s; max-width:160px; }
.halo-zoomable.enlarged { cursor:zoom-out; position:fixed; inset:0; margin:auto; max-width:92vw; max-height:88vh; width:auto; height:auto; z-index:9999; }
body:has(.halo-zoomable.enlarged)::after { content:''; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:9998; }


/* ===================== Add Funds (redesigned) ===================== */
.halo-af-form { display:flex; flex-direction:column; gap:16px; }
.halo-af-hist { display:flex; flex-direction:column; gap:0; }
.halo-af-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:20px; align-items:start; }
@media (max-width:860px){ .halo-af-grid { grid-template-columns:1fr; } }
.halo-af-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:18px; }
.halo-af-title { display:flex; align-items:center; gap:9px; font-size:18px; font-weight:800; }
.halo-af-title i { color:var(--halo-accent); }
.halo-af-sub { font-size:13px; color:var(--halo-muted); margin-top:4px; }
.halo-af-balchip { display:inline-flex; align-items:center; gap:8px; white-space:nowrap; background:color-mix(in srgb,var(--halo-accent) 14%,transparent); border:1px solid color-mix(in srgb,var(--halo-accent) 32%,transparent); color:var(--halo-accent-strong); padding:8px 14px; border-radius:99px; font-weight:800; }
/* payment custom dropdown */
.halo-af-paybox { position:relative; }
.halo-af-paytrigger { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:12px 14px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); cursor:pointer; }
.halo-af-paytrigger:hover { border-color:color-mix(in srgb,var(--halo-text) 25%,var(--halo-border)); }
.halo-af-payname { font-weight:700; }
.halo-af-paymenu { position:absolute; z-index:40; inset-inline:0; top:calc(100% + 6px); background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius); box-shadow:var(--halo-lift); overflow:hidden; display:none; }
.halo-af-paymenu.open { display:block; }
.halo-af-payhead { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid var(--halo-border); font-weight:700; }
.halo-af-payhead button { border:0; background:transparent; color:var(--halo-muted); font-size:18px; cursor:pointer; }
.halo-af-paylist { max-height:280px; overflow-y:auto; }
.halo-af-payitem { display:flex; flex-direction:column; gap:3px; padding:11px 14px; cursor:pointer; border-bottom:1px solid var(--halo-border); }
.halo-af-payitem:last-child { border-bottom:0; }
.halo-af-payitem:hover { background:var(--halo-surface-2); }
.halo-af-payitem.active { background:color-mix(in srgb,var(--halo-accent) 12%,transparent); }
.halo-af-payitem-n { font-weight:700; font-size:14px; }
.halo-af-payitem-d { font-size:12px; color:var(--halo-muted); }
.halo-af-paybg { position:fixed; inset:0; z-index:39; display:none; }
.halo-af-paybg.open { display:block; }
.halo-af-instructions { background:var(--halo-surface-2); border:1px solid var(--halo-border); border-radius:var(--halo-radius); padding:12px 14px; font-size:13px; color:var(--halo-text); margin:14px 0; line-height:1.6; word-wrap:break-word; overflow-wrap:break-word; }
.halo-af-instructions p { margin:0 0 8px; }
.halo-af-instructions p:last-child { margin-bottom:0; }
.halo-af-instructions img { max-width:100%; height:auto; border-radius:8px; margin:6px 0; }
.halo-af-instructions a { color:var(--halo-accent-strong); text-decoration:underline; }
.halo-af-instructions ul, .halo-af-instructions ol { margin:6px 0; padding-inline-start:20px; }
.halo-af-instructions li { margin-bottom:4px; }
.halo-af-instructions strong, .halo-af-instructions b { color:var(--halo-text); font-weight:700; }
/* quick amounts */
.halo-af-quick { margin:16px 0; }
.halo-af-qlabel { display:block; font-size:12px; font-weight:700; color:var(--halo-muted); margin-bottom:8px; }
.halo-af-qgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.halo-af-qbtn { padding:10px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); color:var(--halo-text); font-family:inherit; font-weight:700; cursor:pointer; transition:.15s; }
.halo-af-qbtn:hover { border-color:var(--halo-accent); color:var(--halo-accent-strong); }
.halo-af-qcustom { display:inline-flex; align-items:center; justify-content:center; gap:6px; color:var(--halo-muted); }
.halo-af-submit { margin-top:6px; }
/* guarantees */
.halo-af-guarantees { display:flex; flex-wrap:wrap; gap:14px; justify-content:space-around; margin-top:18px; padding-top:16px; border-top:1px solid var(--halo-border); }
.halo-af-g { display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--halo-muted); font-weight:600; }
.halo-af-g i { color:var(--halo-accent); }
/* history */
.halo-af-histlist { display:flex; flex-direction:column; gap:10px; }
.halo-af-histrow { display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); }
.halo-af-histico { width:38px; height:38px; flex:0 0 38px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; background:color-mix(in srgb,var(--halo-accent) 14%,transparent); color:var(--halo-accent-strong); font-size:16px; }
.halo-af-histinfo { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.halo-af-histname { font-weight:700; font-size:14px; }
.halo-af-histtime { font-size:11.5px; color:var(--halo-muted); }
.halo-af-histright { display:flex; align-items:center; gap:8px; }
.halo-af-histamt { font-weight:800; white-space:nowrap; }
.halo-af-histamt.pos { color:var(--halo-green); } .halo-af-histamt.neg { color:var(--halo-red); }
.halo-af-invbtn { width:32px; height:32px; border:1px solid var(--halo-border); border-radius:9px; background:var(--halo-surface); color:var(--halo-muted); cursor:pointer; }
.halo-af-invbtn:hover { color:var(--halo-accent-strong); border-color:var(--halo-accent); }
.halo-af-empty { text-align:center; padding:40px 16px; color:var(--halo-muted); display:flex; flex-direction:column; align-items:center; gap:8px; }
.halo-af-empty i { font-size:34px; opacity:.5; }
.halo-af-empty b { font-size:15px; color:var(--halo-text); }
.halo-af-empty span { font-size:12.5px; }

/* Ticket attachment drop-zone */
.halo-ticket-upload { display:flex; align-items:center; justify-content:center; gap:8px; min-height:52px; padding:12px; border:1.5px dashed var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface-2); color:var(--halo-muted); cursor:pointer; font-size:13px; font-weight:600; transition:border-color .15s, color .15s; }
.halo-ticket-upload:hover { border-color:var(--halo-accent); color:var(--halo-accent-strong); }
.halo-ticket-upload::before { content:"\f0c6"; font-family:"Font Awesome 6 Pro","Font Awesome 6 Free"; font-weight:900; }

/* ===== orbit Add Funds — flat radio-card payments (Halo identity) ===== */
.halo-af-pcards { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:8px 0 16px; }
@media (max-width:560px){ .halo-af-pcards { grid-template-columns:1fr; } }
.halo-af-pcard { position:relative; display:flex; align-items:center; gap:10px; padding:14px; border:1.5px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); cursor:pointer; transition:border-color .15s, background-color .15s; }
.halo-af-pcard input { position:absolute; opacity:0; pointer-events:none; }
.halo-af-pcard:hover { border-color:color-mix(in srgb,var(--halo-text) 20%,var(--halo-border)); }
.halo-af-pcard.active { border-color:var(--halo-accent); background:color-mix(in srgb,var(--halo-accent) 8%,var(--halo-surface)); }
.halo-af-pcard-b { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.halo-af-pcard-n { font-weight:600; font-size:14px; }
.halo-af-pcard-d { font-size:12px; color:var(--halo-muted); }
.halo-af-pcard-tick { flex:0 0 20px; width:20px; height:20px; border-radius:50%; border:1.5px solid var(--halo-border); display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:10px; transition:.15s; }
.halo-af-pcard.active .halo-af-pcard-tick { background:var(--halo-accent); border-color:var(--halo-accent); }
.halo-af-pcard:not(.active) .halo-af-pcard-tick i { opacity:0; }
.halo-af-quickrow { display:flex; flex-wrap:wrap; gap:8px; margin:8px 0; }
.halo-af-quickrow .halo-af-qbtn { flex:1 1 auto; min-width:64px; padding:9px 12px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); color:var(--halo-text); font-family:inherit; font-weight:600; cursor:pointer; transition:.15s; }
.halo-af-quickrow .halo-af-qbtn:hover { border-color:var(--halo-accent); color:var(--halo-accent-strong); }

/* ── UI polish ── */

/* Themed thin scrollbar */
* { scrollbar-width:thin; scrollbar-color:color-mix(in srgb, var(--halo-accent) 25%, var(--halo-border)) transparent; }
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:color-mix(in srgb, var(--halo-accent) 25%, var(--halo-border)); border-radius:99px; }
::-webkit-scrollbar-thumb:hover { background:color-mix(in srgb, var(--halo-accent) 50%, var(--halo-border)); }

/* Glassmorphism top nav */
@supports (backdrop-filter: blur(12px)) {
  .halo-topnav { background:color-mix(in srgb, var(--halo-surface) 82%, transparent); backdrop-filter:blur(14px) saturate(1.4); -webkit-backdrop-filter:blur(14px) saturate(1.4); }
  .halo-header { background:color-mix(in srgb, var(--halo-surface) 82%, transparent); backdrop-filter:blur(14px) saturate(1.4); -webkit-backdrop-filter:blur(14px) saturate(1.4); }
  .halo-public-header { background:color-mix(in srgb, var(--halo-surface) 82%, transparent); backdrop-filter:blur(14px) saturate(1.4); -webkit-backdrop-filter:blur(14px) saturate(1.4); }
}

/* Stat cards: clean accent top-border */
.halo-stat { position:relative; overflow:hidden; }
.halo-stat::before { content:''; position:absolute; top:0; inset-inline:0; height:2px; background:var(--halo-accent); opacity:.35; }

/* Progress bar */
.halo-progress-bar { background:var(--halo-accent); }

/* Button hover lift */
.halo-btn:hover { box-shadow:0 2px 8px rgba(0,0,0,.08); }

/* Modal entrance animation */
.halo-dialog-box, .halo-modal-box { animation:halo-modal-in .2s var(--halo-ease); }
@keyframes halo-modal-in { from { opacity:0; transform:scale(.96) translateY(8px); } to { opacity:1; transform:scale(1) translateY(0); } }

/* Modal backdrop blur */
@supports (backdrop-filter: blur(6px)) {
  .halo-dialog, .halo-modal { background:rgba(0,0,0,.3); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
}

/* Toast entrance */
.halo-toast.halo-toast-show { animation:halo-toast-in .3s var(--halo-ease); }
@keyframes halo-toast-in { from { opacity:0; transform:translateX(-50%) translateY(14px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }

/* Notification dot pulse */
.halo-notif-dot { animation:halo-pulse 2s ease-in-out infinite; }
@keyframes halo-pulse { 0%,100%{box-shadow:0 0 0 2px var(--halo-surface)} 50%{box-shadow:0 0 0 2px var(--halo-surface), 0 0 0 5px color-mix(in srgb, var(--halo-red) 30%, transparent)} }

/* Active top menu item: bottom indicator line */
.halo-topmenu-item.active { position:relative; }
.halo-topmenu-item.active::after { content:''; position:absolute; bottom:0; inset-inline:14px; height:2px; border-radius:99px; background:var(--halo-accent); }

/* Card hover */
.halo-card:hover { border-color:color-mix(in srgb, var(--halo-text) 18%, var(--halo-border)); }

/* Order card hover */
.halo-ocard:hover { border-color:color-mix(in srgb, var(--halo-text) 18%, var(--halo-border)); box-shadow:0 2px 8px rgba(0,0,0,.06); }

/* Input focus ring */
.halo-input:focus, .halo-form-group input:focus, .halo-form-group select:focus, .halo-form-group textarea:focus,
.form-control:focus { box-shadow:var(--halo-focus); }

/* Sidebar backdrop blur on mobile */
@supports (backdrop-filter: blur(6px)) {
  .halo-sidebar-backdrop { background:rgba(0,0,0,.25); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
}

/* Badge subtle shadow */
.halo-badge { box-shadow:0 1px 3px rgba(0,0,0,.05); }

/* Stat value tabular numbers */
.halo-stat-val { font-variant-numeric:tabular-nums; letter-spacing:-.02em; }

/* Order card percentage: accent color when high */
.halo-ocard-pct { font-variant-numeric:tabular-nums; }

/* ── Component overrides ── */

/* Top menu: animated bottom indicator on hover */
.halo-topmenu-item {
  position: relative;
  transition: color .15s var(--halo-ease);
}
.halo-topmenu-item::after {
  content: '';
  position: absolute;
  bottom: 0;
  inset-inline: 14px;
  height: 2px;
  border-radius: 99px;
  background: var(--halo-accent);
  transform: scaleX(0);
  transition: transform .2s var(--halo-ease);
}
.halo-topmenu-item:hover::after,
.halo-topmenu-item.active::after { transform: scaleX(1); }

/* Hamburger menu: fade in/out */
@media (max-width: 768px) {
  .halo-topmenu:not(.open) { display: none; }
  .halo-topmenu.open { display: flex; animation: halo-menu-in .2s var(--halo-ease); }
  @keyframes halo-menu-in { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
}

/* Order cards: hover elevation + shadow */
.halo-ocard {
  transition: transform .2s var(--halo-ease), box-shadow .2s var(--halo-ease), border-color .2s;
}
.halo-ocard:hover {
  transform: translateY(-1px);
}

/* Completion percentage: circular accent for high values */
.halo-ocard-pct {
  font-size: 32px;
  font-weight: 800;
  color: var(--halo-accent);
}

/* Stats: flexible responsive layout */
.halo-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}
.halo-stat-val { font-size: 26px; font-weight: 800; }
.halo-stat-top i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--halo-accent) 12%, transparent);
  color: var(--halo-accent);
  font-size: 12px;
}

/* Service card: minimal with accent line */
.halo-service {
  transition: background .15s, border-color .15s;
  border-inline-start: 3px solid transparent;
}
.halo-service:hover {
  background: color-mix(in srgb, var(--halo-accent) 4%, var(--halo-surface));
  border-inline-start-color: var(--halo-accent);
}

/* Service feature badges */
.service-features-item {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 99px;
  background: var(--halo-surface-2);
  color: var(--halo-muted);
}
.service-features-item.guaranteed { background: color-mix(in srgb, var(--halo-green) 10%, transparent); color: #1a7a42; }
.service-features-item.recommended { background: color-mix(in srgb, var(--halo-accent) 12%, transparent); color: var(--halo-accent); }

/* Add funds: pill amount buttons */
[data-sbx-amt].halo-btn.outline {
  border-radius: 99px;
  min-width: 56px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
[data-sbx-amt].halo-btn.outline:hover {
  background: var(--halo-accent);
  color: #fff;
  border-color: var(--halo-accent);
}

/* Order status colors */
.halo-status.pending {
  background: color-mix(in srgb, var(--halo-yellow, #f59e0b) 14%, transparent);
  color: #8A6300;
}
.halo-status.completed {
  background: color-mix(in srgb, var(--halo-green) 14%, transparent);
  color: #1a7a42;
}

.halo-user-dd .halo-topuser:hover { border-color:var(--halo-accent); color:var(--halo-accent-strong); }

/* Pay instructions */
.halo-pay-instructions {
  font-size: 13px;
  color: var(--halo-muted);
  background: var(--halo-surface-2);
  padding: 10px 14px;
  border-radius: 8px;
  margin-bottom: 12px;
  line-height: 1.6;
}

/* Dropdown: clean animation */
.halo-cdd.open .halo-cdd-panel {
  animation: halo-cdd-open .18s var(--halo-ease);
}
@keyframes halo-cdd-open { from { opacity:0; transform:scaleY(.92); } to { opacity:1; transform:scaleY(1); } }

/* Form group: clearer field separation */
.halo-form-group + .halo-form-group {
  margin-top: 14px;
}
.halo-form-group label {
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 4px;
  display: block;
}

/* ── Auth page ── */

/* Login card: glassmorphism + clean glow */
@supports (backdrop-filter: blur(12px)) {
  .halo-auth-card { background:color-mix(in srgb, var(--halo-surface) 85%, transparent); backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3); }
}
.halo-auth-card { transition:transform .25s var(--halo-ease), box-shadow .25s var(--halo-ease); }
.halo-auth-card:hover { transform:translateY(-2px); box-shadow:var(--halo-lift); }

/* Login input: clean accent focus */
.halo-auth-card .halo-input:focus { border-color:var(--halo-accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--halo-accent) 14%, transparent); }

/* Submit button: gradient + lift */
.halo-auth-submit { background:var(--halo-accent); transition:transform .15s, box-shadow .15s, filter .15s; }
.halo-auth-submit:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.1); filter:brightness(1.06); }
.halo-auth-submit:active { transform:translateY(0) scale(.98); }

/* Hero copy: entrance animation */
.halo-auth-hero-copy { animation:haloHeroIn .5s var(--halo-ease) both; }
@keyframes haloHeroIn { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }

/* Platform pills: stagger entrance + hover brand color glow */
.halo-auth-pill { opacity:0; animation:orbitPillIn .3s var(--halo-ease) forwards; }
.halo-auth-pill:nth-child(1){ animation-delay:.1s; } .halo-auth-pill:nth-child(2){ animation-delay:.15s; }
.halo-auth-pill:nth-child(3){ animation-delay:.2s; } .halo-auth-pill:nth-child(4){ animation-delay:.25s; }
.halo-auth-pill:nth-child(5){ animation-delay:.3s; } .halo-auth-pill:nth-child(6){ animation-delay:.35s; }
.halo-auth-pill:nth-child(7){ animation-delay:.4s; }
@keyframes orbitPillIn { from { opacity:0; transform:scale(.7); } to { opacity:1; transform:scale(1); } }

/* Badge: subtle entrance */
.halo-auth-badge { animation:orbitBadgeIn .4s var(--halo-ease) both .15s; }
@keyframes orbitBadgeIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }

/* Feature cards: hover lift + accent top-border */
.halo-auth-feat { position:relative; overflow:hidden; transition:transform .2s var(--halo-ease), box-shadow .2s, border-color .2s; }
.halo-auth-feat::before { content:''; position:absolute; top:0; inset-inline:0; height:2px; background:var(--halo-accent); transform:scaleX(0); transition:transform .25s var(--halo-ease); }
.halo-auth-feat:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.06); border-color:color-mix(in srgb, var(--halo-text) 15%, var(--halo-border)); }
.halo-auth-feat:hover::before { transform:scaleX(1); }

/* Stat bar: hover number glow */
.halo-auth-sb b { transition:color .2s, text-shadow .2s; }
.halo-auth-sb:hover b { color:var(--halo-accent-strong); }

/* Platform cards: stagger + hover glow */
.halo-auth-plat { opacity:0; animation:orbitPlatIn .4s var(--halo-ease) forwards; transition:transform .15s, box-shadow .15s, border-color .15s; }
.halo-auth-plat:nth-child(1){ animation-delay:.05s; } .halo-auth-plat:nth-child(2){ animation-delay:.1s; }
.halo-auth-plat:nth-child(3){ animation-delay:.15s; } .halo-auth-plat:nth-child(4){ animation-delay:.2s; }
.halo-auth-plat:nth-child(5){ animation-delay:.25s; } .halo-auth-plat:nth-child(6){ animation-delay:.3s; }
.halo-auth-plat:nth-child(7){ animation-delay:.35s; } .halo-auth-plat:nth-child(8){ animation-delay:.4s; }
@keyframes orbitPlatIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.halo-auth-plat:hover { box-shadow:0 2px 8px rgba(0,0,0,.06); border-color:color-mix(in srgb, var(--halo-text) 15%, var(--halo-border)); }

/* Vertical steps: number glow on hover + connecting line */
.halo-auth-vstep { transition:background .15s; }
.halo-auth-vstep:hover { background:color-mix(in srgb, var(--halo-accent) 4%, transparent); }
.halo-auth-vn { transition:box-shadow .2s, transform .2s; }
.halo-auth-vstep:hover .halo-auth-vn { transform:scale(1.05); }

/* FAQ: accent border on open */
.halo-auth-faq-item { transition:border-color .2s; }
.halo-auth-faq-item[open] { border-color:color-mix(in srgb, var(--halo-accent) 35%, var(--halo-border)); }
.halo-auth-faq-item summary:hover { color:var(--halo-accent-strong); }

/* CTA band: gradient top line + hover */
.halo-auth-cta-band { position:relative; overflow:hidden; transition:transform .2s var(--halo-ease); }
.halo-auth-cta-band::before { content:''; position:absolute; top:0; inset-inline:0; height:2px; background:var(--halo-accent); opacity:.5; }
.halo-auth-cta-band:hover { transform:translateY(-2px); }
.halo-auth-cta { display:inline-flex; align-items:center; gap:8px; transition:transform .15s, box-shadow .15s; }
.halo-auth-cta:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.1); }

/* Trust badges: hover lift */
.halo-auth-trust-item { transition:transform .15s; }
.halo-auth-trust-item:hover { transform:translateY(-1px); }

/* Social marquee hover */
.halo-auth-social-item:hover { box-shadow:0 2px 8px rgba(0,0,0,.06); }


/* Divider: gradient line */
.halo-auth-divider::before, .halo-auth-divider::after { background:linear-gradient(90deg, var(--halo-border), color-mix(in srgb, var(--halo-accent) 18%, var(--halo-border))); }

/* Trustline stars: subtle glow */
.halo-auth-stars { text-shadow:0 0 8px rgba(245,179,1,.3); }


/* ── Dashboard overrides ── */

/* Stats */
.halo-stat { position:relative; overflow:hidden; }
.halo-stat-top i { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--halo-accent) 10%, transparent); border-radius:var(--halo-radius); font-size:15px; }

/* Orders (card grid layout): enhanced ocard */
.halo-ocard { transition:box-shadow .25s var(--halo-ease), transform .2s var(--halo-ease), border-color .15s; }
.halo-ocard:hover { transform:translateY(-1px); box-shadow:var(--halo-lift); border-color:color-mix(in srgb, var(--halo-text) 15%, var(--halo-border)); }
.halo-ocard-id { font-weight:700; }
.halo-ocard-pct { font-weight:700; font-size:12px; }
.halo-status.completed { background:color-mix(in srgb, var(--halo-green) 14%, transparent); }
.halo-status.pending { background:color-mix(in srgb, var(--halo-yellow) 14%, transparent); }
.halo-status.canceled { background:color-mix(in srgb, var(--halo-red) 14%, transparent); }
.halo-status.partial { background:color-mix(in srgb, var(--halo-blue) 14%, transparent); }
.halo-progress-bar { border-radius:inherit; background:var(--halo-accent); }

/* Also support list-based orders (fallback) */
.halo-order { border-inline-start:3px solid transparent; transition:border-color .2s, box-shadow .25s var(--halo-ease), transform .2s var(--halo-ease); }
.halo-order:hover { border-inline-start-color:var(--halo-accent); box-shadow:var(--halo-lift); transform:translateY(-1px); }

/* Services: clean accent line + price pill */
.halo-service { position:relative; border-inline-start:3px solid transparent; }
.halo-service:hover { border-inline-start-color:var(--halo-accent); }
.halo-service-price { background:color-mix(in srgb, var(--halo-accent) 8%, transparent);
  padding:4px 12px; border-radius:8px; }
.halo-cat-title { padding:8px 0; border-bottom:2px solid color-mix(in srgb, var(--halo-accent) 16%, var(--halo-border)); }
.halo-cat-ico { width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--halo-accent) 10%, transparent); border-radius:10px; font-size:14px; }
.halo-cat-ico-img { width:22px; height:22px; border-radius:8px; object-fit:cover; }

/* Service features: clean pill badges */
.service-features { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.service-features-item { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600;
  padding:3px 10px; border-radius:99px; }
.service-features-item.guaranteed { background:color-mix(in srgb, var(--halo-green) 12%, transparent); color:var(--halo-green); }
.service-features-item.recommended { background:color-mix(in srgb, var(--halo-accent) 12%, transparent); color:var(--halo-accent-strong); }
.service-features-item.faster { background:color-mix(in srgb, var(--halo-blue) 12%, transparent); color:var(--halo-blue); }
.service-features-item.canceled { background:color-mix(in srgb, var(--halo-red) 10%, transparent); color:var(--halo-red); }
.service-features-item.timed { background:color-mix(in srgb, var(--halo-muted) 12%, transparent); color:var(--halo-muted); }
.service-features-item.discounted { background:color-mix(in srgb, var(--halo-green) 12%, transparent); color:var(--halo-green); }
.service-features-item.slow { background:color-mix(in srgb, var(--halo-red) 10%, transparent); color:var(--halo-red); }

/* New order: service detail with accent top */
.halo-service-detail { transition:box-shadow .25s var(--halo-ease); border-top:3px solid var(--halo-accent); }
.halo-detail-row:last-child { border-bottom:none; }
.halo-detail-row b { color:var(--halo-accent-strong); }

/* Add funds: clean amounts */
.halo-af-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:20px; align-items:start; }
.halo-af-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:20px; flex-wrap:wrap; }
.halo-af-title { font-family:var(--halo-font-head); font-size:18px; font-weight:700; display:flex; align-items:center; gap:8px; }
.halo-af-title i { color:var(--halo-accent); }
.halo-af-sub { color:var(--halo-muted); font-size:13px; margin-top:4px; }
.halo-af-balchip { display:inline-flex; align-items:center; gap:6px;
  background:color-mix(in srgb, var(--halo-accent) 10%, transparent);
  border:1px solid color-mix(in srgb, var(--halo-accent) 22%, transparent);
  padding:8px 14px; border-radius:99px; font-weight:700; font-size:14px; }
.halo-af-balchip i { color:var(--halo-accent); }

.halo-af-paybox { position:relative; }
.halo-af-paytrigger { display:flex; align-items:center; justify-content:space-between; padding:12px 14px;
  border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface); cursor:pointer; transition:border-color .15s; }
.halo-af-paytrigger:hover { border-color:var(--halo-accent); }
.halo-af-payname { font-weight:600; }
.halo-af-paymenu { position:fixed; inset:0; z-index:100; display:none; flex-direction:column; background:var(--halo-surface);
  border-radius:20px 20px 0 0; bottom:0; top:auto; max-height:70vh; overflow:hidden;
  box-shadow:0 -10px 40px rgba(0,0,0,.15); animation:orbitPayUp .25s var(--halo-ease); }
.halo-af-paymenu.open, .payment-dropdown.open { display:flex; }
@keyframes orbitPayUp { from { transform:translateY(100%); } to { transform:translateY(0); } }
.halo-af-payhead { display:flex; justify-content:space-between; align-items:center; padding:16px 18px; border-bottom:1px solid var(--halo-border); font-weight:700; }
.halo-af-payhead button { background:none; border:none; cursor:pointer; color:var(--halo-muted); font-size:18px; }
.halo-af-paylist { overflow-y:auto; flex:1; padding:8px; }
.halo-af-paybg { position:fixed; inset:0; background:rgba(0,0,0,.3); z-index:99; display:none; }
.halo-af-paybg.open, .payment-dropdown-bg.open { display:block; }

.halo-af-quick { margin-bottom:18px; }
.halo-af-qlabel { display:block; font-size:12px; font-weight:600; color:var(--halo-muted); margin-bottom:8px; }
.halo-af-qgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.halo-af-qbtn { padding:10px; border:1px solid var(--halo-border); border-radius:var(--halo-radius); background:var(--halo-surface-2);
  font-weight:700; font-size:14px; cursor:pointer; text-align:center; transition:all .15s var(--halo-ease); }
.halo-af-qbtn:hover, .halo-af-qbtn.active { background:var(--halo-accent); color:var(--halo-accent-ink); border-color:var(--halo-accent); transform:translateY(-1px); }
.halo-af-qcustom { font-size:13px; display:flex; align-items:center; justify-content:center; gap:6px; }
.halo-af-instructions { background:color-mix(in srgb, var(--halo-accent) 6%, transparent); border:1px solid color-mix(in srgb, var(--halo-accent) 18%, transparent);
  border-radius:var(--halo-radius); padding:14px 16px; margin-bottom:16px; font-size:13px; line-height:1.65; }

/* Account: clean profile header accent */
.halo-user-info { position:relative; overflow:hidden; }
.halo-user-info::before { content:''; position:absolute; top:0; inset-inline:0; height:3px; background:var(--halo-accent); opacity:.5; }
.halo-avatar { box-shadow:0 2px 8px rgba(0,0,0,.08); }

/* Top nav active: glow indicator */
.halo-topmenu-item.active { position:relative; }
.halo-topmenu-item.active::after { content:''; position:absolute; bottom:-1px; inset-inline:8px; height:3px;
  background:var(--halo-accent); border-radius:3px 3px 0 0; }

/* Tickets: hover lift */
.halo-ticket { transition:border-color .15s, box-shadow .2s var(--halo-ease), transform .2s var(--halo-ease); }
.halo-ticket:hover { box-shadow:var(--halo-lift); transform:translateY(-1px);
  border-color:color-mix(in srgb, var(--halo-text) 15%, var(--halo-border)); }
.halo-subject { transition:all .15s var(--halo-ease); }
.halo-subject:hover { border-color:color-mix(in srgb, var(--halo-text) 15%, var(--halo-border));
  background:var(--halo-surface-2); }
.halo-msg.right { position:relative; }
.halo-msg.right::before { content:''; position:absolute; top:0; inset-inline-end:0; bottom:0; width:3px;
  background:var(--halo-accent); border-radius:0 4px 4px 0; }

/* Pagination: hover accent */
.halo-pagination li a { transition:all .15s var(--halo-ease); }
.halo-pagination li a:hover { border-color:var(--halo-accent); color:var(--halo-accent-strong);
  background:color-mix(in srgb, var(--halo-accent) 6%, transparent); }

/* Cards: clean lift on hover */
.halo-card { position:relative; transition:box-shadow .25s var(--halo-ease); }
.halo-card:hover { box-shadow:var(--halo-lift); }

/* Blog: image zoom */
.halo-blog img { transition:transform .3s var(--halo-ease); }
.halo-blog:hover img { transform:scale(1.04); }
.halo-blog { overflow:hidden; }

/* Notify drawer: accent top */
.halo-notify { border-top:3px solid var(--halo-accent); }

/* History: accent border on hover */
.halo-history-box { border-inline-start:3px solid var(--halo-border); transition:border-color .15s; }
.halo-history-box:hover { border-inline-start-color:var(--halo-accent); }

/* Modal: smooth entrance */
.halo-modal-box, .halo-dialog-box { animation:orbitModalIn .2s var(--halo-ease); }
@keyframes orbitModalIn { from { opacity:0; transform:scale(.95) translateY(8px); } to { opacity:1; transform:scale(1) translateY(0); } }

/* ── Responsive ── */

/* ── Tablet: 768px ── */
@media (max-width:768px){
  .halo-container { padding:20px 16px 48px; }
  .halo-stats { grid-template-columns:repeat(2,1fr); gap:10px; }
  .halo-grid-2, .halo-grid-3 { grid-template-columns:1fr; }
  .halo-order-grid { grid-template-columns:1fr; }
  .halo-af-grid { grid-template-columns:1fr; }
  .halo-page-title { font-size:20px; }
  .halo-card, .halo-well { padding:18px; }

  /* Auth/signin page */
  .halo-auth { padding-inline:12px; }
  .halo-auth-promo { font-size:26px; }
  .halo-auth-sub { font-size:15px; }
  .halo-auth-numbers { grid-template-columns:repeat(2,1fr); gap:10px; }
  .halo-auth-num { padding:14px 16px; gap:10px; }
  .halo-auth-num b { font-size:18px; }
  .halo-auth-num-ic { width:38px; height:38px; font-size:16px; }
  .halo-auth-bento-grid { grid-template-columns:1fr; }
  .halo-auth-bcard--wide, .halo-auth-bcard--full { grid-column:span 1; }
  .halo-auth-plat-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .halo-auth-testi-grid { grid-template-columns:1fr; }
  .halo-auth-price-grid { grid-template-columns:1fr; max-width:360px; margin-inline:auto; }
  .halo-auth-h2 { font-size:20px; }
  .halo-auth-cta-band { padding:36px 20px; }
  .halo-auth-cta-band h2 { font-size:22px; }
}

/* ── Small mobile: 480px ── */
@media (max-width:480px){
  .halo-container { padding:14px 12px 40px; }
  .halo-page-title { font-size:17px; margin-bottom:12px; gap:8px; }
  .halo-page-title i { font-size:16px; }

  /* Cards & wells */
  .halo-card, .halo-well { padding:14px 12px; margin-bottom:12px; border-radius:12px; }
  .halo-card-title { font-size:14px; margin-bottom:10px; gap:6px; }

  /* Stats */
  .halo-stats { grid-template-columns:1fr 1fr; gap:8px; }
  .halo-stat { padding:10px 12px; border-radius:12px; }
  .halo-stat-val { font-size:16px; margin-top:6px; }
  .halo-stat-top { font-size:11px; }
  .halo-stat-top i { width:24px; height:24px; font-size:11px; border-radius:6px; }
  .halo-stat::before { height:1.5px; }
  .halo-stat::before + .halo-stat::before { inset-inline-end:-10px; top:-10px; width:40px; height:40px; }

  /* Buttons */
  .halo-btn { padding:9px 14px; font-size:12.5px; border-radius:10px; gap:6px; }
  .halo-btn.sm { padding:6px 10px; font-size:12px; }
  .halo-icon-only { width:32px; }

  /* Forms */
  .halo-form-group { margin-bottom:10px; }
  .halo-form-group label, .halo-label { font-size:12px; margin-bottom:3px; }
  .halo-input, .halo-form-group input, .halo-form-group select, .halo-form-group textarea {
    font-size:13px; padding:9px 11px; border-radius:10px;
  }
  .halo-input-wrap i { font-size:12px; inset-inline-start:10px; }
  .halo-input-wrap .halo-input { padding-inline-start:32px; }

  /* Alerts */
  .halo-alert { font-size:12.5px; padding:10px 12px; border-radius:8px; margin-bottom:12px; }

  /* Badges */
  .halo-badge { padding:3px 9px; font-size:11px; }
  .halo-status { padding:4px 9px; font-size:11px; gap:4px; }

  /* Orders */
  .halo-order { padding:12px 13px; border-radius:12px; }
  .halo-order-top { margin-bottom:8px; }
  .halo-order-id { font-size:13px; }
  .halo-order-body > div { font-size:12.5px; }
  .halo-order-meta { gap:10px; font-size:12px; }
  .halo-order-act { width:26px; height:26px; border-radius:6px; font-size:11px; }
  .halo-progress { height:18px; }
  .halo-progress span { font-size:10.5px; line-height:18px; }
  .halo-ocard { border-radius:12px; }

  /* Toolbar */
  .halo-toolbar { gap:8px; margin-bottom:12px; }
  .halo-toolbar select, .halo-toolbar form { min-width:0; }

  /* Services */
  .halo-service { padding:10px 12px; border-radius:10px; }
  .halo-service-name { font-size:12.5px; line-height:1.4; }
  .halo-service-feats { gap:8px; font-size:11px; }
  .halo-service-feats span { gap:3px; }
  .halo-service-price { font-size:12.5px; padding:3px 9px; border-radius:6px; }
  .halo-cat-title { font-size:14px; padding:6px 0; }
  .halo-cat-ico { width:24px; height:24px; font-size:12px; border-radius:7px; }
  .service-features-item { font-size:10px; padding:2px 7px; }
  .halo-svc-copy { font-size:11px; padding:1px 3px; }

  /* Panel engine forms (injected by panel — not halo-prefixed) */
  #fields .form-group, .neworder-form .form-group { margin-bottom:8px; }
  #fields label, .form-group > label, .control-label { font-size:12px !important; margin-bottom:3px; font-weight:600; }
  .form-control { font-size:13px !important; padding:9px 11px !important; border-radius:10px; }
  textarea.form-control { min-height:60px; }
  .btn { font-size:12px; padding:8px 12px; border-radius:10px; }
  .btn-xs { font-size:10.5px; padding:4px 8px; }
  .btn-sm { font-size:11px; padding:6px 10px; }

  /* CDD dropdowns */
  .halo-cdd-sel { padding:9px 11px; font-size:13px; min-height:auto; border-radius:10px; }
  .halo-cdd-name { font-size:12.5px; }
  .halo-cdd-item { padding:8px 10px; font-size:12.5px; border-radius:8px; }
  .halo-cdd-search { padding:8px 10px; font-size:12.5px; }
  .halo-cdd-panel { border-radius:12px; max-height:260px; padding:4px; }
  .halo-cdd-ic { width:16px; font-size:13px; }

  /* Add Funds */
  .halo-af-head { flex-direction:column; gap:10px; }
  .halo-af-title { font-size:16px; }
  .halo-af-sub { font-size:12px; }
  .halo-af-balchip { font-size:13px; padding:6px 12px; }
  .halo-af-pcards { grid-template-columns:1fr; gap:8px; }
  .halo-af-pcard { padding:11px 12px; border-radius:10px; }
  .halo-af-pcard-n { font-size:13px; }
  .halo-af-pcard-d { font-size:11px; }
  .halo-af-quickrow { gap:6px; }
  .halo-af-quickrow .halo-af-qbtn { padding:7px 10px; font-size:12.5px; min-width:52px; border-radius:10px; }
  .halo-af-qgrid { grid-template-columns:repeat(3,1fr); gap:6px; }
  .halo-af-qbtn { padding:8px; font-size:13px; border-radius:10px; }
  .halo-af-histrow { padding:10px 12px; border-radius:10px; }
  .halo-af-histname { font-size:12.5px; }
  .halo-af-histtime { font-size:10.5px; }
  .halo-af-histamt { font-size:13px; }
  .halo-af-submit { font-size:13px; }

  /* Tickets */
  .halo-ticket { border-radius:10px; }
  .halo-subject { border-radius:10px; }
  .halo-msg { border-radius:10px; font-size:13px; }

  /* Tables (panel-injected) */
  table { font-size:12px; }
  table th, table td { padding:8px 10px; }

  /* Pagination */
  .halo-pagination { gap:4px; }
  .halo-pagination li a { min-width:28px; height:28px; font-size:11.5px; padding:4px 6px; border-radius:8px; }

  /* Modals & dialogs */
  .halo-modal-box, .halo-dialog-box { margin:12px; border-radius:14px; max-width:calc(100vw - 24px); }
  .halo-modal-top, .halo-dialog-top { font-size:15px; padding:14px; }
  .halo-modal-center, .halo-dialog-center { padding:14px; font-size:13px; }
  .halo-modal-bottom, .halo-dialog-bottom { padding:12px 14px; }

  /* Toast */
  .halo-toast { font-size:12.5px; padding:10px 16px; border-radius:10px; min-width:auto; max-width:calc(100vw - 32px); }

  /* How-to block */
  .halo-howto { padding:14px; border-radius:12px; }
  .halo-howto-title { font-size:14px; }
  .halo-howto-list li { font-size:12px; gap:8px; }
  .halo-howto-list li span { flex:0 0 20px; width:20px; height:20px; font-size:10px; }

  /* 2FA inputs */
  .halo-2fa-inputs input { width:36px; height:40px; font-size:16px; border-radius:8px; }

  /* Account page */
  .halo-acct-stats { grid-template-columns:1fr; gap:8px; }
  .halo-acct-stat { padding:11px 13px; border-radius:10px; }
  .halo-acct-stat b { font-size:15px; }
  .halo-acct-stat span { font-size:11px; }
  .halo-level-badge { font-size:11px; padding:2px 8px; }

  /* Notifications */
  .halo-notify { border-radius:12px; }
  .halo-notify-item { font-size:12.5px; padding:10px 12px; }

  /* Blog */
  .halo-blog { border-radius:12px; }

  /* Switch toggle */
  .halo-switch-input { width:36px; height:20px; }
  .halo-switch-input::before { width:16px; height:16px; }
  .halo-switch-input:checked::before { inset-inline-start:18px; }

  /* Header */
  .halo-header { padding:10px 12px; }
  .halo-header .logo { font-size:16px; }
  .halo-topactions { gap:8px; }
  .halo-icon-btn { width:32px; height:32px; border-radius:8px; font-size:13px; }
  .halo-balance { padding:5px 9px; font-size:11.5px; gap:5px; }
  .halo-bal-amt { font-size:12px; }
  .halo-eye { font-size:11px; }

  /* User dropdown + hamburger — match icon-btn */
  .halo-user-dd .halo-topuser { width:32px; height:32px; border-radius:8px; }
  .halo-user-dd .halo-topuser i:first-child { font-size:13px; }
  .halo-nav-toggle { width:32px; height:32px; border-radius:8px; font-size:13px; }
  .halo-user-menu { min-width:200px; border-radius:12px; }
  .halo-dd-item { font-size:12.5px; }
  .halo-dd-theme-row button { font-size:11px; padding:7px 4px; }

  /* Top nav (horizontal menu) */
  .halo-topnav { padding:8px 12px; }
  .halo-topmenu-item { font-size:12.5px; padding:10px 10px; }

  /* Auth/Signin */
  .halo-auth { padding-inline:8px; }
  .halo-auth-hero { gap:20px; padding:24px 0 32px; }
  .halo-auth-card { padding:20px 16px; border-radius:14px; }
  .halo-auth-card-head { margin-bottom:16px; }
  .halo-auth-card-title { font-size:16px; gap:8px; }
  .halo-auth-hero-visual { min-height:240px; padding:16px; }
  .halo-auth-hero-text h1 { font-size:20px; }
  .halo-auth-hero-text p { font-size:13px; }
  .halo-auth-fcard { padding:9px 12px; border-radius:10px; gap:8px; }
  .halo-auth-fcard b { font-size:15px; }
  .halo-auth-fcard span { font-size:9px; }
  .halo-auth-fcard i { font-size:14px; }
  .halo-auth-plat-dot { width:30px; height:30px; border-radius:8px; font-size:13px; }
  .halo-auth-cta { font-size:13px; padding:10px 20px; }
  .halo-auth-numbers { grid-template-columns:1fr 1fr; gap:8px; }
  .halo-auth-bento { padding:32px 0 4px; }
  .halo-auth-bcard { padding:18px 16px; border-radius:12px; }
  .halo-auth-bcard-ic { width:36px; height:36px; font-size:16px; margin-bottom:10px; border-radius:9px; }
  .halo-auth-bcard h3 { font-size:14px; }
  .halo-auth-bcard p { font-size:12.5px; }
  .halo-auth-platforms { padding:32px 0 4px; }
  .halo-auth-plat-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .halo-auth-plat { padding:16px 10px; gap:6px; border-radius:12px; }
  .halo-auth-plat-ic { width:42px; height:42px; border-radius:10px; font-size:20px; }
  .halo-auth-plat-n { font-size:13px; }
  .halo-auth-plat-s { font-size:10px; }
  .halo-auth-how { padding:32px 0 4px; }
  .halo-auth-h2 { font-size:18px; margin-bottom:18px; }
  .halo-auth-tl-n { flex:0 0 28px; width:28px; height:28px; font-size:12px; }
  .halo-auth-tl-content h3 { font-size:14px; }
  .halo-auth-tl-content p { font-size:12px; }
  .halo-auth-tl-step { gap:14px; padding:12px 0; }
  .halo-auth-timeline { padding-inline-start:22px; }
  .halo-auth-testimonials { padding:32px 0 4px; }
  .halo-auth-testi { padding:18px 16px; border-radius:12px; }
  .halo-auth-testi-av { width:34px; height:34px; font-size:13px; }
  .halo-auth-testi-head b { font-size:13px; }
  .halo-auth-testi-head span { font-size:10.5px; }
  .halo-auth-testi-stars { font-size:11px; }
  .halo-auth-testi p { font-size:12.5px; }
  .halo-auth-pricing { padding:32px 0 4px; }
  .halo-auth-pricing-sub { font-size:13px; margin-bottom:20px; }
  .halo-auth-price-card { padding:22px 18px; border-radius:12px; }
  .halo-auth-price-ic { font-size:22px; }
  .halo-auth-price-card h3 { font-size:14px; }
  .halo-auth-price-val { font-size:24px; }
  .halo-auth-price-val span { font-size:12px; }
  .halo-auth-price-card li { font-size:12.5px; }
  .halo-auth-faq { padding:32px 0 4px; }
  .halo-auth-faq-item { padding:2px 14px; border-radius:12px; }
  .halo-auth-faq-item summary { font-size:13px; padding:12px 0; }
  .halo-auth-faq-item p { font-size:12.5px; }
  .halo-auth-cta-band { padding:28px 16px; margin:28px 0 4px; border-radius:14px; }
  .halo-auth-cta-band h2 { font-size:19px; }
  .halo-auth-cta-band p { font-size:13px; }
  .halo-auth-divider { font-size:11px; margin:14px 0 12px; }
  .halo-auth-alt { font-size:12.5px; }
  .halo-auth-row { font-size:12px; }
  .halo-auth-submit { font-size:13.5px; padding:10px 16px; }
  .halo-checkbox-row { font-size:12px; }

  /* Signup/reset/2fa wrapper */
  .halo-auth-wrap { padding:24px 12px; }
  .halo-auth-title { font-size:19px; margin-bottom:16px; }

  /* Footer */
  .halo-footer { font-size:11.5px; padding:16px 12px; }

  /* Public header */
  .halo-public-header { padding:12px 14px; gap:8px; }
  .halo-public-header .logo { font-size:16px; }
  .halo-public-nav { gap:12px; font-size:13px; }

  /* Report button */
  .halo-report-btn { font-size:11px; padding:3px 7px; border-radius:6px; }

  /* Refill time badge */
  .halo-refil-time { font-size:11px; padding:5px 9px; }

  /* Size toggle */
  .halo-size-toggle { border-radius:10px; }
  .halo-size-toggle button { padding:5px 6px; border-radius:8px; }

  /* ── New Order page — comprehensive mobile fix ── */
  .halo-order-grid { grid-template-columns:1fr; gap:10px; }
  .halo-order-grid .halo-card { padding:13px 12px; border-radius:12px; }
  .halo-search-box { margin-bottom:10px; }
  .halo-search-box .halo-input { font-size:13px; padding:9px 11px; }
  .halo-search-results { max-height:220px; }

  /* New Order: select dropdowns (category + service) */
  .halo-order-grid select.halo-input,
  .halo-order-grid .halo-input,
  #order-form .halo-input,
  #order-form select.halo-input {
    font-size:13px !important; padding:9px 11px !important; border-radius:10px;
  }
  #order-form .halo-form-group { margin-bottom:9px; }
  #order-form .halo-form-group label { font-size:12px; margin-bottom:3px; }
  #order-form .halo-btn.block { padding:10px 14px; font-size:13px; border-radius:10px; margin-top:4px; }

  /* Panel engine injected fields inside #fields */
  #fields { font-size:13px; }
  #fields .form-group { margin-bottom:8px !important; }
  #fields .form-group label,
  #fields .control-label,
  #fields > label { font-size:12px !important; margin-bottom:3px !important; }
  #fields .form-control,
  #fields input[type="text"],
  #fields input[type="number"],
  #fields input[type="url"],
  #fields select,
  #fields textarea {
    font-size:13px !important; padding:9px 11px !important; border-radius:10px !important;
  }
  #fields textarea { min-height:60px; }

  /* Panel engine dropdown items (category/service picker) */
  .category-dropdown-item, .service-dropdown-item { padding:9px 11px; margin-bottom:3px; border-radius:8px; }
  .service-dropdown-name .s-name { font-size:12.5px; }
  .service-dropdown-price { font-size:13px; }
  .service-dropdown-price small { font-size:10px; }
  .service-dropdown-bottom, .service-dropdown-info { gap:8px; font-size:11px; margin-top:4px; }

  /* Charge field */
  #charge { font-size:13px !important; padding:9px 11px !important; }

  /* Service detail card */
  .halo-service-detail { padding:13px; border-radius:12px; font-size:13px; position:static; }
  .halo-detail-row { font-size:12.5px; padding:6px 0; }

  /* Terms checkbox */
  .halo-order-grid .halo-checkbox-row { font-size:12px; }
  .halo-order-grid .halo-checkbox-row label { font-size:12px; margin:0; }
}

/* Toast: slide-up */
.halo-toast.halo-toast-show { animation:orbitToastIn .25s var(--halo-ease); }
@keyframes orbitToastIn { from { opacity:0; transform:translateX(-50%) translateY(16px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }

/* Dropdown: smooth reveal */
.halo-dd-menu { animation:orbitDdIn .15s var(--halo-ease); }
@keyframes orbitDdIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }

/* Empty states */
.halo-empty { text-align:center; padding:40px 20px; color:var(--halo-muted); }
.halo-empty i { font-size:40px; opacity:.4; margin-bottom:12px; display:block; }
.halo-empty p { font-size:14px; max-width:280px; margin:0 auto; }

/* Responsive */
@media (max-width:900px) {
  .halo-af-grid { grid-template-columns:1fr; }
  .halo-af-qgrid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px) {
  .halo-af-qgrid { grid-template-columns:repeat(2,1fr); }
  .halo-stats { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .halo-dialog-box, .halo-modal-box { animation:none; }
  .halo-toast.halo-toast-show { animation:none; }
  .halo-notif-dot { animation:none; }
  .halo-topmenu-item::after { transition:none; }
  .halo-ocard { transition:none; }
  .halo-cdd.open .halo-cdd-panel { animation:none; }
  .halo-service { transition:none; }
  .halo-auth-fcard { animation:none; }
  .halo-auth-plat { animation:none; opacity:1; }
  .halo-auth-feat, .halo-auth-cta-band { transition:none; }
  .halo-stat::before { display:none; }
  .halo-blog:hover img { transform:none; }
  .halo-dd-menu, .halo-af-paymenu { animation:none; }
}

/* ===== Mobile polish (375px) ===== */
@media (max-width:420px) {
  /* Top nav: tighter padding */
  .halo-topnav { padding:8px 12px; gap:8px; }
  .halo-brand { font-size:16px; }

  /* Balance chip: compact */
  .halo-balance { padding:5px 8px; gap:4px; font-size:11.5px; }
  .halo-bal-amt { font-size:12px; }
  .halo-cur-inline { font-size:10.5px; }
  .halo-icon-btn { width:32px; height:32px; font-size:13px; }
  .halo-nav-toggle { width:32px; height:32px; border-radius:8px; font-size:13px; }

  /* Page content: prevent horizontal overflow */
  .halo-container { padding:14px 12px 40px; }

  /* Service cards: fit within 375px */
  .halo-service-group { grid-template-columns:1fr; }
  .halo-service { padding:12px 13px; gap:10px; }
  .halo-service-name { font-size:13.5px; }
  .halo-service-right { flex-direction:row; align-items:center; width:100%; margin-top:6px; }
  .halo-service-price { font-size:14px; }
  .halo-service-feats { font-size:11.5px; gap:8px; }

  /* Order cards */
  .halo-ocard { padding:13px; }
  .halo-ocard-pct { font-size:26px; }
  .halo-ocard-meta { font-size:12px; gap:4px 10px; }
  .halo-ocard-foot { gap:6px; }
  .halo-ocard-foot .halo-btn { padding:7px 10px; font-size:12px; }

  /* Stats: two columns for compact view */
  .halo-stats { grid-template-columns:repeat(2,1fr); gap:8px; }
  .halo-stat { padding:10px 12px; }
  .halo-stat-val { font-size:16px; }
  .halo-stat-top { font-size:11px; }
  .halo-stat-top i { font-size:13px; }
  .halo-stat-link { font-size:11px; margin-top:6px; }

  /* New order form */
  .halo-order-grid { grid-template-columns:1fr; gap:10px; }
  .halo-page-title { font-size:18px; gap:8px; }
  .halo-card { padding:13px 12px; }
  .halo-card-title { font-size:14px; }
  .halo-howto { padding:12px; margin-top:10px; }
  .halo-howto-title { font-size:13px; margin-bottom:8px; }
  .halo-howto-list li { font-size:12px; gap:7px; }
  .halo-howto-list li span { flex:0 0 18px; width:18px; height:18px; font-size:9.5px; }
  .halo-service-detail { padding:12px 12px; position:static; }
  .halo-detail-row { font-size:12px; padding:5px 0; }

  /* New order — panel engine fields at 420px */
  #order-form .halo-form-group { margin-bottom:8px; }
  #order-form .halo-form-group label { font-size:11.5px; margin-bottom:2px; }
  #order-form .halo-input,
  #order-form select.halo-input { font-size:12.5px !important; padding:8px 10px !important; border-radius:9px; }
  #order-form .halo-btn.block { padding:9px 12px; font-size:12.5px; }
  #fields .form-group { margin-bottom:7px !important; }
  #fields .form-group label,
  #fields .control-label { font-size:11.5px !important; margin-bottom:2px !important; }
  #fields .form-control,
  #fields input,
  #fields select,
  #fields textarea { font-size:12.5px !important; padding:8px 10px !important; border-radius:9px !important; }
  #charge { font-size:12.5px !important; padding:8px 10px !important; }
  .category-dropdown-item, .service-dropdown-item { padding:8px 10px; font-size:12px; }
  .service-dropdown-name .s-name { font-size:12px; }
  .service-dropdown-bottom, .service-dropdown-info { font-size:10.5px; gap:6px; }
  .halo-search-box .halo-input { font-size:12.5px; padding:8px 10px; }

  /* Orders grid */
  .halo-orders-grid { gap:10px; }
  .halo-ocard-name { font-size:13px; }
  .halo-ocard-link { font-size:12px; }

  /* Add funds */
  .halo-af-grid { grid-template-columns:1fr; }
  .halo-af-qgrid { grid-template-columns:repeat(2,1fr); gap:6px; }
  .halo-af-qbtn { padding:9px; font-size:13px; }
  .halo-af-head { flex-direction:column; gap:8px; }
  .halo-af-balchip { font-size:13px; padding:6px 12px; }
  .halo-af-histrow { padding:10px 12px; gap:10px; }
  .halo-af-histico { width:34px; height:34px; flex:0 0 34px; font-size:14px; }
  .halo-af-histname { font-size:13px; }

  /* Tickets */
  .halo-ticket { padding:12px 13px; }
  .halo-subject { padding:10px 12px; font-size:13px; }

  /* Account */
  .halo-acct-stat { padding:10px 12px; }
  .halo-acct-stat b { font-size:15px; }
  .halo-user-info { padding:14px; gap:10px; }
  .halo-user-info-left { gap:10px; }
  .halo-avatar { width:38px; height:38px; font-size:16px; }
  .halo-user-info form .halo-btn { font-size:12px; padding:8px 12px; }

  /* Alerts */
  .halo-alert { padding:12px 14px; font-size:13px; }
  .halo-well { padding:12px 14px; font-size:13px; }

  /* Toolbar (search + filter) stack vertically */
  .halo-toolbar { flex-direction:column; gap:8px; }
  .halo-toolbar > * { width:100%; }

  /* Mobile menu: tighter items */
  .halo-topmenu.open .halo-topmenu-item { padding:10px 12px; font-size:13px; }

  /* Payment method dropdown: full width on mobile */
  .halo-af-paymenu { border-radius:16px 16px 0 0; max-height:75vh; }
  .halo-af-payitem { padding:12px 14px; }

  /* Tables: horizontal scroll wrapper */
  .halo-table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; font-size:13px; }

  /* Tickets: subject buttons compact */
  .halo-subjects { gap:6px; flex-wrap:wrap; }
  .halo-subject { padding:8px 10px; font-size:12px; min-width:0; flex:1 1 auto; }

  /* Messages: tighter on mobile */
  .halo-msg { max-width:90%; font-size:13px; padding:10px 12px; }
  .halo-msg-list { gap:8px; padding:12px; }

  /* Blog cards: internal compact */
  .halo-blog { border-radius:12px; }
  .halo-blog-body { padding:12px; }
  .halo-blog-title { font-size:14px; }
  .halo-blog-text { font-size:12px; }

  /* Panels list: compact */
  .halo-panel { padding:12px 13px; }
  .halo-panel-body { font-size:13px; }

  /* Affiliates: ring + stats compact */
  .halo-aff-ring { width:100px; height:100px; }
  .halo-aff-stat { padding:10px 12px; font-size:13px; }
  .halo-aff-url { font-size:12px; padding:10px 12px; }

  /* Modal/Dialog: tighter on small screens */
  .halo-dialog-box, .halo-modal-box { margin:12px; max-width:calc(100vw - 24px); border-radius:16px; }
  .halo-modal-top { padding:14px 16px; }
  .halo-modal-center { padding:14px 16px; }
  .halo-dialog-body { padding:14px 16px; font-size:13px; }
  .halo-dialog-actions { padding:12px 16px; gap:8px; }

  /* Toast: full width on mobile */
  .halo-toast { left:16px; right:16px; transform:none; width:auto; bottom:16px; font-size:13px; }
  .halo-toast.halo-toast-show { transform:none; }

  /* Code blocks: scroll */
  .halo-code { overflow-x:auto; font-size:12px; }

  /* Pagination: compact */
  .halo-pagination { gap:4px; font-size:12px; }
  .halo-pagination a, .halo-pagination span { padding:6px 10px; min-width:32px; }

  /* Updates list */
  .halo-update { padding:12px 13px; font-size:13px; }

  /* Notifications: compact switches */
  .halo-notif-item { padding:12px 14px; font-size:13px; }

  /* 2FA verify inputs: fit on small screen */
  .halo-verify-inputs { gap:6px; }
  .halo-verify-inputs input { width:38px; height:42px; font-size:18px; }

  /* Order actions: compact */
  .halo-order-act { font-size:11px; padding:4px 8px; }

  /* History box */
  .halo-history-box { padding:12px; font-size:13px; }

  /* Badge */
  .halo-badge { font-size:11px; padding:3px 7px; }

  /* Progress bar */
  .halo-progress { height:5px; border-radius:99px; }
}

/* ===== Public header: hamburger on mobile ===== */
.halo-pub-toggle { display:none; border:0; background:transparent; color:var(--halo-text); font-size:18px; cursor:pointer; padding:6px; }
.halo-pub-signup-m { display:none; }

@media (max-width:600px){
  .halo-pub-toggle { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:8px; border:1px solid var(--halo-border); background:var(--halo-surface); }
  .halo-public-header { flex-wrap:wrap; padding:10px 14px; gap:0; }
  .halo-public-header .logo { flex:1; font-size:15px; }
  .halo-public-header .logo img { height:26px; }
  .halo-public-nav { display:none; flex-direction:column; width:100%; gap:0; padding-top:10px; border-top:1px solid var(--halo-border); margin-top:10px; }
  .halo-public-nav a { padding:10px 4px; font-size:14px; border-bottom:1px solid var(--halo-border); }
  .halo-public-nav a:last-child { border-bottom:0; }
  .halo-public-header.nav-open .halo-public-nav { display:flex; }
  .halo-pub-signup-d { display:none; }
  .halo-pub-signup-m { display:block; margin-top:6px; text-align:center; width:100%; }
}

/* ===== 404 Error Page ===== */
.err-wrap {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:70vh; padding:40px 20px; text-align:center;
}
.err-badge {
  display:flex; align-items:center; gap:6px;
  margin-bottom:28px; user-select:none;
}
.err-digit {
  font-size:96px; font-weight:800; line-height:1;
  color:var(--halo-text); letter-spacing:-4px;
}
.err-orb {
  display:flex; align-items:center; justify-content:center;
  width:80px; height:80px; border-radius:50%;
  background:var(--halo-accent-strong); color:#fff; font-size:32px;
  box-shadow:0 4px 16px rgba(0,0,0,.12);
}
.err-title {
  font-size:24px; font-weight:700; color:var(--halo-text);
  margin:0 0 8px;
}
.err-desc {
  font-size:15px; color:var(--halo-muted); max-width:420px;
  margin:0 0 28px; line-height:1.6;
}
.err-actions {
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
  margin-bottom:32px;
}
.err-actions .btn {
  display:inline-flex; align-items:center; gap:7px;
  padding:10px 22px; border-radius:var(--halo-radius, 10px);
  font-size:14px; font-weight:600; text-decoration:none;
  cursor:pointer; border:0; transition:all .2s;
}
.err-actions .btn-primary {
  background:var(--halo-accent-strong); color:#fff;
}
.err-actions .btn-primary:hover { filter:brightness(1.1); transform:translateY(-1px); }
.err-actions .btn-ghost {
  background:var(--halo-surface); color:var(--halo-text);
  border:1px solid var(--halo-border);
}
.err-actions .btn-ghost:hover { background:var(--halo-hover); }
.err-links {
  display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:center;
  font-size:13px;
}
.err-links-lbl { color:var(--halo-muted); }
.err-links a {
  color:var(--halo-accent-strong); text-decoration:none;
  padding:4px 10px; border-radius:6px;
  transition:background .15s;
}
.err-links a:hover { background:color-mix(in srgb, var(--halo-accent-strong) 10%, transparent); }

@media (max-width:480px){
  .err-digit { font-size:64px; letter-spacing:-2px; }
  .err-orb { width:56px; height:56px; font-size:22px; }
  .err-title { font-size:20px; }
  .err-desc { font-size:14px; }
  .err-actions { flex-direction:column; width:100%; max-width:280px; }
  .err-actions .btn { justify-content:center; width:100%; }
}

/* ===== Halo: animated dashboard SVG ===== */
.halo-dash-sec { padding:56px 0 8px; }
.halo-dash-wrap { max-width:860px; margin:0 auto; direction:ltr; border-radius:var(--halo-radius-xl);
  border:1px solid var(--halo-border); background:var(--halo-surface); box-shadow:var(--halo-lift); padding:10px; position:relative; overflow:hidden; }
.halo-dash-wrap::before { content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 50% 60% at 15% 0%, color-mix(in srgb,var(--halo-accent) 14%,transparent), transparent); }
.halo-dash-svg { display:block; width:100%; height:auto; position:relative; }
.halo-dash-svg text { font-family:var(--halo-font); }

/* ألوان من الثيم (تدعم الدارك تلقائيًا) */
.hd-bg      { fill:var(--halo-bg); }
.hd-surface { fill:var(--halo-surface); stroke:var(--halo-border); stroke-width:1; }
.hd-surface2{ fill:var(--halo-surface-2); }
.hd-line    { stroke:var(--halo-border); stroke-width:1; }
.hd-accent  { fill:var(--halo-accent); }
.hd-accent-soft { fill:color-mix(in srgb,var(--halo-accent) 14%,transparent); }
.hd-t       { fill:var(--halo-text); font-weight:700; }
.hd-m       { fill:var(--halo-muted); font-weight:500; }
.hd-green   { fill:var(--halo-green); }
.hd-blue    { fill:var(--halo-blue); }
.hd-yellow  { fill:var(--halo-yellow); }

/* حركات */
.hd-bar { transform-box:fill-box; transform-origin:bottom; animation:hdBar 3.6s var(--halo-ease) infinite; }
.hd-bar:nth-child(2){ animation-delay:.12s } .hd-bar:nth-child(3){ animation-delay:.24s }
.hd-bar:nth-child(4){ animation-delay:.36s } .hd-bar:nth-child(5){ animation-delay:.48s }
.hd-bar:nth-child(6){ animation-delay:.6s }  .hd-bar:nth-child(7){ animation-delay:.72s }
@keyframes hdBar { 0%{transform:scaleY(.08)} 25%,80%{transform:scaleY(1)} 100%{transform:scaleY(.08)} }

.hd-draw { stroke:var(--halo-accent); fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:420; stroke-dashoffset:420; animation:hdDraw 5s ease-in-out infinite; }
@keyframes hdDraw { 0%{stroke-dashoffset:420} 45%,85%{stroke-dashoffset:0} 100%{stroke-dashoffset:-420} }
.hd-area { fill:url(#hdGrad); opacity:0; animation:hdArea 5s ease-in-out infinite; }
@keyframes hdArea { 0%,15%{opacity:0} 50%,85%{opacity:1} 100%{opacity:0} }

.hd-ring { fill:none; stroke:var(--halo-accent); stroke-width:7; stroke-linecap:round; stroke-dasharray:176;
  stroke-dashoffset:176; transform:rotate(-90deg); transform-origin:center; transform-box:fill-box; animation:hdRing 5s ease-in-out infinite; }
@keyframes hdRing { 0%{stroke-dashoffset:176} 45%,85%{stroke-dashoffset:44} 100%{stroke-dashoffset:176} }

.hd-prog { transform-box:fill-box; transform-origin:left; animation:hdProg 4.5s var(--halo-ease) infinite; }
.hd-prog.p2 { animation-delay:.4s } .hd-prog.p3 { animation-delay:.8s }
@keyframes hdProg { 0%{transform:scaleX(.05)} 50%,85%{transform:scaleX(1)} 100%{transform:scaleX(.05)} }

.hd-pulse { transform-box:fill-box; transform-origin:center; animation:hdPulse 2s ease-in-out infinite; }
@keyframes hdPulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.6);opacity:.35} }

.hd-float { animation:hdFloat 5s ease-in-out infinite; }
.hd-float.f2 { animation-delay:-1.7s } .hd-float.f3 { animation-delay:-3.2s }
@keyframes hdFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }

.hd-row { opacity:0; animation:hdRow 6s var(--halo-ease) infinite; }
.hd-row.r2 { animation-delay:.5s } .hd-row.r3 { animation-delay:1s }
@keyframes hdRow { 0%{opacity:0;transform:translateX(-10px)} 12%,88%{opacity:1;transform:none} 100%{opacity:0} }

@media (max-width:480px){ .halo-dash-sec{padding:32px 0 4px} .halo-dash-wrap{padding:6px;border-radius:14px} }
@media (prefers-reduced-motion: reduce){
  .hd-bar,.hd-draw,.hd-area,.hd-ring,.hd-prog,.hd-pulse,.hd-float,.hd-row{ animation:none; opacity:1; transform:none; stroke-dashoffset:0 }
  .hd-ring{ stroke-dashoffset:44 }
}

/* ===== Halo: كيف يعمل — SVG متحرك ===== */
.halo-how-grid { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
/* خط متقطع متحرك يربط الخطوات */
.halo-how-grid::before { content:''; position:absolute; top:46px; inset-inline:16%; height:2px; z-index:0;
  background:repeating-linear-gradient(90deg, var(--halo-accent) 0 8px, transparent 8px 16px); opacity:.35;
  animation:hsFlow 1.2s linear infinite; }
[dir="rtl"] .halo-how-grid::before { animation-direction:reverse; }
@keyframes hsFlow { to { background-position:16px 0; } }

.halo-how-step { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px;
  padding:22px 20px 26px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:var(--halo-radius);
  transition:transform .2s var(--halo-ease), box-shadow .2s var(--halo-ease); }
.halo-how-step:hover { transform:translateY(-3px); box-shadow:var(--halo-lift); }
.halo-how-svg { width:100%; max-width:210px; height:auto; display:block; direction:ltr; }
.halo-how-n { width:30px; height:30px; border-radius:50%; background:var(--halo-accent); color:var(--halo-accent-ink);
  display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; margin-top:2px;
  animation:hsBadge 3.6s ease-in-out infinite; }
.halo-how-step:nth-child(2) .halo-how-n { animation-delay:1.2s } .halo-how-step:nth-child(3) .halo-how-n { animation-delay:2.4s }
@keyframes hsBadge { 0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--halo-accent) 45%,transparent)} 30%{box-shadow:0 0 0 9px transparent} }
.halo-how-step h3 { font-size:16px; font-weight:700; margin:0; }
.halo-how-step p { font-size:13.5px; color:var(--halo-muted); line-height:1.6; margin:0; }

/* ألوان الرسوم */
.hs-card  { fill:var(--halo-surface); stroke:var(--halo-border); stroke-width:1.5; }
.hs-soft  { fill:var(--halo-surface-2); }
.hs-acc   { fill:var(--halo-accent); }
.hs-accs  { fill:color-mix(in srgb,var(--halo-accent) 16%,transparent); }
.hs-green { fill:var(--halo-green); }
.hs-yellow{ fill:var(--halo-yellow); }
.hs-stroke{ fill:none; stroke:var(--halo-accent); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.hs-t { fill:var(--halo-accent-ink); font-family:var(--halo-font); font-weight:800; }

/* خطوة 1: إنشاء حساب */
.hs-type { transform-box:fill-box; transform-origin:left; animation:hsType 3.6s var(--halo-ease) infinite; }
.hs-type.t2 { animation-delay:.5s }
@keyframes hsType { 0%{transform:scaleX(0)} 30%,88%{transform:scaleX(1)} 100%{transform:scaleX(0)} }
.hs-check { stroke:#fff; stroke-width:3; fill:none; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:24; stroke-dashoffset:24; animation:hsCheck 3.6s ease infinite; }
@keyframes hsCheck { 0%,55%{stroke-dashoffset:24} 70%,88%{stroke-dashoffset:0} 100%{stroke-dashoffset:24} }
.hs-btnpulse { transform-box:fill-box; transform-origin:center; animation:hsBtn 3.6s ease infinite; }
@keyframes hsBtn { 0%,50%{transform:scale(1)} 60%{transform:scale(.94)} 72%,100%{transform:scale(1)} }

/* خطوة 2: إضافة رصيد */
.hs-coin { transform-box:fill-box; transform-origin:center; opacity:0; animation:hsCoin 3.6s ease-in infinite; }
.hs-coin.c2 { animation-delay:.45s } .hs-coin.c3 { animation-delay:.9s }
@keyframes hsCoin { 0%{opacity:0;transform:translateY(-34px)} 15%{opacity:1} 45%{opacity:1;transform:translateY(34px) scale(.9)} 55%,100%{opacity:0;transform:translateY(40px) scale(.6)} }
.hs-fill { transform-box:fill-box; transform-origin:left; animation:hsFill 3.6s var(--halo-ease) infinite; }
@keyframes hsFill { 0%,10%{transform:scaleX(.08)} 70%,90%{transform:scaleX(1)} 100%{transform:scaleX(.08)} }
.hs-pop { transform-box:fill-box; transform-origin:center; animation:hsPop 3.6s ease infinite; }
@keyframes hsPop { 0%,50%{transform:scale(0)} 65%{transform:scale(1.2)} 75%,90%{transform:scale(1)} 100%{transform:scale(0)} }

/* خطوة 3: اطلب وانمُ */
.hs-bar { transform-box:fill-box; transform-origin:bottom; animation:hsBar 3.6s var(--halo-ease) infinite; }
.hs-bar.b2 { animation-delay:.2s } .hs-bar.b3 { animation-delay:.4s } .hs-bar.b4 { animation-delay:.6s }
@keyframes hsBar { 0%{transform:scaleY(.05)} 45%,88%{transform:scaleY(1)} 100%{transform:scaleY(.05)} }
.hs-arrow { stroke-dasharray:150; stroke-dashoffset:150; animation:hsArrow 3.6s ease-in-out infinite; }
@keyframes hsArrow { 0%,10%{stroke-dashoffset:150} 55%,88%{stroke-dashoffset:0} 100%{stroke-dashoffset:150} }
.hs-tip { opacity:0; animation:hsTip 3.6s ease infinite; }
@keyframes hsTip { 0%,50%{opacity:0} 60%,88%{opacity:1} 100%{opacity:0} }

@media (max-width:820px){
  .halo-how-grid { grid-template-columns:1fr; }
  .halo-how-grid::before { display:none; }
  .halo-how-svg { max-width:180px; }
}
@media (prefers-reduced-motion: reduce){
  .halo-how-grid::before, .halo-how-n, .hs-type, .hs-check, .hs-btnpulse, .hs-coin, .hs-fill, .hs-pop, .hs-bar, .hs-arrow, .hs-tip { animation:none; }
  .hs-check, .hs-arrow { stroke-dashoffset:0; } .hs-coin { opacity:1; } .hs-tip { opacity:1; }
}

/* ===== Halo: المميزات — رسومات SVG متحركة ===== */
.hf-ill { width:76px; height:76px; border-radius:20px; margin-bottom:16px; display:flex; align-items:center; justify-content:center;
  background:color-mix(in srgb,var(--halo-accent) 10%,transparent); transition:transform .25s var(--halo-ease), background .25s; }
.hf-ill svg { width:100%; height:100%; display:block; direction:ltr; }
.halo-auth-bcard:hover .hf-ill { transform:scale(1.06) rotate(-2deg); background:color-mix(in srgb,var(--halo-accent) 16%,transparent); }

.hf-acc   { fill:var(--halo-accent); }
.hf-accs  { fill:color-mix(in srgb,var(--halo-accent) 18%,transparent); }
.hf-soft  { fill:var(--halo-surface); stroke:var(--halo-border); stroke-width:1.5; }
.hf-green { fill:var(--halo-green); }
.hf-line  { fill:none; stroke:var(--halo-accent); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.hf-ring-bg { fill:none; stroke:var(--halo-accent); stroke-width:3; opacity:.2; }
.hf-txt { font-family:var(--halo-font); font-weight:800; }

/* 1) تنفيذ فوري: صاعقة + حلقة عدّاد */
.hf-count { fill:none; stroke:var(--halo-accent); stroke-width:3; stroke-linecap:round; stroke-dasharray:151; stroke-dashoffset:0;
  transform:rotate(-90deg); transform-origin:center; transform-box:fill-box; animation:hfCount 3s ease-in-out infinite; }
@keyframes hfCount { 0%{stroke-dashoffset:151} 60%,100%{stroke-dashoffset:0} }
.hf-bolt { transform-box:fill-box; transform-origin:center; animation:hfBolt 3s ease-in-out infinite; }
@keyframes hfBolt { 0%,45%{transform:scale(.85);opacity:.5} 60%{transform:scale(1.18);opacity:1} 75%,100%{transform:scale(1);opacity:1} }

/* 2) آمن: قفل بيتقفل + علامة صح */
.hf-shield { transform-box:fill-box; transform-origin:center; animation:hfShield 3.4s ease-in-out infinite; }
@keyframes hfShield { 0%,100%{transform:scale(1)} 60%{transform:scale(1.05)} }
.hf-shackle { fill:none; stroke:var(--halo-accent); stroke-width:3.5; stroke-linecap:round; animation:hfShackle 3.4s ease-in-out infinite; }
@keyframes hfShackle { 0%,25%{transform:translateY(-5px)} 50%,100%{transform:translateY(0)} }
.hf-ok { transform-box:fill-box; transform-origin:center; animation:hfOk 3.4s ease infinite; }
@keyframes hfOk { 0%,48%{transform:scale(0)} 62%{transform:scale(1.25)} 72%,92%{transform:scale(1)} 100%{transform:scale(0)} }

/* 3) أسعار: السعر القديم يتشطب والجديد يظهر */
.hf-strike { stroke:var(--halo-red); stroke-width:2.5; stroke-linecap:round; stroke-dasharray:26; stroke-dashoffset:26; animation:hfStrike 3.6s ease infinite; }
@keyframes hfStrike { 0%,15%{stroke-dashoffset:26} 35%,90%{stroke-dashoffset:0} 100%{stroke-dashoffset:26} }
.hf-old { fill:var(--halo-muted); animation:hfOld 3.6s ease infinite; }
@keyframes hfOld { 0%,15%{opacity:1} 40%,90%{opacity:.45} 100%{opacity:1} }
.hf-new { fill:var(--halo-green); transform-box:fill-box; transform-origin:center; animation:hfNew 3.6s ease infinite; }
@keyframes hfNew { 0%,35%{transform:scale(0);opacity:0} 52%{transform:scale(1.25);opacity:1} 62%,90%{transform:scale(1);opacity:1} 100%{transform:scale(0);opacity:0} }

/* 4) ضمان التعويض: أسهم دائرية بتلف */
.hf-spin { transform-box:fill-box; transform-origin:center; animation:hfSpin 3.6s cubic-bezier(.6,.05,.3,1) infinite; }
@keyframes hfSpin { 0%{transform:rotate(0)} 70%,100%{transform:rotate(360deg)} }
.hf-core { transform-box:fill-box; transform-origin:center; animation:hfCore 3.6s ease-in-out infinite; }
@keyframes hfCore { 0%,100%{transform:scale(1)} 50%{transform:scale(1.35)} }

/* 5) دعم: فقاعات رسائل + نقط كتابة */
.hf-b1 { transform-box:fill-box; transform-origin:left bottom; animation:hfB1 4s var(--halo-ease) infinite; }
.hf-b2 { transform-box:fill-box; transform-origin:right bottom; animation:hfB2 4s var(--halo-ease) infinite; }
@keyframes hfB1 { 0%{transform:scale(0);opacity:0} 12%,88%{transform:scale(1);opacity:1} 100%{transform:scale(0);opacity:0} }
@keyframes hfB2 { 0%,25%{transform:scale(0);opacity:0} 40%,88%{transform:scale(1);opacity:1} 100%{transform:scale(0);opacity:0} }
.hf-dot { fill:#fff; animation:hfDot 1s ease-in-out infinite; }
.hf-dot.d2 { animation-delay:.15s } .hf-dot.d3 { animation-delay:.3s }
@keyframes hfDot { 0%,100%{transform:translateY(0);opacity:.5} 50%{transform:translateY(-3px);opacity:1} }

/* الكروت العريضة: الرسمة بجانب النص */
@media (min-width:821px){
  .halo-auth-bcard--wide, .halo-auth-bcard--full { display:grid; grid-template-columns:auto 1fr; column-gap:20px; align-items:center; }
  .halo-auth-bcard--wide .hf-ill, .halo-auth-bcard--full .hf-ill { grid-row:1 / span 2; margin-bottom:0; width:92px; height:92px; }
  .halo-auth-bcard--wide h3, .halo-auth-bcard--full h3 { align-self:end; }
  .halo-auth-bcard--wide p, .halo-auth-bcard--full p { align-self:start; }
}

@media (prefers-reduced-motion: reduce){
  .hf-count,.hf-bolt,.hf-shield,.hf-shackle,.hf-ok,.hf-strike,.hf-old,.hf-new,.hf-spin,.hf-core,.hf-b1,.hf-b2,.hf-dot { animation:none; }
  .hf-strike { stroke-dashoffset:0; } .hf-count { stroke-dashoffset:0; }
  .hf-ok,.hf-new,.hf-b1,.hf-b2 { transform:none; opacity:1; }
}

/* ===== Halo Hero v5 ===== */
.halo-auth-hero-visual { justify-content:space-between; gap:18px; padding:30px 30px 26px; min-height:580px; }
.halo-auth-hero-text { padding-top:0; }
.halo-auth-hero-text h1 { font-size:40px; margin:0 0 12px; }
.halo-auth-hero-text p { margin:0; font-size:15.5px; max-width:420px; }

/* شارة "مباشر" */
.hh-badge { display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:99px; margin-bottom:16px;
  font-size:12.5px; font-weight:700; color:var(--halo-green);
  background:color-mix(in srgb,var(--halo-green) 12%,transparent); border:1px solid color-mix(in srgb,var(--halo-green) 30%,transparent); }
.hh-live { width:8px; height:8px; border-radius:50%; background:var(--halo-green); animation:hhLive 1.8s ease-out infinite; }
@keyframes hhLive { 0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--halo-green) 60%,transparent)} 70%,100%{box-shadow:0 0 0 9px transparent} }

/* كلمة متبدّلة في العنوان (CSS فقط) */
.hh-words { display:inline-grid; vertical-align:bottom; }
.hh-words span { grid-area:1/1; opacity:0; white-space:nowrap; animation:hhWord 9s var(--halo-ease) infinite;
  background:linear-gradient(135deg,var(--halo-accent),color-mix(in srgb,var(--halo-accent) 55%,#3B82F6));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hh-words span:nth-child(2){ animation-delay:3s } .hh-words span:nth-child(3){ animation-delay:6s }
@keyframes hhWord { 0%{opacity:0;transform:translateY(45%)} 6%,28%{opacity:1;transform:none} 34%,100%{opacity:0;transform:translateY(-45%)} }

/* المدار */
.hh-orbit { position:relative; width:250px; height:250px; margin:0 auto; flex:0 0 auto; z-index:1; }
.hh-ring { position:absolute; border-radius:50%; border:1.5px dashed color-mix(in srgb,var(--halo-accent) 38%,var(--halo-border)); animation:hhSpin linear infinite; }
.hh-ring.r1 { inset:0; animation-duration:32s; }
.hh-ring.r2 { inset:54px; animation-duration:22s; animation-direction:reverse; }
@keyframes hhSpin { to { transform:rotate(360deg); } }
.hh-sat { position:absolute; width:40px; height:40px; margin:-20px 0 0 -20px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:var(--halo-surface); border:1px solid var(--halo-border); box-shadow:var(--halo-shadow); font-size:18px;
  animation:hhSpin linear infinite reverse; }
.r1 .hh-sat { animation-duration:32s; }
.r2 .hh-sat { animation-duration:22s; animation-direction:normal; }
.hh-core { position:absolute; inset:0; margin:auto; width:84px; height:84px; z-index:2; }
.hh-core svg { width:100%; height:100%; overflow:visible; }
.hh-wave { fill:none; stroke:var(--halo-accent); stroke-width:2; transform-box:fill-box; transform-origin:center; opacity:0; animation:hhWave 3s ease-out infinite; }
.hh-wave.w2 { animation-delay:1.5s; }
@keyframes hhWave { 0%{transform:scale(1);opacity:.55} 100%{transform:scale(2.3);opacity:0} }
.hh-core-arrow { fill:none; stroke:#fff; stroke-width:4; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:70; stroke-dashoffset:70; animation:hhArrow 3s ease-in-out infinite; }
@keyframes hhArrow { 0%,10%{stroke-dashoffset:70} 50%,90%{stroke-dashoffset:0} 100%{stroke-dashoffset:70} }

/* الأرقام */
.hh-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; position:relative; z-index:2; }
.hh-stat { display:flex; flex-direction:column; gap:2px; padding:12px 14px; border-radius:14px;
  background:color-mix(in srgb,var(--halo-surface) 88%,transparent); border:1px solid var(--halo-border);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.hh-stat i { color:var(--halo-accent); font-size:14px; margin-bottom:4px; }
.hh-stat b { font-size:20px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.1; }
.hh-stat span { font-size:11.5px; color:var(--halo-muted); }

/* كارت الدخول: بدون رفع عند المرور (عشان الفورم) + إظهار كلمة المرور + شارات ثقة */
.halo-auth-card:hover { transform:none; box-shadow:0 1px 2px rgba(0,0,0,.04), 0 8px 40px color-mix(in srgb,var(--halo-accent) 5%,rgba(0,0,0,.06)); }
.hh-pass .halo-input { padding-inline-end:40px; }
.hh-eye { position:absolute; top:50%; inset-inline-end:8px; transform:translateY(-50%); width:30px; height:30px; border:0; border-radius:8px;
  background:transparent; color:var(--halo-muted); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; z-index:2; }
.hh-eye:hover { color:var(--halo-accent-strong); background:var(--halo-surface-2); }
.hh-eye:focus-visible { outline:none; box-shadow:var(--halo-focus); }
.hh-trust { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-top:18px; padding-top:16px; border-top:1px solid var(--halo-border); }
.hh-trust span { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:var(--halo-muted); }
.hh-trust i { color:var(--halo-green); }

@media (max-width:820px){
  .halo-auth-hero-visual { min-height:auto; padding:24px 20px 20px; }
  .halo-auth-hero-text h1 { font-size:28px; }
  .hh-orbit { width:210px; height:210px; }
  .hh-ring.r2 { inset:44px; }
  .hh-core { width:70px; height:70px; }
  .hh-sat { width:34px; height:34px; margin:-17px 0 0 -17px; font-size:15px; border-radius:10px; }
}
@media (max-width:480px){
  .halo-auth-hero-text h1 { font-size:22px; }
  .halo-auth-hero-text p { font-size:13px; }
  .hh-orbit { width:180px; height:180px; }
  .hh-ring.r2 { inset:38px; }
  .hh-core { width:60px; height:60px; }
  .hh-stats { gap:6px; }
  .hh-stat { padding:9px 10px; border-radius:11px; }
  .hh-stat b { font-size:15px; }
  .hh-stat span { font-size:10px; }
  .hh-stat i { font-size:12px; margin-bottom:2px; }
}
@media (prefers-reduced-motion: reduce){
  .hh-live,.hh-ring,.hh-sat,.hh-wave,.hh-core-arrow { animation:none; }
  .hh-core-arrow { stroke-dashoffset:0; }
  .hh-words span { animation:none; opacity:0; } .hh-words span:first-child { opacity:1; }
}


/* =====================================================
   Halo — Hero + Login موحّد
   ===================================================== */

/* ---- اللوحة الكبيرة ---- */
.halo-auth-hero {
  position:relative; isolation:isolate; overflow:hidden;
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  grid-template-areas:"copy side" "stats side";
  align-content:center; column-gap:48px; row-gap:28px;
  min-height:620px; padding:52px 48px; margin:8px 0 0;
  border-radius:var(--halo-radius-xl); border:1px solid var(--halo-border); background:var(--halo-surface);
}
.halo-auth-hero::before { content:none; }
.halo-auth-mesh {
  position:absolute; inset:0; z-index:-2; border:0; border-radius:0;
  background:
    radial-gradient(ellipse 55% 60% at 88% 20%, color-mix(in srgb,var(--halo-accent) 20%,transparent), transparent),
    radial-gradient(ellipse 45% 55% at 10% 90%, color-mix(in srgb,#3B82F6 14%,transparent), transparent),
    var(--halo-surface);
}
/* شبكة خفيفة تتلاشى */
.halo-auth-hero::after {
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.45;
  background-image:linear-gradient(var(--halo-border) 1px,transparent 1px),linear-gradient(90deg,var(--halo-border) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse 70% 80% at 25% 45%,#000,transparent 75%);
  mask-image:radial-gradient(ellipse 70% 80% at 25% 45%,#000,transparent 75%);
}

/* ---- النص ---- */
.hh-copy { grid-area:copy; align-self:end; position:relative; z-index:2; }
.hh-copy h1 { font-size:44px; font-weight:800; line-height:1.18; letter-spacing:-.03em; margin:0 0 14px; }
.hh-copy p { font-size:16px; line-height:1.7; color:var(--halo-muted); margin:0; max-width:460px; }

.hh-badge { display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:99px; margin-bottom:18px;
  font-size:12.5px; font-weight:700; color:var(--halo-green);
  background:color-mix(in srgb,var(--halo-green) 12%,transparent); border:1px solid color-mix(in srgb,var(--halo-green) 30%,transparent); }
.hh-live { width:8px; height:8px; border-radius:50%; background:var(--halo-green); animation:hhLive 1.8s ease-out infinite; }
@keyframes hhLive { 0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--halo-green) 60%,transparent)} 70%,100%{box-shadow:0 0 0 9px transparent} }

/* كلمة متبدّلة (CSS فقط) */
.hh-words { display:inline-grid; vertical-align:bottom; }
.hh-words span { grid-area:1/1; opacity:0; white-space:nowrap; animation:hhWord 9s var(--halo-ease) infinite;
  background:linear-gradient(135deg,var(--halo-accent),color-mix(in srgb,var(--halo-accent) 55%,#3B82F6));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hh-words span:nth-child(2){ animation-delay:3s } .hh-words span:nth-child(3){ animation-delay:6s }
@keyframes hhWord { 0%{opacity:0;transform:translateY(45%)} 6%,28%{opacity:1;transform:none} 34%,100%{opacity:0;transform:translateY(-45%)} }

/* ---- الأرقام ---- */
.hh-stats { grid-area:stats; align-self:start; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; max-width:480px; position:relative; z-index:2; }
.hh-stat { display:flex; flex-direction:column; gap:2px; padding:14px 16px; border-radius:var(--halo-radius);
  background:color-mix(in srgb,var(--halo-surface) 80%,transparent); border:1px solid var(--halo-border);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.hh-stat i { color:var(--halo-accent); font-size:14px; margin-bottom:4px; }
.hh-stat b { font-size:22px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.1; }
.hh-stat span { font-size:12px; color:var(--halo-muted); }

/* ---- الجانب: المدار خلف الكارت ---- */
.hh-side { grid-area:side; align-self:center; position:relative; display:flex; align-items:center; justify-content:center; min-height:500px; }
.hh-orbit { position:absolute; left:50%; top:50%; width:600px; height:600px; margin:-300px 0 0 -300px; pointer-events:none; z-index:0; }
.hh-glow { position:absolute; left:50%; top:50%; width:340px; height:340px; margin:-170px 0 0 -170px; border-radius:50%;
  background:var(--halo-accent); opacity:.28; filter:blur(70px); }
.hh-ring { position:absolute; border-radius:50%; border:1.5px dashed color-mix(in srgb,var(--halo-accent) 42%,var(--halo-border)); animation:hhSpin linear infinite; }
.hh-ring.r1 { inset:0; animation-duration:46s; }
.hh-ring.r2 { inset:70px; animation-duration:32s; animation-direction:reverse; }
@keyframes hhSpin { to { transform:rotate(360deg); } }
.hh-sat { position:absolute; width:44px; height:44px; margin:-22px 0 0 -22px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:var(--halo-surface); border:1px solid var(--halo-border); box-shadow:var(--halo-shadow); font-size:20px; animation:hhSpin linear infinite reverse; }
.r1 .hh-sat { animation-duration:46s; }
.r2 .hh-sat { animation-duration:32s; animation-direction:normal; }

/* =====================================================
   Halo — Hero بملء الصفحة (مسطّح، يتبع الثيم)
   ===================================================== */
.hx { position:relative; width:100vw; margin-inline:calc(50% - 50vw); background:var(--halo-bg); border-bottom:1px solid var(--halo-border); }

.hx-main { position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; text-align:center;
  min-height:calc(100vh - 72px); min-height:calc(100svh - 72px); padding:56px 20px 0; }
/* خطين رأسيين رفيعين على جانبي المحتوى */
.hx-main::before, .hx-main::after { content:''; position:absolute; top:0; bottom:0; width:1px; background:var(--halo-border); pointer-events:none; }
.hx-main::before { inset-inline-start:max(16px, calc(50% - 590px)); }
.hx-main::after  { inset-inline-end:max(16px, calc(50% - 590px)); }
.hx-main > * { position:relative; z-index:1; }

/* شارة */
.hx-badge { display:inline-flex; align-items:center; gap:10px; padding:5px 14px 5px 5px; border-radius:99px; margin-bottom:26px;
  background:var(--halo-surface); border:1px solid var(--halo-border); color:var(--halo-text); font-size:13px; font-weight:600; transition:border-color .15s; }
[dir="rtl"] .hx-badge { padding:5px 5px 5px 14px; }
.hx-badge:hover { border-color:var(--halo-accent); color:var(--halo-text); }
.hx-badge b { background:var(--halo-accent); color:var(--halo-accent-ink); border-radius:99px; padding:3px 11px; font-size:12px; font-weight:700; }
.hx-badge i { font-size:11px; color:var(--halo-muted); }

/* عنوان */
.hx-title { max-width:820px; margin:0 0 16px; font-size:clamp(32px,5.2vw,58px); font-weight:800; line-height:1.25; letter-spacing:-.02em; }
.hx-mark { position:relative; display:inline-block; white-space:nowrap; }
.hx-ul { position:absolute; inset-inline:0; bottom:-8px; width:100%; height:12px; overflow:visible; }
.hx-ul path { fill:none; stroke:var(--halo-accent); stroke-width:3.5; stroke-linecap:round; stroke-dasharray:210; stroke-dashoffset:210; animation:hxDraw .9s .3s var(--halo-ease) forwards; }
@keyframes hxDraw { to { stroke-dashoffset:0; } }
.hx-sub { max-width:560px; margin:0 0 32px; font-size:16px; line-height:1.75; color:var(--halo-muted); }

/* صف الدخول */
.hx-alerts { width:100%; max-width:760px; }
.hx-alerts .halo-alert { text-align:start; margin-bottom:12px; }
.hx-form { width:100%; max-width:760px; }
.hx-login { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; }
.hx-field { position:relative; display:block; margin:0; }
.hx-field > i:first-child { position:absolute; inset-inline-start:16px; top:50%; transform:translateY(-50%); font-size:14px; color:var(--halo-muted); pointer-events:none; transition:color .15s; }
.hx-field:focus-within > i:first-child { color:var(--halo-accent); }
.hx-field input { width:100%; height:52px; padding-block:0; padding-inline:44px 14px; border:1px solid var(--halo-border); border-radius:12px;
  background:var(--halo-surface); color:var(--halo-text); font-family:inherit; font-size:14px; text-align:start; transition:border-color .15s, box-shadow .15s; }
.hx-field input::placeholder { color:var(--halo-muted); }
.hx-field input:hover { border-color:color-mix(in srgb,var(--halo-text) 22%,var(--halo-border)); }
.hx-field input:focus { outline:none; border-color:var(--halo-accent); box-shadow:var(--halo-focus); }
.hx-field input#password { padding-inline-end:46px; }
.hx-eye { position:absolute; inset-inline-end:8px; top:50%; transform:translateY(-50%); width:34px; height:34px; border:0; border-radius:8px; background:transparent; color:var(--halo-muted); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.hx-eye i { position:static; transform:none; font-size:14px; color:inherit; }
.hx-eye:hover { color:var(--halo-text); background:var(--halo-surface-2); }
.hx-eye:focus-visible { outline:none; box-shadow:var(--halo-focus); }
.hx-submit { height:52px; padding:0 34px; border:0; border-radius:12px; background:var(--halo-accent); color:var(--halo-accent-ink); font-family:inherit; font-size:15px; font-weight:700; cursor:pointer; white-space:nowrap; transition:background-color .15s, transform .1s; }
.hx-submit:hover { background:var(--halo-accent-strong); }
.hx-submit:active { transform:translateY(1px); }
.hx-submit:focus-visible { outline:none; box-shadow:var(--halo-focus); }
.hx-captcha { margin-top:12px; display:flex; justify-content:center; }
.hx-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:14px; font-size:13px; color:var(--halo-muted); }
.hx-meta-l { display:inline-flex; align-items:center; gap:18px; flex-wrap:wrap; }
.hx-meta a { color:var(--halo-text); font-weight:700; text-decoration:underline; text-decoration-color:var(--halo-border); text-underline-offset:3px; transition:text-decoration-color .15s; }
.hx-meta a:hover { text-decoration-color:var(--halo-accent); }
.hx-check { display:inline-flex; align-items:center; gap:8px; cursor:pointer; margin:0; font-weight:500; }
.hx-check input { accent-color:var(--halo-accent); width:16px; height:16px; margin:0; }
.hx-google { display:flex; justify-content:center; margin-top:16px; }

/* لقطة اللوحة */
.hx-stage { position:relative; width:100%; max-width:900px; margin-top:auto; padding-top:44px; }
.hx-shot { height:290px; overflow:hidden; background:var(--halo-surface); border:1px solid var(--halo-border); border-bottom:0; border-radius:16px 16px 0 0; text-align:start; }
.hx-shot-bar { display:flex; align-items:center; gap:6px; height:38px; padding:0 14px; border-bottom:1px solid var(--halo-border); background:var(--halo-surface-2); }
.hx-shot-bar i { width:9px; height:9px; border-radius:50%; background:var(--halo-border); }
.hx-shot-bar span { margin-inline-start:12px; width:150px; height:14px; border-radius:7px; background:var(--halo-border); opacity:.6; }
.hx-shot-body { display:grid; grid-template-columns:150px 1fr; height:calc(100% - 38px); }
.hx-shot-side { padding:14px 12px; border-inline-end:1px solid var(--halo-border); display:flex; flex-direction:column; gap:8px; }
.hx-shot-side span { height:28px; border-radius:8px; background:var(--halo-surface-2); }
.hx-shot-side span.on { background:var(--halo-accent); opacity:.9; }
.hx-shot-main { padding:16px; min-width:0; }
.hx-shot-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px; }
.hx-shot-stats div { padding:11px 13px; border:1px solid var(--halo-border); border-radius:10px; }
.hx-shot-stats small { display:block; font-size:11px; color:var(--halo-muted); }
.hx-shot-stats b { display:block; margin-top:3px; font-size:18px; font-weight:800; font-variant-numeric:tabular-nums; }
.hx-shot-table { border:1px solid var(--halo-border); border-radius:10px; overflow:hidden; }
.hx-row { display:grid; grid-template-columns:62px 1.4fr 100px 1fr; align-items:center; gap:12px; padding:11px 14px; border-bottom:1px solid var(--halo-border); font-size:12.5px; }
.hx-row:last-child { border-bottom:0; }
.hx-row em { font-style:normal; font-weight:700; color:var(--halo-muted); font-variant-numeric:tabular-nums; }
.hx-row span { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hx-row u { text-decoration:none; justify-self:start; padding:3px 10px; border-radius:99px; font-size:11.5px; font-weight:700; }
.hx-row u.done { background:color-mix(in srgb,var(--halo-green) 14%,transparent); color:var(--halo-green); }
.hx-row u.prog { background:color-mix(in srgb,var(--halo-blue) 14%,transparent); color:var(--halo-blue); }
.hx-row u.wait { background:color-mix(in srgb,var(--halo-yellow) 16%,transparent); color:var(--halo-yellow); }
.hx-row s { display:block; height:6px; border-radius:99px; background:var(--halo-surface-2); overflow:hidden; text-decoration:none; }
.hx-row s i { display:block; height:100%; background:var(--halo-accent); border-radius:99px; }

/* كروت جانبية */
.hx-card { position:absolute; z-index:2; padding:14px 16px; background:var(--halo-surface); border:1px solid var(--halo-border); border-radius:14px; text-align:start; box-shadow:var(--halo-shadow); }
.hx-card-a { inset-inline-start:-96px; top:132px; display:flex; align-items:center; gap:12px; }
.hx-card-b { inset-inline-end:-96px; top:96px; width:178px; }
.hx-card-ic { width:34px; height:34px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; font-size:14px; }
.hx-card-ic.ok { background:color-mix(in srgb,var(--halo-green) 14%,transparent); color:var(--halo-green); }
.hx-card b { display:block; font-size:13.5px; font-weight:700; }
.hx-card small { display:block; font-size:11.5px; color:var(--halo-muted); margin-top:2px; }
.hx-card-b b { font-size:20px; font-weight:800; margin:2px 0 10px; font-variant-numeric:tabular-nums; }
.hx-bars { display:flex; align-items:flex-end; gap:5px; height:44px; }
.hx-bars i { flex:1; background:var(--halo-accent); border-radius:3px; opacity:.85; }

/* المنصات + الأرقام */
.hx-strip { background:var(--halo-bg); }
.hx-nums { display:grid; grid-template-columns:repeat(4,1fr); max-width:1000px; margin:0 auto; }
.hx-nums > div { padding:32px 20px; text-align:center; border-inline-start:1px solid var(--halo-border); }
.hx-nums > div:first-child { border-inline-start:0; }
.hx-nums b { display:block; font-size:34px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.1; }
.hx-nums span { display:block; margin-top:6px; font-size:13px; color:var(--halo-muted); }

/* شاشات متوسطة: الكروت الجانبية تدخل جوه */
@media (max-width:1180px){
  .hx-card-a { inset-inline-start:12px; top:96px; }
  .hx-card-b { inset-inline-end:12px; top:70px; }
  .hx-main::before, .hx-main::after { display:none; }
}
@media (max-width:900px){
  .hx-main { padding:40px 16px 0; }
  .hx-card { display:none; }
  .hx-shot-body { grid-template-columns:1fr; }
  .hx-shot-side { display:none; }
  .hx-shot { height:250px; }
  .hx-nums { grid-template-columns:repeat(2,1fr); }
  .hx-nums > div:nth-child(3) { border-inline-start:0; }
  .hx-nums > div:nth-child(n+3) { border-top:1px solid var(--halo-border); }
}
@media (max-width:640px){
  .hx-login { grid-template-columns:1fr; }
  .hx-submit { width:100%; }
  .hx-meta { justify-content:center; text-align:center; }
  .hx-meta-l { justify-content:center; }
  .hx-sub { font-size:14.5px; margin-bottom:24px; }
  .hx-badge { margin-bottom:20px; font-size:12px; }
  .hx-row { grid-template-columns:54px 1fr 86px; }
  .hx-row s { display:none; }
  .hx-shot-stats b { font-size:15px; }
  .hx-plats { gap:10px 24px; padding:22px 16px; }
  .hx-plats span { font-size:15px; }
  .hx-nums b { font-size:26px; }
  .hx-nums > div { padding:22px 12px; }
}
@media (prefers-reduced-motion: reduce){
  .hx-ul path { animation:none; stroke-dashoffset:0; }
}

/* =====================================================
   تنظيف باقي الأقسام: نفس الأسلوب المسطّح (بدون رفع/ميلان/تدرّج)
   ===================================================== */
.halo-auth-bcard:hover, .halo-auth-tl-step:hover, .halo-auth-testi:hover, .halo-auth-price-card:hover,
.halo-auth-plat:hover, .halo-auth-cta-band:hover, .halo-auth-feat:hover, .halo-how-step:hover { transform:none; box-shadow:none; }
.halo-auth-bcard:hover .hf-ill { transform:none; }
.halo-auth-bcard:hover, .halo-auth-testi:hover, .halo-auth-price-card:hover, .halo-auth-plat:hover { border-color:color-mix(in srgb,var(--halo-text) 22%,var(--halo-border)); }
.halo-auth-cta:hover, .halo-auth-submit:hover { transform:none; box-shadow:none; }
.halo-auth-promo .halo-grad { background:none; -webkit-text-fill-color:currentColor; color:var(--halo-accent); }
.halo-auth-divider::before, .halo-auth-divider::after { background:var(--halo-border); }
.halo-auth-price-card.featured { box-shadow:none; }
.halo-auth-price-badge { box-shadow:none; }
.halo-auth-stars { text-shadow:none; }


/* ===== شريط المنصات: حركة لانهائية ===== */
.hx-marquee { overflow:hidden; direction:ltr; padding:28px 0; border-bottom:1px solid var(--halo-border);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.hx-track { display:flex; width:max-content; animation:hxScroll 40s linear infinite; will-change:transform; }
.hx-marquee:hover .hx-track { animation-play-state:paused; }
.hx-group { display:flex; flex:0 0 auto; }
@keyframes hxScroll { to { transform:translateX(-50%); } }

.hx-plat { display:inline-flex; align-items:center; gap:12px; padding:0 32px; white-space:nowrap;
  font-size:18px; font-weight:700; letter-spacing:-.01em; color:var(--halo-muted); opacity:.8;
  transition:color .2s, opacity .2s; cursor:default; }
.hx-plat i { font-size:26px; transition:color .2s, transform .25s var(--halo-ease); }
.hx-plat:hover { color:var(--halo-text); opacity:1; }
.hx-plat:hover i { color:var(--c); transform:scale(1.18); }

@media (max-width:640px){
  .hx-marquee { padding:20px 0; }
  .hx-plat { font-size:15px; gap:9px; padding:0 22px; }
  .hx-plat i { font-size:21px; }
  .hx-track { animation-duration:30s; }
}
@media (prefers-reduced-motion: reduce){
  .hx-track { animation:none; width:auto; flex-wrap:wrap; justify-content:center; }
  .hx-group[aria-hidden="true"] { display:none; }
  .hx-group { flex-wrap:wrap; justify-content:center; row-gap:12px; }
  .hx-marquee { -webkit-mask-image:none; mask-image:none; }
}

/* ===== Checkbox جديد (مسطّح) — يشتغل على كل الصفحات ===== */
.hx-check, .halo-checkbox-row { cursor:pointer; user-select:none; }
.hx-check input[type="checkbox"], .halo-checkbox-row input[type="checkbox"] {
  appearance:none; -webkit-appearance:none; flex:0 0 auto; width:20px; height:20px; margin:0; padding:0;
  display:inline-grid; place-content:center; cursor:pointer;
  border:1.5px solid color-mix(in srgb,var(--halo-text) 28%,var(--halo-border)); border-radius:7px; background:var(--halo-surface);
  transition:background-color .15s, border-color .15s, box-shadow .15s;
}
.hx-check input[type="checkbox"]::after, .halo-checkbox-row input[type="checkbox"]::after {
  content:''; width:5px; height:10px; margin-top:-2px; border:solid var(--halo-accent-ink); border-width:0 2.2px 2.2px 0;
  transform:rotate(45deg) scale(0); transition:transform .15s var(--halo-ease);
}
.hx-check input[type="checkbox"]:hover, .halo-checkbox-row input[type="checkbox"]:hover { border-color:var(--halo-accent); }
.hx-check input[type="checkbox"]:checked, .halo-checkbox-row input[type="checkbox"]:checked { background:var(--halo-accent); border-color:var(--halo-accent); }
.hx-check input[type="checkbox"]:checked::after, .halo-checkbox-row input[type="checkbox"]:checked::after { transform:rotate(45deg) scale(1); }
.hx-check input[type="checkbox"]:focus-visible, .halo-checkbox-row input[type="checkbox"]:focus-visible { outline:none; box-shadow:var(--halo-focus); }
.hx-check:has(input:checked), .halo-checkbox-row:has(input:checked) { color:var(--halo-text); }
@media (prefers-reduced-motion: reduce){
  .hx-check input[type="checkbox"]::after, .halo-checkbox-row input[type="checkbox"]::after { transition:none; }
}