/* Insert Your Custom CSS Here */

/* Custom Sidebar Styles */
.vd_navbar-left {
  background-color: #2c3e50;
  border-right: 1px solid #34495e;
}

.vd_menu > ul > li > a {
  color: #ecf0f1;
  border-bottom: 1px solid #34495e;
}

.vd_menu > ul > li > a:hover {
  background-color: #34495e;
  color: #3498db;
}

.vd_menu > ul > li.active > a {
  background-color: #34495e;
  color: #3498db;
  border-left: 4px solid #3498db;
}

.vd_menu .menu-icon {
  color: #95a5a6;
}

.vd_menu > ul > li > a:hover .menu-icon {
  color: #3498db;
}

.vd_menu > ul > li.active > a .menu-icon {
  color: #3498db;
}

.vd_menu ul li .child-menu {
  background-color: #34495e;
  border-left: 4px solid #3498db;
}

.vd_menu ul li .child-menu a {
  color: #ecf0f1;
  border-bottom: 1px solid #2c3e50;
}

.vd_menu ul li .child-menu a:hover {
  background-color: #2c3e50;
  color: #3498db;
}

/* --- Sidebar & Navbar Color Fix --- */
body .vd_navbar-left {
  background-color: #232946 !important; /* Deep navy */
  border-right: 1px solid #394867 !important;
}
body .vd_menu > ul > li > a {
  color: #eebbc3 !important;
  border-bottom: 1px solid #394867 !important;
}
body .vd_menu > ul > li > a:hover {
  background-color: #394867 !important;
  color: #f7c873 !important;
}
body .vd_menu > ul > li.active > a {
  background-color: #394867 !important;
  color: #f7c873 !important;
  border-left: 4px solid #f7c873 !important;
}
body .vd_menu .menu-icon {
  color: #b8c1ec !important;
}
body .vd_menu > ul > li > a:hover .menu-icon,
body .vd_menu > ul > li.active > a .menu-icon {
  color: #f7c873 !important;
}
body .vd_menu ul li .child-menu {
  background-color: #394867 !important;
  border-left: 4px solid #f7c873 !important;
}
body .vd_menu ul li .child-menu a {
  color: #eebbc3 !important;
  border-bottom: 1px solid #232946 !important;
}
body .vd_menu ul li .child-menu a:hover {
  background-color: #232946 !important;
  color: #f7c873 !important;
}

body .vd_top-menu-wrapper {
  background-color: #394867 !important; /* Slightly lighter navy */
  border-bottom: 1px solid #232946 !important;
}

/* --- Receipt Page UI Enhancements --- */
.vd_title-section h1 {
  font-family: 'Montserrat', 'Poppins', Arial, sans-serif !important;
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  color: #23272b !important;
  letter-spacing: 1px;
}
.vd_title-section .subtitle {
  font-size: 1.1rem !important;
  color: #7b8a97 !important;
  font-weight: 400;
}

/* Card/Box Styling */
.bill-card, .card, .dashboard-box, .panel {
  border-radius: 18px !important;
  box-shadow: 0 4px 24px 0 rgba(35,41,70,0.10) !important;
  border: none !important;
  transition: transform 0.2s, box-shadow 0.2s;
  position: relative;
  overflow: hidden;
}
.bill-card:hover, .card:hover, .panel:hover {
  transform: none !important;
  box-shadow: 0 4px 24px 0 rgba(35,41,70,0.10) !important;
}

/* Table Header Styling */
table th {
  font-family: 'Montserrat', 'Poppins', Arial, sans-serif !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #34495e !important;
  background: #f4f6fa !important;
}

/* Table Row Styling */
table td {
  font-size: 1.08rem !important;
  color: #23272b !important;
}

/* Section Title Bar (like green Receipt bar) */
.vd_content-section .panel-heading, .vd_content-section .section-title, .vd_content-section .vd_panel-header {
  background: linear-gradient(90deg, #3498db 0%, #2c3e50 100%) !important;
  color: #fff !important;
  border-radius: 8px 8px 0 0 !important;
  font-weight: 600 !important;
  font-size: 1.1rem !important;
}

/* Remove custom backgrounds for form sections */
.dashboard-box, .bill-card {
  color: #fff !important;
}
/* Only apply unique backgrounds to dashboard summary/statistics cards, not to form sections */
.dashboard-summary-box:nth-child(1) {
  background: linear-gradient(135deg, #5f6caf 0%, #232946 100%) !important;
}
.dashboard-summary-box:nth-child(2) {
  background: linear-gradient(135deg, #f76e11 0%, #f7c873 100%) !important;
}
.dashboard-summary-box:nth-child(3) {
  background: linear-gradient(135deg, #3a86ff 0%, #b8c1ec 100%) !important;
}

/* Remove background and color overrides for .bill-card and .card that affect forms */
.bill-card, .card {
  background: #fff !important;
  color: inherit !important;
}

/* Card icon background circle */
.dashboard-box .fa, .bill-card .fa, .dashboard-box .icon, .bill-card .icon {
  background: rgba(255,255,255,0.13);
  border-radius: 50%;
  padding: 18px;
  font-size: 2.5rem;
  margin-bottom: 10px;
  display: inline-block;
}

/* Card text enhancements */
.dashboard-box h2, .bill-card h2, .dashboard-box .card-title, .bill-card .card-title {
  font-size: 2.3rem !important;
  font-weight: 700 !important;
  margin-bottom: 0.5rem;
}
.dashboard-box .card-desc, .bill-card .card-desc {
  font-size: 1.25rem !important;
  font-weight: 400;
  opacity: 0.92;
}

/* Responsive tweaks */
@media (max-width: 600px) {
  .vd_title-section h1 { font-size: 1.3rem !important; }
  table th, table td { font-size: 0.9rem !important; }
}

/* Responsive tweaks for cards */
@media (max-width: 900px) {
  .dashboard-box, .bill-card, .card, .panel { font-size: 0.95rem !important; }
  .dashboard-box h2, .bill-card h2 { font-size: 1.3rem !important; }
}

/* --- Remove hover effect for table rows and forms (keep simple) --- */
table tr:hover, form:hover, .form-control:hover {
  background: inherit !important;
  box-shadow: none !important;
  transform: none !important;
}

/* --- Professional Font Style: Inter for Headings, Roboto for Body --- */
body, table, input, select, textarea, button, .form-control {
  font-family: 'Roboto', Arial, sans-serif !important;
}
h1, h2, h3, h4, h5, h6, table th, .vd_title-section h1 {
  font-family: 'Inter', Arial, sans-serif !important;
  letter-spacing: 0.5px;
}

/* --- Stylish Summary Cards for Receipt Page --- */
.vd_status-widget.widget.card-effect {
  border-radius: 18px !important;
  box-shadow: 0 4px 24px 0 rgba(35,41,70,0.10) !important;
  border: none !important;
  margin-bottom: 18px;
  margin-top: 8px;
  padding: 18px 16px 16px 16px !important;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 160px;
  transition: none !important;
}

/* Unique colors for each card */
.vd_status-widget.widget.card-effect#allcargodata {
  background: linear-gradient(135deg, #43cea2 0%, #185a9d 100%) !important;
}
.vd_status-widget.widget.card-effect#seacargodata {
  background: linear-gradient(135deg, #ff512f 0%, #f09819 100%) !important;
}
.vd_status-widget.widget.card-effect#aircargodata {
  background: linear-gradient(135deg, #396afc 0%, #2948ff 100%) !important;
}

/* Card icon styling */
.vd_status-widget .menu-icon {
  background: rgba(255,255,255,0.18);
  border-radius: 50%;
  padding: 16px;
  font-size: 2.2rem;
  margin-bottom: 10px;
  display: inline-block;
  color: #fff !important;
}

/* Main numbers/headings use Inter */
.vd_status-widget .menu-value {
  font-family: 'Inter', Arial, sans-serif !important;
  font-size: 2.3rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-left: 8px;
  margin-right: 8px;
}

/* Card label text uses Roboto */
.vd_status-widget .menu-text {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 1.15rem !important;
  font-weight: 500;
  color: #fff !important;
  margin-top: 10px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* Remove hover pop-up effect */
.vd_status-widget.widget.card-effect:hover {
  transform: none !important;
  box-shadow: 0 4px 24px 0 rgba(35,41,70,0.10) !important;
}
