/* استایل پایه - واکنش‌گرا و مینیمال */
:root{
  --bg: #f6f9fc;
  --card: #ffffff;
  --text: #0f1724;
  --muted: #6b7280;
  --accent: #007BFF;
  --danger: #e02424;
}

/* کارت‌ها در صفحه اصلی زیر هم باشند */
.centered .container {
  display: flex;
  flex-direction: column;  /* ستون به جای ردیف */
  align-items: center;     /* وسط چین افقی */
  gap: 16px;               /* فاصله بین کارت‌ها */
}


/*فونت و وسط چین شدن کاردها*/
input,
textarea,
select,
button {
  font-family: BTitr, Tahoma, sans-serif;
}
input {
  text-align: center;
}

/*پایان */

.chat-box {
  height: 60vh;
  overflow-y: auto;
  border: 1px solid #ccc; /* یا var(--border) */
  padding: 10px;
  margin-bottom: 10px;
  background: #fff; /* یا var(--card-bg) */
}

.msg {
  margin-bottom: 6px;
}

.special {
  font-weight: bold;
  color: #e02424;
  /* قرمز برای کاربران خاص */
}

.me {
  font-weight: bold;
  color: #007BFF; /* آبی برای خودت */
}

.time {
  font-size: 11px;
  opacity: 0.6;
}

.message-form {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

.message-form input {
  flex: 1;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #e6e9ef;
  font-size: 1rem;
  text-align: center;
}

.message-form button {
  padding: 10px 16px;
  border-radius: 10px;
  border: none;
  cursor: pointer;
  font-family: 'BTITRBD';
  font-weight: 600;
  background: var(--accent);
  color: #fff;
  box-shadow: 0 6px 18px rgba(0,123,255,0.18);
  transition: transform .12s ease, box-shadow .12s;
}

.message-form button:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0,123,255,0.12);
}

/* رنگ متن داخل chat-box برای تم‌های روشن */
[data-theme="gradient"] .chat-box,
[data-theme="emdadi"] .chat-box {
  color: #0f1724; /* متن تیره برای خوانایی */
}

/* رنگ span های special و me */
[data-theme="gradient"] .msg .me {
  color: #007BFF;
}
[data-theme="gradient"] .msg .special {
  color: #e02424;
}

[data-theme="emdadi"] .msg .me {
  color: #007BFF;
}
[data-theme="emdadi"] .msg .special {
  color: #e02424;
}

@font-face {
  font-family: 'BTITRBD';
  src: url('BTITRBD.woff2') format('woff2'),
       url('BTITRBD.woff') format('woff'),
       url('BTITRBD.woff') format('eot'),
       url('BTITRBD.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

button.btn-danger {
    font-family: 'BTITRBD', sans-serif;
}


.file-preview {
  margin-top: 15px;
  text-align: center;
}

.file-preview img,
.file-preview video,
.file-preview audio {
  max-width: 100%;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.15);
}

/* فقط برای ویدیو */
.video-preview video {
  width: 100%;
  max-width: 480px;
  height: auto;
  border-radius: 16px;
  display: block;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}



.image-box {
  width: 300px;
  /* ارتفاع خودکار نسبت به تصویر */
  aspect-ratio: auto;
  overflow: hidden;
  border: 1px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
  background-color: #f5f5f5;
  border-radius: 12px;
}

.image-box img {
  width: 100%;
  height: auto;        /* اجازه میده ارتفاع خودش نسبت به عرض باشه */
  object-fit: contain;  /* کامل تصویر دیده بشه */
}



*{box-sizing:border-box}
body {
  font-family: 'BTITRBD', Tahoma, sans-serif;
  direction: rtl;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}
.topbar{background:transparent;padding:12px 0}
.container{max-width:980px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 16px}
.brand{font-weight:700;font-size:1.2rem}
.theme-switcher select{padding:6px;border-radius:6px;border:1px solid #ddd}

.centered{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 80px)}
.card{width:100%;max-width:820px;background:var(--card);border-radius:14px;padding:26px;box-shadow:0 8px 30px rgba(15,23,36,0.06)}
.main-card{text-align:center}
.main-card h1{margin:0 0 18px;font-size:1.4rem}
input[type=text]{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #e6e9ef;font-size:1rem}
input[type=password]{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #e6e9ef;font-size:1rem}
.actions{margin-top:14px;display:flex;gap:10px;justify-content:center}
.btn{background:var(--accent);color:#fff;padding:10px 16px;border-radius:10px;border:none;cursor:pointer;font-family:'BTITRBD';font-weight:600;box-shadow:0 6px 18px rgba(0,123,255,0.18);transition:transform .12s ease,box-shadow .12s}
.btn:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,123,255,0.12)}
.btn-outline{background:transparent;color:var(--accent);border:1px solid rgba(0,123,255,0.12)}
.note{margin-top:12px;color:var(--muted)}
.alert{background:#fff3cd;padding:10px;border-radius:8px;margin:12px 0;color:#856404}

.new-card .code-box{font-size:1.6rem;font-weight:700;background:linear-gradient(90deg,#eef6ff,#f7fbff);padding:12px;border-radius:10px;display:inline-block;margin-bottom:12px}
.new-card textarea{width:100%;min-height:320px;padding:16px;border-radius:10px;border:1px solid #eef2f7;font-size:1rem;resize:vertical}
.btn-danger{background:var(--danger)}
.success{background:#e6ffed;padding:10px;border-radius:8px;color:#04622b;margin-bottom:12px}
.clip-content{white-space:pre-wrap;word-wrap:break-word;background:#0f1724;color:#f8fafc;padding:16px;border-radius:10px}

@media (max-width:720px){
  .card{padding:18px;border-radius:12px}
  .new-card textarea{min-height:240px}
}

/* تیک دانلود فایل */
td a {
  color: #ffffff !important;      /* رنگ مشکی */
  text-decoration: none !important; /* بدون underline */
  font-weight: bold;            /* اختیاری: کمی پررنگ‌تر */
  cursor: pointer;              /* مثل دکمه */
}

td a:hover {
  color: #ff0000 !important;      /* وقتی هاور شد هم مشکی بمونه */
  text-decoration: none !important;
}

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px;
}

.topbar .theme-switcher {
  flex: 0 0 auto;
}

.topbar .brand.middle {
  flex: 1;
  text-align: center;
}

.topbar .brand:last-child {
  flex: 0 0 auto;
  text-align: right;
}

.create-card {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: all .35s ease;
}

.create-card.active {
  max-height: 400px;
  opacity: 1;
}

/* فرم ایجاد اتاق زیر فرم ورود - مخفی اولیه */
.create-card {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-10px);
  transition: all 0.35s ease;
}

/* فعال شدن فرم ایجاد اتاق */
.create-card.active {
  max-height: 400px; /* ارتفاع فرم حداکثر */
  opacity: 1;
  transform: translateY(0);
}