/* ==========================================================================
   ACADEX Vazirmatn Font Definitions (Hosted locally on Fider /assets/fonts/)
   ========================================================================== */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 100;
  src: url('/assets/fonts/vazirmatn-arabic-100-normal.woff2') format('woff2');
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 100;
  src: url('/assets/fonts/vazirmatn-latin-100-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('/assets/fonts/vazirmatn-arabic-400-normal.woff2') format('woff2');
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('/assets/fonts/vazirmatn-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('/assets/fonts/vazirmatn-arabic-700-normal.woff2') format('woff2');
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('/assets/fonts/vazirmatn-latin-700-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-display: swap;
  font-weight: 900;
  src: url('/assets/fonts/vazirmatn-arabic-900-normal.woff2') format('woff2');
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}

/* ==========================================================================
   Global Vazirmatn Typography & RTL Direction
   ========================================================================== */
*, *::before, *::after,
html, body, #root,
input, textarea, button, select,
h1, h2, h3, h4, h5, h6,
p, span, a, label, div {
  font-family: 'Vazirmatn', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}

html, body, #root {
  direction: rtl !important;
  text-align: right !important;
}

/* ==========================================================================
   ACADEX Theme Palette & Styling (Dark Navy & Royal Blue)
   ========================================================================== */
:root, body, body[data-theme=dark] {
  --bg-primary: #0B0E1D;
  --text-primary: #FFFFFF;
  --accent-primary: #2563EA;
  --card-bg: rgba(255, 255, 255, 0.035);
  --card-border: rgba(255, 255, 255, 0.08);
}

body, body[data-theme=dark] {
  background-color: #0B0E1D !important;
  background-image: 
    radial-gradient(circle at 85% 20%, rgba(37, 99, 234, 0.14) 0%, transparent 45%),
    radial-gradient(circle at 15% 70%, rgba(124, 58, 237, 0.12) 0%, transparent 45%) !important;
  background-attachment: fixed !important;
  color: #F1F5F9 !important;
}

/* ==========================================================================
   Header & Navigation (RTL Alignment & High Contrast)
   ========================================================================== */
.c-header, nav.c-header, #c-header {
  background: rgba(11, 14, 29, 0.92) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  direction: rtl !important;
}

#c-header .c-header__row {
  direction: rtl !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

#c-header .c-header__brand {
  margin-left: 2rem !important;
  margin-right: 0 !important;
  display: flex !important;
  align-items: center !important;
}

#c-header .c-header__brand a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-decoration: none !important;
  color: #FFFFFF !important;
}

#c-header .c-header__brand h1,
#c-header .c-header__brand a.c-header__logo, 
#c-header .c-header__brand .c-header__title,
#c-header .c-header__brand span {
  color: #FFFFFF !important;
  font-weight: 800 !important;
  font-size: 1.25rem !important;
  letter-spacing: normal !important;
  opacity: 1 !important;
}

#c-header .c-header__brand img {
  border-radius: 8px !important;
  margin-left: 8px !important;
  margin-right: 0 !important;
}

#c-header .c-header__nav {
  margin-left: 0 !important;
  margin-right: 0.5rem !important;
  display: flex !important;
  gap: 1.5rem !important;
}

#c-header .c-header__nav-link {
  color: #94A3B8 !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  transition: all 0.15s ease !important;
  padding: 6px 0 !important;
}

#c-header .c-header__nav-link:hover {
  color: #FFFFFF !important;
}

#c-header .c-header__nav-link--active {
  color: #FFFFFF !important;
  box-shadow: 0 2px 0 0 #3B82F6 !important;
}

#c-header .c-header__actions {
  margin-left: 0 !important;
  margin-right: auto !important; /* Pushes action icons to the far left in RTL */
  display: flex !important;
  align-items: center !important;
  gap: 0.85rem !important;
}

/* ==========================================================================
   Home Page Layout & Typography (RTL)
   ========================================================================== */
#p-home {
  direction: rtl !important;
  background-color: transparent !important;
}

#p-home .p-home__welcome-col {
  direction: rtl !important;
  text-align: right !important;
  padding-right: 0 !important;
  padding-left: 28px !important;
}

#p-home .p-home__welcome-title {
  text-align: right !important;
  font-size: 2.15rem !important;
  font-weight: 900 !important;
  line-height: 1.45 !important;
  color: #FFFFFF !important;
  margin-bottom: 1.5rem !important;
  letter-spacing: -0.02em !important;
}

#p-home .p-home__welcome-body {
  text-align: right !important;
  line-height: 1.9 !important;
  color: #CBD5E1 !important;
  font-size: 1rem !important;
  white-space: pre-line !important;
}

#p-home .p-home__posts-col {
  direction: rtl !important;
}

/* ==========================================================================
   Add Idea / Suggestion Button
   ========================================================================== */
#p-home .p-home__add-idea-btn {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 1.15rem !important;
  color: #F8FAFC !important;
  font-weight: 600 !important;
  font-size: 1.1rem !important;
  text-align: right !important;
  direction: rtl !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 18px 24px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}

#p-home .p-home__add-idea-btn:hover {
  background: rgba(37, 99, 234, 0.12) !important;
  border-color: rgba(59, 130, 246, 0.45) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(37, 99, 234, 0.25) !important;
}

#p-home .p-home__add-idea-icon {
  margin-left: 6px !important;
  margin-right: 0 !important;
  color: #3B82F6 !important;
}

/* ==========================================================================
   Recommendation / Info Banner (RTL)
   ========================================================================== */
.c-dev-banner, div[class*="banner"] {
  direction: rtl !important;
  text-align: right !important;
  background: rgba(37, 99, 234, 0.15) !important;
  border: 1px solid rgba(59, 130, 246, 0.3) !important;
  border-radius: 0.85rem !important;
  color: #93C5FD !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 14px 20px !important;
  margin-bottom: 24px !important;
}

/* ==========================================================================
   Empty State & Illustration (Centered RTL)
   ========================================================================== */
.p-home__empty-state, .c-posts-container__empty, div[class*="empty"] {
  direction: rtl !important;
  text-align: center !important;
  padding: 56px 24px !important;
  color: #94A3B8 !important;
  font-size: 1.05rem !important;
}

/* ==========================================================================
   Cards, Posts & Discussions (RTL Layout)
   ========================================================================== */
.c-card, .c-post-card, .c-posts-container__post, div[class*="card"] {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 1.15rem !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
  direction: rtl !important;
  text-align: right !important;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease !important;
}

.c-posts-container__post-link:hover .c-posts-container__post {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(37, 99, 234, 0.4) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35) !important;
  transform: translateY(-1px) !important;
}

.c-posts-container__post-title {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
  text-align: right !important;
}

.c-posts-container__postdescription {
  color: #94A3B8 !important;
  text-align: right !important;
  line-height: 1.75 !important;
}

/* ==========================================================================
   Filters & Search Bar (RTL)
   ========================================================================== */
.c-posts-container__header {
  direction: rtl !important;
}

.c-post-filter-btn, .c-post-sort-btn {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #E2E8F0 !important;
  border-radius: 0.75rem !important;
  font-weight: 600 !important;
}

.c-post-filter-btn:hover, .c-post-sort-btn:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #FFFFFF !important;
}

/* ==========================================================================
   Vote Counter & Action Buttons
   ========================================================================== */
.c-vote-counter__button {
  background: rgba(37, 99, 234, 0.12) !important;
  border: 1px solid rgba(37, 99, 234, 0.3) !important;
  border-radius: 0.85rem !important;
  color: #93C5FD !important;
  transition: all 0.2s ease !important;
}

.c-vote-counter__button:hover {
  background: rgba(37, 99, 234, 0.25) !important;
  border-color: #3B82F6 !important;
  color: #FFFFFF !important;
  transform: scale(1.05) !important;
}

.c-vote-counter__button--voted {
  background: #2563EA !important;
  border-color: #3B82F6 !important;
  color: #FFFFFF !important;
  box-shadow: 0 0 15px rgba(37, 99, 234, 0.5) !important;
}

.c-button--primary, button[variant="primary"], .c-btn--primary, .btn-primary {
  background-color: #2563EA !important;
  border: 1px solid #3B82F6 !important;
  color: #FFFFFF !important;
  border-radius: 0.75rem !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 15px rgba(37, 99, 234, 0.35) !important;
  transition: all 0.2s ease !important;
}

.c-button--primary:hover, button[variant="primary"]:hover {
  background-color: #1D4ED8 !important;
  box-shadow: 0 6px 20px rgba(37, 99, 234, 0.5) !important;
  transform: translateY(-1px) !important;
}

/* ==========================================================================
   Inputs, Textarea & Form Controls (RTL)
   ========================================================================== */
input[type="text"], input[type="search"], textarea, .c-input, select {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #FFFFFF !important;
  border-radius: 0.75rem !important;
  direction: rtl !important;
  text-align: right !important;
}

input:focus, textarea:focus, select:focus {
  border-color: #2563EA !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 234, 0.25) !important;
  outline: none !important;
}

/* ==========================================================================
   Modals & Popups (RTL & Dark Theme)
   ========================================================================== */
.c-modal, .c-modal-content, .c-modal-header, .c-modal-footer, div[class*="modal"] {
  direction: rtl !important;
  text-align: right !important;
}

.c-modal-content {
  background: #0F1329 !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 1.25rem !important;
}

/* ==========================================================================
   Tags, Badges & Micro-details
   ========================================================================== */
.c-tag {
  border-radius: 9999px !important;
  font-weight: 600 !important;
  padding: 0.25rem 0.75rem !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.c-footer, footer {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(11, 14, 29, 0.9) !important;
  direction: rtl !important;
  text-align: center !important;
  color: #64748B !important;
  padding: 24px 0 !important;
}

.c-footer a, footer a {
  color: #3B82F6 !important;
  text-decoration: none !important;
}