 /** gold color #e67e22; for border **/
 
 .dark-toggle {
  position: fixed;
  top: 130px;
  left: 0px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  /**border: none;**/
  cursor: pointer;
  background: #1d2433;
  color: #fff;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 20px rgba(0,0,0,0.35);
  transition: all 0.3s ease;
  z-index: 9999;
}

.dark-toggle:hover {
  transform: scale(1.1) rotate(-10deg);
}

body.dark-mode .smallDevicesMenu .grid-search input[type="search"]{
color: #000 !important;
}
body.dark-mode{
  background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)),url("img/bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  }

body.dark-mode #header-date
 {
  background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;
  border-top: 1px solid #000 !important;
  border-right: 1px solid #000 !important;
  border-left: 1px solid #86796e !important;
}   

body.dark-mode .copyrights {
/**182130**/
 /** background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;**/
  color: #fff !important;
  background:#000 !important;
}

body.dark-mode .w3-theme-l5 {

  background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
  color: #fff !important;
}


body.dark-mode .w3-gradient-2 {

 background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;

}

body.dark-mode .w3-round {

  background:#000 !important;
  color: #fff !important;
}
/** back ground of slider **/
body.dark-mode .w3-white
{
  /**background:#000 !important;**/
   /**background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;**/
   /**background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;**/
     background: linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95));
  color: #fff !important;
  border-radius: 20px;
}


@media screen and (max-width: 850px) {
body.dark-mode .w3-white {
 
/**border: 1px solid #e67e22;**/
  }
}


/** background inside sections **/
body.dark-mode .w3-theme-l3
{
background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
  /**background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)),url("img/bg.jpg") !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;**/
  color: #fff !important;
}

/** 
change w3-theme-l1** to w3-theme-l1new in main file and change size to 527px
**/
body.dark-mode .w3-theme-l1new
{
 background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
 /** background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)),url("img/bg.jpg") !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;**/
  color: #fff !important;
   height:auto !important;
}

@media screen and (max-width: 850px) {
body.dark-mode .a70 {
 height: 600px !important;
  }
}
@media screen and (max-width: 850px) {
.a70 {
 height: 600px !important;
  }
}

/** section titles **/
body.dark-mode .mahmoud_headb
{
  background:#000 !important;
  color: #fff !important;
}



/**
body.dark-mode .w3-bar-tabs{
    background-color: red !important;
}

body.dark-mode .w3-bar-tabs::after {
    background-color: red !important;
}
**/
/**
body.dark-mode #list-latest_topics-pagination a {
  background-color: #0f1a1c !important;
    color: #FFF !important;
}

body.dark-mode #list-latest_topics-pagination a.selected {
  color: #3ACA88 !important;
  background-color: #FFF !important;
}
**/

body.dark-mode .w3-theme-d1
{
  background-color: #000 !important;
    color: #FFF !important;
}

/** video board background color **/
body.dark-mode .tiles {
  /**background: #000 !important;**/
  background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
  color: #FFF !important;
}
/** video small frame background color **/
body.dark-mode .vid_top
 {
background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
  color: #FFF !important;
}
/** numbers under video **/
body.dark-mode #headerListPagination
{
background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
    color: #FFF !important;
}
/** arrow of category slider **/
body.dark-mode .w3-theme-d2
{
  background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
    color: #FFF !important;
}
/** borders of category slider **/
body.dark-mode .tabs {
  border: 2px solid #202735;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  height: 385pt !important;
}
/** hover of categort in navbar **/
body.dark-mode .has_sub:hover {
    color: #FFF !important;
background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
}

/** slide aswar **/
body.dark-mode .slideLink
{
  background:#000 !important;
    color: #FFF !important;
    border:1px solid #AE950A;
}

/** new mowad pagnation**/

body.dark-mode #list-latest_topics-pagination a
{
background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
    color: #FFF !important;
}

body.dark-mode #list-latest_topics-pagination a.selected
{
background: #000 !important;
    color: #FFF !important;
}

 /** 
 
in class w3-theme-l1new i need to add class to div to make frames to the video under page 
 
<div  style="width:95%;padding:3px;margin-top:8px;">
<a href="'.$langs.'/'.$RowlastVids->id.'"><img  src="'.$thumbURL2.'" style="width:100%"></a>

hear need to add class class="fordark"

<div class="fordark" style="width:95%;padding:3px;margin-top:8px;">
<a href="'.$langs.'/'.$RowlastVids->id.'"><img  src="'.$thumbURL2.'" style="width:100%"></a>
 
 **/

body.dark-mode .fordark
{
 width: 95%;
  padding: 3px;
 /** margin-top: 0px !important;**/
/**background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;**/
 /** background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;**/
  color: #FFF !important;
  border-radius: 10px;
  background-color: #3a3f4c;
  font-size: 15px;
}

body.dark-mode .fordark:hover
{
 width: 95%;
  padding: 1px;
  border-radius: 10px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.01);
    transition: all 0.3s ease;
}

/** fatwa akther qeraa **/
body.dark-mode .cmah
{
 background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
  color: #FFF !important;
}

body.dark-mode .cmah:hover
{
  background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;
  color: #FFF !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.01);
    transition: all 0.3s ease;
}

body.dark-mode .w3-color-dark {
  color: #fff !important;
  
}
body.dark-mode .w3-color-dark:hover {
  color: #fff !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.04);
    transition: all 0.3s ease;
    background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
}
/**slider category tabs of topics  border**/
body.dark-mode .grid-topic-index
{
  background: linear-gradient(to bottom, #000 0%,#000 100%) !important;
  border-left: 0px solid #2A303E;
  border-right: 0px solid #2A303E;
  border-bottom: 0px solid #2A303E;
}

body.dark-mode .w3-border-theme
{
  /** background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;**/
   background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95));
   border: 1px solid #000 !important;
   
}
body.dark-mode .w3-border-theme:hover
{
  background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;
   /**background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95));**/
     color: #FFF !important;
   box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.01);
    transition: all 0.3s ease;
}

body.dark-mode .w3-theme-d1
{
  background:#000 !important;
   /**background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95));**/
     color: #FFF !important;

}

body.dark-mode .w3-theme-d1:hover
{
  background:#4b505c !important;
   /**background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95));**/
     color: #FFF !important;

}

body.dark-mode .w3-bar-item
{
  border: 1px solid #000 !important;
}

body.dark-mode .w3-bar-tabs::after
{
  background-color: #000;
}

/* Change background color of buttons on hover */
body.dark-mode .tabz a:hover {
background: linear-gradient(to bottom, #000 0%,#000 100%);
border-radius: 15px;
}
/* Create an active/current tablink class */
body.dark-mode .tabz a.active {
  background-color: #165a67;
border-radius: 15px;
}


/** gaded maowad**/
body.dark-mode .bbottom {
background: linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
color: #FFF !important;
  border: 1px solid #000 !important;
  margin-left: 2px;
  margin-right: 2px;
}

body.dark-mode .bbottom:hover{
background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95));
color: #FFF !important;
box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.04);
    transition: all 0.3s ease;
}

body.dark-mode .cat-item-sound{
background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
color: #FFF !important;
margin-top: 5px !important;
border: 1px solid #404552 !important;
box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.01);
    transition: all 0.3s ease;
}


body.dark-mode .mahmoud_borders
{
border: 1px solid black;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
 background:linear-gradient(rgba(29,36,51,0.95),rgba(29, 36, 51, 0.95)) !important;
   color: #FFF !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
   /** transform: scale(1.01);**/
    transition: all 0.3s ease;
}

@media screen and (max-width: 850px) {
body.dark-mode .mahmoud_borders {
 
 /** border: 1px solid #e67e22;**/
  border: 1px solid black;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  }
}


@media screen and (max-width: 850px) {
body.dark-mode .w3-theme-l1 {
 
 /*border: 2px solid #e67e22;*/
 border: 2px solid black;
  }
}


body.dark-mode .mahmoud_headb2
{
background: #000 !important;
color: white !important;
}

@media screen and (max-width: 850px) {
body.dark-mode .mahmoud_headb2 {
border-top-left-radius: 26px;
border-top-right-radius: 26px;
  
  }
}

@media screen and (max-width: 850px) {
body.dark-mode .mahmoud_headb {
border-top-left-radius: 26px;
border-top-right-radius: 26px;
  
  }
}

/* للموبايلات فقط */
@media (max-width: 850px) {
  iframe.twittframe {
    height: 180px !important;   /* غير الرقم حسب ما تحب */
  }
}


body.dark-mode .grid-header.grid-header-no-logo
{
  background:linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)),url("img/header_bg.jpg");
 /*grid-template-columns: auto 315px;*/
  padding-right: 16px;
  padding-left: 16px;
  padding-top: 16px;
  margin-bottom: 6px;
  -webkit-box-shadow: 0px 0px 5px 2px #282a2d;
}
body.dark-mode .fa {
    color: #fff !important; /* لون مميز عند المرور بالماوس */
    transition: color 0.3s ease; /* انتقال سلس للون */
}

/* لو عايز hover */
body.dark-mode .fa:hover {
   color: #3ACA88 !important; /* لون أبيض للأيقونات */
}

body.dark-mode .fab {
    color: #fff !important; /* لون مميز عند المرور بالماوس */
    transition: color 0.3s ease; /* انتقال سلس للون */
}

/* لو عايز hover */
body.dark-mode .fab:hover {
    color: #3ACA88 !important; /* لون أبيض للأيقونات */
}


body.dark-mode .quick-btn.contacts{
    background: #2d3341; 
}
body.dark-mode .quick-btn.about{
    background: #2d3341; 
}
body.dark-mode .quick-btn.apps{
    background: #2d3341; 
}
body.dark-mode .quick-btn.home{
    background: #2d3341; 
}
body.dark-mode .quick-btn.rss{
    background: #2d3341; 
}

body.dark-mode .quick-btn.contacts:hover{
    background: #343946; 
}
body.dark-mode .quick-btn.about:hover{
    background: #343946; 
}
body.dark-mode .quick-btn.apps:hover{
    background: #343946; 
}
body.dark-mode .quick-btn.home:hover{
    background: #343946; 
}
body.dark-mode .quick-btn.rss:hover{
    background: #343946; 
}


body.dark-mode .formobaskfatwa button{
 background:linear-gradient(rgba(255, 255, 255, 0.2),rgb(41, 47, 61)) !important;
     color: #fff !important; /* لون أبيض للأيقونات */
}

body.dark-mode .w3-theme-dark{
color: #fff !important;
  background-color: #000 !important;
}

body.dark-mode .w3-theme-l4{
/*background-color: #707175 !important;*/
background-image: none !important;
background-color: #313744 !important;
color: #fff !important;
border-color: rgb(0, 0, 0) !important;
}

@media screen and (max-width: 850px) {
body.dark-mode .smallDevicesMenu a {
    font-size: 47px;
    color: #fff;
    position: relative;
    top: -5px;
    left: -5px;
    background-color: #3a3f4c;
    border: 1px solid #000;
  }
}
@media screen and (max-width: 850px) {
body.dark-mode .smallDevicesMenu a:hover {
 
    background-color: #1E2433;
    border: 1px solid #000;
  }
}

body.dark-mode #mobileMenu {
  width: 95%;
}

body.dark-mode #toggleMobileMenu {
border: 1px solid #000;
color: #FFF !important;

}

body.dark-mode #toggleMobileMenu span{
color: #000 !important;
}

/**body.dark-mode #change_lang__tab a{
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top: 1px solid #404551;
  border-right: 1px solid #404551;
  border-left: 1px solid #404551;
  background: background: linear-gradient(to bottom, #424651 0%,#1e2433 100%) !important;
}**/

body.dark-mode #change_lang__tab a {
 /** background: linear-gradient(to bottom, #b3b0ad 0%,#0f1a1c 100%) !important;**/
 border: 1px solid #000 !important;
  background: #1e2433;
  color: #FFF !important;
}

body.dark-mode #change_lang__tab a:hover {
  background: #343A47;
}

body.dark-mode #change_lang__tab a.active__lang{
  background: linear-gradient(to bottom, #000 0%,#000 100%) !important;
  color: #FFF !important;
  border: 3px solid #1d2332;
}

body.dark-mode .[data-carousel-3d] {
    background: linear-gradient(90deg, #424651, #1e2433, #424651) !important;
    border: 3px solid #1d2332 !important;
}

body.dark-mode .cat-item-sound:hover{
background: linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;
}


/**@media screen and (min-width: 0px) and (max-width: 850px) {
body.dark-mode .social-top {
  margin-top: -20px;
}
}**/
@media screen and (min-width: 0px) and (max-width: 850px) {
body.dark-mode #nav1
{
background: #000 !important;
}
}

body.dark-mode .w3-theme-l1{
  /**background: linear-gradient(rgba(29,36,51,0.5),rgba(29, 36, 51, 0.5)) !important;**/
  color: #FFF !important;
  background-image: none !important;
  background-color: #292F3D !important;

}
body.dark-mode .new_topics_title:hover{
  background: #000 !important;
  color: #FFF !important;
      box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    transform: scale(1.01);
    transition: all 0.3s ease;
}

body.dark-mode .w3-padding .new_topics_title >a:hover {
  background: #000 !important;
    color: #FFF !important;

}


/**
body.dark-mode #crumb .mt16 .mb16 .w3-round .w3-theme-d1 .w3-padding{
background-color:#292f3d;
}**/

body.dark-mode #topic_date_views
{
color:#FFF;
}

body.dark-mode .w3-hover-theme:hover{
    color: #FFF !important;
    background-color: #000 !important;
}

@media screen and (min-width: 0px) and (max-width: 850px) {
body.dark-mode .next_prev .w3-hover-theme>a{
    background-color: #313744 !important;
}
}

body.dark-mode .next_prev .w3-hover-theme>a{
    background-color: #313744 !important;
}


/** trees **/
body.dark-mode .next_prev .almosleh-v2-node-btn {

  background: #292f3d;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  border: 1px solid #eee;
  transition: 0.2s;
}

body.dark-mode .showData {
  color: #FFF !important;
  font-size: 13pt;
}

body.dark-mode .showData:hover {
  background: #313744 !important;
}

@media screen and (max-width: 850px) {
  body.dark-mode .hide-on-mobile {
  display:none;
  }
}

@media screen and (max-width: 850px) {
 .hide-on-mobile {
  display:none;
  }
}
@media screen and (max-width: 850px) {
body.dark-mode .caroufredsel_wrapper {
  margin-top:-20px;
  }
}
 
body.dark-mode  #latest_topics_ul{
padding-bottom: 20px;
}
 
 .at-icon-wrapper{
 padding-top: 20px;
 }
 
body.dark-mode .w3-theme-d4 {
  color: #fff !important;
  background-color: #AE950A !important;
}


body.dark-mode .form_back{
  background: #292f3d;
}


body.dark-mode #fatwa_email {
  background: #292f3d;
  color:#FFF;
}
body.dark-mode #fatwa_id{
  background: #292f3d;
  color:#FFF;
}

body.dark-mode .stared-item:nth-child(2n) {
  opacity: 1;
  background-color: #292f3d;
}

body.dark-mode .stared-item:nth-child(2n+1):hover {
 /*   background-color: #eeabf0 !important;*/
    background-color: #000 !important;
color:#fff;
}
body.dark-mode .stared-item:hover {
 /*   background-color: #eeabf0 !important;*/
    background-color: #000 !important;
color:#fff;
}

body.dark-mode .w3-red {
  color: #fff !important;
  background-color: #000 !important;
}


body.dark-mode .statics_index0 > .grid-mini-slider.w3-white {
    background-color: #1e2433 !important;
    color: #fff !important;
}


