/* ================================================================
   منتديات الشامل — knozasrar.net
   NO CSS VARIABLES — hard-coded for maximum vBulletin compatibility
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Scheherazade+New:wght@400;700&display=swap');

html { direction: rtl; }

body {
  background-color: #080600 !important;
  color: #E8DCC8 !important;
  font-family: 'Amiri', 'Scheherazade New', serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body, table, td, th, div, span, p, li, ul, ol,
input, select, textarea, button {
  font-family: 'Amiri', 'Scheherazade New', serif !important;
}

a { color: #C9A84C !important; text-decoration: none !important; }
a:hover { color: #E8C97A !important; }
a:visited { color: #C9A84C !important; }
img { max-width: 100%; border: 0; }

#page, #wrapper, .page {
  max-width: 1200px;
  margin: 0 auto !important;
  padding: 0 16px !important;
}

/* ================================================================ HEADER */
#header-outer {
  width: 100%;
  background-color: #0d0900 !important;
  border-bottom: 1px solid #8B6914 !important;
  border-top: 3px solid #C9A84C !important;
}

#header {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 22px;
  min-height: 110px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #0d0900;
  background-image: url('images/misc/header.jpg');
  background-size: cover;
  background-position: center;
  position: relative;
}

#header::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: rgba(8,6,0,0.82);
}

#logo-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 14px;
  position: relative;
  z-index: 2;
}

#logo-block .logo-ring {
  width: 70px; height: 70px;
  border-radius: 50%;
  border: 2px solid #8B6914;
  background-color: #1a1200;
  overflow: hidden;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

#logo-block .logo-ring img { width: 100%; height: 100%; object-fit: contain; }

#site-name { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: relative; z-index: 2; }

#site-name strong {
  font-family: 'Scheherazade New', 'Amiri', serif !important;
  font-size: 1.8rem !important; font-weight: 700 !important;
  color: #E8C97A !important; line-height: 1.2 !important;
}

#site-name .sub { font-size: 0.82rem; color: #8B6914; margin-top: 2px; font-style: normal; }
#site-name .sheikh { font-size: 0.76rem; color: #5a4a20; margin-top: 1px; font-style: normal; }

#header-links {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 8px; position: relative; z-index: 2;
  -ms-flex-wrap: wrap; flex-wrap: wrap;
}

#header-links a {
  padding: 5px 13px !important; border: 1px solid #8B6914 !important;
  border-radius: 3px !important; background-color: transparent !important;
  color: #AA9B7D !important; font-size: 0.82rem !important;
}

#header-links a:hover, #header-links a.active {
  background-color: rgba(201,168,76,0.15) !important;
  color: #E8C97A !important; border-color: #C9A84C !important;
}

/* ================================================================ NAVBAR */
#nav-outer {
  width: 100%;
  background-color: #0a0800;
  border-bottom: 1px solid #3d2d00;
  position: -webkit-sticky; position: sticky;
  top: 0; z-index: 100;
}

#navbar-inner {
  max-width: 1200px; margin: 0 auto; padding: 0 16px;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -ms-flex-wrap: wrap; flex-wrap: wrap;
}

#navbar-inner a {
  padding: 10px 16px !important;
  color: #7a6a4a !important; font-size: 0.88rem !important;
  border-bottom: 2px solid transparent !important;
  white-space: nowrap !important; display: inline-block !important;
}

#navbar-inner a:hover {
  color: #E8C97A !important;
  border-bottom-color: #C9A84C !important;
  background-color: rgba(201,168,76,0.06) !important;
}

/* ================================================================ INFO BAR */
#infobar-outer {
  width: 100%;
  background-color: #3d2d00;
  border-bottom: 1px solid #8B6914;
}

#infobar-inner {
  max-width: 1200px; margin: 0 auto; padding: 6px 20px;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
  font-size: 0.78rem; color: rgba(255,240,190,0.9);
  -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px;
}

#infobar-inner a { color: #FFD87A !important; }
#infobar-inner a:hover { color: #fff !important; }

/* ================================================================ MAIN */
#main-outer { max-width: 1200px; margin: 18px auto 30px; padding: 0 16px; }

td[width="175"], td[width="160"] {
  display: none !important; width: 0 !important;
  padding: 0 !important; overflow: hidden !important; border: none !important;
}

td#td_main, #td_main { width: 100% !important; }

table.tborder {
  width: 100% !important; border-collapse: collapse !important;
  background-color: transparent !important;
  margin-bottom: 16px !important; border: 1px solid #2a1f00 !important;
}

/* ================================================================ TCAT */
.tcat, .thead {
  background-color: #1a1200 !important;
  border-bottom: 2px solid #C9A84C !important;
}

.tcat td, .thead td {
  padding: 10px 16px !important; color: #E8C97A !important;
  font-family: 'Scheherazade New', 'Amiri', serif !important;
  font-size: 1rem !important; font-weight: 700 !important;
  border: none !important; background-color: transparent !important;
}

.tcat td a, .thead td a { color: #E8C97A !important; font-weight: 700 !important; }
.tcat td a:hover, .thead td a:hover { color: #fff !important; }

/* ================================================================ ALT1/ALT2 */
.alt1, .alt1Active { background-color: #111008 !important; border-bottom: 1px solid #1a1200 !important; }
.alt2, .alt2Active { background-color: #0e0d07 !important; border-bottom: 1px solid #141000 !important; }

.alt1 td, .alt2 td, .alt1Active td, .alt2Active td {
  padding: 9px 14px !important; color: #E8DCC8 !important;
  font-size: 0.88rem !important; border: none !important;
  vertical-align: middle !important; background-color: transparent !important;
}

.alt1 td a, .alt2 td a { color: #DDD0B8 !important; }
.alt1 td a:hover, .alt2 td a:hover { color: #E8C97A !important; }
td.alt1[align="center"], td.alt2[align="center"] { color: #8B6914 !important; font-size: 0.8rem !important; }

/* ================================================================ TFOOT */
.tfoot { background-color: #0a0800 !important; border-top: 1px solid #2a1f00 !important; }
.tfoot td { padding: 7px 16px !important; color: #4a3810 !important; font-size: 0.76rem !important; background-color: transparent !important; }
.tfoot td a { color: #8B6914 !important; }
.tfoot td a:hover { color: #C9A84C !important; }

/* ================================================================ STATS */
.shamil-stats { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 10px; margin-bottom: 18px; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.sstat { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 120px; background-color: #111008; border: 1px solid #2a1f00; border-top: 2px solid #8B6914; border-radius: 3px; padding: 13px 10px; text-align: center; }
.sstat-n { font-family: 'Scheherazade New', serif !important; font-size: 1.4rem !important; color: #C9A84C !important; font-weight: 700 !important; line-height: 1 !important; display: block; }
.sstat-l { font-size: 0.72rem; color: #4a3810; margin-top: 4px; display: block; }

/* ================================================================ DIVIDER */
.gdiv { height: 1px; background-color: #3d2d00; margin: 22px 0; border: none; }

/* ================================================================ BUTTONS */
input[type="submit"], input[type="button"], .button, a.button, .newpost {
  background-color: #8B6914 !important; color: #0a0800 !important;
  border: 1px solid #6b4d08 !important; padding: 6px 18px !important;
  font-family: 'Amiri', serif !important; font-size: 0.84rem !important;
  font-weight: 700 !important; border-radius: 3px !important; cursor: pointer !important;
}
input[type="submit"]:hover, .button:hover, a.button:hover { background-color: #C9A84C !important; }

/* ================================================================ INPUTS */
input[type="text"], input[type="password"], input[type="search"], textarea, select {
  background-color: #0d0b05 !important; border: 1px solid #2a1f00 !important;
  color: #E8DCC8 !important; padding: 6px 12px !important;
  border-radius: 3px !important; font-family: 'Amiri', serif !important; font-size: 0.88rem !important;
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus { border-color: #8B6914 !important; outline: none !important; }

/* ================================================================ PAGINATION */
.pagenav td { background-color: #111008 !important; }
.pagenav td a { color: #AA9B7D !important; }
.pagenav td a:hover { color: #C9A84C !important; }

/* ================================================================ ICONS */
td.forumicon img, .forumicon img, img[src*="statusicon"], img[src*="forum_"], img[src*="thread_"] {
  -webkit-filter: sepia(1) saturate(2) hue-rotate(10deg) brightness(0.85);
  filter: sepia(1) saturate(2) hue-rotate(10deg) brightness(0.85);
}

/* ================================================================ FOOTER */
#footer-outer { width: 100%; background-color: #050400; border-top: 2px solid #8B6914; margin-top: 40px; }
#footer-inner { max-width: 1200px; margin: 0 auto; padding: 34px 20px 16px; }
.ftr-orn { text-align: center; color: #2a1f00; font-size: 1rem; letter-spacing: 0.4rem; margin-bottom: 24px; }
.ftr-cols { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 30px; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid #1a1200; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.ftr-col { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 160px; }
.ftr-col h4 { font-family: 'Scheherazade New', serif !important; font-size: 0.95rem !important; color: #C9A84C !important; margin-bottom: 10px !important; padding-bottom: 6px !important; border-bottom: 1px solid #1a1200 !important; font-weight: 700 !important; }
.ftr-col ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.ftr-col ul li { font-size: 0.8rem; color: #4a3810; padding: 3px 0; }
.ftr-col ul li a { color: #4a3810 !important; }
.ftr-col ul li a:hover { color: #E8C97A !important; }
.ftr-bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; font-size: 0.72rem; color: #2a1f00; }
.ftr-bottom a { color: #2a1f00 !important; }
.ftr-bottom a:hover { color: #C9A84C !important; }

/* ================================================================ HIDE */
.navbar, #navbar_notice, table.navbar { display: none !important; }

/* ================================================================ RESPONSIVE */
@media only screen and (max-width:900px) {
  #site-name strong { font-size: 1.25rem !important; }
  .ftr-cols { gap: 18px; }
  #navbar-inner { overflow-x: auto; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
}
@media only screen and (max-width:600px) {
  #logo-block .logo-ring { width: 52px !important; height: 52px !important; }
  #site-name strong { font-size: 1rem !important; }
  .ftr-cols { -ms-flex-direction: column; flex-direction: column; }
  .ftr-bottom { -ms-flex-direction: column; flex-direction: column; text-align: center; }
  #infobar-inner { -ms-flex-direction: column; flex-direction: column; }
  #main-outer { padding: 0 8px; }
}
