/* ==========================================================================
   BIGBANG - Dark Mode palette override  (base color: #0d1b3e)
   File: templates/shufytheme/assets/css/bigbang-darkmode.css
   Re-skins the Shufy theme's built-in dark mode from neutral grey to navy.
   Also styles the floating sun/moon toggle button.
   ========================================================================== */

body.body__dark,
body.body__dark.theme-style-two,
body.body__dark.theme-style-three,
body.body__dark.theme-style-four,
[data-theme="dark"] body {
  /* backgrounds */
  --background:      #0d1b3e;
  --background-2:    #12244f;
  --background-3:    #182f63;
  --background-4:    #0f2047;
  --background-5:    #0d1b3e;
  --background-6:    #0e1d43;
  --background-7:    #0a142f;
  --background-8:    #081228;
  --background-9:    #0f2047;
  --background-11:   #0a142f;
  --background-12:   #081228;
  --background-13:   #12244f;
  --background-14:   #182f63;

  /* borders */
  --border-color:        #1e3260;
  --border-color-light:  #16294f;
  --btn-border:          rgba(255, 255, 255, .16);

  /* primary buttons */
  --btn-primary-bg:            #3b6fd4;
  --btn-primary-border:        #3b6fd4;
  --btn-primary-color:         #ffffff;
  --btn-primary-bg-hover:      #4d81e8;
  --btn-primary-border-hover:  #4d81e8;
  --btn-primary-color-hover:   #ffffff;

  --btn-primary-light-bg:            #182f63;
  --btn-primary-light-border:        #182f63;
  --btn-primary-light-bg-hover:      #1f3a77;
  --btn-primary-light-border-hover:  #1f3a77;

  --btn-default-bg:            #12244f;
  --btn-default-border:        #1e3260;
  --btn-default-bg-hover:      #182f63;
  --btn-default-border-hover:  #2b4a8a;

  --btn-primary-outlin-border:        #2b4a8a;
  --btn-primary-outlin-bg-hover:      #3b6fd4;
  --btn-primary-outlin-border-hover:  #3b6fd4;

  --btn-light-bg:              #182f63;
  --btn-light-border:          #182f63;
  --btn-light-bg-hover:        #1f3a77;
  --btn-light-border-hover:    #1f3a77;

  --btn-lighter-bg:            #12244f;
  --btn-lighter-border:        #12244f;
  --btn-lighter-bg-hover:      #182f63;
  --btn-lighter-border-hover:  #182f63;

  --checkbox-first-color:              #3b6fd4;
  --options-icons-container-bg:        #12244f;
  --options-icons-container-bg-hover:  #182f63;

  /* sidebar - default skin */
  --sidebarcolorsdefaultonebg:              #0d1b3e;
  --sidebarcolorsdefaultoneextendbtnbg:     #12244f;
  --sidebarcolorsdefaultoneitembg:          #0d1b3e;
  --sidebarcolorsdefaultoneitemhoverbg:     #182f63;
  --sidebarcolorsdefaultonedropdownbg:      #0f2047;
  --sidebarcolorsdefaultonedropdownitembg:  #12244f;

  /* sidebar - dark skin */
  --sidebarcolorsdarkonebg:              #0a142f;
  --sidebarcolorsdarkoneextendbtnbg:     #0d1b3e;
  --sidebarcolorsdarkoneitembg:          #0d1b3e;
  --sidebarcolorsdarkoneitemhoverbg:     #182f63;
  --sidebarcolorsdarkonedropdownbg:      #081228;
  --sidebarcolorsdarkonedropdownitembg:  #0d1b3e;
}

body.body__dark {
  background-color: #0d1b3e;
  color-scheme: dark;
}

body.body__dark .card,
body.body__dark .modal-content,
body.body__dark .dropdown-menu,
body.body__dark .popover,
body.body__dark .list-group-item,
body.body__dark .panel,
body.body__dark .well {
  background-color: #12244f;
  border-color: #1e3260;
}

body.body__dark .table,
body.body__dark .table td,
body.body__dark .table th {
  border-color: #1e3260;
}

body.body__dark .table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, .025);
}

body.body__dark .form-control,
body.body__dark .custom-select,
body.body__dark input[type="text"],
body.body__dark input[type="email"],
body.body__dark input[type="password"],
body.body__dark input[type="number"],
body.body__dark input[type="search"],
body.body__dark textarea,
body.body__dark select {
  background-color: #0f2047;
  border-color: #1e3260;
  color: #e6ecf7;
}

body.body__dark .form-control:focus,
body.body__dark select:focus,
body.body__dark textarea:focus {
  background-color: #12244f;
  border-color: #3b6fd4;
  box-shadow: 0 0 0 .18rem rgba(59, 111, 212, .25);
}

body.body__dark .form-control::placeholder,
body.body__dark textarea::placeholder {
  color: #7e8db0;
}

body.body__dark hr,
body.body__dark .border,
body.body__dark .border-top,
body.body__dark .border-bottom,
body.body__dark .border-left,
body.body__dark .border-right {
  border-color: #1e3260 !important;
}

body.body__dark a:not(.btn):not(.nav-link) { color: #8fb2ff; }
body.body__dark a:not(.btn):not(.nav-link):hover { color: #b3caff; }

body.body__dark .bg-white,
body.body__dark .bg-light { background-color: #12244f !important; }

body.body__dark .text-dark,
body.body__dark .text-black { color: #e6ecf7 !important; }

body.body__dark .text-muted { color: #8b99b8 !important; }

body.body__dark ::-webkit-scrollbar { width: 10px; height: 10px; }
body.body__dark ::-webkit-scrollbar-track { background: #0a142f; }
body.body__dark ::-webkit-scrollbar-thumb { background: #22376a; border-radius: 8px; }
body.body__dark ::-webkit-scrollbar-thumb:hover { background: #2b4a8a; }


/* ==========================================================================
   Floating sun / moon toggle
   ========================================================================== */
#bb-mode-toggle {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 99990;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 0, 0, .08);
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  background: #ffffff;
  color: #0d1b3e;
  box-shadow: 0 6px 20px rgba(13, 27, 62, .22);
  transition: background-color .25s ease, color .25s ease, box-shadow .25s ease, transform .2s ease;
}

#bb-mode-toggle:hover  { transform: translateY(-2px) scale(1.04); }
#bb-mode-toggle:active { transform: translateY(0) scale(.96); }
#bb-mode-toggle:focus-visible { outline: 2px solid #3b6fd4; outline-offset: 3px; }

body.rtl #bb-mode-toggle,
html[dir="rtl"] #bb-mode-toggle { right: auto; left: 22px; }

body.body__dark #bb-mode-toggle {
  background: #1c3468;
  color: #ffd479;
  border-color: rgba(255, 255, 255, .24);
  box-shadow: 0 6px 22px rgba(0, 0, 0, .55);
}
body.body__dark #bb-mode-toggle:hover { background: #24427f; }

#bb-mode-toggle svg {
  width: 22px;
  height: 22px;
  display: block;
  transition: transform .35s ease, opacity .25s ease;
}

#bb-mode-toggle .bb-icon-sun  { display: none; }
#bb-mode-toggle .bb-icon-moon { display: block; }
body.body__dark #bb-mode-toggle .bb-icon-sun  { display: block; }
body.body__dark #bb-mode-toggle .bb-icon-moon { display: none; }

@media (max-width: 575.98px) {
  #bb-mode-toggle { width: 44px; height: 44px; right: 14px; bottom: 76px; }
  body.rtl #bb-mode-toggle,
  html[dir="rtl"] #bb-mode-toggle { left: 14px; right: auto; }
  #bb-mode-toggle svg { width: 19px; height: 19px; }
}

@media (prefers-reduced-motion: reduce) {
  #bb-mode-toggle,
  #bb-mode-toggle svg { transition: none; }
}