/* AK47Bot 0.28.0 — shared light, compact, RTL-first design system. */
:root {
  color-scheme: light;
  --ak-bg: #f5f6f8;
  --ak-bg-subtle: #eef1f5;
  --ak-surface: #ffffff;
  --ak-surface-muted: #f8f9fb;
  --ak-line: #d9dee7;
  --ak-line-strong: #c5ccd8;
  --ak-ink: #171a21;
  --ak-muted: #667085;
  --ak-blue: #1f6feb;
  --ak-blue-soft: #edf4ff;
  --ak-green: #16805c;
  --ak-green-soft: #eaf8f1;
  --ak-red: #c33d4c;
  --ak-red-soft: #fff1f2;
  --ak-amber: #996515;
  --ak-amber-soft: #fff8e8;
  --ak-shadow: 0 8px 24px rgba(16, 24, 40, 0.065);
  --ak-shadow-small: 0 2px 8px rgba(16, 24, 40, 0.045);
}

body.ak47-admin,
body.ak47-customer {
  margin: 0;
  color: var(--ak-ink);
  background: var(--ak-bg);
  font-family: "Vazirmatn", "IRANSansX", Tahoma, -apple-system,
    BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-feature-settings: "ss01" 1;
  letter-spacing: 0;
}

body.ak47-admin {
  --bg: var(--ak-bg);
  --sidebar: var(--ak-surface);
  --surface: var(--ak-surface);
  --surface-2: var(--ak-surface-muted);
  --line: var(--ak-line);
  --text: var(--ak-ink);
  --muted: var(--ak-muted);
  --accent: var(--ak-blue);
  --accent-2: var(--ak-green);
  --accent-3: #3b82f6;
  --danger: var(--ak-red);
  --ok: var(--ak-green);
  --shadow: var(--ak-shadow);
  --panel: var(--ak-surface);
  --v21-bg: var(--ak-bg);
  --v21-card: var(--ak-surface);
  --v21-line: var(--ak-line);
  --v21-ink: var(--ak-ink);
  --v21-muted: var(--ak-muted);
  --v21-teal: var(--ak-blue);
  --v21-accent: var(--ak-blue);
}

body.ak47-customer {
  --bg: var(--ak-bg);
  --surface: var(--ak-surface);
  --surface-2: var(--ak-surface-muted);
  --surface-3: var(--ak-bg-subtle);
  --line: var(--ak-line);
  --ink: var(--ak-ink);
  --muted: var(--ak-muted);
  --teal: var(--ak-blue);
  --coral: var(--ak-blue);
  --gold: var(--ak-blue);
  --green: var(--ak-green);
  --danger: var(--ak-red);
  --v21-bg: var(--ak-bg);
  --v21-card: var(--ak-surface);
  --v21-line: var(--ak-line);
  --v21-ink: var(--ak-ink);
  --v21-muted: var(--ak-muted);
  --v21-teal: var(--ak-blue);
  --v21-accent: var(--ak-blue);
}

body.ak47-admin :focus-visible,
body.ak47-customer :focus-visible {
  outline: 3px solid rgba(31, 111, 235, 0.22);
  outline-offset: 2px;
}

/* Admin shell and navigation */
.ak47-admin .admin-shell { grid-template-columns: 248px minmax(0, 1fr); }
.ak47-admin .admin-sidebar {
  padding: 18px 14px;
  background: var(--ak-surface);
  border-color: var(--ak-line);
  box-shadow: -2px 0 12px rgba(16, 24, 40, 0.035);
}
.ak47-admin .admin-brand { padding: 2px 6px 12px; }
.ak47-admin .admin-brand-mark,
.ak47-admin .login-brand .admin-brand-mark {
  border-radius: 8px;
  color: #fff;
  background: var(--ak-blue);
  box-shadow: none;
}
.ak47-admin .admin-nav-search { margin: 8px 4px 10px; }
.ak47-admin .admin-nav-search input,
.ak47-admin input,
.ak47-admin textarea,
.ak47-admin select {
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line-strong);
  border-radius: 7px;
}
.ak47-admin input:focus,
.ak47-admin textarea:focus,
.ak47-admin select:focus {
  border-color: var(--ak-blue);
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.12);
}
.ak47-admin .admin-nav { gap: 6px; margin-top: 2px; }
.ak47-admin .admin-nav-section {
  border: 0;
  border-radius: 8px;
  background: transparent;
}
.ak47-admin .admin-nav-section > summary {
  min-height: 44px;
  padding: 8px 10px;
  border-radius: 7px;
}
.ak47-admin .admin-nav-section > summary:hover { background: var(--ak-surface-muted); }
.ak47-admin .admin-nav a {
  min-height: 44px;
  padding: 8px 10px;
  color: var(--ak-muted);
  background: transparent;
  border-color: transparent;
  border-radius: 7px;
}
.ak47-admin .admin-nav a span {
  width: 25px;
  height: 25px;
  color: #31506f;
  background: var(--ak-bg-subtle) !important;
  border-radius: 6px;
}
.ak47-admin .admin-nav a:hover { color: var(--ak-ink); background: var(--ak-surface-muted); }
.ak47-admin .admin-nav a.is-active {
  color: #174d96;
  background: var(--ak-blue-soft);
  border-color: #cfe0fb;
  box-shadow: inset -3px 0 0 var(--ak-blue);
}
.ak47-admin .admin-main { max-width: 1680px; padding: 24px 28px 40px; }
.ak47-admin .admin-topline {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ak-line);
}
.ak47-admin .admin-user,
.ak47-admin .status-chip,
.ak47-admin .status-pill,
.ak47-admin .status-badge {
  color: var(--ak-muted);
  background: var(--ak-surface-muted);
  border-color: var(--ak-line);
  border-radius: 8px;
}

/* Admin content: restrained surfaces and dense operations. */
.ak47-admin :is(
  .panel,
  .admin-panel,
  .metric-card,
  .choice-card,
  .check-row,
  .v21-admin-panel,
  .v21-admin-stat,
  .v23-readonly,
  .feature-toggle,
  .telegram-menu-toolbar,
  .telegram-menu-editor-item,
  .accounting-metric,
  .admin-details,
  .command-box
) {
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: var(--ak-shadow-small);
}
.ak47-admin :is(.panel, .admin-panel, .v21-admin-panel)
  > :is(.panel, .admin-panel, .v21-admin-panel) {
  padding-inline: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.ak47-admin :is(.metric-card, .v21-admin-stat, .accounting-metric) {
  border-top: 2px solid #d7e5fb;
}
.ak47-admin :is(.metric-card, .v21-admin-stat, .accounting-metric) strong {
  color: var(--ak-ink);
}
.ak47-admin :is(.table-wrap, .responsive-table, .v21-table-wrap, .responsive-data-table) {
  border-color: var(--ak-line);
  border-radius: 8px;
  background: var(--ak-surface);
}
.ak47-admin table { color: var(--ak-ink); background: var(--ak-surface); }
.ak47-admin th { color: #475467; background: var(--ak-surface-muted); }
.ak47-admin td,
.ak47-admin th { border-color: #e5e8ee; }
.ak47-admin tbody tr:hover { background: #fafbfc; }
.ak47-admin :is(pre, code, .config-output, .v21-code) {
  color: #263547;
  background: #f2f4f7;
  border-color: var(--ak-line);
  border-radius: 7px;
}
.ak47-admin .button,
.ak47-admin .v21-button,
.ak47-admin .icon-button {
  border-radius: 7px;
  box-shadow: none;
}
.ak47-admin :is(.button-primary, .v21-button) {
  color: #fff;
  background: var(--ak-blue);
  border-color: var(--ak-blue);
}
.ak47-admin .button-secondary { color: #344054; background: #fff; border-color: var(--ak-line-strong); }
.ak47-admin .button-muted { color: var(--ak-muted); background: var(--ak-surface-muted); }
.ak47-admin .button-danger { color: #fff; background: var(--ak-red); border-color: var(--ak-red); }
.ak47-admin :is(.button, .v21-button):hover { filter: none; transform: translateY(-1px); }
.ak47-admin .notice { color: var(--ak-ink); background: var(--ak-surface); border-radius: 8px; }
.ak47-admin :is(.notice-success, .status-ok, .status-active, .status-available, .status-assigned) {
  color: var(--ak-green);
  border-color: #b9e3cf;
  background: var(--ak-green-soft);
}
.ak47-admin :is(.notice-error, .status-error, .status-conflict, .status-deletion_failed, .status-urgent) {
  color: var(--ak-red);
  border-color: #f2c8cd;
  background: var(--ak-red-soft);
}
.ak47-admin :is(.notice-warning, .status-warning, .status-maintenance, .status-drain, .status-quarantine, .status-reserved, .status-high) {
  color: var(--ak-amber);
  border-color: #ead7a5;
  background: var(--ak-amber-soft);
}
.ak47-admin .ticket-thread { background: transparent; }
.ak47-admin .ticket-message {
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line);
  border-radius: 8px;
}
.ak47-admin .ticket-internal { background: var(--ak-amber-soft); border-color: #ead7a5; }
.ak47-admin :is(.v23-hero, .v23-tabs a.is-active) {
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: var(--ak-shadow-small);
}
.ak47-admin .v23-tabs a.is-active { color: #174d96; background: var(--ak-blue-soft); }
.ak47-admin .v23-stats article::after { display: none; }
.ak47-admin :is(.status-pill, .status-badge, .telegram-menu-switch span) { border-radius: 8px; }
.ak47-admin .telegram-menu-phone { border-radius: 8px; box-shadow: var(--ak-shadow); }
.ak47-admin .telegram-menu-avatar { border-radius: 8px; }

/* Customer portal: calmer hierarchy and fewer nested boxes. */
.ak47-customer .shell { width: min(1320px, calc(100% - 32px)); }
.ak47-customer .topbar {
  top: 8px;
  color: var(--ak-ink);
  background: rgba(255, 255, 255, 0.96);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: var(--ak-shadow-small);
  backdrop-filter: blur(12px);
}
.ak47-customer .brandmark-badge {
  color: #fff;
  background: var(--ak-blue);
  border-radius: 7px;
}
.ak47-customer :is(.topnav a, .ghost-button) {
  color: #475467;
  background: #fff;
  border-color: var(--ak-line);
  border-radius: 7px;
}
.ak47-customer :is(.hero-card, .auth-card, .panel-card, .workspace-panel, .v21-panel, .v21-filter, .v21-checkout, .v21-order, .v21-product) {
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: var(--ak-shadow-small);
}
.ak47-customer :is(.workspace-panel, .panel-card, .v21-panel)
  > :is(.panel-card, .v21-panel) {
  padding-inline: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.ak47-customer :is(.service-column, .plan-item, .purchase-plan, .service-tile, .txn-row, .device-control-card, .notification-item, .preference-row, .report-summary-strip) {
  color: var(--ak-ink);
  background: var(--ak-surface-muted);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: none;
}
.ak47-customer :is(input, textarea, select) {
  color: var(--ak-ink);
  background: #fff;
  border-color: var(--ak-line-strong);
  border-radius: 7px;
}
.ak47-customer :is(input, textarea, select):focus {
  border-color: var(--ak-blue);
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.12);
}
.ak47-customer :is(.primary-button, .v21-button, .auth-tab.is-active, .workspace-tab.is-active, .plan-action, .store-heading a) {
  color: #fff;
  background: var(--ak-blue);
  border-color: var(--ak-blue);
  border-radius: 7px;
  box-shadow: none;
}
.ak47-customer :is(.secondary-button, .workspace-tab, .auth-tab) {
  color: #344054;
  background: #fff;
  border-color: var(--ak-line-strong);
  border-radius: 7px;
}
.ak47-customer .danger-button { color: #fff; background: var(--ak-red); border-color: var(--ak-red); border-radius: 7px; }
.ak47-customer :is(.primary-button, .secondary-button, .ghost-button):hover { filter: none; transform: translateY(-1px); }
.ak47-customer :is(.note-panel, .empty-box, .mini-note, .service-reset-option, .service-delete-zone, .customer-delivery, .v21-summary, .v21-note, .v21-empty) {
  color: var(--ak-muted);
  background: var(--ak-surface-muted);
  border-color: var(--ak-line);
  border-radius: 8px;
}
.ak47-customer .workspace-tabs { background: var(--ak-bg); }
.ak47-customer :is(.status-pill, .shared-plan-badge, .device-count-tag, .notification-nav-link b, .auth-progress) { border-radius: 8px; }
.ak47-customer .status-active { color: var(--ak-green); border-color: #a8d9c4; background: var(--ak-green-soft); }
.ak47-customer :is(.status-expired, .status-quota_reached, .status-manual_locked) { color: var(--ak-red); border-color: #efc4ca; background: var(--ak-red-soft); }
.ak47-customer .ticket-message { color: var(--ak-ink); background: #fff; border-color: var(--ak-line); border-radius: 8px; }
.ak47-customer .telegram-auth-icon { color: #fff; background: var(--ak-blue); border-radius: 8px; }
.ak47-customer .store-hero {
  min-height: 220px;
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: var(--ak-shadow);
}
.ak47-customer .store-mark { color: #fff; background: var(--ak-blue); border-radius: 8px; box-shadow: none; }
.ak47-customer .store-trust article,
.ak47-customer .plan-card,
.ak47-customer .store-empty {
  color: var(--ak-ink);
  background: var(--ak-surface);
  border-color: var(--ak-line);
  border-radius: 8px;
  box-shadow: var(--ak-shadow-small);
}
.ak47-customer .plan-card:hover { transform: translateY(-2px); border-color: #b8cef1; }
.ak47-customer .v21-balance { color: #fff; background: var(--ak-blue); border-radius: 8px; }
.ak47-customer :is(.v21-product-meta span, .status, .v21-admin-tabs a, .v21-admin-stat) { border-radius: 8px; }

/* Shared loading, empty and error states. */
.ak47-admin [aria-busy="true"],
.ak47-customer [aria-busy="true"] { opacity: 0.68; cursor: wait; }
.ak47-admin :is(.empty-state, .v21-empty),
.ak47-customer :is(.empty-state, .empty-box, .v21-empty) {
  min-height: 72px;
  display: grid;
  align-content: center;
}

@media (max-width: 1024px) {
  .ak47-admin .admin-main { width: 100%; max-width: 100%; padding: 20px; }
  .ak47-customer .topnav { max-width: 64vw; overflow-x: auto; flex-wrap: nowrap; }
  .ak47-customer .topnav > * { flex: 0 0 auto; }
  .ak47-customer :is(.topnav, .workspace-tabs) { scrollbar-width: none; }
  .ak47-customer :is(.topnav, .workspace-tabs)::-webkit-scrollbar { display: none; }
}

@media (max-width: 1000px) {
  .ak47-admin .admin-shell { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  .ak47-admin .admin-main { padding: 16px 12px 28px; }
  .ak47-admin .admin-sidebar { box-shadow: -16px 0 36px rgba(16, 24, 40, 0.14); }
  .ak47-admin :is(.panel, .admin-panel, .v21-admin-panel, .metric-card) { padding: 14px; }
  .ak47-admin :is(.button-row, .inline-actions) { align-items: stretch; }
  .ak47-admin :is(.button-row, .inline-actions) > * { max-width: 100%; }
  .ak47-customer .shell { width: min(100%, calc(100% - 16px)); }
  .ak47-customer .topbar { position: static; }
  .ak47-customer :is(.hero-card, .auth-card, .panel-card, .workspace-panel, .v21-panel) { padding: 14px; }
  .ak47-customer .workspace-tabs {
    background: rgba(245, 246, 248, 0.97);
    backdrop-filter: blur(12px);
  }
  .ak47-customer .mobile-bottom-nav {
    inset: auto 8px 8px;
    background: rgba(255, 255, 255, 0.97);
    border-color: var(--ak-line);
    border-radius: 8px;
    box-shadow: 0 8px 28px rgba(16, 24, 40, 0.14);
  }
  .ak47-customer .mobile-nav-main span { color: #fff; background: var(--ak-blue); border-radius: 8px; }
  .ak47-customer .store-hero { border-radius: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .ak47-admin *,
  .ak47-customer * { scroll-behavior: auto !important; transition-duration: 0.001ms !important; }
}