/* ==========================================================================
   RDPCore Override v3 - No all:unset, explicit !important on everything
   ========================================================================== */

/* HIGH SPECIFICITY: sidebar + navbar with HostBill compat classes */
body.template_rdpcore .sidebar.rp-sidebar {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  width: 220px !important;
  height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  background: linear-gradient(180deg, #fbfbfe 0%, #f5f4ff 100%) !important;
  border-right: 1px solid rgba(120, 100, 255, 0.06) !important;
  box-shadow: 0 2px 24px rgba(122, 92, 255, 0.04) !important;
  z-index: 40 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
  transition: none !important;
  float: none !important;
}
body.template_rdpcore .navbar.rp-navbar {
  position: sticky !important;
  top: 0 !important;
  height: 80px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 2rem !important;
  background: rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid rgba(229, 231, 235, 0.4) !important;
  z-index: 50 !important;
  margin: 0 !important;
  margin-left: 220px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  left: auto !important;
  right: auto !important;
}
/* Kill Bootstrap's fixed-top on our navbar */
body.template_rdpcore .navbar.rp-navbar.fixed-top {
  position: sticky !important;
  left: auto !important;
  right: auto !important;
  width: auto !important;
  margin-left: 220px !important;
}

/* Services dropdown inside sidebar - override HostBill nav styles */
body.template_rdpcore .rp-sidebar .nav-subnav {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.template_rdpcore .rp-sidebar .nav-subnav .nav-item {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.template_rdpcore .rp-sidebar .nav-subnav .nav-link {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 450 !important;
  color: #374151 !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
  gap: 10px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body.template_rdpcore .rp-sidebar .nav-subnav .nav-link:hover {
  color: #111827 !important;
  background: #f3f4f6 !important;
}
body.template_rdpcore .rp-sidebar .nav-subnav .nav-link .badge {
  margin-left: auto !important;
  background: #ede9fe !important;
  color: #7c3aed !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  padding: 2px 6px !important;
  border-radius: 10px !important;
  min-width: 18px !important;
  text-align: center !important;
}
body.template_rdpcore .rp-sidebar .nav-subnav .nav-link-dropdown {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 44px !important;
  padding: 0 14px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #5f637a !important;
  text-decoration: none !important;
  background: transparent !important;
  cursor: pointer !important;
}
body.template_rdpcore .rp-sidebar .nav-subnav .nav-link-dropdown:hover {
  color: #2e3145 !important;
  background: rgba(255, 255, 255, 0.4) !important;
}
body.template_rdpcore .rp-sidebar .sub-nav .nav-subnav {
  padding-left: 12px !important;
}
body.template_rdpcore .rp-sidebar .sub-nav .nav-subnav .nav-link {
  height: 38px !important;
  font-size: 13px !important;
  padding: 0 14px !important;
}

/* BODY & GLOBAL */
body.template_rdpcore {
  background: #fafbfc !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 16px !important;
  color: #2e3145 !important;
  line-height: 1.5 !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.template_rdpcore *,
body.template_rdpcore *::before,
body.template_rdpcore *::after {
  box-sizing: border-box !important;
}
body.template_rdpcore a { text-decoration: none !important; }
body.template_rdpcore a:hover { text-decoration: none !important; }

/* Layout wrappers - kill HostBill's defaults */
body.template_rdpcore .body-content {
  margin-left: 220px !important;
  padding: 0 !important;
  min-height: 100vh !important;
}
body.template_rdpcore .section-main {
  padding: 24px 28px !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
/* VPS detail page: section-main padding removed (layout handles it) */
body.template_rdpcore .section-main:has(.rp-vps-layout),
body.template_rdpcore .section-main:has(.rp-vps-breadcrumb) {
  padding: 0 !important;
}
body.template_rdpcore .main-overlay { display: none !important; }
body.template_rdpcore .sidebar-overlay { display: none !important; }
body.template_rdpcore .footer-content { margin-left: 220px !important; }

/* ==========================================================================
   SIDEBAR
   ========================================================================== */
.rp-sidebar {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  width: 220px !important;
  height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  background: #ffffff !important;
  border-right: 1px solid #e5e7eb !important;
  box-shadow: none !important;
  z-index: 40 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
}
.rp-sidebar::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 60px !important;
  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1)) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
.rp-sidebar-logo {
  height: 56px !important;
  min-height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 16px !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  border: none !important;
  position: relative !important;
  z-index: 1 !important;
}
.rp-sidebar-logo-icon {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #7b5cff, #8f6dff) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}
.rp-sidebar-brand {
  font-weight: 600 !important;
  font-size: 17px !important;
  color: #2e3145 !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
}

.rp-sidebar-nav {
  flex: 1 !important;
  padding: 8px 16px 48px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: block !important;
  position: relative !important;
}
.rp-sidebar-section {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 12px !important;
  margin-top: 28px !important;
  margin-bottom: 10px !important;
}
.rp-sidebar-section span {
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  color: #9a98b5 !important;
  line-height: 1.4 !important;
}
.rp-sidebar-item {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 38px !important;
  padding: 0 12px !important;
  border-radius: 6px !important;
  font-size: 13.5px !important;
  font-weight: 450 !important;
  color: #374151 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 1px 0 !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  gap: 11px !important;
}
.rp-sidebar-item:hover {
  color: #111827 !important;
  background: #f3f4f6 !important;
  text-decoration: none !important;
}
.rp-sidebar-item.active {
  color: #7c3aed !important;
  font-weight: 500 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.rp-sidebar-item .material-symbols-outlined {
  font-size: 18px !important;
  flex-shrink: 0 !important;
}
.rp-sidebar-item-main {
  font-size: 14px !important;
  font-weight: 500 !important;
  height: 40px !important;
  margin-bottom: 4px !important;
  margin-top: 12px !important;
  gap: 11px !important;
}
.rp-sidebar-item-main .material-symbols-outlined {
  font-size: 19px !important;
}
  margin-right: 12px !important;
  line-height: 1 !important;
}

/* ==========================================================================
   NAVBAR
   ========================================================================== */
.rp-navbar {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 80px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 32px !important;
  background: rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid rgba(229, 231, 235, 0.4) !important;
  z-index: 50 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: auto !important;
}
.rp-navbar-search {
  width: 100% !important;
  max-width: 672px !important;
  padding: 14px 24px 14px 64px !important;
  background: #ffffff !important;
  border: 1px solid rgba(229, 231, 235, 0.7) !important;
  border-radius: 24px !important;
  font-size: 15px !important;
  color: #2e3145 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02) !important;
  outline: none !important;
  transition: border-color 0.2s ease !important;
  height: auto !important;
  line-height: 1.4 !important;
}
.rp-navbar-search::placeholder { color: #9a98b5 !important; }
.rp-navbar-search:focus {
  border-color: rgba(123, 92, 255, 0.4) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04), 0 0 0 3px rgba(123,92,255,0.08) !important;
}
.rp-navbar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
}

.rp-navbar-icon {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px !important;
  border-radius: 50% !important;
  color: #4b5563 !important;
  cursor: pointer !important;
  border: none !important;
  background: transparent !important;
  transition: background 0.2s ease !important;
}
.rp-navbar-icon:hover { background: #f9fafb !important; }
.rp-navbar-badge {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  border: 2px solid #fff !important;
  display: block !important;
}
.rp-navbar-badge.on { background: #00D4AA !important; }
.rp-navbar-badge.off { background: #E5E7EB !important; }
.rp-navbar-cart {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  border-radius: 9999px !important;
  border: 1px solid #e5e7eb !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: background 0.2s ease !important;
  cursor: pointer !important;
}
.rp-navbar-cart:hover {
  background: #f9fafb !important;
  color: #111827 !important;
  text-decoration: none !important;
}
.rp-navbar-divider {
  height: 32px !important;
  width: 1px !important;
  background: #e5e7eb !important;
  margin: 0 4px !important;
  display: block !important;
}

/* Avatar & Profile */
.rp-avatar {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 50% !important;
  background: #e9e7ff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #6d4cff !important;
  line-height: 1 !important;
}
.rp-profile-btn {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 12px !important;
  border-radius: 12px !important;
  cursor: pointer !important;
  border: none !important;
  background: transparent !important;
  transition: background 0.2s ease !important;
}
.rp-profile-btn:hover { background: rgba(249, 250, 251, 0.8) !important; }

/* Dropdown Override */
.rp-dropdown {
  position: absolute !important;
  right: 0 !important;
  top: 100% !important;
  margin-top: 8px !important;
  background: #ffffff !important;
  border-radius: 16px !important;
  border: 1px solid rgba(229, 231, 235, 0.7) !important;
  overflow: hidden !important;
  z-index: 9999 !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04) !important;
  min-width: 256px !important;
  padding: 0 !important;
}
.rp-dropdown-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  margin: 0 !important;
}
.rp-dropdown-header h3 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #2e3145 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.rp-dropdown-body {
  max-height: 400px !important;
  overflow-y: auto !important;
  padding: 0 !important;
}

.rp-dropdown-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 10px 16px !important;
  text-align: left !important;
  border: none !important;
  background: transparent !important;
  text-decoration: none !important;
  color: #5f637a !important;
  font-size: 14px !important;
  transition: background 0.2s ease !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}
.rp-dropdown-item:hover {
  background: #f9fafb !important;
  color: #5f637a !important;
  text-decoration: none !important;
}
.rp-dropdown-item.danger:hover {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
.rp-dropdown-item.danger:hover .material-symbols-outlined {
  color: #dc2626 !important;
}
.rp-dropdown-item .material-symbols-outlined {
  font-size: 18px !important;
  color: #9a98b5 !important;
  flex-shrink: 0 !important;
}
.rp-dropdown-divider {
  border: none !important;
  border-top: 1px solid #f3f4f6 !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* Make Bootstrap dropdown-menu work with our styles */
body.template_rdpcore .dropdown-menu.rp-dropdown {
  border-radius: 16px !important;
  border: 1px solid rgba(229, 231, 235, 0.7) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04) !important;
  padding: 0 !important;
  margin-top: 8px !important;
}

/* ==========================================================================
   DASHBOARD
   ========================================================================== */
.rp-content {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 32px 48px !important;
  display: block !important;
}
.rp-dashboard {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 32px 24px !important;
}
.rp-stats-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  margin-bottom: 32px !important;
}
.rp-stat-card {
  display: block !important;
  background: #ffffff !important;
  border-radius: 8px !important;
  padding: 20px !important;
  border: 1px solid #e5e7eb !important;
  transition: border-color 0.2s ease !important;
  text-decoration: none !important;
  color: inherit !important;
  box-shadow: none !important;
}
.rp-stat-card:hover {
  border-color: rgba(123, 92, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
  color: inherit !important;
  text-decoration: none !important;
}
.rp-stat-icon {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-stat-icon.purple { background: #ede9fe !important; color: #7c3aed !important; }
.rp-stat-icon.green { background: #d1fae5 !important; color: #059669 !important; }
.rp-stat-icon.red { background: #fed7d7 !important; color: #dc2626 !important; }
.rp-stat-value {
  font-size: 36px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  line-height: 1.1 !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  letter-spacing: -0.5px !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
}
.rp-stat-label {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
}
.rp-stat-detail {
  font-size: 13px !important;
  color: #9ca3af !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
}

/* Cards */
.rp-card {
  display: block !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 20px !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}
.rp-card-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
  padding: 0 !important;
}
.rp-card-title {
  font-weight: 600 !important;
  color: #111827 !important;
  font-size: 15px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rp-card-title-icon {
  font-size: 18px !important;
  color: #7c3aed !important;
}
.rp-card-link {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #7c3aed !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}
.rp-card-link:hover { color: #6d28d9 !important; text-decoration: none !important; }
.rp-card-link .material-symbols-outlined { font-size: 14px !important; }

/* Service Items */
.rp-service-item {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(229, 231, 235, 0.6) !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  color: inherit !important;
  margin-bottom: 12px !important;
  cursor: pointer !important;
}
.rp-service-item:hover {
  border-color: #d1d5db !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
  text-decoration: none !important;
  color: inherit !important;
}
.rp-service-icon {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 8px !important;
  background: #ede9fe !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

/* Status Dots */
.rp-status-dot {
  width: 8px !important;
  height: 8px !important;
  min-width: 8px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
}
.rp-status-dot.online { background: #22c55e !important; }
.rp-status-dot.warning { background: #f59e0b !important; }
.rp-status-dot.offline { background: #ef4444 !important; }

/* Badges */
.rp-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  line-height: 1.4 !important;
  border: none !important;
}
.rp-badge-success { background: #f0fdf4 !important; color: #15803d !important; }
.rp-badge-warning { background: #fff7ed !important; color: #c2410c !important; }
.rp-badge-danger { background: #fef2f2 !important; color: #dc2626 !important; }
.rp-badge-neutral { background: #f3f4f6 !important; color: #4b5563 !important; }

/* Buttons */
.rp-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 32px !important;
  border-radius: 16px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.25) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
}
.rp-btn-primary:hover {
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.3) !important;
  transform: translateY(-1px) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Table inside rp-card */
.rp-card .table {
  margin: 0 !important;
  width: 100% !important;
  border-collapse: collapse !important;
}
.rp-card .table th {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  border-top: none !important;
  border-bottom: 1px solid #f3f4f6 !important;
  padding: 12px 16px !important;
  background: transparent !important;
}
.rp-card .table td {
  padding: 14px 16px !important;
  border-top: 1px solid #f9fafb !important;
  font-size: 14px !important;
  color: #374151 !important;
  vertical-align: middle !important;
  background: transparent !important;
}
.rp-card .table tbody tr:hover td {
  background: #fafafa !important;
}

/* Tab styling inside rp-card */
.rp-tab {
  display: inline-block !important;
  padding: 10px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  text-decoration: none !important;
  border-bottom: 2px solid transparent !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}
.rp-tab:hover { color: #7c3aed !important; text-decoration: none !important; }
.rp-tab.active {
  color: #7c3aed !important;
  border-bottom-color: #7c3aed !important;
}

/* Collapse sections in sidebar */
.rp-sidebar .collapse:not(.show) { display: none !important; }
.rp-sidebar .collapse.show { display: block !important; }

/* ==========================================================================
   DASHBOARD — New Components
   ========================================================================== */

/* 2FA Security Banner */
.rp-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 14px 20px !important;
  border-radius: 8px !important;
  margin-bottom: 20px !important;
  position: relative !important;
}
.rp-banner-security {
  background: linear-gradient(135deg, #f3f0ff 0%, #e8f4fd 50%, #f0fdfa 100%) !important;
  border: 1px solid #e0d4f5 !important;
}
.rp-banner-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.rp-banner-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid #7c3aed !important;
  flex-shrink: 0 !important;
}
.rp-banner-icon .material-symbols-outlined {
  font-size: 18px !important;
  color: #7c3aed !important;
}
.rp-banner-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  display: block !important;
}
.rp-banner-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 2px 0 0 !important;
}
.rp-banner-right {
  display: flex !important;
  align-items: flex-end !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
  margin-right: 32px !important;
  align-self: flex-end !important;
}
.rp-banner-action {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #7c3aed !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
.rp-banner-action:hover { color: #6d28d9 !important; text-decoration: none !important; }
.rp-banner-dismiss {
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 8px !important;
  color: #9ca3af !important;
  border-radius: 6px !important;
  position: absolute !important;
  top: 8px !important;
  right: 10px !important;
  z-index: 10 !important;
}
.rp-banner-dismiss:hover { color: #6b7280 !important; background: rgba(0,0,0,0.05) !important; }
.rp-banner-dismiss .material-symbols-outlined { font-size: 18px !important; }

/* Stat icon color variants */
.rp-stat-icon-purple { background: #ede9fe !important; color: #7c3aed !important; }
.rp-stat-icon-green { background: #d1fae5 !important; color: #059669 !important; }
.rp-stat-icon-orange { background: #ffedd5 !important; color: #ea580c !important; }
.rp-stat-icon-blue { background: #dbeafe !important; color: #2563eb !important; }

/* Stat value color variants */
.rp-stat-value-danger { color: #dc2626 !important; }
.rp-stat-value-success { color: #10b981 !important; }
.rp-stat-warning { color: #ea580c !important; font-weight: 500 !important; }

/* Stat card inner layout */
.rp-stat-body { flex: 1 !important; }
.rp-stat-card > div { display: flex !important; align-items: flex-start !important; gap: 16px !important; }

/* Dashboard main layout (infrastructure + quick actions) */
.rp-dashboard-main {
  display: grid !important;
  grid-template-columns: 1fr 320px !important;
  gap: 24px !important;
  margin-bottom: 32px !important;
}

/* Dashboard bottom row (tickets + billing + domains) */
.rp-dashboard-bottom {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  margin-bottom: 32px !important;
}
.rp-dashboard-bottom-3col {
  grid-template-columns: 1fr 1fr 1fr !important;
}

/* Domain Overview items */
.rp-domain-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 12px !important;
  text-decoration: none !important;
  color: inherit !important;
  border-bottom: 1px solid #f3f4f6 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
}
.rp-domain-item:last-child { border-bottom: none !important; }
.rp-domain-item:hover { text-decoration: none !important; color: inherit !important; background: #f9fafb !important; }
.rp-domain-item-info { flex: 1 !important; min-width: 0 !important; }
.rp-domain-item-name {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #111827 !important;
}
.rp-domain-item-expires {
  display: block !important;
  font-size: 11px !important;
  color: #9ca3af !important;
  margin-top: 2px !important;
}
.rp-domain-item-right {
  text-align: right !important;
  flex-shrink: 0 !important;
}
.rp-domain-item-price {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin-bottom: 2px !important;
}

/* Infrastructure table */
.rp-infra-tabs {
  display: flex !important;
  gap: 4px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid #e5e7eb !important;
  margin-bottom: 0 !important;
  overflow-x: auto !important;
}
.rp-infra-tab {
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.15s !important;
}
.rp-infra-tab:hover {
  color: #374151 !important;
  background: #f3f4f6 !important;
}
.rp-infra-tab-active {
  color: #7c3aed !important;
  background: transparent !important;
  border-color: transparent !important;
  font-weight: 600 !important;
}
.rp-infra-tab-active:hover {
  color: #7c3aed !important;
  background: #f3f4f6 !important;
}
.rp-infra-table {
  width: 100% !important;
  border-collapse: collapse !important;
}
.rp-infra-table thead th {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #9ca3af !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid #e5e7eb !important;
  text-align: left !important;
  background: #f9fafb !important;
}
.rp-infra-table thead th:nth-child(2) {
  text-align: center !important;
}
.rp-infra-table thead th:nth-child(3),
.rp-infra-table thead th:nth-child(4) {
  text-align: center !important;
}
.rp-infra-table tbody tr {
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-infra-table tbody tr:last-child { border-bottom: none !important; }
.rp-infra-table tbody tr:hover { background: #f9fafb !important; }
.rp-infra-table tbody td {
  padding: 12px 12px !important;
  font-size: 13px !important;
  color: #374151 !important;
  vertical-align: middle !important;
}
.rp-infra-table tbody td:nth-child(2) {
  text-align: center !important;
}
.rp-infra-table tbody td:nth-child(3),
.rp-infra-table tbody td:nth-child(4) {
  text-align: center !important;
}
.rp-infra-service-link {
  text-decoration: none !important;
  color: #111827 !important;
  font-weight: 500 !important;
  display: block !important;
}
.rp-infra-service-link:hover { color: #7c3aed !important; }
.rp-infra-cat {
  display: block !important;
  font-size: 11px !important;
  color: #9ca3af !important;
  font-weight: 400 !important;
  margin-top: 2px !important;
}
.rp-infra-domain {
  color: #6b7280 !important;
  font-size: 13px !important;
}
.rp-infra-date {
  color: #6b7280 !important;
  font-size: 13px !important;
}
.rp-infra-actions {
  width: 40px !important;
  text-align: right !important;
}
.rp-infra-menu {
  position: relative !important;
  display: inline-block !important;
}
.rp-infra-menu-btn {
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 4px !important;
  border-radius: 4px !important;
  color: #9ca3af !important;
}
.rp-infra-menu-btn:hover { background: #f3f4f6 !important; color: #374151 !important; }
.rp-infra-menu-btn .material-symbols-outlined { font-size: 18px !important; }
.rp-infra-dropdown {
  position: absolute !important;
  right: 0 !important;
  top: 100% !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
  z-index: 10 !important;
  min-width: 160px !important;
  padding: 4px !important;
}
.rp-infra-dropdown a {
  display: block !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  color: #374151 !important;
  text-decoration: none !important;
  border-radius: 6px !important;
  text-align: left !important;
}
.rp-infra-dropdown a:hover { background: #f3f4f6 !important; color: #111827 !important; }
.rp-infra-status {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}
.rp-infra-status-online { background: #22c55e !important; }
.rp-infra-status-offline { background: #ef4444 !important; }
.rp-infra-status-pending { background: #f59e0b !important; }
.rp-infra-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  background: #f3f4f6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-infra-icon .material-symbols-outlined { font-size: 16px !important; color: #6b7280 !important; }
.rp-infra-info {
  flex: 1 !important;
  min-width: 0 !important;
}
.rp-infra-name {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
}
.rp-infra-detail {
  display: block !important;
  font-size: 12px !important;
  color: #9ca3af !important;
}
.rp-infra-badge {
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}
.rp-infra-badge-online { background: #f0fdf4 !important; color: #15803d !important; }
.rp-infra-badge-offline { background: #fef2f2 !important; color: #dc2626 !important; }
.rp-infra-badge-pending { background: #fff7ed !important; color: #c2410c !important; }

/* Quick Actions */
.rp-action-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.15s !important;
  border: 1px solid #e5e7eb !important;
  margin: 0 0 8px !important;
  background: #ffffff !important;
}
.rp-action-item:last-child { margin-bottom: 0 !important; }
.rp-action-item:hover { background: #f9fafb !important; border-color: #d1d5db !important; text-decoration: none !important; color: inherit !important; }
.rp-action-info { flex: 1 !important; min-width: 0 !important; }
.rp-action-name {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #111827 !important;
  line-height: 1.4 !important;
}
.rp-action-desc {
  display: block !important;
  font-size: 11px !important;
  color: #9ca3af !important;
  margin-top: 2px !important;
  line-height: 1.3 !important;
}

/* Ticket items */
.rp-ticket-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 12px !important;
  text-decoration: none !important;
  color: inherit !important;
  border-bottom: 1px solid #f3f4f6 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
}
.rp-ticket-item:last-child { border-bottom: none !important; }
.rp-ticket-item:hover { text-decoration: none !important; color: inherit !important; background: #f9fafb !important; }
.rp-ticket-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  background: #ede9fe !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-ticket-icon .material-symbols-outlined { font-size: 14px !important; color: #7c3aed !important; }
.rp-ticket-info { flex: 1 !important; min-width: 0 !important; }
.rp-ticket-title { font-size: 13px !important; font-weight: 600 !important; color: #111827 !important; display: block !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.rp-ticket-date { font-size: 11px !important; color: #9ca3af !important; display: block !important; margin-top: 2px !important; }
.rp-item-arrow { font-size: 16px !important; color: #d1d5db !important; margin-left: 4px !important; }

/* Invoice items */
.rp-invoice-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 12px !important;
  text-decoration: none !important;
  color: inherit !important;
  border-bottom: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
  background: #ffffff !important;
}
.rp-invoice-item:last-child { border-bottom: none !important; }
.rp-invoice-item:hover { text-decoration: none !important; color: inherit !important; background: #f8fafc !important; }
.rp-invoice-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  background: #ede9fe !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-invoice-icon .material-symbols-outlined { font-size: 16px !important; color: #7c3aed !important; }
.rp-invoice-info { flex: 1 !important; min-width: 0 !important; }
.rp-invoice-number { font-size: 13px !important; font-weight: 600 !important; color: #111827 !important; display: block !important; }
.rp-invoice-date { font-size: 11px !important; color: #9ca3af !important; display: block !important; }
.rp-invoice-right { text-align: right !important; flex-shrink: 0 !important; }
.rp-invoice-amount { font-size: 13px !important; font-weight: 600 !important; color: #111827 !important; display: block !important; margin-bottom: 2px !important; }

/* Empty states */
.rp-empty-state {
  text-align: center !important;
  padding: 40px 20px !important;
}
.rp-empty-icon { font-size: 48px !important; color: #d1d5db !important; display: block !important; margin-bottom: 12px !important; }
.rp-empty-state p { font-size: 14px !important; color: #9ca3af !important; margin: 0 0 16px !important; }
.rp-empty-state-sm {
  text-align: center !important;
  padding: 24px 16px !important;
  color: #9ca3af !important;
}
.rp-empty-state-sm .material-symbols-outlined { font-size: 32px !important; color: #d1d5db !important; display: block !important; margin: 0 auto 8px !important; }
.rp-empty-state-sm p { font-size: 13px !important; margin: 0 !important; }

/* Small button variant */
.rp-btn-sm { padding: 8px 20px !important; font-size: 13px !important; border-radius: 10px !important; }

/* Hidden utility — class toggle ile JS'ten kontrol edilir */
.rp-hidden { display: none !important; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1200px) {
  .rp-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .rp-dashboard-main { grid-template-columns: 1fr !important; }
}
@media (max-width: 1024px) {
  body.template_rdpcore .navbar.rp-navbar,
  body.template_rdpcore .navbar.rp-navbar.fixed-top { margin-left: 0 !important; }
  body.template_rdpcore .body-content { margin-left: 0 !important; }
  body.template_rdpcore .footer-content { margin-left: 0 !important; }
  .rp-dashboard-bottom { grid-template-columns: 1fr !important; }
  .rp-dashboard-bottom-3col { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  .rp-stats-grid { grid-template-columns: 1fr !important; }
  .rp-navbar { padding: 0 16px !important; height: 64px !important; }
  .rp-content { padding: 16px !important; }
  .rp-card { padding: 16px !important; }
  .rp-banner { flex-direction: column !important; align-items: flex-start !important; }
  .rp-banner-right { width: 100% !important; justify-content: flex-end !important; }
}

/* ==========================================================================
   UTILITY: HostBill compatibility fixes
   ========================================================================== */
/* Ensure HostBill's JS-driven dropdowns still work */
body.template_rdpcore .dropdown-menu {
  display: none;
}
body.template_rdpcore .dropdown-menu.show,
body.template_rdpcore .show > .dropdown-menu {
  display: block !important;
}
/* HostBill search results dropdown */
body.template_rdpcore .navbar-search-results.show {
  display: block !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin-top: 4px !important;
  background: #fff !important;
  border-radius: 16px !important;
  border: 1px solid rgba(229,231,235,0.7) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
  z-index: 9999 !important;
  padding: 8px 0 !important;
}
/* Hide HostBill's default sidebar toggle behavior */
body.template_rdpcore .sidebar.toggled { width: 220px !important; }

/* Services dropdown inside sidebar - override HostBill's default dropdown styling */
.rp-sidebar .collapse .nav-subnav,
.rp-sidebar .collapse ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.rp-sidebar .collapse .nav-subnav .nav-item,
.rp-sidebar .collapse ul li {
  margin: 0 !important;
  padding: 0 !important;
}
.rp-sidebar .collapse .nav-subnav .nav-link,
.rp-sidebar .collapse .nav-subnav a,
.rp-sidebar .collapse ul li a {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 44px !important;
  padding: 0 14px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #5f637a !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 2px 0 !important;
}
.rp-sidebar .collapse .nav-subnav .nav-link:hover,
.rp-sidebar .collapse .nav-subnav a:hover,
.rp-sidebar .collapse ul li a:hover {
  color: #2e3145 !important;
  background: rgba(255, 255, 255, 0.4) !important;
}
.rp-sidebar .collapse .nav-subnav .nav-link.active,
.rp-sidebar .collapse .nav-subnav a.active {
  color: #6d4cff !important;
  background: linear-gradient(90deg, rgba(122,92,255,0.16), rgba(122,92,255,0.08)) !important;
}
.rp-sidebar .collapse .badge {
  font-size: 10px !important;
  padding: 2px 6px !important;
  border-radius: 10px !important;
  margin-left: 8px !important;
}

/* Fix: Ensure collapse works in sidebar */
.rp-sidebar .collapse:not(.show) {
  display: none !important;
}
.rp-sidebar .collapse.show {
  display: block !important;
}







/* Sidebar collapse arrow rotation */
.rp-sidebar .rp-sidebar-section [data-toggle="collapse"] .material-symbols-outlined {
  transition: transform 0.2s ease !important;
  display: inline-block !important;
}
.rp-sidebar .rp-sidebar-section [data-toggle="collapse"]:not(.collapsed) .material-symbols-outlined {
  transform: rotate(90deg) !important;
}
.rp-sidebar .rp-sidebar-section [data-toggle="collapse"].collapsed .material-symbols-outlined {
  transform: rotate(0deg) !important;
}


/* ==========================================================================
   SIDEBAR COLLAPSE TOGGLE (Logo yanındaki ok)
   ========================================================================== */

/* Toggle button hover */
#rp-sidebar-toggle:hover {
  background: rgba(122, 92, 255, 0.12) !important;
  border-color: rgba(120, 100, 255, 0.35) !important;
  box-shadow: 0 2px 8px rgba(122, 92, 255, 0.18) !important;
}

/* Collapsed state: sidebar shrinks to 72px */
body.template_rdpcore .sidebar.rp-sidebar.rp-collapsed {
  width: 72px !important;
}
body.template_rdpcore.rp-body-collapsed .body-content {
  margin-left: 72px !important;
}
body.template_rdpcore.rp-body-collapsed .navbar.rp-navbar,
body.template_rdpcore.rp-body-collapsed .navbar.rp-navbar.fixed-top {
  margin-left: 72px !important;
}
body.template_rdpcore.rp-body-collapsed .footer-content {
  margin-left: 72px !important;
}

/* Collapsed: hide logo link */
.rp-sidebar.rp-collapsed .rp-sidebar-logo a {
  display: none !important;
}
/* Collapsed: center toggle button */
.rp-sidebar.rp-collapsed .rp-sidebar-logo {
  justify-content: center !important;
  padding: 0 !important;
}

/* Collapsed: rotate the chevron icon 180deg */
.rp-sidebar.rp-collapsed #rp-sidebar-toggle .material-symbols-outlined {
  transform: rotate(180deg) !important;
}

/* Collapsed: hide section headers */
.rp-sidebar.rp-collapsed .rp-sidebar-section {
  display: none !important;
}

/* Collapsed: hide collapse groups */
.rp-sidebar.rp-collapsed .collapse,
.rp-sidebar.rp-collapsed .collapse.show {
  display: none !important;
}

/* Collapsed: hide language section */
.rp-sidebar.rp-collapsed .d-lg-none {
  display: none !important;
}

/* Collapsed: menu items become icon-only */
.rp-sidebar.rp-collapsed .rp-sidebar-item {
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  justify-content: center !important;
  border-radius: 12px !important;
  margin: 4px auto !important;
  font-size: 0 !important;
}
.rp-sidebar.rp-collapsed .rp-sidebar-item .material-symbols-outlined {
  margin-right: 0 !important;
  font-size: 20px !important;
}

/* Collapsed: nav padding */
.rp-sidebar.rp-collapsed .rp-sidebar-nav {
  padding: 8px 12px 16px !important;
}

/* Smooth transitions */
body.template_rdpcore .sidebar.rp-sidebar {
  transition: width 0.25s ease !important;
}
body.template_rdpcore .body-content {
  transition: margin-left 0.25s ease !important;
}
body.template_rdpcore .navbar.rp-navbar {
  transition: margin-left 0.25s ease !important;
}
body.template_rdpcore .footer-content {
  transition: margin-left 0.25s ease !important;
}

/* HostBill toggled class override for collapsed state */
body.template_rdpcore .sidebar.rp-sidebar.toggled.rp-collapsed {
  width: 72px !important;
}

/* Responsive: collapsed state on mobile handled in MOBILE RESPONSIVE section */


/* ==========================================================================
   SEARCH RESULTS DROPDOWN (Semantic UI Search - HostBill)
   ========================================================================== */

/* Container */
body.template_rdpcore .navbar-search-results.show,
body.template_rdpcore .dropdown-menu.navbar-search-results.show {
  display: block !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin-top: 8px !important;
  background: #ffffff !important;
  border-radius: 20px !important;
  border: 1px solid rgba(229, 231, 235, 0.7) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  z-index: 9999 !important;
  padding: 12px 0 !important;
  max-height: 420px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
/* Hide when empty */
body.template_rdpcore .navbar-search-results.show:empty,
body.template_rdpcore .dropdown-menu.navbar-search-results.show:empty {
  display: none !important;
}

/* Custom scrollbar */
body.template_rdpcore .navbar-search-results::-webkit-scrollbar {
  width: 6px !important;
}
body.template_rdpcore .navbar-search-results::-webkit-scrollbar-track {
  background: transparent !important;
}
body.template_rdpcore .navbar-search-results::-webkit-scrollbar-thumb {
  background: #e5e7eb !important;
  border-radius: 3px !important;
}

/* Category name (Accounts, Domains, etc.) */
body.template_rdpcore .navbar-search-results .category > .name,
body.template_rdpcore .navbar-search-results .name,
body.template_rdpcore .navbar-search-results h6,
body.template_rdpcore .navbar-search-results .dropdown-header {
  display: block !important;
  padding: 8px 20px 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #9a98b5 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  background: transparent !important;
  margin: 0 !important;
  border: none !important;
  line-height: 1.4 !important;
}

/* Result items */
body.template_rdpcore .navbar-search-results .result,
body.template_rdpcore .navbar-search-results a,
body.template_rdpcore .navbar-search-results .dropdown-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 16px !important;
  margin: 2px 8px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #2e3145 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  border: none !important;
  border-radius: 12px !important;
  cursor: pointer !important;
  min-height: 48px !important;
  line-height: 1.4 !important;
  background: transparent !important;
}
body.template_rdpcore .navbar-search-results .result:hover,
body.template_rdpcore .navbar-search-results a:hover,
body.template_rdpcore .navbar-search-results .dropdown-item:hover {
  background: linear-gradient(90deg, rgba(122,92,255,0.06), rgba(122,92,255,0.02)) !important;
  color: #6d4cff !important;
  text-decoration: none !important;
}
body.template_rdpcore .navbar-search-results .result.active,
body.template_rdpcore .navbar-search-results a.active,
body.template_rdpcore .navbar-search-results .dropdown-item.active {
  background: linear-gradient(90deg, rgba(122,92,255,0.12), rgba(122,92,255,0.04)) !important;
  color: #6d4cff !important;
}

/* Result title text */
body.template_rdpcore .navbar-search-results .result .content .title,
body.template_rdpcore .navbar-search-results .result .title {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: inherit !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Result description if any */
body.template_rdpcore .navbar-search-results .result .content .description,
body.template_rdpcore .navbar-search-results .result .description {
  font-size: 12px !important;
  color: #9a98b5 !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
}

/* Add a subtle left icon indicator via ::before */
body.template_rdpcore .navbar-search-results .result::before,
body.template_rdpcore .navbar-search-results .results > a::before {
  content: '' !important;
  display: block !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 8px !important;
  background: rgba(237, 233, 254, 0.7) !important;
  flex-shrink: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3' width='20' height='14' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='8' y1='21' x2='16' y2='21'%3E%3C/line%3E%3Cline x1='12' y1='17' x2='12' y2='21'%3E%3C/line%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 16px !important;
}

/* Category divider between groups */
body.template_rdpcore .navbar-search-results .category + .category {
  border-top: 1px solid #f3f4f6 !important;
  margin-top: 8px !important;
  padding-top: 4px !important;
}

/* "No results" message */
body.template_rdpcore .navbar-search-results .message,
body.template_rdpcore .navbar-search-results .message .header {
  padding: 24px 20px !important;
  text-align: center !important;
  color: #9a98b5 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  background: transparent !important;
  border: none !important;
}

/* Dividers */
body.template_rdpcore .navbar-search-results .divider,
body.template_rdpcore .navbar-search-results .dropdown-divider {
  border: none !important;
  border-top: 1px solid #f3f4f6 !important;
  margin: 8px 0 !important;
  padding: 0 !important;
}

/* Override any Semantic UI default image/icon */
body.template_rdpcore .navbar-search-results .result .image,
body.template_rdpcore .navbar-search-results .result img {
  display: none !important;
}


/* ==========================================================================
   FOOTER: Hide completely in customer area
   ========================================================================== */
body.template_rdpcore .footer-content,
body.template_rdpcore .footer-content.rdpcore-footer {
  display: none !important;
}


/* ==========================================================================
   AUTH PAGES (Login, Signup, Password Reset) - Split Layout
   ========================================================================== */
.rp-auth-wrapper {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  min-height: calc(100vh - 60px) !important;
  padding: 20px 32px 0 !important;
  background: #f0f0f5 !important;
  flex-wrap: wrap !important;
  align-content: center !important;
  gap: 0 !important;
  margin-top: -5px !important;
}

/* Left Panel - Brand */
.rp-auth-left {
  width: 480px !important;
  align-self: stretch !important;
  padding: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border-radius: 16px 0 0 16px !important;
  position: relative !important;
  overflow: hidden !important;
}
.rp-auth-left::before {
  content: '' !important;
  position: absolute !important;
  top: -50% !important;
  right: -30% !important;
  width: 80% !important;
  height: 200% !important;
  background: radial-gradient(ellipse, rgba(123,92,255,0.15) 0%, transparent 70%) !important;
  pointer-events: none !important;
}
.rp-auth-left-content {
  position: relative !important;
  z-index: 1 !important;
}
.rp-auth-left-logo {
  height: 36px !important;
  width: auto !important;
  margin-bottom: 48px !important;
  filter: brightness(0) invert(1) !important;
}
.rp-auth-left-title {
  font-family: 'Manrope', sans-serif !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1.3 !important;
  margin: 0 0 16px !important;
}
.rp-auth-left-desc {
  font-size: 15px !important;
  color: rgba(255,255,255,0.7) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  max-width: 360px !important;
}
.rp-auth-left-features {
  display: flex !important;
  gap: 24px !important;
  position: relative !important;
  z-index: 1 !important;
}
.rp-auth-feature {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: rgba(255,255,255,0.85) !important;
}
.rp-auth-feature .material-symbols-outlined {
  font-size: 20px !important;
  color: #a78bfa !important;
}
.rp-auth-feature strong {
  font-size: 12px !important;
  font-weight: 600 !important;
  display: block !important;
}
.rp-auth-feature small {
  font-size: 11px !important;
  color: rgba(255,255,255,0.5) !important;
}

/* Right Panel - Form */
.rp-auth-right {
  width: 480px !important;
  align-self: stretch !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 48px 40px !important;
  background: #ffffff !important;
  border-radius: 0 16px 16px 0 !important;
  box-shadow: 4px 4px 32px rgba(0,0,0,0.06) !important;
}
.rp-auth-card {
  width: 100% !important;
  max-width: 420px !important;
}
.rp-auth-title {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #2e3145 !important;
  text-align: center !important;
  margin: 0 0 12px !important;
  font-family: 'Manrope', sans-serif !important;
}
.rp-auth-divider {
  width: 40px !important;
  height: 3px !important;
  background: #7b5cff !important;
  border-radius: 2px !important;
  margin: 0 auto 12px !important;
}
.rp-auth-subtitle {
  font-size: 14px !important;
  color: #9a98b5 !important;
  text-align: center !important;
  margin: 0 0 32px !important;
}
.rp-auth-field {
  margin-bottom: 20px !important;
}
.rp-auth-field label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #5f637a !important;
  margin-bottom: 6px !important;
}
.rp-auth-input-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}
.rp-auth-input-icon {
  position: absolute !important;
  left: 14px !important;
  font-size: 18px !important;
  color: #c4c6cc !important;
  pointer-events: none !important;
}
.rp-auth-input-wrap input,
.rp-auth-field input {
  width: 100% !important;
  padding: 13px 16px 13px 44px !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  color: #2e3145 !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
  outline: none !important;
}
.rp-auth-field input:not(.rp-auth-input-wrap input) {
  padding-left: 16px !important;
}
.rp-auth-input-wrap input::placeholder,
.rp-auth-field input::placeholder {
  color: #c4c6cc !important;
}
.rp-auth-input-wrap input:focus,
.rp-auth-field input:focus {
  border-color: #7b5cff !important;
  box-shadow: 0 0 0 3px rgba(123, 92, 255, 0.08) !important;
}
.rp-auth-remember-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 24px !important;
}
.rp-auth-checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: #5f637a !important;
  cursor: pointer !important;
  font-weight: 500 !important;
}
.rp-auth-checkbox input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: #7b5cff !important;
  padding: 0 !important;
}
.rp-auth-forgot {
  font-size: 13px !important;
  color: #7b5cff !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.rp-auth-forgot:hover {
  color: #5d3fd3 !important;
}
.rp-auth-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  padding: 14px 24px !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7b5cff, #6d4cff) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 12px rgba(123, 92, 255, 0.3) !important;
}
.rp-auth-btn:hover {
  box-shadow: 0 6px 20px rgba(123, 92, 255, 0.4) !important;
  transform: translateY(-1px) !important;
}

/* "or" divider */
.rp-auth-or {
  text-align: center !important;
  margin: 24px 0 !important;
  position: relative !important;
}
.rp-auth-or::before {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: #e5e7eb !important;
}
.rp-auth-or span {
  position: relative !important;
  background: #f8f9fc !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  color: #9a98b5 !important;
  font-weight: 500 !important;
}

/* Social login area */
.rp-auth-social {
  margin-top: 0 !important;
}
.rp-auth-social:empty {
  display: none !important;
}
.rp-auth-social a,
.rp-auth-social button,
.rp-auth-social .btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #2e3145 !important;
  background: #ffffff !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  margin-bottom: 10px !important;
}
.rp-auth-social a:hover,
.rp-auth-social button:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
}
.rp-auth-social img {
  width: 20px !important;
  height: 20px !important;
}

/* Footer text */
.rp-auth-footer-text {
  text-align: center !important;
  margin-top: 24px !important;
  font-size: 14px !important;
  color: #9a98b5 !important;
}
.rp-auth-footer-text a {
  color: #7b5cff !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.rp-auth-footer-text a:hover {
  color: #5d3fd3 !important;
}

/* Responsive */
@media (max-width: 900px) {
  .rp-auth-left { display: none !important; }
  .rp-auth-right {
    border-radius: 16px !important;
    max-width: 480px !important;
    padding: 32px 24px !important;
  }
  .rp-auth-wrapper { padding: 16px !important; }
}
@media (max-width: 480px) {
  .rp-auth-card { max-width: 100% !important; }
  .rp-auth-right { padding: 24px 16px !important; border-radius: 20px !important; }
}


/* ==========================================================================
   AUTH PAGES: Hide sidebar & navbar when not logged in
   ========================================================================== */
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .sidebar,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .rp-sidebar,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .navbar,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .rp-navbar,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .rdpcore-navbar,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .d-lg-none,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .navbar.fixed-top {
  display: none !important;
}
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .body-content {
  margin-left: 0 !important;
}
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .section-main {
  padding: 0 !important;
  margin: 0 !important;
}


/* Auth page bottom footer */
.rp-auth-bottom-footer {
  position: relative !important;
  width: 100% !important;
  flex-basis: 100% !important;
  text-align: center !important;
  padding: 16px 0 0 !important;
  margin-top: -10px !important;
  font-size: 13px !important;
  color: #9a98b5 !important;
  background: transparent !important;
  border: none !important;
}
.rp-auth-bottom-footer a {
  color: #7b5cff !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-left: 16px !important;
}
.rp-auth-bottom-footer a:hover {
  color: #5d3fd3 !important;
}


/* Fix: Auth page body background must match wrapper */
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) {
  background: #f0f0f5 !important;
}
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .body-content {
  background: #f0f0f5 !important;
}
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .section-main {
  background: #f0f0f5 !important;
}


/* Login hero image */
.rp-auth-hero-img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 16px 0 0 16px !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* Gradient overlay on login hero image */
.rp-auth-left-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(to right, rgba(26,10,62,0.1) 0%, rgba(26,10,62,0.4) 50%, rgba(26,10,62,0.85) 100%) !important;
  border-radius: 16px 0 0 16px !important;
  pointer-events: none !important;
}

/* Logo on top of the hero image */
.rp-auth-left-logo-overlay {
  position: absolute !important;
  top: 32px !important;
  left: 32px !important;
  height: 32px !important;
  width: auto !important;
  filter: brightness(0) invert(1) !important;
  z-index: 2 !important;
}


/* Text on top of login hero */
.rp-auth-left-text {
  position: absolute !important;
  bottom: 40px !important;
  left: 24px !important;
  right: 24px !important;
  z-index: 2 !important;
  background: rgba(0,0,0,0.25) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-radius: 12px !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
}
.rp-auth-left-text h2 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  line-height: 1.5 !important;
  margin: 0 0 6px !important;
}
.rp-auth-left-text p {
  font-size: 12px !important;
  color: rgba(255,255,255,0.6) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}


/* Ensure PNotify popups are visible on auth pages */
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .ui-pnotify,
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) [class*="pnotify"],
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .alert {
  display: none !important;
}


/* ==========================================================================
   SIGNUP PAGE - Minimal styling (keep original layout, just soften corners)
   ========================================================================== */
.rp-signup-card {
  width: 100% !important;
  max-width: 680px !important;
  background: #ffffff !important;
  border-radius: 16px !important;
  padding: 40px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.06) !important;
  border: 1px solid rgba(229,231,235,0.5) !important;
}
.rp-signup-fields .form-control,
.rp-signup-fields select {
  border-radius: 10px !important;
  border: 1.5px solid #e5e7eb !important;
  transition: border-color 0.2s ease !important;
}
.rp-signup-fields .form-control:focus,
.rp-signup-fields select:focus {
  border-color: #7b5cff !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
}
.rp-signup-fields .iti {
  width: 100% !important;
}
.rp-auth-wrapper-center {
  justify-content: center !important;
  align-items: center !important;
  align-content: center !important;
}
@media (max-width: 640px) {
  .rp-signup-card {
    padding: 24px 16px !important;
    max-width: 100% !important;
  }
}


/* ==========================================================================
   FLOATING LABELS (HostBill form-label-group - replaces app.min.css)
   ========================================================================== */
.form-label-group {
  position: relative !important;
  margin-bottom: 16px !important;
}
.form-label-group > .form-control,
.form-label-group > input,
.form-label-group > select {
  height: 48px !important;
  padding: 12px 14px !important;
  border-radius: 10px !important;
  border: 1.5px solid #e5e7eb !important;
  font-size: 14px !important;
  background: #fff !important;
  width: 100% !important;
}
.form-label-group > .form-control:focus,
.form-label-group > input:focus,
.form-label-group > select:focus {
  border-color: #7b5cff !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
  outline: none !important;
}
.form-label-group > .form-label-placeholder {
  position: absolute !important;
  top: 0 !important;
  left: 14px !important;
  display: block !important;
  width: auto !important;
  height: 48px !important;
  line-height: 48px !important;
  font-size: 14px !important;
  color: #9a98b5 !important;
  pointer-events: none !important;
  transition: all 0.15s ease !important;
  margin: 0 !important;
  padding: 0 !important;
  font-weight: 400 !important;
}
.form-label-group > .form-control:focus ~ .form-label-placeholder,
.form-label-group > .form-control:not(:placeholder-shown) ~ .form-label-placeholder,
.form-label-group > select ~ .form-label-placeholder,
.form-label-group > input:not([value=""]) ~ .form-label-placeholder {
  top: -8px !important;
  left: 10px !important;
  height: auto !important;
  line-height: 1 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #7b5cff !important;
  background: #fff !important;
  padding: 0 4px !important;
}
/* Phone number field (intl-tel-input) */
.form-label-group .iti,
.form-group .iti {
  width: 100% !important;
  display: block !important;
}
.form-label-group .iti input,
.form-group .iti input {
  width: 100% !important;
  height: 48px !important;
  padding: 12px 14px 12px 90px !important;
  border-radius: 10px !important;
  border: 1.5px solid #e5e7eb !important;
  font-size: 14px !important;
}
.form-label-group .iti input:focus,
.form-group .iti input:focus {
  border-color: #7b5cff !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
  outline: none !important;
}
/* Password strength meter */
.form-label-group .progress,
.form-group .progress {
  height: 4px !important;
  border-radius: 2px !important;
  margin-top: 4px !important;
}
/* Form group (non-floating) */
.form-signup .form-group {
  margin-bottom: 16px !important;
}
.form-signup .form-group label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #5f637a !important;
  margin-bottom: 4px !important;
}
/* Submit button override */
.form-signup .btn-primary {
  background: linear-gradient(135deg, #7b5cff, #6d4cff) !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 32px !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 12px rgba(123,92,255,0.3) !important;
  width: auto !important;
  min-width: 160px !important;
}
.form-signup .btn-primary:hover {
  box-shadow: 0 6px 20px rgba(123,92,255,0.4) !important;
  transform: translateY(-1px) !important;
}


/* Hide floating label when input has placeholder text */
.form-label-group > .form-control[placeholder]:not([placeholder=""]) ~ .form-label-placeholder {
  display: none !important;
}


/* MFA verification form styling */
.rp-mfa-form .form-control,
.rp-mfa-form input[type="text"],
.rp-mfa-form input[type="password"] {
  width: 100% !important;
  padding: 13px 16px !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 12px !important;
  font-size: 18px !important;
  letter-spacing: 4px !important;
  text-align: center !important;
  color: #2e3145 !important;
  transition: border-color 0.2s ease !important;
  outline: none !important;
}
.rp-mfa-form .form-control:focus,
.rp-mfa-form input:focus {
  border-color: #7b5cff !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
}
.rp-mfa-form .btn-primary,
.rp-mfa-form button[type="submit"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 14px 24px !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7b5cff, #6d4cff) !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(123,92,255,0.3) !important;
  margin-top: 16px !important;
}
.rp-mfa-form .btn-primary:hover,
.rp-mfa-form button[type="submit"]:hover {
  box-shadow: 0 6px 20px rgba(123,92,255,0.4) !important;
  transform: translateY(-1px) !important;
}
.rp-mfa-form label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #5f637a !important;
  margin-bottom: 8px !important;
  display: block !important;
}


/* MFA verify page: hide "Login" heading from module template */
.rp-mfa-form h1,
.rp-mfa-form h2,
.rp-mfa-form h3,
.rp-mfa-form .panel-heading,
.rp-mfa-form .card-header {
  display: none !important;
}

/* MFA verify page: style logout link */
.rp-mfa-form a[href*="logout"] {
  display: block !important;
  text-align: center !important;
  margin-top: 16px !important;
  font-size: 13px !important;
  color: #9a98b5 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.rp-mfa-form a[href*="logout"]:hover {
  color: #dc2626 !important;
}


/* ==========================================================================
   PNOTIFY POPUP STYLES (replaces app.min.css PNotify)
   ========================================================================== */
.ui-pnotify {
  top: 24px !important;
  right: 24px !important;
  width: 380px !important;
  max-width: calc(100vw - 48px) !important;
}
.ui-pnotify .ui-pnotify-container {
  padding: 14px 18px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}
.ui-pnotify .ui-pnotify-text {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
.ui-pnotify .ui-pnotify-title {
  font-weight: 600 !important;
  margin: 0 0 2px !important;
  font-size: 14px !important;
}
/* Error type - same as login .rp-auth-alert-error */
.ui-pnotify [class*="error"] .ui-pnotify-container,
.ui-pnotify [class*="error"].ui-pnotify-container,
.ui-pnotify .alert-danger,
.ui-pnotify-container[class*="error"] {
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border: 1px solid #fecaca !important;
}
.ui-pnotify [class*="error"] .ui-pnotify-text,
.ui-pnotify .alert-danger .ui-pnotify-text,
[class*="error"] .ui-pnotify-text {
  color: #dc2626 !important;
}
.ui-pnotify [class*="error"] .ui-pnotify-title,
.ui-pnotify .alert-danger .ui-pnotify-title,
[class*="error"] .ui-pnotify-title {
  color: #dc2626 !important;
}
/* Info/Success type - green version */
.ui-pnotify [class*="info"] .ui-pnotify-container,
.ui-pnotify [class*="success"] .ui-pnotify-container,
.ui-pnotify [class*="info"].ui-pnotify-container,
.ui-pnotify [class*="success"].ui-pnotify-container,
.ui-pnotify .alert-info,
.ui-pnotify .alert-success,
.ui-pnotify-container[class*="info"],
.ui-pnotify-container[class*="success"] {
  background: #f0fdf4 !important;
  color: #16a34a !important;
  border: 1px solid #bbf7d0 !important;
}
.ui-pnotify [class*="info"] .ui-pnotify-text,
.ui-pnotify [class*="success"] .ui-pnotify-text,
.ui-pnotify .alert-info .ui-pnotify-text,
.ui-pnotify .alert-success .ui-pnotify-text,
[class*="info"] .ui-pnotify-text,
[class*="success"] .ui-pnotify-text {
  color: #16a34a !important;
}
.ui-pnotify [class*="info"] .ui-pnotify-title,
.ui-pnotify [class*="success"] .ui-pnotify-title,
.ui-pnotify .alert-info .ui-pnotify-title,
.ui-pnotify .alert-success .ui-pnotify-title,
[class*="info"] .ui-pnotify-title,
[class*="success"] .ui-pnotify-title {
  color: #16a34a !important;
}
/* Close button */
.ui-pnotify .ui-pnotify-closer,
.ui-pnotify .ui-pnotify-sticker {
  display: none !important;
}
/* Custom close button */
.rp-pnotify-close {
  position: absolute !important;
  top: 10px !important;
  right: 14px !important;
  font-size: 20px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  opacity: 0.4 !important;
  color: inherit !important;
  font-weight: 300 !important;
  transition: opacity 0.15s ease !important;
}
.rp-pnotify-close:hover {
  opacity: 1 !important;
}
/* Stack positioning */
.ui-pnotify.stack-topleft {
  left: 20px !important;
  right: auto !important;
}
.ui-pnotify.stack-bottomright {
  top: auto !important;
  bottom: 20px !important;
}
.ui-pnotify.stack-bottomleft {
  top: auto !important;
  bottom: 20px !important;
  left: 20px !important;
  right: auto !important;
}

/* Auth page inline alerts */
.rp-auth-alert {
  padding: 12px 16px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-bottom: 16px !important;
  line-height: 1.4 !important;
}
.rp-auth-alert-error {
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border: 1px solid #fecaca !important;
}
.rp-auth-alert-info {
  background: #eff6ff !important;
  color: #2563eb !important;
  border: 1px solid #bfdbfe !important;
}

/* Hide PNotify on auth pages (we use inline alerts there) */
body.template_rdpcore:has(.section-main > .rp-auth-wrapper) .ui-pnotify {
  display: none !important;
}


/* ==========================================================================
   PNOTIFY: Missing display/transition rules (from app.min.css)
   Without these, PNotify popups never become visible in customer area
   ========================================================================== */
body > .ui-pnotify {
  position: fixed !important;
  z-index: 999999 !important;
}
.ui-pnotify {
  display: none !important;
}
.ui-pnotify.ui-pnotify-in {
  display: block !important;
}
.ui-pnotify.ui-pnotify-fade-slow {
  transition: opacity 0.4s linear !important;
}
.ui-pnotify.ui-pnotify-fade-normal {
  transition: opacity 0.25s linear !important;
}
.ui-pnotify.ui-pnotify-fade-fast {
  transition: opacity 0.1s linear !important;
}
.ui-pnotify.ui-pnotify-fade-in {
  opacity: 1 !important;
}
.ui-pnotify.ui-pnotify-move {
  transition: left 0.5s ease, top 0.5s ease, right 0.5s ease, bottom 0.5s ease !important;
}
.ui-pnotify .ui-pnotify-shadow {
  box-shadow: 0 6px 28px 0 rgba(0, 0, 0, 0.1) !important;
}
.ui-pnotify-container {
  background-position: 0 0 !important;
  padding: 0.8em !important;
  overflow: hidden !important;
}
.ui-pnotify-container:after {
  content: " " !important;
  visibility: hidden !important;
  display: block !important;
  height: 0 !important;
  clear: both !important;
}
.ui-pnotify-title {
  display: block !important;
  margin-bottom: 0.4em !important;
}
.ui-pnotify-text {
  display: block !important;
}
.ui-pnotify-icon,
.ui-pnotify-icon span {
  display: block !important;
  float: left !important;
  margin-right: 0.2em !important;
}
/* Modal overlay */
.ui-pnotify-modal-overlay {
  background-color: rgba(0, 0, 0, 0.4) !important;
  top: 0 !important;
  left: 0 !important;
  position: absolute !important;
  height: 100% !important;
  width: 100% !important;
  z-index: 1 !important;
}
body > .ui-pnotify-modal-overlay {
  position: fixed !important;
  z-index: 999998 !important;
}
/* BrightTheme (HostBill's default PNotify theme) */
.brighttheme.ui-pnotify-container {
  padding: 18px !important;
}
.brighttheme .ui-pnotify-title {
  margin-bottom: 12px !important;
}
.brighttheme-notice .ui-pnotify-container {
  background-color: #fffbeb !important;
  border: 1px solid #fde68a !important;
  color: #d97706 !important;
}
.brighttheme-info .ui-pnotify-container {
  background-color: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  color: #16a34a !important;
}
.brighttheme-success .ui-pnotify-container {
  background-color: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  color: #16a34a !important;
}
.brighttheme-error .ui-pnotify-container {
  background-color: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  color: #dc2626 !important;
}
/* Ensure combined fade+move transitions work */
.ui-pnotify.ui-pnotify-fade-slow.ui-pnotify-move {
  transition: opacity 0.4s linear, left 0.5s ease, top 0.5s ease, right 0.5s ease, bottom 0.5s ease !important;
}
.ui-pnotify.ui-pnotify-fade-normal.ui-pnotify-move {
  transition: opacity 0.25s linear, left 0.5s ease, top 0.5s ease, right 0.5s ease, bottom 0.5s ease !important;
}
.ui-pnotify.ui-pnotify-fade-fast.ui-pnotify-move {
  transition: opacity 0.1s linear, left 0.5s ease, top 0.5s ease, right 0.5s ease, bottom 0.5s ease !important;
}
/* Stack positioning (ensure these override base) */
.ui-pnotify.stack-topleft {
  left: 20px !important;
  right: auto !important;
}
.ui-pnotify.stack-bottomright {
  top: auto !important;
  bottom: 20px !important;
}
.ui-pnotify.stack-bottomleft {
  top: auto !important;
  bottom: 20px !important;
  left: 20px !important;
  right: auto !important;
}
.ui-pnotify.stack-modal {
  left: 50% !important;
  right: auto !important;
  margin-left: -180px !important;
}


/* ==========================================================================
   PASSWORD STRENGTH METER (HostBill core injects .progress + .progress-bar)
   ========================================================================== */
body.template_rdpcore .progress {
  height: 6px !important;
  border-radius: 3px !important;
  background: #f3f4f6 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  margin-top: 8px !important;
  border: none !important;
}
body.template_rdpcore .progress .progress-bar {
  border-radius: 3px !important;
  transition: width 0.3s ease !important;
  box-shadow: none !important;
  border: none !important;
}


/* ==========================================================================
   MOBILE RESPONSIVE - Sidebar & Navbar (≤1024px)
   ========================================================================== */

/* Mobile top bar */
.rp-mobile-navbar {
  display: none !important;
}

@media (max-width: 1024px) {
  /* Show mobile navbar */
  .rp-mobile-navbar {
    display: flex !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 60px !important;
    background: #ffffff !important;
    z-index: 60 !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 16px !important;
    border-bottom: 1px solid #e5e7eb !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
  }

  /* Hide desktop navbar */
  .rp-navbar {
    display: none !important;
  }
  body.template_rdpcore .navbar.rp-navbar {
    display: none !important;
  }

  /* Sidebar: off-canvas (hidden by default, shown with class) */
  .rp-sidebar {
    display: flex !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s ease !important;
    z-index: 9999 !important;
    width: 280px !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    height: 100vh !important;
    visibility: hidden !important;
    overflow-y: auto !important;
    background: #fbfbfe !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .rp-sidebar.rp-mobile-open {
    transform: translateX(0) !important;
    visibility: visible !important;
  }
  body.template_rdpcore .sidebar.rp-sidebar {
    transform: translateX(-100%) !important;
    visibility: hidden !important;
    width: 280px !important;
    transition: transform 0.3s ease, visibility 0.3s ease !important;
    z-index: 9999 !important;
    background: #fbfbfe !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body.template_rdpcore .sidebar.rp-sidebar.rp-mobile-open {
    transform: translateX(0) !important;
    visibility: visible !important;
  }

  /* Overlay when sidebar is open */
  .rp-mobile-overlay {
    display: none !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0, 0, 0, 0.3) !important;
    z-index: 9998 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .rp-mobile-overlay.active {
    display: block !important;
  }

  /* Body content: add top padding for mobile navbar */
  body.template_rdpcore .body-content {
    margin-left: 0 !important;
    padding-top: 60px !important;
  }

  /* Collapsed state irrelevant on mobile */
  body.template_rdpcore.rp-body-collapsed .body-content {
    margin-left: 0 !important;
  }
  body.template_rdpcore.rp-body-collapsed .navbar.rp-navbar,
  body.template_rdpcore.rp-body-collapsed .navbar.rp-navbar.fixed-top {
    margin-left: 0 !important;
  }

  /* Sidebar collapse toggle: hide on mobile */
  #rp-sidebar-toggle {
    display: none !important;
  }

  /* Sidebar collapsed class: ignore on mobile */
  .rp-sidebar.rp-collapsed {
    width: 280px !important;
  }
  .rp-sidebar.rp-collapsed .rp-sidebar-logo a {
    display: flex !important;
  }
  .rp-sidebar.rp-collapsed .rp-sidebar-section {
    display: flex !important;
  }
  .rp-sidebar.rp-collapsed .collapse,
  .rp-sidebar.rp-collapsed .collapse.show {
    display: none !important;
  }
  .rp-sidebar.rp-collapsed .collapse.show {
    display: block !important;
  }
  .rp-sidebar.rp-collapsed .rp-sidebar-item {
    width: 100% !important;
    height: 44px !important;
    padding: 0 14px !important;
    justify-content: flex-start !important;
    border-radius: 14px !important;
    margin: 2px 0 !important;
    font-size: 14px !important;
  }
  .rp-sidebar.rp-collapsed .rp-sidebar-item .material-symbols-outlined {
    margin-right: 12px !important;
    font-size: 18px !important;
  }
  .rp-sidebar.rp-collapsed .rp-sidebar-nav {
    padding: 8px 16px 16px !important;
  }
}

@media (max-width: 640px) {
  .rp-mobile-navbar {
    height: 56px !important;
    padding: 0 12px !important;
  }
  body.template_rdpcore .body-content {
    padding-top: 56px !important;
  }
}



/* === ALAN 1: Sidebar/Navbar kontrolü — login durumuna göre === */
/* Sidebar yoksa (login olmayan) body-content tam genişlik */
.body-content.rdpcore-theme {
    margin-left: 0 !important;
}
/* Sidebar varsa (login olan) — sadece desktop'ta margin uygula */
@media (min-width: 1025px) {
    .body-content.rdpcore-theme.rp-has-sidebar {
        margin-left: 220px !important;
    }
    .body-content.rdpcore-theme.rp-has-sidebar ~ .rp-navbar,
    .rp-has-sidebar ~ .navbar {
        margin-left: 220px !important;
    }
}


/* ==========================================================================
   ACCOUNT DETAILS — Overview, Edit Details, Settings, etc.
   ========================================================================== */

/* Page wrapper */
.rp-account-page {
  margin: 0 !important;
  padding: 32px 2rem !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Page header */
.rp-account-header {
  margin-bottom: 12px !important;
}
.rp-account-title {
  font-size: 32px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  font-family: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}

/* Tab Navigation */
.rp-tab-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid #e5e7eb !important;
  margin-bottom: 24px !important;
  padding: 0 !important;
  gap: 12px !important;
}
.rp-tab-nav-inner {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.rp-tab-nav-inner::-webkit-scrollbar {
  display: none !important;
}
.rp-tab-nav-item {
  display: inline-flex !important;
  align-items: center !important;
  padding: 12px 16px !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #1e293b !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -1px !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-tab-nav-item:hover {
  color: #5C3CD6 !important;
  text-decoration: none !important;
}
.rp-tab-nav-active {
  color: #5C3CD6 !important;
  border-bottom-color: #5C3CD6 !important;
  font-weight: 400 !important;
}
.rp-tab-nav-active:hover {
  color: #5C3CD6 !important;
}
.rp-tab-filter-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-tab-filter-btn:hover {
  background: #f3f4f6 !important;
  border-color: #d1d5db !important;
}
.rp-tab-filter-btn .material-symbols-outlined {
  font-size: 16px !important;
}

/* Account content area */
.rp-account-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

/* Card wrapper */
.rp-account-card {
  background: #f4f7fa !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 12px !important;
  overflow: visible !important;
}

/* 2-column grid layout */
.rp-account-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  background: #ffffff !important;
  border-radius: 12px !important;
  border: none !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
  padding: 0 24px !important;
}
.rp-account-grid-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid #f0f2f5 !important;
}
.rp-account-grid-item:nth-last-child(-n+2) {
  border-bottom: none !important;
}
.rp-account-grid-item:nth-child(odd) {
  padding-right: 24px !important;
}
.rp-account-grid-item:nth-child(even) {
  padding-left: 24px !important;
}
.rp-account-grid-label {
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #9ca3af !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-account-grid-value {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  word-break: break-word !important;
  line-height: 1.4 !important;
}
/* Table — kept for other pages that may use table layout */
.rp-account-table-wrap {
  overflow-x: auto !important;
  background: #ffffff !important;
  border-radius: 10px !important;
  border: 1px solid #e5e7eb !important;
}

/* ==========================================================================
   ACCOUNT DETAILS — Edit Fields Form
   ========================================================================== */

.rp-account-edit-section {
  margin: 0 !important;
}

/* Edit grid — 2 columns */
.rp-edit-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  background: #ffffff !important;
  border-radius: 12px !important;
  border: none !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
  padding: 0 24px !important;
  overflow: visible !important;
}
.rp-edit-grid-single {
  grid-template-columns: 1fr !important;
  max-width: 560px !important;
}
.rp-edit-form-full {
  display: contents !important;
}

/* Simple form card (Change Email, Change Password) */
.rp-form-card {
  background: #ffffff !important;
  border-radius: 12px !important;
  border: none !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
  padding: 32px !important;
  max-width: 480px !important;
}
.rp-form-group {
  margin-bottom: 20px !important;
}
.rp-form-label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-form-submit {
  margin-top: 28px !important;
}

/* Simple form — no card, no background (Change Email, Change Password) */
.rp-simple-form {
  max-width: 520px !important;
  padding-top: 8px !important;
}
.rp-simple-form-group {
  margin-bottom: 28px !important;
}
.rp-simple-form-label {
  display: block !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin-bottom: 4px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-simple-form-hint {
  font-size: 13px !important;
  color: #9ca3af !important;
  margin: 0 0 10px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-simple-form-input {
  width: 100% !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: #111827 !important;
  background: #ffffff !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 10px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  outline: none !important;
}
.rp-simple-form-input:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
.rp-simple-form-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  justify-content: flex-end !important;
  margin-top: 32px !important;
}

/* Settings page */
.rp-settings-wrap {
  max-width: 100% !important;
}
.rp-settings-section {
  margin-bottom: 36px !important;
}
.rp-settings-section-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-settings-section-desc {
  font-size: 13px !important;
  color: #9ca3af !important;
  margin: 0 0 16px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-settings-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.rp-settings-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: center !important;
  gap: 32px !important;
  padding: 20px 28px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-settings-row:last-child {
  border-bottom: none !important;
}
.rp-settings-row-left {
  min-width: 0 !important;
}
.rp-settings-row-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-settings-row-desc {
  font-size: 13px !important;
  color: #9ca3af !important;
  margin: 2px 0 0 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-settings-row-right {
  min-width: 0 !important;
}
.rp-settings-input,
.rp-settings-select {
  width: 100% !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  color: #111827 !important;
  background: #ffffff !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  outline: none !important;
  transition: border-color 0.15s ease !important;
}
.rp-settings-input:focus,
.rp-settings-select:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
.rp-settings-options {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.rp-settings-option {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: #374151 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-settings-option input[type="radio"],
.rp-settings-option input[type="checkbox"] {
  accent-color: #5C3CD6 !important;
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}
.rp-settings-ns-fields {
  margin-top: 12px !important;
}
.rp-settings-ns-grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.rp-settings-ns-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.rp-settings-ns-row label {
  font-size: 13px !important;
  color: #6b7280 !important;
  min-width: 100px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-settings-ns-row input {
  max-width: 240px !important;
}
.rp-settings-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  justify-content: flex-end !important;
  margin-top: 32px !important;
  padding-top: 24px !important;
  border-top: 1px solid #f0f2f5 !important;
}
.rp-edit-grid-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid #f0f2f5 !important;
}
.rp-edit-grid-item:nth-last-child(-n+2) {
  border-bottom: none !important;
}
.rp-edit-grid-item:nth-child(odd) {
  padding-right: 24px !important;
}
.rp-edit-grid-item:nth-child(even) {
  padding-left: 24px !important;
}

/* Label */
.rp-edit-label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-edit-required {
  color: #dc2626 !important;
  margin-left: 2px !important;
}

/* Input fields */
.rp-edit-input,
.rp-edit-select,
.rp-edit-textarea {
  width: 100% !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #111827 !important;
  background: #ffffff !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  outline: none !important;
}
.rp-edit-input:focus,
.rp-edit-select:focus,
.rp-edit-textarea:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.1) !important;
}
.rp-edit-textarea {
  resize: vertical !important;
  min-height: 80px !important;
}

/* Static (non-editable) value */
.rp-edit-static {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  padding: 10px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Checkbox group */
.rp-edit-check-group {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.rp-edit-check-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 14px !important;
  color: #374151 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-edit-checkbox {
  width: 16px !important;
  height: 16px !important;
  accent-color: #5C3CD6 !important;
}

/* File input */
.rp-edit-file-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.rp-edit-file-hint {
  font-size: 12px !important;
  color: #9ca3af !important;
}

/* Description hint */
.rp-edit-hint {
  font-size: 12px !important;
  color: #9ca3af !important;
  margin: 2px 0 0 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* intl-tel-input phone field fix */
.rp-edit-grid-item.overflow-unset {
  overflow: visible !important;
}
.rp-edit-grid-item .iti {
  width: 100% !important;
  display: block !important;
  position: relative !important;
}
.rp-edit-grid-item .iti input,
.rp-edit-grid-item .iti input.form-control {
  padding-left: 90px !important;
  width: 100% !important;
}

/* intl-tel-input dropdown styling */
.iti.iti--container {
  z-index: 99999 !important;
  position: absolute !important;
}
.iti__country-list {
  max-height: 200px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  width: 300px !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  list-style: none !important;
  padding: 4px 0 !important;
}
.iti__country-list .iti__country {
  padding: 8px 12px !important;
  cursor: pointer !important;
  font-size: 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.iti__country-list .iti__country:hover,
.iti__country-list .iti__country.iti__highlight {
  background: #f3f4f6 !important;
}

/* Submit button */
.rp-edit-submit-wrap {
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 20px !important;
}

/* Responsive — edit grid */
@media (max-width: 768px) {
  .rp-edit-grid {
    grid-template-columns: 1fr !important;
  }
  .rp-edit-grid-item:nth-child(odd) {
    padding-right: 0 !important;
  }
  .rp-edit-grid-item:nth-child(even) {
    padding-left: 0 !important;
  }
  .rp-edit-grid-item:last-child {
    border-bottom: none !important;
  }
}

/* Download link inside table */
.rp-account-download-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #5C3CD6 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.rp-account-download-link:hover {
  color: #4c2fb3 !important;
  text-decoration: underline !important;
}
.rp-account-download-link .material-symbols-outlined {
  font-size: 18px !important;
}

/* Actions section (download JSON) */
.rp-account-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 16px 20px !important;
  background: #ffffff !important;
  border-radius: 10px !important;
  border: 1px solid #e5e7eb !important;
  margin-top: 12px !important;
}
.rp-account-actions-text {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Buttons */
.rp-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 9px 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  border: none !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  white-space: nowrap !important;
  line-height: 1.4 !important;
}
.rp-btn .material-symbols-outlined {
  font-size: 16px !important;
}
.rp-btn-outline {
  color: #374151 !important;
  background: #ffffff !important;
  border: 1px solid #d1d5db !important;
}
.rp-btn-outline:hover {
  background: #f9fafb !important;
  border-color: #9ca3af !important;
  text-decoration: none !important;
  color: #111827 !important;
}
.rp-btn-danger {
  color: #ffffff !important;
  background: #dc2626 !important;
}
.rp-btn-danger:hover {
  background: #b91c1c !important;
  text-decoration: none !important;
  color: #ffffff !important;
}
.rp-btn-primary {
  color: #ffffff !important;
  background: linear-gradient(135deg, #5C3CD6 0%, #7b5cff 100%) !important;
}
.rp-btn-primary:hover {
  background: linear-gradient(135deg, #4c2fb3 0%, #6a4de6 100%) !important;
  text-decoration: none !important;
  color: #ffffff !important;
}

/* Danger zone */
.rp-account-danger-zone {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  border-radius: 12px !important;
  margin-top: 16px !important;
}
.rp-account-danger-info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.rp-account-danger-icon {
  font-size: 22px !important;
  color: #dc2626 !important;
}
.rp-account-danger-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #991b1b !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-account-danger-desc {
  font-size: 13px !important;
  color: #7f1d1d !important;
  margin: 2px 0 0 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* ==========================================================================
   ACCOUNT DETAILS — Responsive
   ========================================================================== */
@media (max-width: 768px) {
  .rp-account-page {
    padding: 20px 16px !important;
  }
  .rp-account-title {
    font-size: 24px !important;
  }
  .rp-tab-nav-item {
    padding: 10px 12px !important;
    font-size: 14px !important;
  }
  .rp-account-grid {
    grid-template-columns: 1fr !important;
  }
  .rp-account-grid-item:nth-child(odd) {
    border-right: none !important;
  }
  .rp-account-grid-item:last-child {
    border-bottom: none !important;
  }
  .rp-account-actions {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .rp-account-danger-zone {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
}
@media (max-width: 480px) {
  .rp-tab-nav-item {
    padding: 8px 10px !important;
    font-size: 13px !important;
  }
  .rp-account-grid-item {
    padding: 14px 16px !important;
  }
}


/* Override HostBill's default account page styles */
.rp-account-page .section-account-header {
  display: none !important;
}
.rp-account-page .section-account {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: none !important;
}
.rp-account-page .nav-tabs-wrapper {
  display: none !important;
}
.rp-account-page .nav-tabs {
  display: none !important;
}
.rp-account-page .table {
  margin: 0 !important;
  border: none !important;
  background: none !important;
}
.rp-account-page .table-responsive {
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.rp-account-page .table-borders {
  border: none !important;
}
.rp-account-page .table-radius {
  border-radius: 0 !important;
}
.rp-account-page .form-control:not(textarea) {
  height: auto !important;
  min-height: 42px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  border-radius: 8px !important;
  border: 1.5px solid #e5e7eb !important;
}
.rp-account-page textarea.form-control {
  padding: 10px 14px !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  border-radius: 8px !important;
  border: 1.5px solid #e5e7eb !important;
}
.rp-account-page .form-control:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
.rp-account-page input[type="checkbox"],
.rp-account-page input[type="radio"] {
  accent-color: #5C3CD6 !important;
}


/* ==========================================================================
   MANAGE CONTACTS
   ========================================================================== */

.rp-account-header-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}
.rp-account-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rp-contacts-content {
  margin-top: 0 !important;
}
.rp-contacts-table-wrap {
  overflow: visible !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
}
.rp-account-page .rp-contacts-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin: 0 !important;
  border: none !important;
}
.rp-account-page .rp-contacts-table thead th {
  padding: 14px 20px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background: #f4f7fa !important;
  border-bottom: 1px solid #e5e7eb !important;
  border-top: none !important;
  text-align: left !important;
  white-space: nowrap !important;
}
.rp-account-page .rp-contacts-table thead th a {
  color: #374151 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
}
.rp-account-page .rp-contacts-table thead th a:hover {
  color: #111827 !important;
}
.rp-account-page .rp-contacts-table thead th .material-icons {
  font-size: 16px !important;
  color: #9ca3af !important;
}
.rp-account-page .rp-contacts-table tbody tr {
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-account-page .rp-contacts-table tbody tr:last-child {
  border-bottom: none !important;
}
.rp-account-page .rp-contacts-table tbody tr:hover {
  background: #fafbff !important;
}
.rp-account-page .rp-contacts-table tbody td {
  padding: 14px 20px !important;
  color: #374151 !important;
  vertical-align: middle !important;
  border: none !important;
  font-size: 14px !important;
}
.rp-account-page .rp-contacts-table tbody td a b {
  color: #2563eb !important;
  font-weight: 600 !important;
}
.rp-account-page .rp-contacts-table tbody td a:hover b {
  color: #1d4ed8 !important;
}
.rp-account-page .rp-contacts-table .btn {
  background: transparent !important;
  border: none !important;
  padding: 4px 8px !important;
  box-shadow: none !important;
}
.rp-account-page .rp-contacts-table .material-icons {
  font-size: 20px !important;
  color: #6b7280 !important;
}
.rp-account-page .rp-contacts-table .dropdown-menu {
  border-radius: 8px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  padding: 4px 0 !important;
  position: absolute !important;
  right: 0 !important;
  z-index: 1000 !important;
  min-width: 160px !important;
}
.rp-account-page .rp-contacts-table .dropdown-item {
  padding: 8px 16px !important;
  font-size: 13px !important;
  color: #374151 !important;
}
.rp-account-page .rp-contacts-table .dropdown-item:hover {
  background: #f3f4f6 !important;
  color: #111827 !important;
}

@media (max-width: 768px) {
  .rp-account-header-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
}

/* Contacts billing section */
.rp-contacts-billing {
  margin-top: 32px !important;
}
.rp-contacts-billing .rp-settings-select {
  max-width: 100% !important;
  height: auto !important;
  padding: 12px 16px !important;
  white-space: normal !important;
  text-overflow: ellipsis !important;
}

/* Contact edit page */
.rp-contact-edit-wrap {
  max-width: 100% !important;
  margin-top: 24px !important;
}
.rp-back-link {
  color: #5C3CD6 !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  display: inline-block !important;
  margin-top: 4px !important;
  margin-bottom: 8px !important;
}
.rp-back-link:hover {
  color: #4c2fb3 !important;
  text-decoration: underline !important;
}
.rp-contact-notify {
  margin-top: 16px !important;
}


/* Chosen.js multi-select fix (HostBill uses chzn- prefix, v0.9.8) */
.rp-account-page .chzn-container {
  width: 100% !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  display: inline-block !important;
  position: relative !important;
}
.rp-account-page .chzn-container .chzn-drop {
  border: 1px solid #e5e7eb !important;
  border-radius: 0 0 8px 8px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  background: #ffffff !important;
  position: absolute !important;
  top: 100% !important;
  left: -9999px !important;
  width: 100% !important;
  z-index: 1010 !important;
  clip: rect(0,0,0,0) !important;
}
.rp-account-page .chzn-container-active .chzn-drop {
  left: 0 !important;
  clip: auto !important;
}
.rp-account-page .chzn-container-multi .chzn-choices {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 6px 10px !important;
  background: #ffffff !important;
  min-height: 42px !important;
  box-shadow: none !important;
  cursor: text !important;
  overflow: hidden !important;
  list-style: none !important;
  position: relative !important;
}
.rp-account-page .chzn-container-multi .chzn-choices li {
  float: left !important;
  list-style: none !important;
}
.rp-account-page .chzn-container-multi .chzn-choices .search-choice {
  background: #ede9fe !important;
  border: none !important;
  border-radius: 6px !important;
  color: #5C3CD6 !important;
  padding: 4px 22px 4px 8px !important;
  font-size: 13px !important;
  margin: 3px 4px 3px 0 !important;
  position: relative !important;
  cursor: default !important;
}
.rp-account-page .chzn-container-multi .chzn-choices .search-choice .search-choice-close {
  position: absolute !important;
  top: 50% !important;
  right: 6px !important;
  transform: translateY(-50%) !important;
  width: 12px !important;
  height: 12px !important;
  cursor: pointer !important;
  display: block !important;
  font-size: 0 !important;
}
.rp-account-page .chzn-container-multi .chzn-choices .search-choice .search-choice-close::after {
  content: '×' !important;
  font-size: 14px !important;
  color: #5C3CD6 !important;
  line-height: 12px !important;
}
.rp-account-page .chzn-container-multi .chzn-choices .search-field input {
  height: 28px !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.rp-account-page .chzn-container-multi .chzn-choices .search-field .default {
  color: #9ca3af !important;
}
.rp-account-page .chzn-container .chzn-results {
  max-height: 200px !important;
  overflow-y: auto !important;
  margin: 0 !important;
  padding: 4px 0 !important;
}
.rp-account-page .chzn-container .chzn-results li {
  padding: 8px 12px !important;
  font-size: 14px !important;
  cursor: pointer !important;
  display: none !important;
}
.rp-account-page .chzn-container .chzn-results li.active-result {
  display: list-item !important;
}
.rp-account-page .chzn-container .chzn-results li.result-selected {
  display: none !important;
}
.rp-account-page .chzn-container .chzn-results li.no-results {
  display: list-item !important;
  color: #9ca3af !important;
  cursor: default !important;
  background: #f9fafb !important;
}
.rp-account-page .chzn-container .chzn-results .highlighted {
  background: #5C3CD6 !important;
  color: #ffffff !important;
}
.rp-account-page .chzn-container-active .chzn-choices {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}


/* ==========================================================================
   SECURITY / MFA PAGE
   ========================================================================== */

/* MFA Status Banner */
.rp-mfa-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 20px 24px !important;
  border-radius: 12px !important;
  margin-bottom: 28px !important;
}
.rp-mfa-banner-active {
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
}
.rp-mfa-banner-inactive {
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
}
.rp-mfa-banner-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.rp-mfa-banner-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-mfa-banner-icon-active {
  background: #dcfce7 !important;
}
.rp-mfa-banner-icon-active .material-symbols-outlined {
  color: #16a34a !important;
  font-size: 22px !important;
}
.rp-mfa-banner-icon-inactive {
  background: #fee2e2 !important;
}
.rp-mfa-banner-icon-inactive .material-symbols-outlined {
  color: #dc2626 !important;
  font-size: 22px !important;
}
.rp-mfa-banner-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #15803d !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-banner-title-danger {
  color: #dc2626 !important;
}
.rp-mfa-banner-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 2px 0 0 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* MFA Select Section */
.rp-mfa-select-section {
  margin-bottom: 24px !important;
}
.rp-mfa-select-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-select-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 20px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* MFA Module Cards */
.rp-mfa-modules {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
  gap: 16px !important;
}
.rp-mfa-module-card {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  background: #ffffff !important;
  display: flex !important;
  flex-direction: column !important;
}
.rp-mfa-module-header {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  margin-bottom: 16px !important;
}
.rp-mfa-module-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: #f3f4f6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-mfa-module-icon .material-symbols-outlined {
  font-size: 20px !important;
  color: #5C3CD6 !important;
}
.rp-mfa-module-name {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-module-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 !important;
  line-height: 1.4 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* MFA Module Features */
.rp-mfa-module-features {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 20px 0 !important;
  flex: 1 !important;
}
.rp-mfa-module-features li {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: #374151 !important;
  padding: 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-module-features li .material-symbols-outlined {
  font-size: 16px !important;
  color: #16a34a !important;
}

/* MFA Module Actions */
.rp-mfa-module-actions {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: auto !important;
}
.rp-mfa-module-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
  justify-content: center !important;
}
.rp-mfa-module-btn .material-symbols-outlined {
  font-size: 16px !important;
}
.rp-mfa-module-disabled {
  padding: 10px 16px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
  background: #f3f4f6 !important;
  color: #9ca3af !important;
  font-weight: 500 !important;
  text-align: center !important;
  width: 100% !important;
}

/* MFA Info Note */
.rp-mfa-info-note {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 14px 20px !important;
  background: #f4f7fa !important;
  border-radius: 10px !important;
  margin-top: 24px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-info-note .material-symbols-outlined {
  font-size: 18px !important;
  color: #9ca3af !important;
}

.rp-mfa-info {
  font-size: 14px !important;
  color: #6b7280 !important;
  margin: 0 0 20px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-divider {
  border: none !important;
  border-top: 1px solid #f0f2f5 !important;
  margin: 28px 0 !important;
}


/* Tab active state for Bootstrap data-toggle="tab" */
.rp-tab-nav-item.active,
.rp-tab-nav-item.nav-link.active,
.nav-item.active .rp-tab-nav-item {
  color: #5C3CD6 !important;
  border-bottom-color: #5C3CD6 !important;
}


/* Security — Current IP Address */
.rp-ip-current {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 20px 24px !important;
  background: #f4f7fa !important;
  border-radius: 12px !important;
  margin-bottom: 24px !important;
  margin-top: 8px !important;
}
.rp-ip-current-icon {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: #ede9fe !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-ip-current-icon .material-icons,
.rp-ip-current-icon .material-symbols-outlined {
  font-size: 22px !important;
  color: #5C3CD6 !important;
}
.rp-ip-current-info {
  display: flex !important;
  flex-direction: column !important;
}
.rp-ip-current-label {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ip-current-value {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ip-current-hint {
  font-size: 12px !important;
  color: #9ca3af !important;
  margin-top: 2px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* IP Access Card */
.rp-ip-card {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  background: #ffffff !important;
}
.rp-ip-card-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ip-card-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 20px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Add IP Form */
.rp-ip-add-form {
  margin-bottom: 16px !important;
}
.rp-ip-add-row {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}
.rp-ip-add-input-wrap {
  flex: 1 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}
.rp-ip-add-icon {
  position: absolute !important;
  left: 14px !important;
  font-size: 18px !important;
  color: #9ca3af !important;
  z-index: 1 !important;
}
.rp-account-page .rp-ip-add-input.form-control {
  padding-left: 42px !important;
  height: auto !important;
  min-height: 44px !important;
  width: 100% !important;
}
.rp-ip-add-desc {
  width: 200px !important;
  flex-shrink: 0 !important;
  height: auto !important;
  min-height: 44px !important;
}
.rp-ip-add-btn {
  flex-shrink: 0 !important;
  padding: 12px 20px !important;
  white-space: nowrap !important;
}

/* Info note */
.rp-ip-info-note {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 14px !important;
  background: #f9fafb !important;
  border-radius: 8px !important;
  margin-bottom: 20px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ip-info-note .material-symbols-outlined {
  font-size: 16px !important;
  color: #9ca3af !important;
}

/* IP Table */
.rp-ip-table-wrap {
  margin-bottom: 20px !important;
}
.rp-ip-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ip-table thead th {
  padding: 10px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  border-bottom: 1px solid #e5e7eb !important;
  text-align: left !important;
}
.rp-ip-table tbody tr {
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-ip-table tbody tr:last-child {
  border-bottom: none !important;
}
.rp-ip-table tbody td {
  padding: 14px 16px !important;
  color: #374151 !important;
  vertical-align: middle !important;
}
.rp-ip-table-rule {
  font-weight: 500 !important;
  color: #111827 !important;
}
.rp-ip-table-desc {
  color: #9ca3af !important;
  font-size: 13px !important;
}
.rp-ip-table-actions {
  text-align: right !important;
  width: 80px !important;
}
.rp-ip-table-empty {
  color: #9ca3af !important;
  font-style: italic !important;
}
.rp-ip-delete-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  color: #9ca3af !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}
.rp-ip-delete-btn:hover {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
.rp-ip-delete-btn .material-symbols-outlined {
  font-size: 18px !important;
}

/* Rule Formats Accordion */
.rp-rule-formats {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
.rp-rule-formats-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px !important;
  cursor: pointer !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-rule-formats-body {
  padding: 0 16px 16px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-rule-formats-body ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 8px 0 !important;
}
.rp-rule-formats-body li {
  padding: 4px 0 !important;
}


/* Security — Rule formats chevron */
.rp-rule-chevron {
  font-size: 20px !important;
  color: #6b7280 !important;
  transition: transform 0.2s ease !important;
}
.rp-rule-formats-header[aria-expanded="true"] .rp-rule-chevron {
  transform: rotate(180deg) !important;
}


/* Security — Responsive */
@media (max-width: 768px) {
  .rp-ip-add-row {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .rp-ip-add-desc {
    width: 100% !important;
  }
  .rp-ip-add-btn {
    width: 100% !important;
  }
}


/* SSH Key Modal */
.rp-account-page .modal-content {
  border-radius: 14px !important;
  border: none !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15) !important;
  overflow: visible !important;
}
.rp-account-page .modal-header {
  padding: 24px 24px 0 !important;
  border-bottom: none !important;
  background: #ffffff !important;
}
.rp-account-page .modal-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-account-page .modal-header .close {
  background: none !important;
  border: none !important;
  font-size: 24px !important;
  color: #9ca3af !important;
  opacity: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.rp-account-page .modal-header .close:hover {
  color: #374151 !important;
}
.rp-account-page .modal-body {
  padding: 20px 24px 24px !important;
}
.rp-account-page .modal-body .form-control {
  border-radius: 10px !important;
  border: 1.5px solid #e5e7eb !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  background: #ffffff !important;
  height: auto !important;
  min-height: 44px !important;
}
.rp-account-page .modal-body .form-control:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
.rp-account-page .modal-body textarea.form-control {
  min-height: 160px !important;
}
#addssh .modal-body,
#addssh .modal-content,
#addssh .modal-body .form-label-group,
#addssh .form-label-group {
  overflow: visible !important;
}
#addssh textarea,
.modal textarea.form-control {
  resize: vertical !important;
  overflow: auto !important;
  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
}
.rp-account-page .modal-body .form-label-group {
  margin-bottom: 16px !important;
}
.rp-account-page .modal-body .form-label-placeholder {
  color: #9ca3af !important;
  font-size: 13px !important;
}
.rp-account-page .modal-body .btn-primary {
  background: linear-gradient(135deg, #5C3CD6 0%, #7b5cff 100%) !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 14px 24px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  width: 100% !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}
.rp-account-page .modal-body .btn-primary:hover {
  background: linear-gradient(135deg, #4c2fb3 0%, #6a4de6 100%) !important;
  box-shadow: 0 4px 12px rgba(92, 60, 214, 0.3) !important;
}


/* MFA Setup/Manage Card */
.rp-mfa-how-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 20px 24px !important;
  background: #f4f7fa !important;
  border-radius: 12px !important;
  margin-bottom: 24px !important;
}
.rp-mfa-how-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.rp-mfa-how-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: #ede9fe !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-mfa-how-icon .material-symbols-outlined {
  font-size: 20px !important;
  color: #5C3CD6 !important;
}
.rp-mfa-how-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  display: block !important;
  margin-bottom: 2px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-how-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 !important;
  line-height: 1.5 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

.rp-mfa-setup-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 28px !important;
  max-width: 100% !important;
}
.rp-mfa-verify-title {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-verify-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 16px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-verify-hint {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 12px 0 0 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-form-content h3,
.rp-mfa-form-content h4 {
  display: none !important;
}
.rp-mfa-setup-card .alert,
.rp-mfa-setup-card .alert-info {
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 8px !important;
  padding: 12px 16px 12px 42px !important;
  font-size: 14px !important;
  color: #1e40af !important;
  margin-bottom: 16px !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}
.rp-mfa-setup-card .alert::before,
.rp-mfa-setup-card .alert-info::before {
  content: 'info' !important;
  font-family: 'Material Symbols Outlined' !important;
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 18px !important;
  color: #3b82f6 !important;
}
.rp-mfa-setup-card .alert-danger {
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  color: #dc2626 !important;
  margin-bottom: 16px !important;
}
.rp-mfa-setup-card .btn-primary,
.rp-mfa-setup-card .btn-success,
.rp-mfa-setup-card input[type="submit"] {
  background: linear-gradient(135deg, #5C3CD6 0%, #7b5cff 100%) !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  cursor: pointer !important;
}
.rp-mfa-setup-card .btn-primary:hover,
.rp-mfa-setup-card .btn-success:hover {
  background: linear-gradient(135deg, #4c2fb3 0%, #6a4de6 100%) !important;
}
.rp-mfa-setup-card .btn-info,
.rp-mfa-setup-card .btn-default {
  background: #ffffff !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  cursor: pointer !important;
}
.rp-mfa-setup-card .btn-info:hover,
.rp-mfa-setup-card .btn-default:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
}
.rp-mfa-setup-card input[type="text"],
.rp-mfa-setup-card input[type="password"] {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  width: 100% !important;
  max-width: 100% !important;
  background: #f9fafb !important;
}
.rp-mfa-setup-card input[type="text"]:focus,
.rp-mfa-setup-card input[type="password"]:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
  outline: none !important;
  background: #ffffff !important;
}
.rp-mfa-form-content {
  position: relative !important;
}
.rp-mfa-form-content input[type="text"]::placeholder {
  color: #9ca3af !important;
}
.rp-mfa-setup-card label {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  display: block !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-setup-card hr {
  border-color: #f0f2f5 !important;
  margin: 20px 0 !important;
}


/* MFA Setup — Google Authenticator QR + links styling */
.rp-mfa-setup-card img[src*="qr"],
.rp-mfa-setup-card img[src*="chart"] {
  border-radius: 8px !important;
  border: 1px solid #e5e7eb !important;
  padding: 8px !important;
  background: #ffffff !important;
  max-width: 180px !important;
}
.rp-mfa-setup-card ol,
.rp-mfa-setup-card ul {
  padding-left: 20px !important;
  margin: 12px 0 !important;
}
.rp-mfa-setup-card ol li,
.rp-mfa-setup-card ul li {
  padding: 4px 0 !important;
  font-size: 14px !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-mfa-setup-card ol li a,
.rp-mfa-setup-card ul li a {
  color: #5C3CD6 !important;
  text-decoration: none !important;
}
.rp-mfa-setup-card ol li a:hover,
.rp-mfa-setup-card ul li a:hover {
  text-decoration: underline !important;
}
.rp-mfa-setup-card code,
.rp-mfa-setup-card .code,
.rp-mfa-setup-card input[readonly] {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 14px !important;
  background: #f4f7fa !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  color: #111827 !important;
  letter-spacing: 0.5px !important;
}


/* History / Table links — ID links color fix */
.rp-account-page .rp-contacts-table tbody td a,
.rp-account-page .table tbody td a {
  color: #5C3CD6 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.rp-account-page .rp-contacts-table tbody td a:hover,
.rp-account-page .table tbody td a:hover {
  color: #4c2fb3 !important;
  text-decoration: underline !important;
}

/* Pagination styling */
.rp-account-page .pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  margin: 24px 0 !important;
  padding: 0 !important;
  list-style: none !important;
  flex-wrap: wrap !important;
}
.rp-account-page .pagination li {
  list-style: none !important;
}
.rp-account-page .pagination li a,
.rp-account-page .pagination li span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 36px !important;
  height: 36px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-account-page .pagination li a:hover {
  background: #f9fafb !important;
  border-color: #5C3CD6 !important;
  color: #5C3CD6 !important;
}
.rp-account-page .pagination li.active a,
.rp-account-page .pagination li.active span {
  background: #5C3CD6 !important;
  border-color: #5C3CD6 !important;
  color: #ffffff !important;
}
.rp-account-page .pagination li.disabled a,
.rp-account-page .pagination li.disabled span {
  color: #d1d5db !important;
  background: #f9fafb !important;
  border-color: #f3f4f6 !important;
  cursor: not-allowed !important;
}


/* Email Detail */
.rp-email-detail-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 28px !important;
}
.rp-email-detail-subject {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 16px 0 !important;
  word-break: break-word !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-email-detail-meta {
  background: #f9fafb !important;
  border-radius: 8px !important;
  padding: 14px 18px !important;
  margin-bottom: 20px !important;
}
.rp-email-detail-meta-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 4px 0 !important;
  font-size: 14px !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-email-detail-meta-label {
  min-width: 80px !important;
  color: #6b7280 !important;
  font-size: 13px !important;
}
.rp-email-detail-body {
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-email-detail-body a {
  color: #5C3CD6 !important;
}

/* Badges */
.rp-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 20px !important;
  white-space: nowrap !important;
}
.rp-badge-success {
  background: #dcfce7 !important;
  color: #15803d !important;
}
.rp-badge-danger {
  background: #fee2e2 !important;
  color: #dc2626 !important;
}


/* ==========================================================================
   EMAIL HISTORY — Detail View
   ========================================================================== */

.rp-email-detail-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 28px !important;
  overflow: hidden !important;
}
.rp-email-detail-subject {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 16px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-email-detail-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px 32px !important;
  padding-bottom: 16px !important;
  margin-bottom: 20px !important;
  border-bottom: 1px solid #f0f2f5 !important;
}
.rp-email-detail-meta-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-email-detail-meta-label {
  font-weight: 600 !important;
  color: #6b7280 !important;
  font-size: 13px !important;
}
.rp-email-detail-body {
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-email-detail-body a {
  color: #5C3CD6 !important;
}

/* Badges */
.rp-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 20px !important;
  white-space: nowrap !important;
}
.rp-badge-success {
  background: #dcfce7 !important;
  color: #16a34a !important;
}
.rp-badge-danger {
  background: #fee2e2 !important;
  color: #dc2626 !important;
}


/* ==========================================================================
   BILLING — Invoices
   ========================================================================== */

.rp-billing-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 20px !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.rp-billing-balance {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-billing-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* Filters */
.rp-filters-box {
  padding: 16px 20px !important;
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  margin-bottom: 20px !important;
}
.rp-filters-row {
  display: flex !important;
  gap: 12px !important;
  align-items: flex-end !important;
  flex-wrap: wrap !important;
}
.rp-filter-item {
  flex: 1 !important;
  min-width: 150px !important;
}
.rp-filter-item-wide {
  flex: 2 !important;
}
.rp-filter-item label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  margin-bottom: 4px !important;
  display: block !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

@media (max-width: 768px) {
  .rp-billing-top {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .rp-filters-row {
    flex-direction: column !important;
  }
  .rp-filter-item {
    width: 100% !important;
  }
}


/* Billing Summary (Invoices Due + Available Credit) */
.rp-billing-summary {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 32px !important;
  padding: 0 !important;
  background: none !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
}
.rp-billing-summary-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
}
.rp-billing-summary-value {
  font-size: 22px !important;
  font-weight: 700 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-billing-summary-due {
  color: #dc2626 !important;
}
.rp-billing-summary-ok {
  color: #2563eb !important;
}
.rp-billing-summary-credit {
  color: #16a34a !important;
}
.rp-billing-summary-label {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}


/* Add Funds */
.rp-addfunds-card {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  background: #ffffff !important;
  margin-bottom: 24px !important;
  max-width: 750px !important;
}
.rp-addfunds-grid {
  display: grid !important;
  grid-template-columns: 1fr 1.2fr !important;
  gap: 24px !important;
  max-width: 750px !important;
}
.rp-addfunds-field {
  display: flex !important;
  flex-direction: column !important;
}
.rp-addfunds-label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin-bottom: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-addfunds-input-wrap {
  display: flex !important;
  align-items: center !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #ffffff !important;
}
.rp-addfunds-input-wrap:focus-within {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
.rp-addfunds-input-prefix {
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  background: #f9fafb !important;
  border-right: 1px solid #e5e7eb !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
}
.rp-addfunds-input-suffix {
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  background: #f9fafb !important;
  border-left: 1px solid #e5e7eb !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
}
.rp-addfunds-input {
  border: none !important;
  border-radius: 0 !important;
  padding: 10px 14px !important;
  font-size: 15px !important;
  flex: 1 !important;
  box-shadow: none !important;
  min-height: 44px !important;
  background: transparent !important;
}
.rp-addfunds-input:focus {
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}
.rp-account-page .rp-addfunds-input.form-control {
  border: none !important;
  border-radius: 0 !important;
  min-height: auto !important;
  height: 44px !important;
  box-shadow: none !important;
  background: transparent !important;
}
.rp-account-page .rp-addfunds-input.form-control:focus {
  border: none !important;
  box-shadow: none !important;
}
.rp-addfunds-select {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  min-height: 44px !important;
  background: #ffffff !important;
}
.rp-addfunds-select:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
.rp-addfunds-field-hint {
  font-size: 12px !important;
  color: #9ca3af !important;
  margin: 6px 0 0 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-addfunds-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 24px !important;
  padding-top: 20px !important;
  border-top: 1px solid #f0f2f5 !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.rp-addfunds-limits {
  display: flex !important;
  gap: 24px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-addfunds-limit-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.rp-addfunds-limit-icon {
  font-size: 14px !important;
  color: #9ca3af !important;
}
.rp-addfunds-limits strong {
  color: #111827 !important;
  margin-left: 4px !important;
}

@media (max-width: 768px) {
  .rp-addfunds-grid {
    grid-template-columns: 1fr !important;
  }
  .rp-addfunds-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .rp-addfunds-limits {
    flex-direction: column !important;
    gap: 8px !important;
  }
}


/* ==========================================================================
   CREDIT CARDS
   ========================================================================== */

.rp-cards-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.rp-card-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  gap: 16px !important;
}
.rp-card-item-primary {
  border-color: #5C3CD6 !important;
  border-width: 1.5px !important;
}
.rp-card-item-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.rp-card-item-img img {
  display: block !important;
}
.rp-card-item-info {
  display: flex !important;
  flex-direction: column !important;
}
.rp-card-item-number {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  font-family: 'JetBrains Mono', monospace !important;
  letter-spacing: 0.5px !important;
}
.rp-card-item-meta {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-card-item-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rp-badge-primary {
  background: #ede9fe !important;
  color: #5C3CD6 !important;
}
.rp-badge-info {
  background: #dbeafe !important;
  color: #2563eb !important;
}
.rp-badge-muted {
  background: #f3f4f6 !important;
  color: #9ca3af !important;
}

@media (max-width: 768px) {
  .rp-card-item {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .rp-card-item-right {
    flex-wrap: wrap !important;
  }
}


/* ==========================================================================
   INVOICE DETAIL
   ========================================================================== */

.rp-invoice-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 24px !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.rp-invoice-status-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.rp-invoice-date {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-invoice-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.rp-invoice-credit-banner {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 14px 20px !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  border-radius: 10px !important;
  margin-bottom: 24px !important;
  font-size: 14px !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-invoice-credit-banner a {
  color: #5C3CD6 !important;
}
.rp-invoice-credit-form {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rp-invoice-body {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  padding: 24px 32px !important;
}
.rp-invoice-body iframe {
  min-height: 600px !important;
  width: 100% !important;
  display: block !important;
}

@media (max-width: 768px) {
  .rp-invoice-toolbar {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .rp-invoice-actions {
    width: 100% !important;
  }
}


/* Invoice Pay Modal */
#payInvoiceModal .modal-content {
  border-radius: 14px !important;
  border: none !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15) !important;
}
#payInvoiceModal .modal-header {
  padding: 24px 24px 0 !important;
  border-bottom: none !important;
}
#payInvoiceModal .modal-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
#payInvoiceModal .modal-body {
  padding: 20px 24px 24px !important;
}
#payInvoiceModal select.form-control {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  height: auto !important;
  min-height: 44px !important;
  background: #ffffff !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
#payInvoiceModal select.form-control:focus {
  border-color: #5C3CD6 !important;
  box-shadow: 0 0 0 3px rgba(92, 60, 214, 0.08) !important;
}
#payInvoiceModal #gateway {
  margin-top: 16px !important;
  font-size: 14px !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
#payInvoiceModal .close {
  background: none !important;
  border: none !important;
  color: #9ca3af !important;
  opacity: 1 !important;
}
#payInvoiceModal .close:hover {
  color: #374151 !important;
}


/* ==========================================================================
   BILLING ALERTS (Module page)
   ========================================================================== */

.rp-account-page .padding.white-bg,
.body-content .padding.white-bg {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 28px 32px !important;
  max-width: 100% !important;
}
.body-content .padding.white-bg h3 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 8px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.body-content .padding.white-bg .table {
  border: none !important;
  margin-top: 16px !important;
}
.body-content .padding.white-bg .table td {
  border: none !important;
  border-bottom: 1px solid #f3f4f6 !important;
  padding: 14px 12px !important;
  font-size: 14px !important;
  color: #374151 !important;
  vertical-align: middle !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.body-content .padding.white-bg .table tr:last-child td {
  border-bottom: none !important;
  padding-top: 20px !important;
}
.body-content .padding.white-bg .table input[type="radio"] {
  accent-color: #5C3CD6 !important;
  width: 16px !important;
  height: 16px !important;
}
.body-content .padding.white-bg .table input[type="text"] {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  font-size: 14px !important;
  width: 80px !important;
}
.body-content .padding.white-bg .table input[type="text"]:focus {
  border-color: #5C3CD6 !important;
  outline: none !important;
}
.body-content .padding.white-bg .btn-success {
  background: linear-gradient(135deg, #5C3CD6 0%, #7b5cff 100%) !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}
.body-content .padding.white-bg .btn-success:hover {
  background: linear-gradient(135deg, #4c2fb3 0%, #6a4de6 100%) !important;
}


/* Nav-item wrapper for filter tabs (invisible li) */
.rp-tab-nav .nav-item {
  list-style: none !important;
  display: inline-flex !important;
}


/* ==========================================================================
   SUPPORT — New Ticket Form
   ========================================================================== */

.rp-ticket-form-wrap {
  max-width: 720px !important;
}

/* Ticket field blocks — icon + title + description pattern */
.rp-ticket-field-block {
  margin-bottom: 24px !important;
  padding: 0 !important;
}
.rp-ticket-field-block > .rp-simple-form-input,
.rp-ticket-field-block > .ticketwidget_newticket,
.rp-ticket-field-block > .rp-ticket-dropzone-area,
.rp-ticket-field-block > select.rp-simple-form-input,
.rp-ticket-field-block > select.form-control,
.rp-ticket-field-block > textarea.rp-simple-form-input,
.rp-ticket-field-block > .deptsdesc,
.rp-ticket-field-block > #hintarea,
.rp-ticket-field-block > input.rp-simple-form-input {
  margin-left: 0 !important;
}
.rp-ticket-field-header {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}
.rp-ticket-field-icon {
  display: none !important;
}
.rp-ticket-field-title {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  line-height: 1.4 !important;
}
.rp-ticket-field-optional {
  font-weight: 400 !important;
  color: #9ca3af !important;
  font-size: 13px !important;
}
.rp-ticket-field-desc {
  display: block !important;
  font-size: 12.5px !important;
  color: #6b7280 !important;
  margin-top: 2px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  line-height: 1.4 !important;
}
.rp-ticket-checkbox-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.rp-ticket-checkbox-row .rp-settings-option {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}

/* Dropzone area — modern drag & drop */
.rp-ticket-dropzone-area {
  border: 1.5px dashed #e0d4f5 !important;
  border-radius: 12px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #faf8ff !important;
  transition: border-color 0.2s ease, background 0.2s ease !important;
}
.rp-ticket-dropzone-area:hover {
  border-color: #c4b5fd !important;
  background: #f5f0ff !important;
}
.rp-ticket-dropzone-inner {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: none !important;
}
.rp-ticket-dropzone-label {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 28px 20px !important;
  cursor: pointer !important;
  text-align: center !important;
  margin: 0 !important;
}
.rp-ticket-dropzone-cloud {
  font-size: 32px !important;
  color: #7c3aed !important;
  margin-bottom: 10px !important;
  opacity: 0.7 !important;
}
.rp-ticket-dropzone-text {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ticket-dropzone-browse {
  color: #7c3aed !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}
.rp-ticket-dropzone-hint {
  display: block !important;
  font-size: 12px !important;
  color: #9ca3af !important;
  margin-top: 6px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Secondary button */
.rp-btn-secondary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 24px !important;
  border-radius: 16px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  background: #ffffff !important;
  color: #374151 !important;
  border: 1.5px solid #e5e7eb !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
}
.rp-btn-secondary:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
  color: #111827 !important;
}

.rp-ticket-upload {
  border: 1.5px dashed #e5e7eb !important;
  border-radius: 10px !important;
  padding: 16px 20px !important;
  margin-bottom: 16px !important;
  background: #f9fafb !important;
}
.rp-ticket-attach-label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin: 0 !important;
  padding: 4px 0 !important;
}
.rp-ticket-options {
  margin-bottom: 12px !important;
}


/* Ticket form — Related service widget + Dropzone fix */
.rp-ticket-form-wrap .ticketwidget_newticket select,
.rp-ticket-form-wrap .ticketwidget_newticket .form-control,
.rp-ticket-field-block .ticketwidget_newticket select,
.rp-ticket-field-block .ticketwidget_newticket .form-control {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  height: auto !important;
  min-height: 42px !important;
  width: 100% !important;
  max-width: 100% !important;
}
.rp-ticket-form-wrap .ticketwidget_newticket label,
.rp-ticket-field-block .ticketwidget_newticket label {
  display: none !important;
}
.rp-ticket-form-wrap .ticketwidget_newticket,
.rp-ticket-field-block .ticketwidget_newticket {
  margin-bottom: 0 !important;
}

/* Dropzone area */
.rp-ticket-dropzone-area #dropzone {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: none !important;
}
.rp-ticket-dropzone-area #dropzone h1 {
  display: none !important;
}

/* Department description hints */
.rp-ticket-field-block .deptsdesc {
  margin-top: 6px !important;
}
.rp-ticket-field-block .deptsdesc small {
  font-size: 12.5px !important;
  color: #6b7280 !important;
  font-style: italic !important;
}

/* Ticket Created Success Page */
.rp-ticket-success {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 80px 24px !important;
  max-width: 560px !important;
  margin: 0 auto !important;
}
.rp-ticket-success-icon {
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  background: #f0fdf4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 24px !important;
}
.rp-ticket-success-icon .material-symbols-outlined {
  font-size: 36px !important;
  color: #22c55e !important;
}
.rp-ticket-success-title {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 12px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ticket-success-number {
  color: #7c3aed !important;
}
.rp-ticket-success-desc {
  font-size: 15px !important;
  color: #6b7280 !important;
  margin: 0 0 32px !important;
  line-height: 1.6 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ticket-success-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

/* ==========================================================================
   VIEW TICKET PAGE
   ========================================================================== */
.rp-ticket-view-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.rp-ticket-view-title {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 6px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  word-break: break-word !important;
}
.rp-ticket-view-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  flex-wrap: wrap !important;
}

/* Ticket meta bar */
.rp-ticket-meta {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 28px !important;
  flex-wrap: wrap !important;
}
.rp-ticket-status {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 12px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: capitalize !important;
}
.rp-ticket-status-open {
  background: #f0fdf4 !important;
  color: #15803d !important;
}
.rp-ticket-status-closed {
  background: #f3f4f6 !important;
  color: #6b7280 !important;
}
.rp-ticket-status-answered {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}
.rp-ticket-status-customer-reply,
.rp-ticket-status-customer_reply {
  background: #fff7ed !important;
  color: #c2410c !important;
}
.rp-ticket-status-in-progress,
.rp-ticket-status-in_progress {
  background: #fef3c7 !important;
  color: #92400e !important;
}
.rp-ticket-meta-item {
  font-size: 13px !important;
  color: #6b7280 !important;
  padding: 4px 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  background: #ffffff !important;
}

/* Conversation */
.rp-ticket-conversation {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  margin-bottom: 32px !important;
}
.rp-ticket-message {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 20px 24px !important;
  transition: box-shadow 0.2s ease !important;
}
.rp-ticket-message:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}
.rp-ticket-message-admin {
  border-left: 3px solid #7c3aed !important;
}
.rp-ticket-message-header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}
.rp-ticket-message-avatar {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background: #e9e7ff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.rp-ticket-message-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}
.rp-ticket-avatar-initials {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #7c3aed !important;
  text-transform: uppercase !important;
}
.rp-ticket-message-sender {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.rp-ticket-message-sender strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
}
.rp-ticket-message-date {
  font-size: 12px !important;
  color: #9ca3af !important;
}
.rp-ticket-badge-staff {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: #ede9fe !important;
  color: #7c3aed !important;
}
.rp-ticket-quote-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  color: #9ca3af !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
}
.rp-ticket-quote-btn:hover {
  background: #f3f4f6 !important;
  color: #7c3aed !important;
}
.rp-ticket-quote-btn .material-symbols-outlined {
  font-size: 20px !important;
}
.rp-ticket-message-body {
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: #374151 !important;
  word-break: break-word !important;
}
.rp-ticket-message-body p {
  margin: 0 0 8px !important;
}

/* Attachments */
.rp-ticket-attachments {
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid #f3f4f6 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.rp-ticket-attachment-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  background: #f9fafb !important;
  border-radius: 8px !important;
  border: 1px solid #f3f4f6 !important;
}
.rp-ticket-attachment-item .material-symbols-outlined {
  font-size: 18px !important;
  color: #6b7280 !important;
}
.rp-ticket-attachment-name {
  flex: 1 !important;
  font-size: 13px !important;
  color: #374151 !important;
  font-weight: 500 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.rp-ticket-attachment-download {
  display: flex !important;
  align-items: center !important;
  color: #7c3aed !important;
  text-decoration: none !important;
}
.rp-ticket-attachment-download:hover {
  color: #6d28d9 !important;
}
.rp-ticket-encrypted-notice {
  margin-top: 12px !important;
  font-size: 12px !important;
  color: #f59e0b !important;
  font-weight: 500 !important;
}
.rp-ticket-rating {
  margin-top: 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rp-ticket-rating .rating-box {
  display: inline-flex !important;
}
.rp-ticket-rating .rating-box input[type="number"] {
  width: 50px !important;
  height: 32px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  text-align: center !important;
  font-size: 14px !important;
  color: #374151 !important;
  background: #f9fafb !important;
}
.rp-ticket-rating-label {
  font-size: 12px !important;
  color: #6b7280 !important;
}
.rp-ticket-report-link {
  margin-top: 8px !important;
}
.rp-ticket-report-link a {
  font-size: 12px !important;
  color: #f59e0b !important;
  text-decoration: none !important;
}
.rp-ticket-report-link a:hover {
  text-decoration: underline !important;
}

/* Reply form */
.rp-ticket-reply-wrap {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
}
.rp-ticket-reply-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 16px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-ticket-reply-textarea-wrap {
  margin-bottom: 16px !important;
}
.rp-ticket-reply-textarea-wrap textarea {
  min-height: 120px !important;
}
.rp-ticket-reply-options {
  margin: 16px 0 !important;
}
.rp-ticket-reply-options .rp-settings-option {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: #374151 !important;
}
.rp-ticket-reply-submit {
  margin-top: 16px !important;
}

/* Warning button small */
.rp-btn-warning-sm {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  background: #fff7ed !important;
  color: #c2410c !important;
  border: 1px solid #fed7aa !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.rp-btn-warning-sm:hover {
  background: #ffedd5 !important;
}

/* Report & Rate ticket pages */
.rp-ticket-report-note {
  font-size: 14px !important;
  color: #6b7280 !important;
  margin: 0 !important;
  line-height: 1.6 !important;
}
.rp-ticket-report-quote {
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  padding: 16px 20px !important;
  background: #f9fafb !important;
  margin-bottom: 16px !important;
}
.rp-ticket-report-quote-header {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
}
.rp-ticket-report-quote-header strong {
  font-size: 14px !important;
  color: #111827 !important;
}
.rp-ticket-report-quote-body {
  font-size: 14px !important;
  color: #374151 !important;
  line-height: 1.7 !important;
  word-break: break-word !important;
}
.rp-ticket-rate-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.rp-ticket-rate-detail {
  font-size: 14px !important;
  color: #374151 !important;
}
.rp-ticket-rate-label {
  color: #6b7280 !important;
  margin-right: 6px !important;
}
.rp-ticket-rating-input .rating {
  display: flex !important;
  gap: 16px !important;
}
.rp-ticket-rating-input .rating-icon {
  font-size: 36px !important;
  cursor: pointer !important;
  opacity: 0.6 !important;
  transition: opacity 0.2s ease, transform 0.2s ease !important;
}
.rp-ticket-rating-input .rating-icon:hover {
  opacity: 1 !important;
  transform: scale(1.1) !important;
}

/* ==========================================================================
   NETWORK STATUS (Status Updates) PAGE
   ========================================================================== */
.rp-netstat-wrap {
  max-width: 100% !important;
}
.rp-netstat-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
.rp-netstat-badge-online {
  background: #f0fdf4 !important;
  color: #15803d !important;
}
.rp-netstat-badge-offline {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
.rp-netstat-value {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
}
.rp-netstat-value-muted {
  color: #9ca3af !important;
}
.rp-netstat-loading {
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  border: 2px solid #e5e7eb !important;
  border-top-color: #7c3aed !important;
  border-radius: 50% !important;
  animation: rp-spin 0.6s linear infinite !important;
}
@keyframes rp-spin {
  to { transform: rotate(360deg); }
}

/* ==========================================================================
   CLIENT NOTES MODULE — CSS Override
   ========================================================================== */
body.template_rdpcore .section-servicenotes {
  max-width: 100% !important;
  padding: 32px 48px !important;
  margin: 0 auto !important;
}
body.template_rdpcore .section-servicenotes .wbox {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 24px !important;
  overflow: hidden !important;
  width: 100% !important;
}
body.template_rdpcore .section-servicenotes .wbox_header {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin: 0 0 16px !important;
  padding: 0 0 16px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
body.template_rdpcore .section-servicenotes .wbox_content1 {
  padding: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
}
body.template_rdpcore .section-servicenotes .alert-info {
  background: #f9fafb !important;
  border: 1px solid #f3f4f6 !important;
  border-radius: 8px !important;
  padding: 14px 16px 32px !important;
  margin: 0 0 10px !important;
  color: #374151 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  position: relative !important;
  box-shadow: none !important;
}
body.template_rdpcore .section-servicenotes .topright {
  position: absolute !important;
  bottom: 10px !important;
  right: 14px !important;
  font-size: 11px !important;
  color: #9ca3af !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .section-servicenotes .text-muted {
  font-size: 14px !important;
  color: #9ca3af !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  padding: 20px 0 !important;
}
/* Fix: section-main should not clip dropdowns */
body.template_rdpcore .section-main {
  overflow: visible !important;
}

/* ==========================================================================
   WHOIS LOOKUP MODULE — CSS Override
   ========================================================================== */
body.template_rdpcore [class*="whoislookup"] .padding.white-bg,
body.template_rdpcore .body-content .padding.white-bg {
  background: transparent !important;
  padding: 32px 48px !important;
  max-width: 100% !important;
}
body.template_rdpcore .body-content .padding.white-bg > h3 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
}
body.template_rdpcore .body-content .padding.white-bg > form {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
}
body.template_rdpcore .body-content .padding.white-bg > form .form-group label {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin-bottom: 6px !important;
  display: block !important;
}
body.template_rdpcore .body-content .padding.white-bg > form .form-control {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  height: auto !important;
  min-height: 42px !important;
  max-width: 100% !important;
  width: 400px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  transition: border-color 0.2s ease !important;
}
body.template_rdpcore .body-content .padding.white-bg > form .form-control:focus {
  border-color: rgba(123, 92, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
  outline: none !important;
}
body.template_rdpcore .body-content .padding.white-bg > form .btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 32px !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.25) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}
body.template_rdpcore .body-content .padding.white-bg > form .btn-primary:hover {
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.3) !important;
  transform: translateY(-1px) !important;
}
/* Whois results */
body.template_rdpcore .body-content .padding.white-bg .well,
body.template_rdpcore .body-content .padding.white-bg .card-body.bg-light {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
}
body.template_rdpcore .body-content .padding.white-bg pre {
  background: #f9fafb !important;
  border: 1px solid #f3f4f6 !important;
  border-radius: 8px !important;
  padding: 16px !important;
  font-size: 12px !important;
  color: #374151 !important;
  font-family: 'JetBrains Mono', 'Fira Code', monospace !important;
  white-space: pre-wrap !important;
  word-break: break-all !important;
  margin: 0 !important;
  max-height: 500px !important;
  overflow-y: auto !important;
}
body.template_rdpcore .body-content .padding.white-bg .btn-success {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 20px !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  background: #059669 !important;
  color: #ffffff !important;
  border: none !important;
  text-decoration: none !important;
  margin-left: 12px !important;
}
body.template_rdpcore .body-content .padding.white-bg .btn-success:hover {
  background: #047857 !important;
}

/* ==========================================================================
   SERVICES LIST — Filter Box
   ========================================================================== */
.rp-services-filter-box {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 20px 24px !important;
  margin-bottom: 20px !important;
}
.rp-services-filter-row {
  margin-bottom: 16px !important;
}
.rp-services-filter-field {
  max-width: 280px !important;
}
.rp-services-filter-field label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  display: block !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-services-filter-field .selectize-control {
  max-width: 280px !important;
}
.rp-services-filter-field .selectize-input {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  min-height: 38px !important;
  box-shadow: none !important;
  background: #ffffff !important;
}
.rp-services-filter-field .selectize-input.focus {
  border-color: rgba(123, 92, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(123,92,255,0.08) !important;
}
.rp-services-filter-field .selectize-dropdown {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
  margin-top: 4px !important;
}
.rp-services-filter-field .selectize-dropdown .option {
  padding: 8px 12px !important;
  font-size: 13px !important;
}
.rp-services-filter-field .selectize-dropdown .option.active {
  background: #f5f3ff !important;
  color: #7c3aed !important;
}
.rp-services-filter-checks {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  margin-bottom: 16px !important;
}
.rp-services-filter-checks .rp-settings-option {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: #374151 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-services-filter-checks .rp-settings-option input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  border-radius: 4px !important;
  accent-color: #7c3aed !important;
  cursor: pointer !important;
}
.rp-services-filter-actions {
  display: flex !important;
  gap: 10px !important;
  padding-top: 12px !important;
  border-top: 1px solid #f3f4f6 !important;
}
.rp-services-filter-actions .rp-btn-primary {
  padding: 8px 20px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
}
.rp-services-filter-actions .rp-btn-secondary {
  padding: 8px 20px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
}
.rp-tab-nav-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rp-tab-nav-actions .rp-btn,
.rp-tab-nav-actions .rp-btn-secondary,
.rp-tab-nav-actions .rp-btn-primary {
  padding: 8px 16px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
  font-weight: 500 !important;
}

/* Services/Domains table — Status badges (no border, dashboard style) */
body.template_rdpcore .section-main .badge[class*="badge-"] {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  line-height: 1.4 !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  box-shadow: none !important;
  outline: none !important;
  background: #f3f4f6 !important;
  color: #4b5563 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .section-main .badge-Active {
  background: #f0fdf4 !important;
  color: #15803d !important;
}
body.template_rdpcore .section-main .badge-Pending {
  background: #f3f4f6 !important;
  color: #4b5563 !important;
}
body.template_rdpcore .section-main .badge-Suspended {
  background: #fff7ed !important;
  color: #c2410c !important;
}
body.template_rdpcore .section-main .badge-Terminated {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
body.template_rdpcore .section-main .badge-Cancelled {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
body.template_rdpcore .section-main .badge-Fraud {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
body.template_rdpcore .section-main .badge-Expired {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
body.template_rdpcore .section-main .badge-warning {
  background: #fff7ed !important;
  color: #c2410c !important;
}
body.template_rdpcore .section-main .badge-primary {
  background: #ede9fe !important;
  color: #7c3aed !important;
}
.badge.badge-primary {
  background: #ede9fe !important;
  color: #7c3aed !important;
  border: 1px solid #ddd6fe !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
}
body.template_rdpcore .section-main .badge-primary:empty {
  display: none !important;
}
.badge.badge-primary:empty {
  display: none !important;
}

/* Services table — dropdown menu overflow fix */
body.template_rdpcore .services-table .dropdown-menu {
  z-index: 1050 !important;
}

/* ==========================================================================
   SERVICE DETAIL PAGE — CSS Only (SolusVM VPS Panel)
   ========================================================================== */

/* Breadcrumb */
.rp-vps-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 16px !important;
  padding: 24px 24px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-breadcrumb a {
  font-size: 13px !important;
  color: #6b7280 !important;
  text-decoration: none !important;
}
.rp-vps-breadcrumb a:hover { color: #7c3aed !important; }
.rp-vps-header-hostname {
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-header-plan {
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #9ca3af !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin-top: 4px !important;
}

/* Header Card */
.rp-vps-header {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  padding: 0 !important;
  margin: 0 24px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
.rp-vps-header-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 20px 24px !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}
.rp-vps-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.rp-vps-header-icon {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.rp-vps-header-icon .material-symbols-outlined { font-size: 20px !important; color: #fff !important; }
.rp-vps-header-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.rp-vps-header-name {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-status-badge {
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
}
.rp-vps-status-active { background: #f0fdf4 !important; color: #15803d !important; border-color: #dcfce7 !important; }
.rp-vps-status-suspended { background: #fff7ed !important; color: #c2410c !important; border-color: #fed7aa !important; }
.rp-vps-status-terminated, .rp-vps-status-cancelled { background: #fef2f2 !important; color: #dc2626 !important; border-color: #fecaca !important; }
.rp-vps-label-badge { padding: 3px 10px !important; border-radius: 20px !important; font-size: 11px !important; font-weight: 600 !important; background: #ede9fe !important; color: #7c3aed !important; border: 1px solid #ddd6fe !important; }
.rp-vps-header-meta {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 12px 24px !important;
  background: transparent !important;
  border-top: 1px solid #f3f4f6 !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  flex-wrap: wrap !important;
}
.rp-vps-header-meta span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.rp-vps-header-meta span + span::before {
  content: '' !important;
  width: 3px !important;
  height: 3px !important;
  border-radius: 50% !important;
  background: #d1d5db !important;
  margin: 0 8px !important;
}
.rp-vps-header-meta .material-symbols-outlined {
  color: #9ca3af !important;
}
.rp-vps-header-actions { display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }

/* Buttons */
.rp-vps-btn {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 18px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  white-space: nowrap !important;
  border: 1px solid transparent !important;
}
.rp-vps-btn-primary { background: linear-gradient(135deg, #7C3AED, #9333EA) !important; color: #fff !important; }
.rp-vps-btn-primary:hover { box-shadow: 0 4px 12px rgba(124,58,237,0.3) !important; color: #fff !important; }
.rp-vps-btn-back { background: #ffffff !important; color: #374151 !important; border-color: #e5e7eb !important; text-decoration: none !important; }
.rp-vps-btn-back:hover { border-color: #d1d5db !important; background: #f9fafb !important; color: #111827 !important; text-decoration: none !important; }
.rp-vps-btn-outline { background: #fff !important; color: #374151 !important; border-color: #e5e7eb !important; }
.rp-vps-btn-outline:hover { border-color: #7c3aed !important; color: #7c3aed !important; }
.rp-vps-btn-danger-outline { background: #fff !important; color: #dc2626 !important; border-color: #fecaca !important; }
.rp-vps-btn-danger-outline:hover { background: #fef2f2 !important; }

/* Layout */
.rp-vps-layout {
  display: grid !important;
  grid-template-columns: 220px 1fr !important;
  gap: 20px !important;
  align-items: start !important;
  padding: 0 24px 40px 24px !important;
}

/* Sidebar */
.rp-vps-sidebar {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  padding: 8px 0 !important;
  position: sticky !important;
  top: 100px !important;
}
.rp-vps-nav-section {
  font-size: 10px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  color: #9ca3af !important;
  padding: 14px 20px 6px !important;
  margin-top: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  border-top: 1px solid #f3f4f6 !important;
}
.rp-vps-nav-section:first-child { border-top: none !important; }
.rp-vps-nav-section-danger { color: #dc2626 !important; }
.rp-vps-nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 20px !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  font-weight: 450 !important;
  color: #374151 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  border-left: 3px solid transparent !important;
}
.rp-vps-nav-item:hover { background: #f9fafb !important; color: #111827 !important; text-decoration: none !important; }
.rp-vps-nav-item.active {
  background: #f5f3ff !important;
  color: #7c3aed !important;
  font-weight: 500 !important;
  border-left-color: #7c3aed !important;
}
.rp-vps-nav-item .material-symbols-outlined { font-size: 16px !important; flex-shrink: 0 !important; color: #6b7280 !important; }
.rp-vps-nav-item.active .material-symbols-outlined { color: #7c3aed !important; }
.rp-vps-nav-item-danger { color: #dc2626 !important; }
.rp-vps-nav-item-danger .material-symbols-outlined { color: #dc2626 !important; }
.rp-vps-nav-item-danger:hover { background: #fef2f2 !important; color: #dc2626 !important; }

/* Content */
.rp-vps-content { min-width: 0 !important; }
.rp-vps-content > #content-cloud { width: 100% !important; }
.rp-vps-details-card,
.rp-vps-billing-card,
.rp-vps-reinstall-card,
.rp-vps-rescue-section,
.rp-vps-upgrade-card,
.rp-vps-usage-page,
.rp-vps-billing-page,
.rp-vps-backup-page,
.rp-vps-content .wbox {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Details card */
.rp-vps-details-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 0 !important;
  margin-bottom: 16px !important;
  margin-top: 0 !important;
}
/* Hide empty upgrade section spacing */
body.template_rdpcore .rp-vps-content .upgrade-service:empty { display: none !important; }
body.template_rdpcore .rp-vps-content > #content-cloud { padding: 0 !important; margin: 0 !important; }
body.template_rdpcore .rp-vps-content > #content-cloud > *:first-child { margin-top: 0 !important; }
.rp-vps-details-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  padding: 18px 24px !important;
  margin: 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Config grid */
.rp-vps-config-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
}
.rp-vps-config-item {
  padding: 14px 24px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.rp-vps-config-item:nth-child(odd) { border-right: 1px solid #f3f4f6 !important; }
.rp-vps-config-item:nth-last-child(-n+2) { border-bottom: none !important; }
.rp-vps-config-label {
  font-size: 12px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-config-value {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-power-online { color: #15803d !important; font-weight: 500 !important; margin-left: 10px !important; }
.rp-vps-power-offline { color: #dc2626 !important; font-weight: 500 !important; margin-left: 10px !important; }
.rp-vps-power-processing {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #6b7280 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
.rp-vps-spinner {
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid #e5e7eb !important;
  border-top-color: #7c3aed !important;
  border-radius: 50% !important;
  animation: rp-spin 0.6s linear infinite !important;
}

/* Power state — no custom toggle, use original module styling */
.rp-vps-password-field { display: flex !important; align-items: center !important; gap: 8px !important; }
.rp-vps-password-dots { color: #6b7280 !important; letter-spacing: 2px !important; }
.rp-vps-password-toggle { color: #9ca3af !important; text-decoration: none !important; }
.rp-vps-password-toggle:hover { color: #7c3aed !important; }
.rp-vps-password-toggle .material-symbols-outlined { font-size: 18px !important; }

/* Billing bar */
.rp-vps-billing-bar {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.rp-vps-billing-bar-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 14px !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-bar-left .material-symbols-outlined { font-size: 18px !important; color: #7c3aed !important; }
.rp-vps-billing-price { color: #6b7280 !important; font-weight: 400 !important; }
.rp-vps-billing-link { font-size: 13px !important; color: #7c3aed !important; font-weight: 600 !important; text-decoration: none !important; }
.rp-vps-billing-link:hover { color: #6d28d9 !important; }

/* Hide old cloud styles */
body.template_rdpcore .cloud-top { display: none !important; }
body.template_rdpcore .cloud-nav { display: none !important; }
body.template_rdpcore .header-bar { display: none !important; }
body.template_rdpcore .content-bar { display: none !important; }
body.template_rdpcore .vm-details { display: none !important; }
body.template_rdpcore #content-cloud { padding: 0 !important; margin: 0 !important; width: 100% !important; }
body.template_rdpcore #content-cloud > #lockable-vm-menu { display: none !important; }
body.template_rdpcore #content-cloud > .header-bar { display: none !important; }
body.template_rdpcore .rp-vps-content .upgrade-service { margin-top: 0 !important; }

/* Usage & Monitoring Page */
.rp-vps-usage-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-usage-header {
  margin-bottom: 24px !important;
}
.rp-vps-usage-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-usage-subtitle {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 !important;
  font-weight: 400 !important;
}

/* Graph Cards */
.rp-vps-graph-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  margin-bottom: 20px !important;
  overflow: hidden !important;
  transition: box-shadow 0.2s ease !important;
}
.rp-vps-graph-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
}
.rp-vps-graph-header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-vps-graph-icon {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.rp-vps-graph-icon .material-symbols-outlined {
  font-size: 17px !important;
}
.rp-vps-graph-icon-cpu { background: rgba(124, 58, 237, 0.1) !important; }
.rp-vps-graph-icon-cpu .material-symbols-outlined { color: #7C3AED !important; }
.rp-vps-graph-icon-mem { background: rgba(239, 68, 68, 0.1) !important; }
.rp-vps-graph-icon-mem .material-symbols-outlined { color: #EF4444 !important; }
.rp-vps-graph-icon-net { background: rgba(16, 185, 129, 0.1) !important; }
.rp-vps-graph-icon-net .material-symbols-outlined { color: #10B981 !important; }
.rp-vps-graph-icon-disk { background: rgba(59, 130, 246, 0.1) !important; }
.rp-vps-graph-icon-disk .material-symbols-outlined { color: #3B82F6 !important; }
.rp-vps-graph-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.rp-vps-graph-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-graph-unit {
  font-size: 12px !important;
  color: #9ca3af !important;
  font-weight: 400 !important;
}
.rp-vps-graph-body {
  padding: 16px 20px 20px !important;
  position: relative !important;
  min-height: 200px !important;
  background: #ffffff !important;
}
.rp-vps-graph-body canvas {
  width: 100% !important;
  max-width: 100% !important;
}

/* Loading state */
.rp-vps-graph-loading {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.8) !important;
  z-index: 2 !important;
}
.rp-vps-graph-spinner {
  width: 28px !important;
  height: 28px !important;
  border: 3px solid #e5e7eb !important;
  border-top-color: #7c3aed !important;
  border-radius: 50% !important;
  animation: rp-spin 0.7s linear infinite !important;
}

/* Override: hide original content-bar on usage page (it's replaced by our cards) */
body.template_rdpcore .rp-vps-usage-page ~ .content-bar,
body.template_rdpcore .rp-vps-content .content-bar {
  display: none !important;
}

/* Billing Page */
.rp-vps-billing-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-page-header {
  margin-bottom: 24px !important;
}
.rp-vps-billing-page-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 4px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-page-subtitle {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 !important;
  font-weight: 400 !important;
}

/* Balance cards (flavor/metered billing) */
.rp-vps-billing-balance {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}
.rp-vps-billing-balance-item {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  text-decoration: none !important;
}
.rp-vps-billing-balance-value {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-balance-label {
  font-size: 13px !important;
  color: #6b7280 !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.rp-vps-billing-balance-label .material-symbols-outlined { font-size: 14px !important; }
.rp-vps-billing-balance-danger .rp-vps-billing-balance-value { color: #dc2626 !important; }
.rp-vps-billing-balance-success .rp-vps-billing-balance-value { color: #15803d !important; }
.rp-vps-billing-balance-action { border-color: #7c3aed !important; transition: box-shadow 0.2s ease !important; }
.rp-vps-billing-balance-action:hover { box-shadow: 0 4px 12px rgba(124, 58, 237, 0.15) !important; text-decoration: none !important; }
.rp-vps-billing-balance-action .rp-vps-billing-balance-value { color: #7c3aed !important; font-size: 15px !important; font-weight: 600 !important; }

/* Billing cards */
.rp-vps-billing-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  margin-bottom: 20px !important;
  overflow: hidden !important;
}
.rp-vps-billing-card-header {
  padding: 16px 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-vps-billing-card-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-card-body {
  padding: 4px 0 !important;
}
.rp-vps-billing-card-body-table {
  padding: 0 !important;
}

/* Billing grid rows */
.rp-vps-billing-grid {
  display: flex !important;
  flex-direction: column !important;
}
.rp-vps-billing-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 20px !important;
  border-bottom: 1px solid #f9fafb !important;
}
.rp-vps-billing-row:last-child { border-bottom: none !important; }
.rp-vps-billing-label {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-weight: 500 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-value {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #111827 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-cycle {
  font-size: 12px !important;
  color: #9ca3af !important;
  font-weight: 400 !important;
}
.rp-vps-billing-overdue { color: #dc2626 !important; }
.rp-vps-billing-cancel-link {
  font-size: 12px !important;
  color: #dc2626 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  background: #fef2f2 !important;
}
.rp-vps-billing-cancel-link:hover { background: #fee2e2 !important; }
.rp-vps-billing-invoice-link {
  font-size: 12px !important;
  color: #7c3aed !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.rp-vps-billing-invoice-link:hover { text-decoration: underline !important; }

/* Billing table (addons) */
.rp-vps-billing-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-billing-table thead th {
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  letter-spacing: 0.03em !important;
  padding: 10px 20px !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  text-align: left !important;
}
.rp-vps-billing-table tbody td {
  font-size: 13px !important;
  color: #374151 !important;
  padding: 12px 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-vps-billing-table tbody tr:last-child td { border-bottom: none !important; }
.rp-vps-billing-addon-cta {
  font-size: 13px !important;
  color: #6b7280 !important;
  padding: 12px 20px !important;
  margin: 0 !important;
}
.rp-vps-billing-addon-cta a { color: #7c3aed !important; }

/* Widget styling (changelabel, etc. rendered inside #content-cloud) */
.rp-vps-content .section-changelabel {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 0 20px 0 !important;
}
.rp-vps-content .wbox {
  background: #ffffff !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-content .wbox_header {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  padding: 0 0 16px 0 !important;
  margin: 0 !important;
  border-bottom: none !important;
  background: transparent !important;
}
.rp-vps-content .wbox_content {
  padding: 0 !important;
}
.rp-vps-content .wbox_content .form-group {
  margin-bottom: 12px !important;
}
/* Selectize inline style override */
.rp-vps-content .selectize-input {
  max-height: none !important;
  min-height: 42px !important;
  padding: 9px 12px !important;
  border-radius: 8px !important;
  border-color: #e5e7eb !important;
  box-shadow: none !important;
  background-image: none !important;
  background-color: #fff !important;
}
.rp-vps-content .selectize-control.single .selectize-input {
  box-shadow: none !important;
  background-image: none !important;
  background-color: #fff !important;
  border-color: #e5e7eb !important;
}
.rp-vps-content .selectize-input.focus,
.rp-vps-content .selectize-input.dropdown-active {
  border-color: #7c3aed !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-content .selectize-dropdown {
  border-color: #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  margin-top: 4px !important;
}
.rp-vps-content .selectize-dropdown .option.active,
.rp-vps-content .selectize-dropdown .active:not(.selected) {
  background: #f5f3ff !important;
  color: #7c3aed !important;
}

/* Reinstall / Rebuild OS Page */
.rp-vps-reinstall-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-reinstall-header {
  margin-bottom: 20px !important;
}
.rp-vps-reinstall-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 6px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-reinstall-warning {
  font-size: 13px !important;
  color: #dc2626 !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  border-radius: 8px !important;
  line-height: 1.5 !important;
}
.rp-vps-reinstall-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
}
.rp-vps-reinstall-field {
  margin-bottom: 20px !important;
}
.rp-vps-reinstall-label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-reinstall-required {
  color: #dc2626 !important;
}
.rp-vps-reinstall-select,
.rp-vps-reinstall-input {
  width: 100% !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: #111827 !important;
  background: #ffffff !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  height: auto !important;
  overflow: visible !important;
}
.rp-vps-reinstall-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 36px !important;
}
.rp-vps-reinstall-select:focus,
.rp-vps-reinstall-input:focus {
  border-color: #7c3aed !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-reinstall-info {
  font-size: 14px !important;
  color: #6b7280 !important;
  margin: 0 0 20px 0 !important;
}
.rp-vps-reinstall-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding-top: 8px !important;
}
.rp-vps-btn-danger {
  background: #dc2626 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
}
.rp-vps-btn-danger:hover {
  background: #b91c1c !important;
  color: #fff !important;
}

/* Rescue Mode Page */
.rp-vps-rescue-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-rescue-section {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  margin-bottom: 20px !important;
}
.rp-vps-rescue-title {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 6px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-rescue-desc {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 20px 0 !important;
  line-height: 1.5 !important;
}
.rp-vps-rescue-options {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
  margin-bottom: 16px !important;
}
.rp-vps-rescue-option {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 16px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  cursor: pointer !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
  text-align: left !important;
  position: relative !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-rescue-option:hover:not(:disabled) {
  border-color: #7c3aed !important;
  box-shadow: 0 2px 8px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-rescue-option:disabled {
  cursor: default !important;
  opacity: 0.7 !important;
}
.rp-vps-rescue-option-active {
  border-color: #7c3aed !important;
  background: #faf5ff !important;
}
.rp-vps-rescue-option-icon {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 8px !important;
  background: rgba(124, 58, 237, 0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.rp-vps-rescue-option-icon .material-symbols-outlined {
  font-size: 18px !important;
  color: #7c3aed !important;
}
.rp-vps-rescue-option-icon-warn {
  background: rgba(245, 158, 11, 0.1) !important;
}
.rp-vps-rescue-option-icon-warn .material-symbols-outlined {
  color: #f59e0b !important;
}
.rp-vps-rescue-option-text {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.rp-vps-rescue-option-text strong {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111827 !important;
}
.rp-vps-rescue-option-text small {
  font-size: 12px !important;
  color: #6b7280 !important;
  line-height: 1.4 !important;
}
.rp-vps-rescue-badge {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
  background: #f0fdf4 !important;
  color: #15803d !important;
}
.rp-vps-rescue-badge-warn {
  background: #fffbeb !important;
  color: #d97706 !important;
}
.rp-vps-rescue-info {
  font-size: 12px !important;
  color: #9ca3af !important;
  line-height: 1.5 !important;
  margin-top: 8px !important;
}
.rp-vps-rescue-actions {
  margin-top: 4px !important;
}

/* Backup Page */
.rp-vps-backup-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 20px !important;
}
.rp-vps-backup-top .rp-vps-rescue-title { margin-bottom: 0 !important; }
.rp-vps-backup-create-form { margin: 0 !important; }
.rp-vps-backup-list {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
.rp-vps-backup-list-header {
  display: grid !important;
  grid-template-columns: 80px 100px 100px 1fr auto !important;
  gap: 12px !important;
  padding: 10px 16px !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  letter-spacing: 0.03em !important;
}
.rp-vps-backup-item {
  display: grid !important;
  grid-template-columns: 80px 100px 100px 1fr auto !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  align-items: center !important;
  font-size: 13px !important;
  color: #374151 !important;
}
.rp-vps-backup-item:last-child { border-bottom: none !important; }
.rp-vps-backup-id { font-weight: 500 !important; font-family: monospace !important; }
.rp-vps-backup-actions {
  display: flex !important;
  gap: 8px !important;
}
.rp-vps-btn-sm {
  padding: 5px 12px !important;
  font-size: 12px !important;
  border-radius: 6px !important;
}
/* Backup Schedule Grid */
.rp-vps-backup-schedule-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 20px !important;
}
.rp-vps-backup-schedule-form .chosen-container {
  width: 100% !important;
}

/* Upgrade / Downgrade Page */
.rp-vps-upgrade-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-upgrade-header {
  margin-bottom: 20px !important;
}
.rp-vps-upgrade-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-upgrade-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  margin-bottom: 20px !important;
}
.rp-vps-upgrade-subtitle {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 16px 0 !important;
}
.rp-vps-upgrade-table-wrap {
  overflow-x: auto !important;
  margin-bottom: 16px !important;
}
.rp-vps-upgrade-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-upgrade-table thead th {
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  letter-spacing: 0.03em !important;
  padding: 10px 12px !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  text-align: left !important;
}
.rp-vps-upgrade-table tbody td {
  font-size: 13px !important;
  color: #374151 !important;
  padding: 12px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle !important;
}
.rp-vps-upgrade-table tbody select,
.rp-vps-upgrade-table tbody input[type="number"],
.rp-vps-upgrade-table tbody input[type="text"] {
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  font-size: 13px !important;
  color: #111827 !important;
  background: #fff !important;
}
.rp-vps-upgrade-table tbody select:focus,
.rp-vps-upgrade-table tbody input:focus {
  border-color: #7c3aed !important;
  outline: none !important;
}
.rp-vps-upgrade-table tfoot td {
  font-size: 13px !important;
  color: #111827 !important;
  padding: 12px !important;
  border-top: 1px solid #e5e7eb !important;
}
.rp-vps-upgrade-price-col { text-align: right !important; }
.rp-vps-upgrade-total-label { text-align: right !important; }
.rp-vps-upgrade-total-value { text-align: right !important; font-weight: 600 !important; }
.rp-vps-upgrade-actions {
  display: flex !important;
  justify-content: flex-end !important;
  padding-top: 12px !important;
}
.rp-vps-upgrade-select-wrap {
  margin-bottom: 16px !important;
}
.rp-vps-upgrade-select-label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
}
.rp-vps-upgrade-billing {
  margin-bottom: 16px !important;
}
.rp-vps-upgrade-descriptions {
  margin-top: 16px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  line-height: 1.5 !important;
}
.rp-vps-upgrade-subproducts {
  display: flex !important;
  flex-direction: column !important;
}
.rp-vps-upgrade-subproduct-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  font-size: 13px !important;
  color: #374151 !important;
}
.rp-vps-upgrade-subproduct-row:last-child { border-bottom: none !important; }
.rp-vps-upgrade-order-link {
  font-size: 13px !important;
  color: #7c3aed !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.rp-vps-upgrade-order-link:hover { text-decoration: underline !important; }
.rp-vps-content .wbox_content p {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.5 !important;
}
/* Form inputs — selectize OLMAYAN normal input'lar için */
.rp-vps-content .wbox_content .form-group:not(:has(.selectize-control)) .form-control,
.rp-vps-content .wbox_content input.inp:not([id*="selectize"]),
.rp-vps-content .wbox_content textarea.form-control {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  color: #111827 !important;
  background: #ffffff !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.rp-vps-content .wbox_content .form-group:not(:has(.selectize-control)) .form-control:focus,
.rp-vps-content .wbox_content textarea.form-control:focus {
  border-color: #7c3aed !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-content .wbox_content .form-control:focus,
.rp-vps-content .wbox_content .inp:focus {
  border-color: #7c3aed !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-content .wbox_content .btn-primary,
.rp-vps-content .wbox_content input[type="submit"] {
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  transition: box-shadow 0.2s ease !important;
}
.rp-vps-content .wbox_content .btn-primary:hover,
.rp-vps-content .wbox_content input[type="submit"]:hover {
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3) !important;
}
.rp-vps-content .wbox_content .selectized-small-text {
  font-size: 12px !important;
  color: #9ca3af !important;
  margin-top: 6px !important;
  display: block !important;
}
/* Widget select & table */
.rp-vps-content .wbox_content select {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  color: #111827 !important;
  background: #ffffff !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  width: 100% !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 36px !important;
  height: auto !important;
  line-height: 1.4 !important;
  overflow: visible !important;
}
.rp-vps-content .wbox_content select:focus {
  border-color: #7c3aed !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-content .wbox_content .table {
  width: 100% !important;
  border: none !important;
  margin: 0 0 16px 0 !important;
}
.rp-vps-content .wbox_content .table td {
  border: none !important;
  padding: 12px 12px !important;
  font-size: 13px !important;
  color: #374151 !important;
  vertical-align: middle !important;
  text-align: left !important;
}
.rp-vps-content .wbox_content .table td strong {
  font-weight: 600 !important;
  color: #111827 !important;
}
.rp-vps-content .wbox_content .table thead th {
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  letter-spacing: 0.03em !important;
  padding: 10px 12px !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  border-top: none !important;
}
.rp-vps-content .wbox_content .table tbody tr {
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-vps-content .wbox_content .table tbody tr:last-child {
  border-bottom: none !important;
}
.rp-vps-content .wbox_content .table tbody td a {
  color: #7c3aed !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.rp-vps-content .wbox_content .table tbody td a:hover {
  text-decoration: underline !important;
}
.rp-vps-content .wbox_content .table-striped tbody tr:nth-of-type(odd) {
  background: transparent !important;
}
.rp-vps-content .wbox_content .text-muted,
.rp-vps-content .wbox_content section.text-center {
  font-size: 14px !important;
  color: #9ca3af !important;
  padding: 24px 0 !important;
}
/* Invoice/status badges inside widgets */
.rp-vps-content .wbox_content .badge {
  display: inline-block !important;
  padding: 3px 8px !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}
.rp-vps-content .wbox_content .badge-Paid,
.rp-vps-content .wbox_content .badge-Active {
  background: #f0fdf4 !important;
  color: #15803d !important;
}
.rp-vps-content .wbox_content .badge-Unpaid,
.rp-vps-content .wbox_content .badge-Overdue {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
.rp-vps-content .wbox_content .badge-Cancelled,
.rp-vps-content .wbox_content .badge-Refunded {
  background: #f3f4f6 !important;
  color: #6b7280 !important;
}
/* Widget radio/checkbox styling */
.rp-vps-content .wbox_content input[type="radio"],
.rp-vps-content .wbox_content input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: #7c3aed !important;
  margin-right: 6px !important;
  vertical-align: middle !important;
  cursor: pointer !important;
}
.rp-vps-content .wbox_content .checker td {
  padding: 12px 16px !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-vps-content .wbox_content .checker td[align="right"] {
  text-align: left !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  font-size: 13px !important;
}
.rp-vps-content .wbox_content .checker td b {
  font-weight: 600 !important;
  color: #111827 !important;
  font-size: 14px !important;
}
.rp-vps-content .wbox_content .btn-lg {
  width: auto !important;
  padding: 10px 24px !important;
  font-size: 14px !important;
}

/* Cancellation Request Page */
.rp-vps-cancel-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-cancel-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  margin-bottom: 24px !important;
}
.rp-vps-cancel-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 6px 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-vps-cancel-service {
  font-size: 14px !important;
  color: #6b7280 !important;
  margin: 0 !important;
}
.rp-vps-cancel-service strong {
  color: #111827 !important;
}
.rp-vps-cancel-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
}
.rp-vps-cancel-card-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin: 0 0 20px 0 !important;
}
.rp-vps-cancel-form {
  margin-bottom: 20px !important;
}
.rp-vps-cancel-reasons {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}
.rp-vps-cancel-reason {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 16px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: border-color 0.2s ease !important;
  font-size: 14px !important;
  color: #374151 !important;
}
.rp-vps-cancel-reason:hover {
  border-color: #7c3aed !important;
}
.rp-vps-cancel-reason input[type="radio"] {
  accent-color: #7c3aed !important;
  width: 16px !important;
  height: 16px !important;
}
.rp-vps-cancel-textarea {
  width: 100% !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  resize: vertical !important;
  box-sizing: border-box !important;
  line-height: 1.5 !important;
}
.rp-vps-cancel-textarea:focus {
  border-color: #7c3aed !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
.rp-vps-cancel-textarea:disabled {
  background: #f9fafb !important;
  color: #9ca3af !important;
}
.rp-vps-cancel-warning {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 16px !important;
  background: #fffbeb !important;
  border: 1px solid #fde68a !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  color: #92400e !important;
  margin-top: 16px !important;
}
.rp-vps-cancel-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.rp-vps-cancel-type-select {
  max-width: 240px !important;
}

/* Cancellation Request — CSS only (no template change) */
body.template_rdpcore .section-cancelation-request .card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
body.template_rdpcore .section-cancelation-request .card-header {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  padding: 18px 24px !important;
  background: #ffffff !important;
  border-bottom: 1px solid #f3f4f6 !important;
  border-radius: 12px 12px 0 0 !important;
}
body.template_rdpcore .section-cancelation-request .card-body {
  padding: 24px !important;
}
body.template_rdpcore .section-cancelation-request .radio {
  margin: 8px 0 !important;
}
body.template_rdpcore .section-cancelation-request .radio label {
  font-size: 14px !important;
  color: #374151 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
body.template_rdpcore .section-cancelation-request input[type="radio"] {
  accent-color: #7c3aed !important;
  width: 16px !important;
  height: 16px !important;
}
body.template_rdpcore .section-cancelation-request textarea {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  width: 100% !important;
  box-sizing: border-box !important;
  resize: vertical !important;
}
body.template_rdpcore .section-cancelation-request textarea:focus {
  border-color: #7c3aed !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1) !important;
}
body.template_rdpcore .section-cancelation-request .btn-danger {
  background: #dc2626 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .section-cancelation-request .btn-danger:hover {
  background: #b91c1c !important;
}
body.template_rdpcore .section-cancelation-request .form-control {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  height: auto !important;
  line-height: 1.4 !important;
  overflow: visible !important;
}
body.template_rdpcore .section-cancelation-request .alert-warning {
  background: #fffbeb !important;
  border: 1px solid #fde68a !important;
  border-radius: 8px !important;
  color: #92400e !important;
  font-size: 13px !important;
}
body.template_rdpcore .section-account-header h2 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .section-account-header h5 {
  font-size: 14px !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
  margin: 6px 0 0 0 !important;
}
body.template_rdpcore .section-account-header .btn-secondary {
  background: #fff !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 6px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
body.template_rdpcore .section-account-header .btn-secondary .material-icons {
  font-size: 16px !important;
}
body.template_rdpcore .section-account-header .btn-secondary:hover {
  border-color: #7c3aed !important;
  color: #7c3aed !important;
}

/* Responsive */
@media (max-width: 768px) {
  .rp-vps-layout { grid-template-columns: 1fr !important; }
  .rp-vps-sidebar { position: static !important; }
  .rp-vps-config-grid { grid-template-columns: 1fr !important; }
  .rp-vps-config-item:nth-child(odd) { border-right: none !important; }
  .rp-vps-header { flex-direction: column !important; align-items: flex-start !important; }
  .rp-vps-graph-header { padding: 12px 16px !important; }
  .rp-vps-graph-body { padding: 12px 12px 16px !important; min-height: 160px !important; }
  .rp-vps-graph-card { border-radius: 10px !important; }
  .rp-vps-billing-balance { grid-template-columns: 1fr !important; }
  .rp-vps-billing-row { flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; }
  .rp-vps-rescue-options { grid-template-columns: 1fr !important; }
  .rp-vps-backup-list-header, .rp-vps-backup-item { grid-template-columns: 1fr 1fr !important; }
  .rp-vps-backup-schedule-grid { grid-template-columns: 1fr !important; }
}
.rp-service-header {
  background: linear-gradient(135deg, #f8f6ff 0%, #f0fdf4 100%) !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  padding: 24px 28px !important;
  margin-bottom: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.rp-service-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.rp-service-header-icon {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.rp-service-header-icon .material-symbols-outlined {
  font-size: 22px !important;
  color: #ffffff !important;
}
.rp-service-header-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.rp-service-name {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-status-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
}
.rp-service-status-active {
  background: #f0fdf4 !important;
  color: #15803d !important;
  border-color: #bbf7d0 !important;
}
.rp-service-status-pending {
  background: #f3f4f6 !important;
  color: #374151 !important;
  border-color: #e5e7eb !important;
}
.rp-service-status-suspended {
  background: #fff7ed !important;
  color: #c2410c !important;
  border-color: #fed7aa !important;
}
.rp-service-status-terminated,
.rp-service-status-cancelled {
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border-color: #fecaca !important;
}
.rp-service-label-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: #ede9fe !important;
  color: #7c3aed !important;
  border: 1px solid #ddd6fe !important;
}
.rp-service-header-meta {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 4px !important;
  flex-wrap: wrap !important;
}
.rp-service-meta-item {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-meta-item::before {
  content: '·' !important;
  margin-right: 12px !important;
  color: #d1d5db !important;
}
.rp-service-meta-item:first-child::before {
  display: none !important;
}

/* Layout */
.rp-service-layout {
  display: grid !important;
  grid-template-columns: 220px 1fr !important;
  gap: 24px !important;
  align-items: start !important;
}

/* Sidebar */
.rp-service-sidebar {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 12px !important;
  position: sticky !important;
  top: 100px !important;
}
.rp-service-nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.rp-service-nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 12px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 450 !important;
  color: #374151 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-nav-item:hover {
  background: #f3f4f6 !important;
  color: #111827 !important;
  text-decoration: none !important;
}
.rp-service-nav-item.active {
  background: #f5f3ff !important;
  color: #7c3aed !important;
  font-weight: 500 !important;
}
.rp-service-nav-item .material-symbols-outlined {
  font-size: 18px !important;
  flex-shrink: 0 !important;
}
.rp-service-nav-danger {
  color: #dc2626 !important;
}
.rp-service-nav-danger:hover {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}
.rp-service-nav-section {
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  color: #9ca3af !important;
  padding: 12px 12px 4px !important;
  margin-top: 4px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Content */
.rp-service-content {
  min-width: 0 !important;
}
.rp-service-content .widget {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

/* Widget tables (ManageIP, Colocation Manager, etc.) */
.rp-service-content .widget .table-responsive {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.rp-service-content .widget .table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin-bottom: 0 !important;
}
.rp-service-content .widget .table thead th {
  padding: 10px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  text-align: left !important;
  white-space: nowrap !important;
}
.rp-service-content .widget .table tbody td {
  padding: 13px 16px !important;
  color: #111827 !important;
  background: #ffffff !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle !important;
}
.rp-service-content .widget .table tbody tr:last-child td {
  border-bottom: none !important;
}
.rp-service-content .widget .table tbody tr:hover {
  background: #f9fafb !important;
}
.rp-service-content .widget .table tbody td a {
  color: #7c3aed !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.rp-service-content .widget .table tbody td a:hover {
  text-decoration: underline !important;
}
/* Widget buttons (Show IPs, etc.) */
.rp-service-content .widget .table tbody td .btn,
.rp-service-content .widget .table tbody td a.btn {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #7c3aed !important;
  background: #f5f3ff !important;
  border: 1px solid #ede9fe !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-content .widget .table tbody td .btn:hover,
.rp-service-content .widget .table tbody td a.btn:hover {
  background: #ede9fe !important;
  border-color: #ddd6fe !important;
  color: #6d28d9 !important;
  text-decoration: none !important;
}

/* Modal styling (Edit IP, etc.) */
body.template_rdpcore .modal-content {
  border-radius: 14px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
  overflow: hidden !important;
}
body.template_rdpcore .modal-header {
  padding: 20px 24px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  background: #ffffff !important;
}
body.template_rdpcore .modal-header .modal-title,
body.template_rdpcore .modal-header h4,
body.template_rdpcore .modal-header h5 {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .modal-header .close,
body.template_rdpcore .modal-header button[data-dismiss="modal"] {
  font-size: 22px !important;
  color: #9ca3af !important;
  opacity: 1 !important;
  background: none !important;
  border: none !important;
}
body.template_rdpcore .modal-header .close:hover {
  color: #374151 !important;
}
body.template_rdpcore .modal-body {
  padding: 20px 24px !important;
}
body.template_rdpcore .modal-body label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  display: block !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .modal-body textarea,
body.template_rdpcore .modal-body input[type="text"],
body.template_rdpcore .modal-body input[type="email"],
body.template_rdpcore .modal-body input[type="number"],
body.template_rdpcore .modal-body select {
  width: 100% !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  color: #111827 !important;
  background: #ffffff !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
body.template_rdpcore .modal-body textarea:focus,
body.template_rdpcore .modal-body input[type="text"]:focus,
body.template_rdpcore .modal-body select:focus {
  border-color: rgba(123, 92, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(123, 92, 255, 0.08) !important;
  outline: none !important;
}
body.template_rdpcore .modal-footer {
  padding: 16px 24px !important;
  border-top: 1px solid #f3f4f6 !important;
  background: #ffffff !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 10px !important;
}
body.template_rdpcore .modal-footer .btn-primary,
body.template_rdpcore .modal-footer .btn-info {
  padding: 8px 20px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .modal-footer .btn-primary:hover,
body.template_rdpcore .modal-footer .btn-info:hover {
  opacity: 0.9 !important;
}
body.template_rdpcore .modal-footer .btn-default,
body.template_rdpcore .modal-footer [data-dismiss="modal"] {
  padding: 8px 20px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .modal-footer .btn-default:hover,
body.template_rdpcore .modal-footer [data-dismiss="modal"]:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
}

/* Colocation Manager widget */
.rp-colo-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 16px !important;
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  margin-bottom: 20px !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-colo-breadcrumb-link {
  color: #7c3aed !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.rp-colo-breadcrumb-link:hover {
  text-decoration: underline !important;
}
.rp-colo-breadcrumb-sep {
  color: #9ca3af !important;
}
.rp-colo-breadcrumb-current {
  color: #111827 !important;
  font-weight: 600 !important;
}
.rp-colo-rack-name {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 10px !important;
  display: inline-block !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-colo-zero-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  display: block !important;
  margin-bottom: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-colo-zero-devices {
  width: 200px !important;
  margin-bottom: 10px !important;
  background: #f9fafb !important;
  border-radius: 6px !important;
}
.rp-colo-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-colo-back-btn:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
  text-decoration: none !important;
}
.rp-colo-item-detail {
  margin-bottom: 28px !important;
}
.rp-colo-item-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 16px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-colo-item-table-wrap {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.rp-colo-item-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-colo-item-table td {
  padding: 12px 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  color: #111827 !important;
  vertical-align: middle !important;
}
.rp-colo-item-table tr:last-child td {
  border-bottom: none !important;
}
.rp-colo-item-table tr:hover {
  background: #f9fafb !important;
}
.rp-colo-item-label {
  color: #6b7280 !important;
  font-weight: 500 !important;
  width: 200px !important;
  white-space: nowrap !important;
}
.rp-colo-item-actions {
  margin-top: 16px !important;
}
.rp-colo-rack-list {
  margin-bottom: 28px !important;
}

/* Domain filter date row */
.rp-domain-filter-date {
  display: flex !important;
  gap: 8px !important;
}
.rp-domain-filter-date select {
  max-width: 70px !important;
}

/* Domain bulk action bar */
.rp-domain-bulk-bar {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px 0 !important;
}
.rp-domain-bulk-left {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  flex: 1 !important;
  min-width: 0 !important;
}
.rp-domain-bulk-label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  white-space: nowrap !important;
  padding-top: 2px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-domain-bulk-names {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  max-height: 60px !important;
  overflow-y: auto !important;
}
.rp-domain-bulk-actions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-shrink: 0 !important;
}

/* Icon button (domain widgets) */
.rp-btn-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  border: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  color: #374151 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}
.rp-btn-icon:hover {
  border-color: #7c3aed !important;
  color: #7c3aed !important;
  text-decoration: none !important;
}
.rp-btn-icon.disabled {
  opacity: 0.4 !important;
  pointer-events: none !important;
}
.rp-btn-icon .material-symbols-outlined {
  font-size: 18px !important;
}
.rp-colo-hint {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 16px !important;
  font-style: italic !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Domain status alert */
.rp-domain-alert {
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
  margin-bottom: 20px !important;
  font-size: 14px !important;
  color: #c2410c !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Change Label widget */
.rp-service-content .widget .section-changelabel,
.rp-service-content .widget .wbox {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-content .widget .wbox .wbox_header {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}
.rp-service-content .widget .wbox .wbox_content {
  padding: 0 !important;
}
.rp-service-content .widget .wbox .wbox_content p,
.rp-service-content .widget .wbox .wbox_content .help-block {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin-bottom: 12px !important;
}
/* Cancel link in widget forms */
.rp-service-content .widget .wbox .wbox_content a[href*="clientarea/domains/"],
.rp-service-content .widget .wbox .wbox_content .fs11 a {
  color: #7c3aed !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.rp-service-content .widget .wbox .wbox_content a[href*="clientarea/domains/"]:hover,
.rp-service-content .widget .wbox .wbox_content .fs11 a:hover {
  text-decoration: underline !important;
}
.rp-service-content .widget .wbox .wbox_content .btn-primary,
.rp-service-content .widget .wbox .wbox_content .btn-info,
.rp-service-content .widget .wbox .wbox_content button[type="submit"],
.rp-service-content .widget .wbox .wbox_content input[type="submit"] {
  padding: 8px 20px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  cursor: pointer !important;
}
.rp-service-content .widget .wbox .wbox_content .btn-primary:hover,
.rp-service-content .widget .wbox .wbox_content .btn-info:hover,
.rp-service-content .widget .wbox .wbox_content button[type="submit"]:hover,
.rp-service-content .widget .wbox .wbox_content input[type="submit"]:hover {
  opacity: 0.9 !important;
}

/* Widget form inputs (DNS Management, Nameservers, etc.) */
.rp-service-content .widget .wbox .wbox_content input[type="text"],
.rp-service-content .widget .wbox .wbox_content select,
.rp-service-content .widget .wbox .wbox_content textarea {
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  color: #111827 !important;
  background: #ffffff !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-content .widget .wbox .wbox_content input[type="text"]:focus,
.rp-service-content .widget .wbox .wbox_content select:focus,
.rp-service-content .widget .wbox .wbox_content textarea:focus {
  border-color: rgba(123, 92, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(123, 92, 255, 0.08) !important;
  outline: none !important;
}

/* Widget table (DNS records, etc.) */
.rp-service-content .widget .wbox .wbox_content .checker th {
  padding: 10px 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
}
.rp-service-content .widget .wbox .wbox_content .checker td {
  padding: 10px 8px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle !important;
}
.rp-service-content .widget .wbox .wbox_content .checker tr:hover {
  background: #f9fafb !important;
}
.rp-service-content .widget .wbox .wbox_content .checker .even {
  background: transparent !important;
}

/* Delete button in DNS records — toggle switch style */
.rp-service-content .widget .wbox .wbox_content .deleteico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 20px !important;
  border-radius: 10px !important;
  background: #e5e7eb !important;
  border: none !important;
  color: transparent !important;
  padding: 0 !important;
  min-width: 36px !important;
  position: relative !important;
  transition: background 0.2s ease !important;
  cursor: pointer !important;
}
.rp-service-content .widget .wbox .wbox_content .deleteico::after {
  content: '' !important;
  position: absolute !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  top: 2px !important;
  left: 2px !important;
  transition: transform 0.2s ease !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
}
.rp-service-content .widget .wbox .wbox_content .deleteico:hover {
  background: #d1d5db !important;
}
.rp-service-content .widget .wbox .wbox_content .deleteico .material-icons,
.rp-service-content .widget .wbox .wbox_content .deleteico .icon-trash,
.rp-service-content .widget .wbox .wbox_content .deleteico i {
  display: none !important;
}
.rp-service-content .widget .wbox .wbox_content .deleteico.active {
  background: #dc2626 !important;
}
.rp-service-content .widget .wbox .wbox_content .deleteico.active::after {
  transform: translateX(16px) !important;
}

/* Related Invoices widget */
.rp-widget-relatedinvoices {
  margin-bottom: 28px !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
}
.rp-widget-table-wrap {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.rp-widget-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border-bottom: none !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-widget-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-widget-table thead th {
  padding: 10px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  background: #f9fafb !important;
  border-bottom: 1px solid #e5e7eb !important;
  text-align: left !important;
  white-space: nowrap !important;
}
.rp-widget-table tbody td {
  padding: 13px 16px !important;
  color: #111827 !important;
  background: #ffffff !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle !important;
}
.rp-widget-table tbody tr:last-child td {
  border-bottom: none !important;
}
.rp-widget-table tbody tr:hover {
  background: #f9fafb !important;
}
.rp-widget-table tbody td a {
  color: #7c3aed !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.rp-widget-table tbody td a:hover {
  text-decoration: underline !important;
}
.rp-widget-empty {
  color: #9ca3af !important;
  font-size: 14px !important;
  font-style: italic !important;
}

/* VPS Info grid */
.rp-service-vps-info {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  margin-top: 16px !important;
}
.rp-service-info-item {
  padding: 16px 20px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.rp-service-info-item:nth-child(odd) {
  border-right: 1px solid #f3f4f6 !important;
}
.rp-service-info-label {
  display: block !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  color: #9ca3af !important;
  margin-bottom: 4px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-info-value {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Section headers */
.rp-service-section-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 28px 0 12px !important;
}
.rp-service-section-header h3 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Addon info */
.rp-service-addon-info-link {
  font-size: 12px !important;
  color: #7c3aed !important;
  margin-left: 8px !important;
}
.rp-service-addon-info {
  padding: 12px !important;
  background: #f9fafb !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  color: #374151 !important;
}
.rp-service-sub-domain {
  font-size: 12px !important;
  color: #6b7280 !important;
  margin-top: 2px !important;
}

/* Responsive */
@media (max-width: 768px) {
  .rp-service-layout {
    grid-template-columns: 1fr !important;
  }
  .rp-service-sidebar {
    position: static !important;
  }
}

/* ==========================================================================
   SOLUSVM / CLOUD HOSTING MODULE — CSS Override
   ========================================================================== */

/* Header section (service name + badge) */
body.template_rdpcore .section-main > .d-flex.flex-row.flex-wrap.align-items-center.mb-3,
body.template_rdpcore .section-main > section.d-flex.flex-row {
  background: linear-gradient(135deg, #f8f6ff 0%, #f0fdf4 100%) !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  padding: 20px 24px !important;
  margin-bottom: 20px !important;
}
body.template_rdpcore .section-main > .d-flex .h2,
body.template_rdpcore .section-main > section .h2 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .section-main .badge-Active {
  background: #f0fdf4 !important;
  color: #15803d !important;
  border: 1px solid #bbf7d0 !important;
  border-radius: 20px !important;
  padding: 3px 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
body.template_rdpcore .section-main .badge-Suspended {
  background: #fff7ed !important;
  color: #c2410c !important;
  border: 1px solid #fed7aa !important;
  border-radius: 20px !important;
}
body.template_rdpcore .section-main .badge-Terminated,
body.template_rdpcore .section-main .badge-Cancelled {
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border: 1px solid #fecaca !important;
  border-radius: 20px !important;
}

/* Cloud navigation (Overview / Usage / Billing tabs) */
body.template_rdpcore .cloud-top {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 0 !important;
  margin-bottom: 20px !important;
  overflow: visible !important;
  position: relative !important;
}
body.template_rdpcore .cloud-top .cloud-header {
  display: none !important;
}
body.template_rdpcore .cloud-nav {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
}
body.template_rdpcore .cloud-nav ul.level-1 {
  display: flex !important;
  list-style: none !important;
  padding: 0 20px !important;
  margin: 0 !important;
  gap: 0 !important;
  border-bottom: none !important;
}
body.template_rdpcore .cloud-nav ul.level-1 li {
  margin: 0 !important;
  padding: 0 !important;
}
body.template_rdpcore .cloud-nav ul.level-1 li a {
  display: flex !important;
  align-items: center !important;
  padding: 14px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  text-decoration: none !important;
  border-bottom: 2px solid transparent !important;
  transition: all 0.2s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  white-space: nowrap !important;
}
body.template_rdpcore .cloud-nav ul.level-1 li a:hover {
  color: #7c3aed !important;
}
body.template_rdpcore .cloud-nav ul.level-1 li.current-menu-item a {
  color: #7c3aed !important;
  border-bottom-color: #7c3aed !important;
  font-weight: 600 !important;
}

/* Server details header bar */
body.template_rdpcore .header-bar {
  padding: 16px 20px 0 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
}
body.template_rdpcore .header-bar h3 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  margin: 0 !important;
}

/* VM Actions (Console, Reboot, Shutdown, Force Power Off, More) */
body.template_rdpcore .content-bar > .right#lockable-vm-menu {
  float: none !important;
  display: block !important;
  padding: 16px 20px !important;
}
body.template_rdpcore #lockable-vm-menu > ul {
  display: flex !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}
body.template_rdpcore #lockable-vm-menu > ul > li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
body.template_rdpcore #lockable-vm-menu > ul > li > a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  white-space: nowrap !important;
}
body.template_rdpcore #lockable-vm-menu > ul > li > a:hover {
  border-color: #7c3aed !important;
  color: #7c3aed !important;
  background: #f5f3ff !important;
}
/* First button (Console) = purple */
body.template_rdpcore #lockable-vm-menu > ul > li:first-child > a {
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
body.template_rdpcore #lockable-vm-menu > ul > li:first-child > a:hover {
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3) !important;
}
/* Widget items (with images) — hide images, show as buttons */
body.template_rdpcore #lockable-vm-menu > ul > li.widget {
  display: none !important;
}
body.template_rdpcore #lockable-vm-menu > ul > li img {
  display: none !important;
}
body.template_rdpcore #lockable-vm-menu > ul > li br {
  display: none !important;
}

/* VM Details table */
body.template_rdpcore .content-bar {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 0 !important;
  margin-bottom: 20px !important;
}
body.template_rdpcore .vm-details {
  width: 100% !important;
  border-collapse: collapse !important;
}
body.template_rdpcore .vm-details > tbody > tr > td {
  padding: 0 !important;
  vertical-align: top !important;
}
body.template_rdpcore .vm-details-part,
body.template_rdpcore .ttable.vm-details-part {
  width: 100% !important;
  border-collapse: collapse !important;
}
body.template_rdpcore .vm-details-part tr {
  border-bottom: 1px solid #f3f4f6 !important;
}
body.template_rdpcore .vm-details-part tr:last-child {
  border-bottom: none !important;
}
body.template_rdpcore .vm-details-part td {
  padding: 14px 20px !important;
  font-size: 14px !important;
  color: #111827 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  border: none !important;
}
body.template_rdpcore .vm-details-part td:first-child {
  width: 140px !important;
}
body.template_rdpcore .vm-details-part td:first-child b,
body.template_rdpcore .vm-details-part td b {
  font-size: 12px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em !important;
  color: #6b7280 !important;
}
body.template_rdpcore .vm-details-part td:last-child {
  font-weight: 500 !important;
  color: #111827 !important;
}

/* VM Status switch */
body.template_rdpcore .vm-details-switch a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 12px !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
body.template_rdpcore .iphone_switch_container_on {
  background: #f0fdf4 !important;
  color: #15803d !important;
  border: 1px solid #bbf7d0 !important;
}
body.template_rdpcore .iphone_switch_container_off {
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border: 1px solid #fecaca !important;
}

/* Password show link */
body.template_rdpcore .vm-details-password a {
  color: #7c3aed !important;
  font-weight: 500 !important;
  font-size: 13px !important;
}

/* Hostname link under service name */
body.template_rdpcore .section-main > .font-weight-normal {
  margin-bottom: 16px !important;
}
body.template_rdpcore .section-main > .font-weight-normal a {
  color: #7c3aed !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .padding.white-bg {
  background: transparent !important;
  padding: 0 !important;
}
body.template_rdpcore #status_calendar {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
  text-align: center !important;
}
body.template_rdpcore #status_calendar .jCal {
  height: auto !important;
}
body.template_rdpcore #status_calendar .jCal .month,
body.template_rdpcore #status_calendar .jCal .monthName,
body.template_rdpcore #status_calendar .jCal .monthYear {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #111827 !important;
}
body.template_rdpcore #status_calendar .jCalMo .dow {
  background: #f9fafb !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  text-transform: uppercase !important;
  border: none !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
body.template_rdpcore #status_calendar .jCalMo .day {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 12px !important;
  color: #374151 !important;
  border-color: #f3f4f6 !important;
  background: #ffffff !important;
  border-radius: 0 !important;
}
body.template_rdpcore #status_calendar .jCalMo .day:hover {
  background: #f5f3ff !important;
  color: #7c3aed !important;
}
body.template_rdpcore #status_calendar .jCalMo .day.selectedDay {
  background: #7c3aed !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}
body.template_rdpcore #status_calendar .jCalMo .day.overDay {
  background: #ede9fe !important;
  color: #7c3aed !important;
}
body.template_rdpcore #status_calendar .jCalMo .day.hasEvent {
  border-radius: 6px !important;
}
body.template_rdpcore #status_calendar .jCalMo .pday,
body.template_rdpcore #status_calendar .jCalMo .aday {
  background: #fafafa !important;
  color: #d1d5db !important;
  border-color: #f3f4f6 !important;
}
body.template_rdpcore #status_calendar .jCalMo .invday {
  background: #f9fafb !important;
  color: #9ca3af !important;
  border-color: #f3f4f6 !important;
}

/* Subscription alert */
body.template_rdpcore .padding.white-bg .alert-primary {
  background: #f5f3ff !important;
  border: 1px solid #e0d4f5 !important;
  border-radius: 10px !important;
  color: #374151 !important;
  padding: 16px 20px !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .padding.white-bg .alert-primary strong {
  color: #7c3aed !important;
}
body.template_rdpcore .padding.white-bg .alert-primary a {
  color: #7c3aed !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}
body.template_rdpcore .padding.white-bg .alert-primary a:hover {
  color: #6d28d9 !important;
}

/* Status event cards */
body.template_rdpcore .padding.white-bg .separator-line {
  background: #f3f4f6 !important;
  margin: 24px 0 20px !important;
}
body.template_rdpcore .padding.white-bg .status h3 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .padding.white-bg .status h3 a {
  color: #7c3aed !important;
  text-decoration: none !important;
}
body.template_rdpcore .padding.white-bg .status h3 a:hover {
  color: #6d28d9 !important;
}
body.template_rdpcore .padding.white-bg .status .status-line {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body.template_rdpcore .padding.white-bg .status h4 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin: 16px 0 6px !important;
}
body.template_rdpcore .padding.white-bg .status p {
  font-size: 14px !important;
  color: #374151 !important;
  line-height: 1.6 !important;
}

/* 2019 template style cards (if tpl_family matches) */
body.template_rdpcore .padding.white-bg .card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  transition: box-shadow 0.2s ease !important;
}
body.template_rdpcore .padding.white-bg .card:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}
body.template_rdpcore .padding.white-bg .card .card-body {
  padding: 20px !important;
}
body.template_rdpcore .padding.white-bg .card .card-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #7c3aed !important;
  text-decoration: none !important;
}
body.template_rdpcore .padding.white-bg .card .badge {
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
}

/* View all link */
body.template_rdpcore .padding.white-bg #view_all {
  font-size: 14px !important;
  color: #6b7280 !important;
  padding: 12px 0 !important;
}
body.template_rdpcore .padding.white-bg #view_all a {
  color: #7c3aed !important;
  font-weight: 600 !important;
}

/* HR separator */
body.template_rdpcore .padding.white-bg hr {
  border: none !important;
  border-top: 1px solid #f3f4f6 !important;
  margin: 20px 0 !important;
}

/* ==========================================================================
   GENERAL SERVICE DETAIL PAGE — Billing, Cards, Tables, Forms
   ========================================================================== */

/* Service detail page wrapper */
.rp-service-detail-page {
  max-width: 100% !important;
}

/* Billing section — flat layout: header on top, table below */
.rp-service-billing-section {
  margin-bottom: 28px !important;
}
.rp-service-billing-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.rp-service-billing-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-billing-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

/* Billing table (flat, no card wrapper, no outer border) */
.rp-service-billing-table-wrap {
  overflow: hidden !important;
  border: none !important;
  border-radius: 0 !important;
}
.rp-service-billing-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-billing-table thead {
  display: none !important;
}
.rp-service-billing-table tbody td {
  padding: 13px 20px !important;
  color: #111827 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle !important;
}
.rp-service-billing-table tbody tr:last-child td {
  border-bottom: none !important;
}
.rp-service-billing-table tbody tr:hover {
  background: #f9fafb !important;
}
.rp-service-billing-table .rp-billing-label {
  color: #6b7280 !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  width: 200px !important;
}
.rp-service-billing-table .rp-service-table-action {
  width: 50px !important;
  text-align: center !important;
}

/* Upgrade/Downgrade link */
.rp-service-upgrade-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #7c3aed !important;
  text-decoration: none !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  border: 1px solid #ede9fe !important;
  background: #faf5ff !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-upgrade-link:hover {
  background: #ede9fe !important;
  border-color: #ddd6fe !important;
  text-decoration: none !important;
}
.rp-service-upgrade-link .material-symbols-outlined {
  font-size: 16px !important;
}

/* cPanel access button */
.rp-service-cpanel-btn-wrap {
  margin-bottom: 16px !important;
}
.rp-service-cpanel-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #7C3AED, #9333EA) !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-cpanel-btn:hover {
  opacity: 0.9 !important;
  text-decoration: none !important;
  color: #ffffff !important;
}
.rp-service-cpanel-btn .material-symbols-outlined {
  font-size: 16px !important;
}

/* Add addon button */
.rp-service-add-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #15803d !important;
  text-decoration: none !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  border: 1px solid #bbf7d0 !important;
  background: #f0fdf4 !important;
  transition: all 0.15s ease !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-service-add-btn:hover {
  background: #dcfce7 !important;
  border-color: #86efac !important;
  text-decoration: none !important;
}
.rp-service-add-btn .material-symbols-outlined {
  font-size: 16px !important;
}

/* Service tables — REMOVED, using .rp-service-billing-table-wrap and .rp-service-billing-table instead */

/* Sub-service link */
.rp-service-sub-link {
  font-weight: 600 !important;
  color: #111827 !important;
  text-decoration: none !important;
}
.rp-service-sub-link:hover {
  color: #7c3aed !important;
  text-decoration: none !important;
}

/* Arrow link (sub-services) */
.rp-service-arrow-link {
  color: #9ca3af !important;
  text-decoration: none !important;
}
.rp-service-arrow-link:hover {
  color: #7c3aed !important;
}
.rp-service-arrow-link .material-symbols-outlined {
  font-size: 18px !important;
}

/* Empty state */
.rp-service-empty {
  color: #9ca3af !important;
  font-style: italic !important;
}

/* Unpaid invoice notice */
.rp-service-unpaid-notice {
  margin-top: 4px !important;
  font-size: 12px !important;
  color: #dc2626 !important;
}
.rp-service-unpaid-notice a {
  color: #dc2626 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}

/* Renew link */
.rp-service-renew-link {
  font-size: 12px !important;
  color: #7c3aed !important;
  margin-left: 8px !important;
  text-decoration: none !important;
}
.rp-service-renew-link:hover {
  text-decoration: underline !important;
}

/* Info note (hourly billing) */
.rp-service-info-note {
  font-size: 12px !important;
  color: #9ca3af !important;
  font-weight: 400 !important;
}

/* Meta link (domain, etc.) */
.rp-service-meta-link {
  color: #7c3aed !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.rp-service-meta-link:hover {
  text-decoration: underline !important;
}

/* Text danger utility */
.rp-text-danger {
  color: #dc2626 !important;
}

/* Top navigation (horizontal layout) */
.rp-service-top-nav {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 8px 12px !important;
  margin-bottom: 20px !important;
  overflow-x: auto !important;
}
.rp-service-nav-horizontal {
  flex-direction: row !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
}
.rp-service-nav-horizontal .rp-service-nav-item {
  white-space: nowrap !important;
  padding: 8px 14px !important;
}

/* Extra fields container (custom commands) */
#extrafields {
  margin-top: 20px !important;
}
#extrafields #content_field {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 20px !important;
}

/* Responsive — General Service Detail */
@media (max-width: 768px) {
  .rp-service-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 16px 20px !important;
  }
  .rp-service-header-left {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .rp-service-billing-table .rp-billing-label {
    width: auto !important;
  }
  .rp-service-billing-header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .rp-service-top-nav {
    padding: 6px 8px !important;
  }
}

/* ==========================================================================
   ANNOUNCEMENTS PAGE
   ========================================================================== */
.rp-announcement-meta {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
  flex-wrap: wrap !important;
}
.rp-announcement-date {
  font-size: 13px !important;
  color: #6b7280 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-announcement-tags {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
.rp-announcement-tag {
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}
.rp-announcement-content {
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: #374151 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-announcement-content p {
  margin-bottom: 12px !important;
}
.rp-announcement-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}
.rp-announcement-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}
.rp-announcement-item:hover {
  background: #f9fafb !important;
  margin: 0 -16px !important;
  padding: 16px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
}
.rp-announcement-item:last-child {
  border-bottom: none !important;
}
.rp-announcement-item-left {
  flex: 1 !important;
  min-width: 0 !important;
}
.rp-announcement-item-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 0 4px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-announcement-item-excerpt {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin: 0 0 6px !important;
  line-height: 1.5 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-announcement-item-date {
  font-size: 12px !important;
  color: #9ca3af !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-announcement-arrow {
  color: #9ca3af !important;
  font-size: 20px !important;
  flex-shrink: 0 !important;
}
.rp-announcement-item:hover .rp-announcement-arrow {
  color: #7c3aed !important;
}

/* ==========================================================================
   404 PAGE
   ========================================================================== */
.rp-404-page {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 80px 20px !important;
}
.rp-404-icon {
  font-size: 64px !important;
  color: #d1d5db !important;
  margin-bottom: 16px !important;
}
.rp-404-title {
  font-size: 72px !important;
  font-weight: 800 !important;
  color: #111827 !important;
  margin: 0 0 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-404-subtitle {
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin: 0 0 8px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-404-desc {
  font-size: 14px !important;
  color: #6b7280 !important;
  margin: 0 0 28px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.rp-404-actions {
  display: flex !important;
  gap: 12px !important;
}


/* ============================================================
   RESULT PAGES — Thankyou, Payment Failed, Cart5
   ============================================================ */

.rp-result-page {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 60px 16px !important;
    min-height: 400px !important;
}

.rp-result-card {
    background: #ffffff !important;
    border: 1px solid #e8ecf0 !important;
    border-radius: 16px !important;
    padding: 48px 40px !important;
    max-width: 480px !important;
    width: 100% !important;
    text-align: center !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.rp-result-icon {
    width: 64px !important;
    height: 64px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 20px !important;
}

.rp-result-icon .material-symbols-outlined {
    font-size: 32px !important;
    font-weight: 300 !important;
}

.rp-result-icon-success {
    background: #ecfdf5 !important;
}

.rp-result-icon-success .material-symbols-outlined {
    color: #10b981 !important;
}

.rp-result-icon-error {
    background: #fef2f2 !important;
}

.rp-result-icon-error .material-symbols-outlined {
    color: #ef4444 !important;
}

.rp-result-icon-payment {
    background: #f3f0ff !important;
}

.rp-result-icon-payment .material-symbols-outlined {
    color: #7C3AED !important;
}

.rp-result-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 8px !important;
    line-height: 1.3 !important;
}

.rp-result-subtitle {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #64748b !important;
    margin: 0 0 24px !important;
    line-height: 1.5 !important;
}

.rp-result-details {
    background: #f8fafc !important;
    border: 1px solid #e8ecf0 !important;
    border-radius: 10px !important;
    padding: 16px 20px !important;
    margin-bottom: 24px !important;
    text-align: left !important;
}

.rp-result-detail-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 6px 0 !important;
}

.rp-result-detail-row + .rp-result-detail-row {
    border-top: 1px solid #e8ecf0 !important;
}

.rp-result-detail-label {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #64748b !important;
}

.rp-result-detail-value {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
}

.rp-result-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    align-items: center !important;
}

.rp-result-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 11px 28px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    min-width: 180px !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.rp-result-btn-primary {
    background: linear-gradient(135deg, #7C3AED, #5B21B6) !important;
    color: #ffffff !important;
    border: none !important;
}

.rp-result-btn-primary:hover {
    background: linear-gradient(135deg, #6D28D9, #4C1D95) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3) !important;
}

.rp-result-btn-outline {
    background: #ffffff !important;
    color: #374151 !important;
    border: 1px solid #d1d5db !important;
}

.rp-result-btn-outline:hover {
    background: #f9fafb !important;
    color: #111827 !important;
    border-color: #9ca3af !important;
    text-decoration: none !important;
}

/* Cart5 paymodule area styling */
.rp-cart5-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 60px 16px !important;
    min-height: 400px !important;
}

.rp-cart5-card {
    background: #ffffff !important;
    border: 1px solid #e8ecf0 !important;
    border-radius: 16px !important;
    padding: 48px 40px !important;
    max-width: 560px !important;
    width: 100% !important;
    text-align: center !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.rp-cart5-icon {
    width: 64px !important;
    height: 64px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 20px !important;
}

.rp-cart5-icon .material-symbols-outlined {
    font-size: 32px !important;
    font-weight: 300 !important;
}

.rp-cart5-icon-success {
    background: #ecfdf5 !important;
}

.rp-cart5-icon-success .material-symbols-outlined {
    color: #10b981 !important;
}

.rp-cart5-icon-payment {
    background: #f3f0ff !important;
}

.rp-cart5-icon-payment .material-symbols-outlined {
    color: #7C3AED !important;
}

.rp-cart5-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 8px !important;
    line-height: 1.3 !important;
}

.rp-cart5-subtitle {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #64748b !important;
    margin: 0 0 20px !important;
    line-height: 1.5 !important;
}

.rp-cart5-paymodule {
    text-align: center !important;
    font-size: 14px !important;
    color: #374151 !important;
    line-height: 1.7 !important;
    margin-top: 16px !important;
}

.rp-cart5-paymodule input[type="submit"],
.rp-cart5-paymodule input[type="button"],
.rp-cart5-paymodule button,
.rp-cart5-paymodule .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 11px 28px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    background: linear-gradient(135deg, #7C3AED, #5B21B6) !important;
    color: #ffffff !important;
    border: none !important;
    cursor: pointer !important;
    margin-top: 16px !important;
    text-decoration: none !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    transition: all 0.15s ease !important;
}

.rp-cart5-paymodule input[type="submit"]:hover,
.rp-cart5-paymodule input[type="button"]:hover,
.rp-cart5-paymodule button:hover,
.rp-cart5-paymodule .btn:hover {
    background: linear-gradient(135deg, #6D28D9, #4C1D95) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3) !important;
}

.rp-cart5-paymodule a {
    color: #7C3AED !important;
    font-weight: 500 !important;
}

.rp-cart5-paymodule a:hover {
    color: #5B21B6 !important;
}

.rp-cart5-order-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #f3f0ff !important;
    border: 1px solid #e4d9fc !important;
    border-radius: 8px !important;
    padding: 10px 18px !important;
    margin-bottom: 16px !important;
}

.rp-cart5-order-label {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.rp-cart5-order-number {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #7C3AED !important;
}

.rp-cart5-desc {
    font-size: 13px !important;
    color: #64748b !important;
    margin: 0 0 24px !important;
}

.rp-cart5-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    align-items: center !important;
}

.rp-cart5-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 11px 28px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    min-width: 180px !important;
}

.rp-btn-primary.rp-cart5-btn {
    background: linear-gradient(135deg, #7C3AED, #5B21B6) !important;
    color: #ffffff !important;
    border: none !important;
}

.rp-btn-primary.rp-cart5-btn:hover {
    background: linear-gradient(135deg, #6D28D9, #4C1D95) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

.rp-btn-outline.rp-cart5-btn {
    background: #ffffff !important;
    color: #374151 !important;
    border: 1px solid #d1d5db !important;
}

.rp-btn-outline.rp-cart5-btn:hover {
    background: #f9fafb !important;
    border-color: #9ca3af !important;
    text-decoration: none !important;
}

@media (max-width: 580px) {
    .rp-result-card,
    .rp-cart5-card {
        padding: 32px 20px !important;
    }
    .rp-result-title,
    .rp-cart5-title {
        font-size: 18px !important;
    }
}
