/* ================= Aurora Neon Glass Theme (RTL) ================= */
/* Design tokens */
:root{
  /* Core palette (Aurora Neon, readable on light-glass surfaces) */
  --bg: #0b0f17;             /* Deep space */
  --text: #eaf0ff;           /* Soft ice */
  --muted: #9aa7c7;          /* Mist */
  --primary: #7c4dff;        /* Electric violet */
  --secondary: #00e0ff;      /* Cyan glow */
  --accent: #ff5db1;         /* Pink neon */

  /* Surfaces */
  --card: rgba(255,255,255,.08);
  --border: rgba(255,255,255,.22);
  --glass-blur: 14px;

  /* Links */
  --link: #00e0ff;

  /* States */
  --success-bg: rgba(0, 255, 171, 0.18);
  --success-fg: #00ffab;
  --success-bd: rgba(0, 255, 171, .35);

  --danger-bg: rgba(255, 77, 109, 0.18);
  --danger-fg: #ff4d6d;
  --danger-bd: rgba(255, 77, 109, .35);
}

/* ========== Base ========== */
html,body{
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(124,77,255,.25), transparent 60%),
    radial-gradient(1200px 600px at 120% 20%, rgba(0,224,255,.18), transparent 60%),
    linear-gradient(135deg, #0b0f17, #111828 70%, #0b0f17);
  background-attachment: fixed;
  color: var(--text);
  font-family: Vazirmatn, Shabnam, "Segoe UI", Tahoma, Verdana, sans-serif;
  line-height: 1.9;
  overflow-x: hidden;
}

@supports (animation: name){
  body{
    background-size: 120% 120%;
    animation: bgFlow 22s ease-in-out infinite;
  }
}
@keyframes bgFlow{
  0%   { background-position: 0% 0%; }
  50%  { background-position: 100% 60%; }
  100% { background-position: 0% 0%; }
}

.container{ width: min(1080px,92%); margin-inline: auto; padding-block: 1rem; }

/* Global focus ring */
*,:focus{ outline: none; }
:focus-visible{
  box-shadow: 0 0 0 3px rgba(124,77,255,.4), 0 0 0 6px rgba(0,224,255,.25);
  border-radius: 8px;
}

/* Links: subtle neon underline on hover */
a{
  color: var(--link);
  text-decoration: none;
  position: relative;
  transition: color .25s ease, opacity .25s ease;
}
a::after{
  content:"";
  position:absolute; inset-inline-start:0; inset-block-end:-2px;
  width:100%; height:2px;
  background: linear-gradient(90deg, var(--secondary), var(--primary), var(--accent));
  transform: scaleX(0);
  transform-origin: inline-start;
  transition: transform .25s ease;
}
a:hover::after, a:focus::after{ transform: scaleX(1); }

/* ========== Header & Nav ========== */
.site-header{
  background: var(--card);
  backdrop-filter: blur(var(--glass-blur));
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 50;
  box-shadow: 0 6px 24px rgba(0,0,0,.35), inset 0 -1px 0 rgba(255,255,255,.06);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding:.75rem 0;
}
.brand{
  font-weight:800; color: var(--text); font-size:1.35rem;
  letter-spacing:.2px;
  text-shadow: 0 0 10px rgba(124,77,255,.35);
}
.header-tools{ display:flex; align-items:center; gap:.5rem; }

.theme-toggle{
  border:1px solid var(--border);
  background: var(--card);
  color: var(--text);
  padding:.45rem .7rem; border-radius:.6rem; cursor:pointer;
  backdrop-filter: blur(var(--glass-blur));
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.theme-toggle:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(124,77,255,.35);
  border-color: color-mix(in oklab, var(--border) 50%, var(--primary) 50%);
}

.main-nav ul{ display:flex; gap:.75rem; list-style:none; margin:0; padding:0; }
.main-nav a{
  color: var(--text);
  padding:.45rem .7rem; border-radius:.55rem;
  transition: background .18s ease, color .18s ease, transform .18s ease;
  position: relative;
}
.main-nav a:hover, .main-nav a:focus{
  background: color-mix(in oklab, var(--card) 70%, rgba(124,77,255,.25) 30%);
  transform: translateY(-1px);
}

/* ========== Chips (header badges) ========== */
.chip{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.25rem .6rem; border:1px solid var(--border);
  border-radius:999px; font-size:.85rem; background:var(--card); color:var(--text);
  text-decoration:none; cursor:default;
  backdrop-filter: blur(var(--glass-blur));
}





/* Footer stats center - Dark theme */
.footer-stats{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:.75rem;
}

/* ظرف داخلی با پس‌زمینه تیره و شفافیت مناسب */
.footer-stats-inner{
  display:flex;
  align-items:center;
  gap:.9rem;
  background: rgba(20,24,28,0.55); /* تیره و نیمه‌شفاف */
  padding:.45rem .75rem;
  border-radius:.6rem;
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 6px 18px rgba(0,0,0,0.5);
  direction: rtl;
}

/* آیتم‌ها */
.stat-item{ text-align:center; min-width:110px; }
.stat-label{
  display:block;
  font-size:.85rem;
  color: rgba(255,255,255,0.65); /* متن کم‌رنگ‌تر */
}
.stat-value{
  display:block;
  font-weight:700;
  font-size:1.05rem;
  color: #ffffff; /* مقدارها روشن */
  margin-top:.15rem;
}

/* جداکننده */
.stat-sep{
  color: rgba(255,255,255,0.45);
  font-size:1.1rem;
  opacity:.95;
}

/* واکنش‌گرا */
@media (max-width:520px){
  .footer-stats-inner{
    flex-direction:column;
    gap:.5rem;
    padding:.6rem;
  }
  .stat-item{ min-width:unset; }
  .stat-sep{ display:none; }
}

/* فعال‌سازی فقط برای حالت تاریک با prefers-color-scheme */
@media (prefers-color-scheme: dark){
  .footer-stats-inner{
    background: rgba(18,20,24,0.6);
    border: 1px solid rgba(255,255,255,0.05);
    box-shadow: 0 6px 20px rgba(0,0,0,0.6);
  }
  .stat-label{ color: rgba(255,255,255,0.6); }
  .stat-sep{ color: rgba(255,255,255,0.45); }
}

/* یا فعال‌سازی دستی با کلاس .dark روی <body> */
body.dark .footer-stats-inner{
  background: rgba(18,20,24,0.7);
  border: 1px solid rgba(255,255,255,0.06);
}
body.dark .stat-label{ color: rgba(255,255,255,0.65); }
body.dark .stat-value{ color: #fff; }






/* ========== Cards / Posts ========== */
.card, .post-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 1rem; margin-block: 1rem;
  backdrop-filter: blur(var(--glass-blur));
  box-shadow: 0 12px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.04) inset;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover, .post-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(0,0,0,.45), 0 0 24px rgba(0,224,255,.25);
  border-color: color-mix(in oklab, var(--border) 60%, var(--secondary) 40%);
}

.post-card .meta, .post .meta{
  display:flex; gap:1rem; color: var(--muted); font-size:.9rem; margin-bottom:.5rem;
}
.post-card .read-more{ color: var(--link); }
.post-card .read-more:hover{ text-decoration: underline; }

.post-card h2 a{
  text-decoration: none !important;
  color: var(--text);
  transition: color .18s ease, text-shadow .18s ease;
}
.post-card h2 a:hover, .post-card h2 a:focus{
  color: var(--primary);
  text-shadow: 0 0 12px rgba(124,77,255,.35);
}

/* ========== Tables (Enhanced) ========== */
.table{
  width:100%; border-collapse:collapse; border-spacing:0;
  background: var(--card);
  border: 2px solid transparent;
  border-radius: 12px; overflow: hidden; font-size: .98rem;
  backdrop-filter: blur(var(--glass-blur));
  /* Animated gradient border */
  --g1: var(--secondary);
  --g2: var(--primary);
  --g3: var(--accent);
  border-image: linear-gradient(90deg, var(--g1), var(--g2), var(--g3)) 1;
  animation: tableBorderShift 8s linear infinite;
}
@keyframes tableBorderShift{
  0%   { border-image-source: linear-gradient(90deg, var(--g1), var(--g2), var(--g3)); }
  50%  { border-image-source: linear-gradient(90deg, var(--g2), var(--g3), var(--g1)); }
  100% { border-image-source: linear-gradient(90deg, var(--g3), var(--g1), var(--g2)); }
}
.table thead th{
  background: color-mix(in oklab, var(--card) 70%, rgba(0,224,255,.15) 30%);
  color: var(--text); text-align:center; font-weight:700;
  border-bottom: 1px solid var(--border);
  padding:.7rem .8rem; white-space:nowrap;
  text-shadow: 0 0 8px rgba(0,224,255,.25);
}
.table tbody td{
  border-top: 1px solid var(--border);
  padding:.6rem .8rem; text-align:center; vertical-align:middle;
}
.table.table-striped tbody tr:nth-child(odd){
  background: color-mix(in oklab, var(--card) 78%, rgba(124,77,255,.12) 22%);
}
.table.table-hover tbody tr:hover{
  background: color-mix(in oklab, var(--card) 70%, rgba(0,224,255,.18) 30%);
}
.table.table-bordered th, .table.table-bordered td{ border:1px solid var(--border); }
.table.table-compact thead th{ padding:.5rem .6rem }
.table.table-compact tbody td{ padding:.45rem .6rem; font-size:.92rem }
.table.table-roomy thead th{ padding:.95rem 1.05rem }
.table.table-roomy tbody td{ padding:.85rem 1.05rem; font-size:1.02rem }
.table-wrapper{ overflow-x:auto; -webkit-overflow-scrolling:touch }

/* Center tables inside post content */
.post .content table,
.post .content .table{
  margin: 1.25rem auto;
}
.post .content table th,
.post .content table td{
  padding: .5rem .75rem;
}
/* Default alignment inside table builder canvas */
#tb th, #tb td { text-align: center; }

/* ========== Forms & Buttons ========== */
.auth-form, .contact-form, .post-form, .search-form{
  display:grid; gap:.7rem; max-width:700px;
}

input, textarea, select{
  border:1px solid var(--border);
  border-radius:.6rem;
  padding:.65rem .8rem; font-size:1rem;
  background: color-mix(in oklab, #ffffff 86%, rgba(255,255,255,.0) 14%);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  transition: border-color .18s ease, box-shadow .18s ease, transform .12s ease;
}
input:hover, textarea:hover, select:hover{
  border-color: color-mix(in oklab, var(--border) 60%, var(--secondary) 40%);
}
input:focus, textarea:focus, select:focus{
  box-shadow: 0 0 0 3px rgba(124,77,255,.28);
  border-color: color-mix(in oklab, var(--border) 40%, var(--primary) 60%);
  transform: translateY(-1px);
}

button, .button{
  background: linear-gradient(90deg, var(--primary), var(--secondary), var(--accent));
  color: #fff; border: none; border-radius:.65rem;
  padding:.6rem 1rem; text-decoration:none; display:inline-block;
  font-weight:600; line-height:1; font-family:inherit;
  box-shadow: 0 10px 24px rgba(0,0,0,.35), 0 0 18px rgba(124,77,255,.35);
  position:relative; overflow:hidden; cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
button:hover, .button:hover{
  transform: translateY(-2px);
  filter: saturate(1.05) brightness(1.06);
}
button:active, .button:active{
  transform: translateY(0);
}

/* Ripple highlight (pure CSS hover) */
button::before, .button::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(120px 120px at var(--x,50%) var(--y,50%), rgba(255,255,255,.25), transparent 60%);
  opacity:0; transition: opacity .25s ease;
}
button:hover::before, .button:hover::before{ opacity:1; }

/* ========== Pagination ========== */
.pagination{ display:flex; gap:.5rem; margin:1rem 0; }
.page-link{
  padding:.38rem .7rem; border:1px solid var(--border);
  border-radius:.5rem; text-decoration:none; color:var(--text);
  background: var(--card); backdrop-filter: blur(var(--glass-blur));
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.page-link:hover{
  transform: translateY(-1px);
  border-color: color-mix(in oklab, var(--border) 55%, var(--primary) 45%);
  box-shadow: 0 6px 18px rgba(0,0,0,.3);
}
.page-link.active{
  background: color-mix(in oklab, var(--card) 65%, rgba(124,77,255,.2) 35%);
}

/* ========== Alerts ========== */
.alert{
  padding:.85rem 1.05rem; border-radius:.7rem; margin:.85rem 0;
  background: var(--card); border:1px solid var(--border);
  backdrop-filter: blur(var(--glass-blur));
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
}
.alert.success{
  background: var(--success-bg);
  color: var(--success-fg);
  border-color: var(--success-bd);
  box-shadow: 0 0 18px rgba(0,255,171,.25);
}
.alert.error{
  background: var(--danger-bg);
  color: var(--danger-fg);
  border-color: var(--danger-bd);
  box-shadow: 0 0 18px rgba(255,77,109,.25);
}

/* ========== Grid / Cards Misc ========== */
.grid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:.85rem; margin:.85rem 0;
}
.msg-body{ white-space:pre-wrap; text-align:justify; }

/* ========== Footer ========== */
.site-footer{
  margin-top:2rem; padding:2rem 0; border-top:1px solid var(--border); color:var(--muted);
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.04));
  box-shadow: 0 -12px 28px rgba(0,0,0,.35) inset;
}
.footer-grid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
  gap:1rem; align-items:start;
}
.footer-title{
  margin:.25rem 0 .6rem; font-weight:800; font-size:1rem; color: var(--text);
}
.footer-links{ list-style:none; padding:0; margin:0; display:grid; gap:.4rem; }
.footer-links a{ text-decoration:none; color:var(--text); opacity:.9; }
.footer-links a:hover{ opacity:1; }
.footer-bottom{
  margin-top:1rem; border-top:1px solid var(--border);
  padding-top:.75rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  color:var(--muted);
}

/* ========== Mobile Nav ========== */
.nav-toggle{
  display:none; border:1px solid var(--border); background: var(--card); color: var(--text);
  padding:.5rem .7rem; border-radius:.7rem; cursor:pointer;
  backdrop-filter: blur(var(--glass-blur));
}
@media (max-width:720px){
  .nav-toggle{ display:inline-flex; align-items:center; justify-content:center; }
  .main-nav{
    position:fixed; top:64px; inset-inline-end:12px; width:min(260px,92vw);
    max-height:calc(100dvh - 76px); overflow:auto; background: var(--card);
    border:1px solid var(--border); border-radius:14px; box-shadow:0 10px 28px rgba(0,0,0,.45);
    padding:.6rem 0; z-index:1000; transform-origin:top right; transform:scale(.98);
    opacity:0; pointer-events:none; transition:transform .18s ease, opacity .18s ease;
    backdrop-filter: blur(var(--glass-blur));
  }
  .main-nav ul{ display:flex; flex-direction:column; margin:0; padding:0; list-style:none; }
  .main-nav a{ display:block; padding:.7rem 1rem; border-radius:0; }
  .main-nav a:hover, .main-nav a:focus{
    background: color-mix(in oklab, var(--card) 70%, rgba(0,224,255,.18) 30%);
  }
  .main-nav.open{ transform:scale(1); opacity:1; pointer-events:auto; }
  .nav-backdrop{
    position:fixed; inset:0; background: rgba(0,0,0,.45);
    opacity:0; pointer-events:none; transition:opacity .18s ease; z-index:999;
  }
  .nav-open{ overflow:hidden; }
  .nav-open .nav-backdrop{ opacity:1; pointer-events:auto; }
}

/* ========== Admin: Horizontal Form ========== */
.form.form-horizontal .row{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:16px 24px; align-items:center;
}
.form.form-horizontal .field{
  display:grid; grid-template-columns:120px 1fr; gap:10px; align-items:center;
}
.form.form-horizontal .field.full{ grid-column:1 / -1; grid-template-columns:120px 1fr; }

.form.form-horizontal input[type="text"],
.form.form-horizontal input[type="url"],
.form.form-horizontal input[type="email"],
.form.form-horizontal input[type="password"],
.form.form-horizontal input[type="file"],
.form.form-horizontal textarea,
.form.form-horizontal select{
  width:100%; padding:.6rem .85rem; border:1px solid #3a445a; border-radius:10px;
  background: rgba(255,255,255,.08); color: #eaf0ff;
  backdrop-filter: blur(var(--glass-blur));
}
.form.form-horizontal input[type="url"],
.form.form-horizontal input[type="email"]{ direction:ltr; text-align:left; }
.form.form-horizontal textarea{ min-height:180px; resize:vertical; }
.form.form-horizontal fieldset.full{
  grid-column:1 / -1; border:1px solid #3a445a; border-radius:12px; padding:12px;
  background: rgba(255,255,255,.06); backdrop-filter: blur(var(--glass-blur));
}
.form.form-horizontal fieldset legend{ padding:0 6px; font-weight:600; color: var(--text); }
.form.form-horizontal .actions{ grid-column:1 / -1; display:flex; gap:8px; margin-top:8px; }

/* Admin cover inputs compact */
.form.form-horizontal fieldset.full .field{ grid-template-columns:100px auto; }
.form.form-horizontal fieldset.full .field input[type="file"],
.form.form-horizontal fieldset.full .field input[type="url"]{
  max-width:360px; padding:.5rem .65rem; font-size:.95rem;
}

/* Delete as link */
.btn-link{
  background:none; border:none; padding:0;
  color: var(--accent); cursor:pointer; font:inherit;
}
.btn-link:hover{ text-decoration: underline; }
.btn-link.danger{ color:#ff4d6d; }

/* Helpers for full-span widgets (e.g. table builder) */
.form.form-horizontal .field.full .full-span{ grid-column:1 / -1; width:100%; }
.form.form-horizontal .field.full .full-span .table-wrapper{
  overflow:auto; border:1px solid var(--border); border-radius:.6rem; background:var(--card); padding:.5rem;
  backdrop-filter: blur(var(--glass-blur));
}
.form.form-horizontal .field.full .full-span table.table{ min-width:760px; }

/* ========== Progress bar (reading) ========== */
#readProgress{
  position:fixed; inset-inline-start:0; top:0; height:3px;
  width:0;
  background: linear-gradient(90deg, var(--secondary), var(--primary), var(--accent));
  box-shadow: 0 0 12px rgba(0,224,255,.55);
  z-index:9999; transition: width .1s linear;
}

/* ========== Floating buttons ========== */
.to-top{
  position:fixed; inset-inline-end:16px; bottom:16px;
  width:42px; height:42px; border-radius:999px; border:1px solid var(--border);
  background: var(--card); color: var(--text); display:none; align-items:center; justify-content:center;
  box-shadow: 0 6px 18px rgba(0,0,0,.35), 0 0 22px rgba(0,224,255,.25);
  cursor:pointer;
  backdrop-filter: blur(var(--glass-blur));
}
.to-top.show{ display:flex; }

.fab{
  position:fixed;
  inset-inline-start:16px; bottom:18px;  /* RTL-aware */
  width:40px; height:40px; border-radius:999px;
  display:grid; place-items:center;
  border:1px solid var(--border);
  background: var(--card); color: var(--text);
  box-shadow: 0 6px 18px rgba(0,0,0,.35), 0 0 22px rgba(124,77,255,.28);
  cursor:pointer; opacity:0; transform:translateY(10px);
  transition:opacity .15s ease, transform .15s ease, background .15s ease;
  z-index:1200;
  backdrop-filter: blur(var(--glass-blur));
}
.fab.show{ opacity:1; transform:translateY(0); }
.fab:hover{ background: color-mix(in oklab, var(--card) 85%, rgba(124,77,255,.18) 15%); }

/* ========== Code copy button ========== */
.pre-wrap{ position:relative; }
.copy-btn{
  position:absolute; inset-inline-end:8px; top:8px; font-size:.8rem;
  border:1px solid var(--border); background: var(--card); color: var(--text);
  border-radius:.45rem; padding:.25rem .5rem; cursor:pointer;
  backdrop-filter: blur(var(--glass-blur));
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.copy-btn:hover{
  transform: translateY(-1px);
  border-color: color-mix(in oklab, var(--border) 55%, var(--secondary) 45%);
  box-shadow: 0 6px 18px rgba(0,0,0,.3);
}

/* ========== Archive list ========== */
.archive-list{
  list-style:none; margin:1rem auto; padding:0;
  width:min(900px, 100%);
  display:grid; gap:.7rem;
}
.archive-item{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem;
  background: var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:.85rem 1rem;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
  backdrop-filter: blur(var(--glass-blur));
}
.archive-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.35), 0 0 18px rgba(0,224,255,.25);
  border-color: color-mix(in oklab, var(--border) 55%, var(--secondary) 45%);
}
.archive-link{
  text-decoration:none; color: var(--text); font-weight:700;
  line-height:1.6;
}
.archive-link:hover{ opacity:.95; }
.archive-date{
  color: var(--muted); font-size:.85rem; white-space:nowrap;
}

/* موبایل: تاریخ زیر عنوان بیاید */
@media (max-width:700px){
  .archive-item{ flex-direction:column; align-items:flex-start; }
  .archive-date{ order:2; }
}