:root {
  --rap-bg-app: #020817;
  --rap-bg-sidebar: #071426;
  --rap-bg-header: #081224;
  --rap-bg-card: #0b172a;
  --rap-bg-card-secondary: #0c1d31;
  --rap-border: rgb(45 91 121 / 0.52);
  --rap-border-active: rgb(34 211 238 / 0.55);
  --rap-text-primary: #edf7ff;
  --rap-text-secondary: #b4c9dc;
  --rap-text-muted: #7896b3;
  --rap-accent: #22d3ee;
  --rap-success: #10d9a5;
  --rap-warning: #f4c430;
  --rap-danger: #f43f76;
  --rap-purple: #a855f7;
  --rap-radius-sm: 10px;
  --rap-radius-md: 14px;
  --rap-radius-lg: 16px;
  --rap-space-xs: 8px;
  --rap-space-sm: 12px;
  --rap-space-md: 16px;
  --rap-space-lg: 24px;
  --rap-space-xl: 32px;
  --rap-sidebar-expanded: 248px;
  --rap-sidebar-collapsed: 72px;
  --rap-page-max: 1440px;
}

.rap-app-shell {
  width: 100%;
  min-width: 0;
  background: var(--rap-bg-app);
}

.rap-natural-main-shell {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  padding-left: 0 !important;
}

.rap-main-viewport {
  min-width: 0;
  min-height: 0;
  flex: 1 1 auto;
}

.rap-global-page-container {
  width: 100% !important;
  max-width: var(--rap-page-max) !important;
  min-width: 0;
  flex: 1 0 auto;
  margin-inline: auto !important;
  padding: clamp(24px, 2.3vw, 36px) clamp(20px, 2.5vw, 40px) !important;
}

.rap-route-host,
.rap-route-content {
  width: 100%;
  min-width: 0;
  margin-inline: auto;
}

.rap-consistent-header {
  min-height: 60px;
  flex: 0 0 60px;
  padding-inline: max(clamp(20px, 2.5vw, 40px), calc((100% - 1360px) / 2)) !important;
  border-bottom-color: rgb(45 91 121 / 0.3) !important;
  background: rgb(8 18 36 / 0.97) !important;
}

.community-dashboard-footer {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.rap-footer-inner {
  display: flex;
  width: 100%;
  max-width: var(--rap-page-max);
  min-height: 60px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-inline: auto;
  padding: 14px clamp(20px, 2.5vw, 40px) 16px;
  border-top: 1px solid rgb(45 91 121 / 0.36);
}

.rap-global-page-container .rounded-2xl.border,
.rap-global-page-container section[class*="border"] {
  border-color: var(--rap-border);
  border-radius: var(--rap-radius-lg);
}

.rap-global-page-container button,
.rap-global-page-container a,
.rap-natural-sidebar,
.rap-natural-main-shell {
  transition-duration: 190ms !important;
  transition-timing-function: ease !important;
}

.rap-global-page-container textarea,
.rap-global-page-container input,
.rap-global-page-container select {
  max-width: 100%;
}

.rap-main-viewport[data-rap-page="check-kelayakan-akun"] .rap-route-content { max-width: 1080px; }
.rap-main-viewport[data-rap-page="generate-qr"] .rap-route-content { max-width: 1320px; }
.rap-main-viewport[data-rap-page="take-generate"] .rap-route-content { max-width: 1280px; }
.rap-main-viewport[data-rap-page="inbox-email"] .rap-route-content { max-width: 1040px; }
.rap-main-viewport[data-rap-page="sewa-nokos-mail"] .rap-route-content { max-width: 1140px; }
.rap-main-viewport[data-rap-page="order"] .rap-route-content { max-width: 1180px; }
.rap-main-viewport[data-rap-page="referral"] .rap-route-content { max-width: 1080px; }
.rap-main-viewport[data-rap-page="profil"] .rap-route-content { max-width: 1180px; }
.rap-main-viewport[data-rap-page^="admin"] .rap-route-content,
.rap-main-viewport[data-rap-page="harga-generate"] .rap-route-content { max-width: 1320px; }

.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-extraction-status] {
  padding: 15px 18px !important;
  border-radius: var(--rap-radius-md) !important;
  box-shadow: none !important;
}

.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-grid] {
  gap: 3px !important;
  margin: 12px 0 !important;
}

.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-cell] { height: 8px !important; }
.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-method] { padding: 5px 11px !important; font-size: 12px !important; }
.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-tabs] { margin-bottom: 8px !important; }
.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-summary] { padding: 9px 12px !important; border-radius: 10px !important; font-size: 13px !important; }
.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-foot] { margin-top: 9px !important; font-size: 11px !important; }
.rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-status-total] strong { font-size: 24px !important; }

@media (min-width: 1024px) {
  .rap-natural-sidebar {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    width: var(--rap-sidebar-expanded) !important;
    flex: 0 0 var(--rap-sidebar-expanded) !important;
    transform: none !important;
    transition-property: width, flex-basis !important;
  }

  .rap-natural-sidebar.community-sidebar-collapsed {
    width: var(--rap-sidebar-collapsed) !important;
    flex-basis: var(--rap-sidebar-collapsed) !important;
  }

  .community-sidebar-collapsed .community-sidebar-section {
    display: block !important;
    padding-inline: 11px;
  }

  .community-sidebar-collapsed .community-sidebar-heading,
  .community-sidebar-collapsed .community-sidebar-copy,
  .community-sidebar-collapsed .community-external-icon {
    display: none !important;
  }

  .community-sidebar-collapsed .community-sidebar-link {
    width: 48px;
    min-height: 46px;
    justify-content: center;
    margin-inline: auto;
    padding: 6px;
  }
}

@media (max-width: 1023px) {
  .rap-global-page-container { padding: 24px !important; }
  .rap-consistent-header { padding-inline: 24px !important; }
  .rap-footer-inner { padding-inline: 24px; }
}

@media (max-width: 767px) {
  .rap-global-page-container { padding: 16px 14px 92px !important; }
  .rap-consistent-header { min-height: 56px; flex-basis: 56px; padding-inline: 16px !important; }
  .rap-footer-inner { min-height: 0; align-items: flex-start; flex-direction: column; gap: 10px; padding: 14px 16px 92px; }
  .community-footer-links { width: 100%; flex-wrap: wrap; }
  .rap-main-viewport:not([data-rap-page="dashboard"]) [data-rap-extraction-status] { padding: 13px 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .rap-global-page-container *,
  .rap-natural-sidebar,
  .rap-natural-main-shell {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}