/* portal/portal-theme.css */

html, body {
  font-family: 'Cairo', sans-serif;
  background-color: #030712;
  color: #ffffff;
  min-height: 100vh;
  overflow-x: hidden;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* طبقة الإضاءة النيونية الخلفية الأصلية */
.aurora-container {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.glow-sphere {
  position: absolute;
  border-radius: 50%;
  filter: blur(95px);
  opacity: 0.65;
  mix-blend-mode: screen;
  animation: floatPulse 12s ease-in-out infinite alternate;
}
.glow-cyan { top: -10%; right: 10%; width: 650px; height: 650px; background: radial-gradient(circle, #00f2fe 0%, rgba(0, 242, 254, 0.25) 70%, transparent 100%); }
.glow-purple { top: 25%; left: -5%; width: 700px; height: 700px; background: radial-gradient(circle, #7928ca 0%, rgba(121, 40, 202, 0.3) 65%, transparent 100%); animation-delay: -3s; }
.glow-pink { bottom: 5%; right: 25%; width: 600px; height: 600px; background: radial-gradient(circle, #ff007a 0%, rgba(255, 0, 122, 0.28) 70%, transparent 100%); animation-delay: -6s; }
.glow-green { bottom: -10%; left: 15%; width: 550px; height: 550px; background: radial-gradient(circle, #00ff88 0%, rgba(0, 255, 136, 0.2) 70%, transparent 100%); animation-delay: -9s; }

@keyframes floatPulse {
  0% { transform: translate(0px, 0px) scale(1); }
  50% { transform: translate(35px, 45px) scale(1.1); }
  100% { transform: translate(-25px, -35px) scale(0.95); }
}

/* التصميم الزجاجي الشفاف النقي المعتمد */
.glass-card {
  background: rgba(10, 18, 38, 0.82) !important;
  backdrop-filter: blur(28px) saturate(210%);
  -webkit-backdrop-filter: blur(28px) saturate(210%);
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.65);
}
.glass-card-inner {
  background: rgba(18, 30, 60, 0.75) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.14);
}

/* هالات النيون داخل المودال */
.modal-aurora-mesh {
  position: absolute;
  inset: -40px;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.mesh-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.7;
  mix-blend-mode: screen;
  animation: modalAuroraFlow 10s ease-in-out infinite alternate;
}
.mesh-cyan { top: -15%; right: -10%; width: 450px; height: 450px; background: radial-gradient(circle, #00f2fe 0%, rgba(0, 242, 254, 0.3) 65%, transparent 100%); }
.mesh-purple { bottom: -15%; left: -10%; width: 480px; height: 480px; background: radial-gradient(circle, #8a2be2 0%, rgba(138, 43, 226, 0.35) 65%, transparent 100%); animation-delay: -3s; }
.mesh-pink { top: 35%; left: 20%; width: 380px; height: 380px; background: radial-gradient(circle, #ff007a 0%, rgba(255, 0, 122, 0.28) 65%, transparent 100%); animation-delay: -6s; }

@keyframes modalAuroraFlow {
  0% { transform: translate(0, 0) scale(1) rotate(0deg); }
  50% { transform: translate(30px, -20px) scale(1.12) rotate(12deg); }
  100% { transform: translate(-20px, 30px) scale(0.94) rotate(-12deg); }
}

/* أزرار السايد بار */
.portal-nav-btn {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: 1rem;
  font-weight: 700;
  font-size: 0.85rem;
  color: #94a3b8;
  cursor: pointer;
  transition: all 0.25s;
}
.portal-nav-btn:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.08);
}
.portal-nav-btn.active {
  color: #00f2fe;
  background-color: rgba(0, 242, 254, 0.15);
  border: 1px solid rgba(0, 242, 254, 0.4);
  box-shadow: 0 0 20px rgba(0, 242, 254, 0.2);
}

.neon-badge {
  background: linear-gradient(135deg, rgba(0, 242, 254, 0.3) 0%, rgba(13, 22, 42, 0.9) 100%);
  border: 1.5px solid #00f2fe;
  box-shadow: 0 0 25px rgba(0, 242, 254, 0.45);
}

/* طي وفتح الأكورديون */
.collapse-content {
  transition: max-height 0.35s ease, opacity 0.3s ease;
  overflow: hidden;
}
.collapse-content.collapsed {
  max-height: 0 !important;
  opacity: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  pointer-events: none;
}

/* كروت الاختيار الموحدة وكروت التطبيقات */
.custom-select-card {
  position: relative;
  background: rgba(10, 18, 38, 0.65) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1.5px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 1.5rem !important;
  transition: all 0.25s ease;
  cursor: pointer;
}
.custom-select-card:hover {
  border-color: rgba(0, 242, 254, 0.5) !important;
  transform: translateY(-2px);
}
.custom-select-card.selected {
  border: 2px solid #00f2fe !important;
  box-shadow: 0 0 25px rgba(0, 242, 254, 0.35) !important;
  background: rgba(0, 242, 254, 0.18) !important;
}

/* مؤشرات النيون للراديو */
.neon-radio {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease;
}
.custom-select-card.selected .neon-radio {
  border-color: #00f2fe;
  background: rgba(0, 242, 254, 0.25);
  box-shadow: 0 0 12px rgba(0, 242, 254, 0.6);
}
.custom-select-card.selected .neon-radio::after {
  content: "";
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: #00f2fe;
  box-shadow: 0 0 8px #00f2fe;
}

/* أزرار معالجات أجهزة الرسيفر */
.chip-tab-btn {
  padding: 0.35rem 0.75rem;
  border-radius: 0.75rem;
  font-size: 0.7rem;
  font-weight: 800;
  transition: all 0.2s ease;
  cursor: pointer;
}
.chip-tab-btn.active {
  background: rgba(0, 242, 254, 0.2);
  color: #00f2fe;
  border: 1px solid rgba(0, 242, 254, 0.5);
  box-shadow: 0 0 10px rgba(0, 242, 254, 0.3);
}
.chip-tab-btn:not(.active) {
  background: rgba(255, 255, 255, 0.05);
  color: #94a3b8;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* صندوق الكتابة والتنسيق المرئي المباشر */
.rich-editor-content {
  min-height: 90px;
  max-height: 180px;
  overflow-y: auto;
  outline: none;
  direction: rtl;
  text-align: right;
}
.rich-editor-content:empty:before {
  content: attr(placeholder);
  color: #94a3b8;
  pointer-events: none;
  display: block;
}

/* --- تنسيقات فقاعات المحادثة الشبيهة بنظام الواتساب --- */
.chat-bubble-client {
  background: linear-gradient(135deg, rgba(0, 242, 254, 0.16) 0%, rgba(10, 25, 55, 0.85) 100%) !important;
  border: 1.5px solid rgba(0, 242, 254, 0.45) !important;
  box-shadow: 0 8px 25px rgba(0, 242, 254, 0.15);
  border-radius: 1.25rem 1.25rem 0.25rem 1.25rem;
}

.chat-bubble-support {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.18) 0%, rgba(5, 35, 25, 0.85) 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.5) !important;
  box-shadow: 0 8px 25px rgba(16, 185, 129, 0.15);
  border-radius: 1.25rem 1.25rem 1.25rem 0.25rem;
}

/* تخصيص شريط التمرير */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #030712; }
::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.2); border-radius: 4px; }