/*@import url(https://fonts.googleapis.com/css?family=Rubik:300,400,500,700,900);*/
@import url(css.css?family=Rubik:300,400,500,700,900);
/*Theme Colors*/
/*bootstrap Color*/
/*Normal Color*/
/*Border radius*/
/*Preloader*/
.preloader {
  width: 100%;
  height: 100%;
  top: 0px;
  position: fixed;
  z-index: 99999;
  background: #fff;
}
.preloader .cssload-speeding-wheel {
  position: absolute;
  top: calc(50% - 3.5px);
  left: calc(50% - 3.5px);
}
/*Just change your choise color here its theme Colors*/
body {
  background: #fff;
}
.top-left-part {
  background: #fff;
}
.top-left-part .dark-logo {
  display: none;
}
.top-left-part .light-logo {
  display: inline-block;
}
/*Top Header Part*/
.logo i {
  color: #ffffff;
}
.navbar-header {
  background: #f0ad4e;
}
.navbar-top-links > li > a {
  color: #ffffff;
}
.sidebar .sidebar-head {
  background: #ffffff;
}
.sidebar .sidebar-head h3 {
  color: #686868;
}
/*Right panel*/
.right-sidebar .rpanel-title {
  background: #41b3f9;
}
/*Bread Crumb*/
.bg-title .breadcrumb .active {
  color: #41b3f9;
}
/*Sidebar*/
.sidebar {
  background: #fff;
  box-shadow: 1px 0px 20px rgba(0, 0, 0, 0.08);
}
.sidebar .label-custom {
  background: #01c0c8;
}
#side-menu li a {
  color: #54667a;
}
#side-menu li a {
  color: #54667a;
  border-left: 0px solid #fff;
}
#side-menu > li > a {
  border-left: 3px solid transperant;
}
#side-menu > li > a:hover,
#side-menu > li > a:focus {
  background: rgba(0, 0, 0, 0.07);
}
#side-menu > li > a.active {
  background: transperant;
  color: #54667a;
  border-left: 3px solid #41b3f9;
  font-weight: 500;
}
#side-menu ul > li > a:hover {
  color: #41b3f9;
}
#side-menu ul > li > a.active {
  color: #54667a;
  font-weight: 500;
}
.user-profile .user-pro-body .u-dropdown {
  color: #54667a;
}
/*themecolor*/
.bg-theme {
  background-color: #707cd2 !important;
}
.bg-theme-dark {
  background-color: #41b3f9 !important;
}
/*Button*/
.btn-custom {
  background: #41b3f9;
  border: 1px solid #41b3f9;
  color: #ffffff;
}
.btn-custom:hover {
  background: #41b3f9;
  opacity: 0.8;
  color: #ffffff;
  border: 1px solid #41b3f9;
}
/*Custom tab*/
.customtab li.active a,
.customtab li.active a:hover,
.customtab li.active a:focus {
  border-bottom: 2px solid #41b3f9;
  color: #41b3f9;
}
.tabs-vertical li.active a,
.tabs-vertical li.active a:hover,
.tabs-vertical li.active a:focus {
  background: #41b3f9;
  border-right: 2px solid #41b3f9;
}
/*Nav-pills*/
.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover {
  background: #41b3f9;
  color: #ffffff;
}
/*Extra css*/
.bg-theme {
  background-color: #41b3f9 !important;
}
.panel-themecolor,
.panel-theme {
  border-color: #41b3f9;
}
.panel-themecolor .panel-heading,
.panel-theme .panel-heading {
  border-color: #41b3f9;
  color: white;
  background-color: #41b3f9;
}
.panel-themecolor .panel-heading a,
.panel-theme .panel-heading a {
  color: #ffffff;
}
.panel-themecolor .panel-heading a:hover,
.panel-theme .panel-heading a:hover {
  color: rgba(255, 255, 255, 0.5);
}
.panel-themecolor a,
.panel-theme a {
  color: #41b3f9;
}
.panel-themecolor a:hover,
.panel-theme a:hover {
  color: #0791e6;
}

/* =========================================================
   THEME GLOBAL CORPORATIVO - SISTEMA COMPLETO
   ========================================================= */

:root {
  --brand-900: #071b2d;
  --brand-800: #0d2d4f;
  --brand-700: #123f67;
  --brand-600: #1d5f97;
  --brand-500: #2b86d6;
  --brand-400: #59b4ff;
  --accent: #ff9f43;
  --accent-2: #ff7a59;
  --success: #1ec6a3;
  --bg-soft: #edf4fb;
  --panel: rgba(255,255,255,0.92);
  --panel-strong: #ffffff;
  --text: #1b2d3d;
  --muted: #53677d;
  --border: rgba(18, 46, 73, 0.12);
  --shadow-soft: 0 18px 40px rgba(13, 29, 48, 0.13);
}

body {
  background: linear-gradient(180deg, #edf4fb 0%, #eaf2f8 100%) !important;
  color: var(--text);
}

#main-wrapper,
.page-wrapper {
  background: transparent !important;
}

.topbar {
  background: #ffffff !important;
  box-shadow: 0 4px 16px rgba(13, 29, 48, 0.08) !important;
  border-bottom: 1px solid var(--border);
}

.topbar .navbar-header {
  background: #ffffff !important;
}

.page-breadcrumb {
  background: rgba(255,255,255,0.78) !important;
  border-bottom: 1px solid var(--border) !important;
  backdrop-filter: blur(4px);
}

.card {
  background: rgba(255,255,255,0.94) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow-soft) !important;
  overflow: hidden;
}

.card .card-header {
  border-bottom: none !important;
  padding: 16px 20px;
  font-weight: 700;
}

.card .card-title {
  font-size: 1.05rem;
  letter-spacing: 0.02em;
}

.card .card-body {
  padding: 1.1rem 1.2rem;
}

.bg-warning,
.btn-warning,
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
  background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(255, 159, 67, 0.22);
}

.btn-info,
.btn-info:hover,
.btn-info:focus,
.btn-info:active {
  background: linear-gradient(135deg, var(--brand-500) 0%, var(--brand-400) 100%) !important;
  border-color: transparent !important;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background: linear-gradient(135deg, var(--brand-700) 0%, var(--brand-500) 100%) !important;
  border-color: transparent !important;
}

.form-control,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  border-radius: 12px !important;
  border-color: rgba(18, 46, 73, 0.16) !important;
  min-height: 42px !important;
  box-shadow: none !important;
}

.form-control:focus,
.select2-container--default .select2-selection--single:focus,
.select2-container--default .select2-selection--multiple:focus {
  border-color: rgba(43, 134, 214, 0.7) !important;
  box-shadow: 0 0 0 4px rgba(43, 134, 214, 0.12) !important;
}

.table thead th {
  background: rgba(13, 45, 79, 0.04);
  color: var(--brand-800);
  border-bottom-color: rgba(13, 45, 79, 0.1);
}

.badge,
.label {
  border-radius: 999px;
  padding: 0.45em 0.8em;
}

#main-wrapper .container-fluid,
.page-content {
  padding-top: 20px;
}

.topbar .navbar-nav .nav-link,
.topbar .nav-link,
.topbar .dropdown-toggle,
.topbar .nav-item a {
  color: var(--muted) !important;
}

.topbar .navbar-nav .nav-link:hover,
.topbar .nav-link:hover,
.topbar .dropdown-toggle:hover {
  color: var(--brand-700) !important;
}

.topbar .nav-item .text-dark,
.topbar .text-dark,
.topbar .hour,
.topbar .dropdown-item,
.topbar .message-title,
.topbar .mail-contnet,
.topbar h5,
.topbar small {
  color: inherit !important;
}

.left-sidebar,
#sidebarnav,
#sidebarnav ul,
#side-menu,
.sidebar,
.sidebar-nav {
  background: #ffffff !important;
  box-shadow: 4px 0 18px rgba(13, 29, 48, 0.06) !important;
  border-right: 1px solid var(--border) !important;
}

.sidebar-nav ul .sidebar-item .sidebar-link {
  color: var(--muted) !important;
  border-radius: 12px !important;
  margin: 4px 10px !important;
  padding: 11px 14px !important;
  opacity: 1 !important;
  transition: all 0.2s ease;
}

.sidebar-nav ul .sidebar-item .sidebar-link:hover,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link,
.sidebar-nav ul .sidebar-item.active > .sidebar-link {
  background: rgba(43, 134, 214, 0.1) !important;
  color: var(--brand-800) !important;
  box-shadow: inset 3px 0 0 var(--brand-500);
}

.sidebar-nav ul .sidebar-item .sidebar-link i,
.sidebar-nav ul .sidebar-item .sidebar-link span {
  color: inherit !important;
}

.sidebar-nav .has-arrow::after {
  border-color: var(--muted) transparent transparent transparent;
}

.sidebar-nav .nav-small-cap {
  color: var(--muted) !important;
}

.white-box,
.panel,
.card,
.widget,
.table-responsive,
.form-group,
.modal-content {
  background: var(--panel) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow-soft) !important;
}

.panel-heading,
.card-header,
.modal-header {
  background: linear-gradient(135deg, #f5f9ff 0%, #edf5ff 100%) !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--border) !important;
}

.panel-title,
.modal-title,
.card-title {
  color: var(--brand-800) !important;
  font-weight: 700 !important;
}

.form-control,
select,
textarea,
input {
  border-radius: 12px !important;
  border: 1px solid #dfeaf5 !important;
  background: #f8fbff !important;
  box-shadow: inset 0 1px 2px rgba(15,39,67,0.03) !important;
  color: var(--text) !important;
}

.form-control:focus,
select:focus,
textarea:focus,
input:focus {
  border-color: var(--brand-500) !important;
  box-shadow: 0 0 0 4px rgba(43,134,214,0.12) !important;
  background: #ffffff !important;
}

.btn,
.btn-warning,
.login-btn,
button[type="submit"] {
  border-radius: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  transition: all 0.2s ease;
}

.btn-warning,
.login-btn,
.btn-primary {
  background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 14px 24px rgba(255, 122, 89, 0.28) !important;
}

.btn-warning:hover,
.login-btn:hover,
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 30px rgba(255, 122, 89, 0.35) !important;
}

.badge,
.label,
.label-warning,
.label-primary,
.label-success,
.label-info {
  border-radius: 999px !important;
  letter-spacing: 0.04em;
}

.table thead th {
  background: linear-gradient(180deg, #eff6ff 0%, #edf5fb 100%) !important;
  color: var(--brand-800) !important;
  border-bottom: 1px solid var(--border) !important;
  font-weight: 700 !important;
}

.table tbody tr:hover {
  background: rgba(43,134,214,0.04) !important;
}

.dropdown-menu {
  border-radius: 14px !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 20px 40px rgba(9, 26, 44, 0.14) !important;
}

.dropdown-item:hover {
  background: rgba(43,134,214,0.08) !important;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover,
.customtab li.active a,
.customtab li.active a:hover,
.customtab li.active a:focus {
  background: linear-gradient(135deg, var(--brand-500), var(--brand-600)) !important;
  color: #fff !important;
  border-color: transparent !important;
}

::-webkit-scrollbar-thumb {
  background: rgba(60, 111, 173, 0.4);
  border-radius: 10px;
}

::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.25);
}
