/* ASP.NET Core base styles */

/* ========================================
   Global CSS Variables - Table Borders
   ======================================== */
:root {
  --table-header-border: 1.5px solid #0070BA;
  --table-row-border: 1px solid #e9ecef;
  --primary-color: #0070BA;
}

html {
  font-size: 14px;
  position: relative;
  min-height: 100%;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

body {
  padding-top: 75px; /* Single navbar height + margins */
  padding-bottom: 20px;
  margin-bottom: 60px;
  background: #ffffff;
}

/* Add spacing between navbar and content */
.container-fluid.body-content {
  margin-top: 1.5rem;
}

/* Keep placeholders transparent inside floating-label fields so only the
   floating label is shown (prevents label/placeholder overlap). */
.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: transparent;
}

/* Manage account: temporarily hide unused tabs (Email, Two-factor, Personal data).
   Only Profile and Password remain. Remove this block to bring them back. */
#email, #two-factor, #personal-data {
  display: none !important;
}

/* ========================================
   Manage account - aligned with app card style
   ======================================== */
.account-card {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  background-color: #fff;
}

.account-nav {
  padding: 0.5rem;
}

.account-body {
  padding: 1.5rem 1.75rem;
  max-width: 560px;
}

/* Left navigation pills */
.account-nav .nav-pills .nav-link {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 0.9rem;
  color: #0070BA;
  border-radius: 5px;
  padding: 0.5rem 0.85rem;
  margin-bottom: 0.25rem;
  transition: all 0.2s ease;
}

.account-nav .nav-pills .nav-link:hover {
  background-color: #f0f8ff;
  color: #005a94;
}

.account-nav .nav-pills .nav-link.active {
  background-color: #0070BA;
  color: #fff;
  font-weight: 500;
}

/* Inner page heading (e.g. "Change password", "Profile") */
.account-body h3,
.account-body h4 {
  color: #085E9C;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  margin-bottom: 1.25rem;
}

/* Primary buttons inside the account area match the app blue */
.account-body .btn-primary {
  background-color: #0070BA;
  border-color: #0070BA;
}

.account-body .btn-primary:hover {
  background-color: #005a94;
  border-color: #005a94;
}

/* ========================================
   Modern Navigation Styles - GST Fashion Theme
   ======================================== */

/* Main Navbar - single bar with logo and menu */
.navbar.main-navbar {
  background: #f8f9fa !important;
  border: none;
  border-radius: 8px;
  padding: 0.5rem 1rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  min-height: 60px;
  margin: 0.5rem 1rem;
}

.navbar.main-navbar .container-fluid {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  display: flex;
  align-items: stretch;
  position: relative;
}

/* Top bar inline - positioned absolute top right */
.top-bar-inline {
  position: absolute;
  top: 0.15rem;
  right: 1.5rem;
  z-index: 10;
}

/* Brand styling - GST Fashion elegant logo */
.navbar-brand {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-decoration: none !important;
  height: 100%;
}

.navbar-brand:hover {
  opacity: 0.75;
}

/* Logo text - elegant thin font with wide letter spacing like gstfashion.com */
.brand-logo-text {
  font-family: 'Josefin Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 1.4rem;
  font-weight: 300;
  color: #333333;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  text-decoration: none !important;
}

/* GST part slightly bolder */
.brand-logo-text .logo-gst {
  font-weight: 400;
}

/* Responsive logo sizing */
@media (max-width: 576px) {
  .brand-logo-text {
    font-size: 1rem;
    letter-spacing: 0.25em;
  }
}

/* Nav links - dark text on white background */
.navbar-nav {
  align-items: center;
  margin-top: 1.5rem;
}

.navbar-nav .nav-link {
  color: #000000 !important;
  font-weight: 400;
  font-size: 0.85rem;
  padding: 0.4rem 0.85rem;
  transition: color 0.2s ease;
  border-radius: 0;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Last nav item (About) - align with logout on the right */
.navbar-nav .nav-item:last-child .nav-link {
  padding-right: 0;
}

.navbar-nav .nav-link:hover {
  color: #d4a574 !important;
}

/* Active nav link - gold accent */
.navbar-nav .nav-link.active,
.navbar-nav .show > .nav-link {
  color: #d4a574 !important;
}

/* Dropdown toggle arrow */
.dropdown-toggle::after {
  border-top-color: currentColor;
}

/* Dropdown menu styling */
.navbar .dropdown-menu {
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  padding: 0.25rem 0;
  margin-top: 0;
}

.navbar .dropdown-item {
  color: #000000;
  padding: 0.35rem 1.5rem;
  transition: background-color 0.2s ease, color 0.2s ease;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus {
  color: #d4a574;
  background-color: #f8f8f8;
}

.navbar .dropdown-item.active,
.navbar .dropdown-item:active {
  color: #d4a574;
  background-color: #f8f8f8;
}

.navbar .dropdown-divider {
  border-top-color: #e5e5e5;
  margin: 0.25rem 0;
}

/* User info and Login/Logout - inline top right */
.user-auth-section {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 400;
  white-space: nowrap;
}

.user-auth-section .user-info {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  color: #000000;
}

.user-auth-section .user-link,
.user-auth-section .login-link {
  color: #000000 !important;
  text-decoration: none;
  font-weight: 400;
}

.user-auth-section .user-link:hover,
.user-auth-section .login-link:hover {
  color: #d4a574 !important;
}

.user-auth-section .separator {
  color: #e5e5e5;
  font-weight: 300;
}

/* Login/Logout button styling */
.user-auth-section .btn-link.logout-btn {
  color: #000000 !important;
  border: none;
  padding: 0;
  margin: 0;
  background: transparent;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 400;
  cursor: pointer;
  text-decoration: none !important;
}

.user-auth-section .btn-link.logout-btn:hover {
  color: #d4a574 !important;
  text-decoration: none !important;
}

.user-auth-section .btn-link.logout-btn:focus {
  box-shadow: none;
  outline: none;
  text-decoration: none !important;
}

/* User icon sizing */
.user-auth-section .bi-person-circle {
  font-size: 0.8rem;
}

/* Navbar toggler for mobile */
.navbar-toggler {
  border-color: rgba(0, 0, 0, 0.1);
}

.navbar-toggler:focus {
  box-shadow: 0 0 0 0.15rem rgba(0, 0, 0, 0.1);
}

/* Responsive adjustments */
@media (max-width: 992px) {
  .navbar.main-navbar {
    margin: 0.5rem 0.5rem;
  }
  
  .navbar.main-navbar .container-fluid {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  
  .top-bar-inline {
    right: 1rem;
  }
  
  .logo-text {
    font-size: 1.5rem;
  }
  
  .logo-subtext {
    font-size: 0.6rem;
  }
}

@media (max-width: 576px) {
  .navbar.main-navbar {
    min-height: 50px;
    padding: 0.4rem 0.5rem;
    margin: 0.3rem 0.3rem;
    border-radius: 6px;
  }
  
  .user-auth-section {
    font-size: 0.6rem;
  }
  
  .logo-text {
    font-size: 1.2rem;
  }
  
  .logo-subtext {
    font-size: 0.55rem;
  }
  
  body {
    padding-top: 60px;
  }
}
  text-decoration: none;
  border: none;
  padding: 0.5rem 1rem;
}

.navbar-dark .btn-link.nav-link:hover {
  color: #fff !important;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
}

/* User greeting styling */
.navbar-dark .navbar-nav .nav-link[title="Manage"] {
  color: rgba(255, 255, 255, 0.85) !important;
}

.navbar-dark .navbar-nav .nav-link[title="Manage"]:hover {
  color: #4dabf7 !important;
}

/* ========================================
   GST Legacy Custom Styles - Ported
   ======================================== */

/* Modal dialog styles */
.modal-content {
  width: 600px !important;
  margin: 10px auto !important;
  border-radius: 6px;
}

/* Body content padding */
.body-content {
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 5px;
}

/* Year selector buttons - matching report-nav-item style */
.year-selector {
  align-self: flex-end;
}

.btn-year {
  min-width: 52px;
  padding: 0.35rem 0.65rem;
  font-size: 0.9rem;
  font-weight: 400;
  border-radius: 5px !important;
  border: 1.5px solid #d0d0d0;
  background-color: #ffffff;
  color: #0070BA;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.btn-year:hover {
  background-color: #f8f9fa;
  border-color: #0070BA;
  color: #005a94;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15);
}

.btn-year.selected {
  background-color: #f0f8ff;
  border: 1.5px solid #0070BA;
  color: #0070BA;
  font-weight: 500;
  cursor: default;
}

/* Collection selector buttons (PE/AI) */
.btn-collection {
  min-width: 48px;
  padding: 0.35rem 0.65rem;
  font-size: 0.85rem;
  font-weight: 400;
  border-radius: 5px !important;
  border: 1.5px solid #d0d0d0;
  background-color: #ffffff;
  color: #0070BA;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.btn-collection:hover {
  background-color: #f8f9fa;
  border-color: #0070BA;
  color: #005a94;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15);
}

.btn-collection.selected {
  background-color: #f0f8ff;
  border: 1.5px solid #0070BA;
  color: #0070BA;
  font-weight: 500;
  cursor: default;
}

.collection-selector {
  max-width: 450px;
  justify-content: flex-end;
}

/* Override bootstrap horizontal description lists */
.dl-horizontal dt {
  white-space: normal;
}

/* Form input max-width */
input,
select,
textarea {
  max-width: 280px;
}

/* Icon styles */
.iconTable {
  color: darkgray;
}

.iconTable:hover {
  color: gray;
  text-decoration: none;
}

.iconButton {
  margin-left: 10px;
}

.iconButton02 {
  margin-left: 0px;
}

.iconButtonPrint {
  margin-left: 0px;
}

.iconDivEdit {
  color: darkgray;
  font-size: 1.3em;
  letter-spacing: 8px;
}

.iconDivEdit:hover {
  text-decoration: none;
}

.iconDivDelete {
  color: darkgray;
  font-size: 1.3em;
}

.iconDivDelete:hover {
  color: red;
  text-decoration: none;
}

.iconDivNew {
  color: #00a4a4;
  font-size: 2em;
  padding-top: 9px;
  padding-right: 10px;
}

.iconDivNew:hover {
  color: #00a4a4;
  text-decoration: none;
}

.iconDivEditHeader {
  color: darkgray;
  font-size: 2em;
  padding-top: 9px;
  padding-right: 10px;
}

.iconDivEditHeader:hover {
  color: #085E9C;
  text-decoration: none;
}

.iconDivDeleteHeader {
  color: darkgray;
  font-size: 2em;
  padding-top: 9px;
  padding-right: 10px;
}

.iconDivDeleteHeader:hover {
  color: red;
  text-decoration: none;
}

.iconCollapse {
  color: darkgray;
}

.iconGray {
  color: gray;
}

.iconRed {
  color: red;
}

.backgroundGray {
  background-color: gainsboro;
}

/* Typography */
h3,
.h3 {
  color: #00A6A9;
  font-size: 14px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  margin-top: 0.5rem;
  margin-bottom: 0.25rem;
}

/* Report page header spacing */
h3 + div,
h3 + p {
  margin-bottom: 0.25rem;
}

/* Links row spacing */
h3 ~ p {
  margin-bottom: 0.25rem;
  margin-top: 0;
}

/* Print/Export buttons spacing */

.labelChart {
  color: gray;
  font-size: 16px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.captionChart {
  color: #0070BA;
  font-size: 18px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.captionChartQuantity {
  color: #7FBA00;
  font-size: 18px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.captionChartAmount {
  color: #00A4EF;
  font-size: 18px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

/* Chart.js container styling */
.chart-container {
  position: relative;
}

/* Business Entity styles */
.businessEntityCaption {
  margin-top: 20px;
  color: #3d3d3d;
  font-size: 24px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  text-transform: uppercase;
  padding-bottom: 10px;
  padding-top: 10px;
  padding-left: 0px;
  padding-right: 0px;
}

.businessEntity {
  border-top: solid;
  border-top-width: 1px;
  border-top-color: #085E9C;
  color: #666666;
  font-size: 14px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  padding: 0px;
}

.businessEntityCompanyName {
  color: #085E9C;
  font-size: 20px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  text-transform: uppercase;
  padding: 0px;
}

.businessEntityContact {
  border: solid;
  border-width: 1px;
  border-color: lightgray;
  color: #666666;
  background-color: white;
  padding: 4px;
  margin-top: 6px;
  margin-bottom: 6px;
  margin-left: 0px;
}

.businessEntityContactName {
  color: #00a4a4;
  font-size: 18px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.businessEntityContactPhoneEmail {
  white-space: pre-line;
}

address {
  color: #0070BA;
}

/* Button styles */
.btn.sharp {
  border-radius: 3px;
}

.btn-graph {
  color: gray;
  background-color: white;
  border-color: darkgray;
  border: none;
  width: 240px !important;
  text-align: left;
}

.btn-graph:hover {
  color: #ffffff;
  background-color: #666666;
  border-color: #666666;
}

.btn-circle {
  min-width: 40px;
  height: 32px;
  border-radius: 5px;
  text-align: center;
  padding: 0.35rem 0.5rem;
  font-size: 13px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-weight: 400;
  border: 1.5px solid #d0d0d0;
  color: #0070BA;
  background-color: #ffffff;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.btn-circle:hover {
  background-color: #f8f9fa;
  border-color: #0070BA;
  color: #005a94;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15);
}

.btn-circle.selected {
  background-color: #f0f8ff;
  border: 1.5px solid #0070BA;
  color: #0070BA;
  font-weight: 500;
  cursor: default;
}

.btn-square {
  width: 60px !important;
  height: 30px !important;
  border-radius: 2px;
  text-align: center;
  padding: 0px;
  font-size: 14px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-weight: 500;
  border: solid;
  border-width: 2px;
  color: white;
  background-color: darkgray;
  border-color: darkgray;
}

.btn-square:hover {
  color: white;
  background-color: #085E9C;
  border-color: #085E9C;
}

.btn-square.selected {
  color: white;
  background-color: #085E9C;
  border-color: #085E9C;
}

/* Print and Export buttons - modern style */
.btn-print {
  padding: 0.35rem 0.75rem;
  font-size: 0.9rem;
  font-weight: 400;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  border-radius: 5px;
  border: 1.5px solid #d0d0d0;
  background-color: #ffffff;
  color: #0070BA;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.btn-print:hover {
  background-color: #f8f9fa;
  border-color: #0070BA;
  color: #005a94;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15);
}

.btn-print i {
  font-size: 1rem;
}

/* Table styles */
.table > thead > tr > td.headerTable,
.table > tbody > tr > td.headerTable,
.table > tfoot > tr > td.headerTable,
.table > thead > tr > th.headerTable,
.table > tbody > tr > th.headerTable,
.table > tfoot > tr > th.headerTable,
.table > thead > tr.headerTable > td,
.table > tbody > tr.headerTable > td,
.table > tfoot > tr.headerTable > td,
.table > thead > tr.headerTable > th,
.table > tbody > tr.headerTable > th,
.table > tfoot > tr.headerTable > th {
  color: #3d3d3d;
  border-bottom: var(--table-header-border) !important;
  font-weight: 600;
  text-indent: 0px;
  text-align: right;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  padding: 3px 0.5rem !important;
  white-space: nowrap;
}

.table > thead > tr > td.headerTableCaption,
.table > tbody > tr > td.headerTableCaption,
.table > tfoot > tr > td.headerTableCaption,
.table > thead > tr > th.headerTableCaption,
.table > tbody > tr > th.headerTableCaption,
.table > tfoot > tr > th.headerTableCaption,
.table > thead > tr.headerTableCaption > td,
.table > tbody > tr.headerTableCaption > td,
.table > tfoot > tr.headerTableCaption > td,
.table > thead > tr.headerTableCaption > th,
.table > tbody > tr.headerTableCaption > th,
.table > tfoot > tr.headerTableCaption > th {
  text-align: left;
}

/* Group header rows (parent items like Country) - with top border */
.table > thead > tr > td.headerTable01,
.table > tbody > tr > td.headerTable01,
.table > tfoot > tr > td.headerTable01,
.table > thead > tr > th.headerTable01,
.table > tbody > tr > th.headerTable01,
.table > tfoot > tr > th.headerTable01,
.table > thead > tr.headerTable01 > td,
.table > tbody > tr.headerTable01 > td,
.table > tfoot > tr.headerTable01 > td {
  color: #085E9C;
  font-weight: 600;
  border-top: 1px solid #dee2e6 !important;
  border-bottom: none !important;
  text-indent: 0px;
  text-align: right;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  padding: 3px 0.4rem !important;
}

.table > thead > tr > td.headerTable01Caption,
.table > tbody > tr > td.headerTable01Caption,
.table > tfoot > tr > td.headerTable01Caption,
.table > thead > tr > th.headerTable01Caption,
.table > tbody > tr > th.headerTable01Caption,
.table > tfoot > tr > th.headerTable01Caption {
  text-indent: 0px;
  text-align: left;
}

/* Data rows (items like Country in simple tables) */
.table > thead > tr > td.headerTable02,
.table > tbody > tr > td.headerTable02,
.table > tfoot > tr > td.headerTable02,
.table > thead > tr > th.headerTable02,
.table > tbody > tr > th.headerTable02,
.table > tfoot > tr > th.headerTable02,
.table > thead > tr.headerTable02 > td,
.table > tbody > tr.headerTable02 > td,
.table > tfoot > tr.headerTable02 > td {
  color: #085E9C;
  font-weight: normal;
  border-bottom: none !important;
  border-top: 1px solid #e9ecef !important;
  text-indent: 0px;
  text-align: right;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  padding: 2px 0.4rem !important;
}

.table > thead > tr > td.headerTable02Caption,
.table > tbody > tr > td.headerTable02Caption,
.table > tfoot > tr > td.headerTable02Caption,
.table > thead > tr > th.headerTable02Caption,
.table > tbody > tr > th.headerTable02Caption,
.table > tfoot > tr > th.headerTable02Caption {
  text-indent: 0px;
  text-align: left;
  vertical-align: top;
}

.table > thead > tr > td.headerTable02CaptionLink,
.table > tbody > tr > td.headerTable02CaptionLink,
.table > tfoot > tr > td.headerTable02CaptionLink,
.table > thead > tr > th.headerTable02CaptionLink,
.table > tbody > tr > th.headerTable02CaptionLink,
.table > tfoot > tr > th.headerTable02CaptionLink {
  background-color: gainsboro;
  text-indent: 0px;
  text-align: right;
  vertical-align: top;
}

.table > thead > tr > td.footerTable02,
.table > tbody > tr > td.footerTable02,
.table > tfoot > tr > td.footerTable02,
.table > thead > tr > th.footerTable02,
.table > tbody > tr > th.footerTable02,
.table > tfoot > tr > th.footerTable02,
.table > thead > tr.footerTable02 > td,
.table > tbody > tr.footerTable02 > td,
.table > tfoot > tr.footerTable02 > td {
  color: #3d3d3d;
  font-weight: 600;
  border-top: 1px solid #e9ecef !important;
  text-indent: 0px;
  text-align: right;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  padding: 2px 0.4rem !important;
}

.table > thead > tr > td.footerTable02Caption,
.table > tbody > tr > td.footerTable02Caption,
.table > tfoot > tr > td.footerTable02Caption,
.table > thead > tr > th.footerTable02Caption,
.table > tbody > tr > th.footerTable02Caption,
.table > tfoot > tr > th.footerTable02Caption {
  text-indent: 0px;
  text-align: left;
  vertical-align: top;
}

.colTable01 {
  color: seagreen;
}

.colTable02 {
  color: red;
}

.colTable03 {
  color: royalblue;
}

.colTableLeft,
.colTableLeft td,
.colTableLeft th {
  text-align: left !important;
}

.colTableRight,
td.colTableRight,
th.colTableRight {
  text-align: right !important;
}

.colTableGray {
  color: gray;
}

/* Detail rows (child items) - compact, no borders */
/* Detail rows (headerTable03) - third level, no borders */
.table > thead > tr > td.headerTable03,
.table > tbody > tr > td.headerTable03,
.table > tfoot > tr > td.headerTable03,
.table > thead > tr > th.headerTable03,
.table > tbody > tr > th.headerTable03,
.table > tfoot > tr > th.headerTable03,
.table > thead > tr.headerTable03 > td,
.table > tbody > tr.headerTable03 > td,
.table > tfoot > tr.headerTable03 > td {
  color: #333;
  font-weight: normal;
  border-bottom: none !important;
  border-top: none !important;
  text-indent: 0px;
  text-align: right;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  padding: 2px 0.4rem !important;
}

.table > thead > tr > td.headerTable03Caption,
.table > tbody > tr > td.headerTable03Caption,
.table > tfoot > tr > td.headerTable03Caption,
.table > thead > tr > th.headerTable03Caption,
.table > tbody > tr > th.headerTable03Caption,
.table > tfoot > tr > th.headerTable03Caption {
  text-indent: 0px;
  text-align: left !important;
  vertical-align: top;
}

.rowTable,
.table > tbody > tr.rowTable > td {
  color: #555;
  border-bottom: none !important;
  border-top: none !important;
  text-indent: 0px;
  text-align: right;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  padding: 2px 0.4rem !important;
  line-height: 1.4;
}

.rowTableCaption,
.table > tbody > tr > td.rowTableCaption {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  text-indent: 0px;
  text-align: left !important;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
}

.rowTableTopBorder {
  border-top: 1px;
}

.rowTableNonBorder {
  border-top: none;
  border-bottom: none;
}

.headerTableButton {
  color: #085E9C;
  text-align: left;
  font-weight: normal;
  font-size: 16px;
  padding-bottom: 0px;
  border-color: #0070BA;
  text-indent: 0px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.rowTableButton {
  border-top: none;
  border-bottom: none;
}

.rowTableGray {
  color: grey;
}

.rowTableBlue {
  color: cornflowerblue;
}

/* Jumbotron - converted to BS5 */
.jumbotron {
  padding: 20px;
  margin-bottom: 20px;
  font-size: 21px;
  font-weight: 200;
  line-height: 2.1;
  background-color: #eeeeee;
  background-image: url(../img/bgJumbotron.jpg);
  background-position: 0% 25%;
  background-size: cover;
  background-repeat: no-repeat;
  color: white;
  text-shadow: black 0.3em 0.3em 0.3em;
  border-radius: 0.3rem;
}

.jumbotron h1 {
  line-height: 1;
  color: inherit;
}

.jumbotron p {
  line-height: 1.4;
}

@media screen and (min-width: 768px) {
  .jumbotron {
    padding-top: 10px;
    padding-bottom: 10px;
    background-position: 0% 0%;
  }

  .jumbotron h1 {
    font-size: 63px;
    color: white;
  }
}

/* Form styles */
.formTable {
  color: #3d3d3d;
  border: none;
  padding: 0px;
  margin: 0px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.formRow {
  color: #3d3d3d;
  border: none;
  padding: 0px;
  margin: 0px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.formLabel {
  color: #085E9C;
  text-align: left;
  font-weight: normal;
  font-size: 14px;
  padding: 0px;
  margin: 0px;
  text-indent: 0px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.formControl {
  width: 100px;
  text-align: left;
  font-weight: normal;
  font-size: 14px;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

.formTextBox {
  text-align: left;
  font-weight: normal;
  font-size: 14px;
  border: solid;
  border-width: 1px;
  width: 400px;
  border-color: gainsboro;
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

/* TODO: Morris.js removed - consider Chart.js alternative */
.morris-hover {
  position: absolute;
  z-index: 1000;
}

.morris-hover.morris-default-style {
  border-radius: 10px;
  padding: 6px;
  color: #666;
  background: rgba(255, 255, 255, 0.8);
  border: solid 2px rgba(230, 230, 230, 0.8);
  font-family: sans-serif;
  font-size: 12px;
  text-align: center;
}

.morris-hover.morris-default-style .morris-hover-row-label {
  font-weight: bold;
  margin: 0.25em 0;
}

.morris-hover.morris-default-style .morris-hover-point {
  white-space: nowrap;
  margin: 0.1em 0;
}

.rowBusinessEntity {
  margin-right: 0px;
  margin-left: 0px;
}

/* Panel styles - BS5 uses cards instead */
.panel-container {
  margin: 0px 0px 0px 0px;
  padding: 10px 0px 0px 0px;
}

.panel {
  margin: 10px 10px 10px 10px;
  padding: 5px 5px 20px 5px;
}

/* Font color utilities */
.font-red {
  color: red !important;
}

.font-green {
  color: green !important;
}

.font-grey {
  color: grey !important;
}

/* Master layout styles */
.masterDiv {
  padding: 0px 0px 0px 10px;
  margin: 0px;
}

.masterBackground {
  background-image: url(../img/bgJumbotron.jpg);
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #eeeeee !important;
}

.masterLogIn {
  width: 300px;
  align-content: center;
  align-items: center;
  vertical-align: central;
  border: thin;
  border-radius: 5px 5px;
  border-color: white;
  background: rgba(240, 240, 240, 0.9) !important;
  padding: 50px 50px 50px 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

/* Footer styles */
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px;
}

/* ========================================
   Collapsible Table Styles
   ======================================== */
.collapse-toggle {
  display: inline-block;
  width: 16px;
  text-align: center;
  cursor: pointer;
}

.collapse-toggle:hover {
  opacity: 0.7;
}

.collapse-toggle i {
  font-size: 10px;
}

/* ========================================
   Compact Table Styles (matching old Bootstrap 3)
   ======================================== */

/* Modern font for tables */
.table-sales-day,
.table-sales-month,
.table-sales-trend {
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
  margin-bottom: 0;
}

/* TREND tables - equal columns */
.table-sales-trend {
  table-layout: fixed;
  width: 100%;
}

.table-sales-trend th,
.table-sales-trend td {
  width: 20%;
  padding: 0.5rem 0.75rem !important;
  overflow: hidden;
  text-overflow: ellipsis;
  border-bottom: 1px solid #dee2e6 !important;
}

/* TREND header row */
.table-sales-trend thead tr {
  border-bottom: var(--table-header-border) !important;
}

.table-sales-trend thead th {
  color: #3d3d3d;
  font-weight: 600;
  border-bottom: var(--table-header-border) !important;
}

/* TREND body rows */
.table-sales-trend tbody tr {
  border-bottom: 1px solid #dee2e6;
}

.table-sales-trend tbody tr:hover {
  background-color: rgba(0, 112, 186, 0.05);
}

/* Total row styling - using tfoot */
.table-sales-trend tfoot tr td {
  color: #3d3d3d;
  font-weight: 600;
  border-top: 1px solid #0070BA;
  border-bottom: none !important;
}

/* First column (Month) - left aligned */
.table-sales-trend th:first-child,
.table-sales-trend td:first-child {
  text-align: left !important;
}

/* All other columns (numbers) - right aligned */
.table-sales-trend th:not(:first-child),
.table-sales-trend td:not(:first-child) {
  text-align: right !important;
}

/* ========================================
   DAILY & MONTHLY tables styling
   ======================================== */
.table-sales-day th,
.table-sales-day td,
.table-sales-month th,
.table-sales-month td {
  padding: 0.4rem 0.5rem !important;
}

/* Header row blue border */
.table-sales-day thead tr,
.table-sales-month thead tr {
  border-bottom: var(--table-header-border);
}

.table-sales-day thead th,
.table-sales-month thead th {
  color: #3d3d3d;
  font-weight: 600;
}

/* Parent rows (dates/months) - blue color like original */
.table-sales-day tr[data-parent=""] td,
.table-sales-month tr[data-parent=""] td {
  color: #085E9C;
  border-top: 1px solid #dee2e6;
}

/* Total/footer rows - bold dark */
.table-sales-day tr.fw-bold td,
.table-sales-month tr.fw-bold td,
.table-sales-month tr[data-parent=""].table-light td {
  color: #3d3d3d;
  font-weight: 600;
}



.table-sales-day td,
.table-sales-day th,
.table-sales-month td,
.table-sales-month th,
.table-sales-trend td,
.table-sales-trend th {
  padding: 3px 6px !important;
  vertical-align: middle;
  line-height: 1.4;
  white-space: nowrap;
  text-align: left;
}

/* First column (toggle) - fixed narrow width */
.table-sales-day td:first-child,
.table-sales-day th:first-child,
.table-sales-month td:first-child,
.table-sales-month th:first-child,
.table-sales-trend td:first-child,
.table-sales-trend th:first-child {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  padding: 2px !important;
  text-align: center;
}

/* Amount column (last) - right aligned for numbers */
.table-sales-day td:last-child,
.table-sales-month td:last-child,
.table-sales-trend td:last-child {
  text-align: right !important;
}

.table-sales-day th:last-child,
.table-sales-month th:last-child,
.table-sales-trend th:last-child {
  text-align: right !important;
}

/* Text columns - left aligned */
.table-sales-day td:nth-child(2),
.table-sales-day td:nth-child(3),
.table-sales-month td:nth-child(2),
.table-sales-month td:nth-child(3),
.table-sales-trend td:nth-child(2),
.table-sales-trend td:nth-child(3) {
  text-align: left !important;
}

.table-sales-day th:nth-child(2),
.table-sales-day th:nth-child(3),
.table-sales-month th:nth-child(2),
.table-sales-month th:nth-child(3),
.table-sales-trend th:nth-child(2),
.table-sales-trend th:nth-child(3) {
  text-align: left !important;
}

/* Parent row (level 0) styling */
tr[data-parent=""] {
  cursor: pointer;
  font-weight: 500;
}

tr[data-parent=""]:hover {
  background-color: rgba(0, 112, 186, 0.08) !important;
}

/* Level 1 child rows */
tr[data-parent]:not([data-parent=""]) {
  font-size: 11px;
}

/* Header rows for children */
.headerTable04 {
  background-color: #f8f9fa;
}

.headerTable04 th {
  font-weight: 600 !important;
  font-size: 11px !important;
  color: #085E9C !important;
}

/* Data rows styling */
.rowTable td {
  color: #333;
}

.rowTableBlue td {
  color: cornflowerblue !important;
}

/* Background for gray sections */
.colTableGray {
  color: #555 !important;
}

/* Remove default Bootstrap table borders */
.table-sales-day > :not(caption) > * > *,
.table-sales-month > :not(caption) > * > *,
.table-sales-trend > :not(caption) > * > * {
  border-bottom-width: 0;
}

/* Add separator for parent rows (data-parent="") */
tr[data-parent=""] td {
  border-top: 1px solid #dee2e6 !important;
}

/* Add separator between days in MONTHLY tables */
.table-sales-month tr.headerTable02[data-parent]:not([data-parent=""]) td {
  border-top: 1px solid #dee2e6 !important;
}

/* Ensure header04 rows have top border for clarity */
.table-sales-month tr.headerTable04 th,
.table-sales-day tr.headerTable04 th {
  border-top: 1px solid #e9ecef !important;
}

/* Header row styling */
.table-sales-day thead tr,
.table-sales-month thead tr,
.table-sales-trend thead tr {
  border-bottom: var(--table-header-border);
}

.table-sales-day thead th,
.table-sales-month thead th,
.table-sales-trend thead th {
  font-weight: 600;
  color: #3d3d3d;
  font-size: 12px;
  padding: 4px 6px !important;
  background-color: #fff;
}

/* ========================================
   Panel & Card Styles
   ======================================== */

/* Bootstrap 5 panel replacement */
.panel {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel-default {
  border-color: #ddd;
}

.panel h4 {
  padding: 8px 10px;
  margin: 0;
  font-size: 13px;
  color: #333;
  background-color: #f5f5f5;
  border-bottom: 1px solid #ddd;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

/* Card styling to match old panels */
.card {
  border: 1px solid #ddd;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.card-body {
  padding: 10px 12px;
}

/* Table section titles (PRONTO TREND, DAILY SALES, REPORT PRONTO COUNTRY, etc.) */
.card-title,
.report-header-wrapper h3 {
  color: #085E9C;
  font-size: 13px;
  font-weight: 500;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  margin-top: 0;
  margin-bottom: 10px;
  padding-bottom: 6px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Panel container (legacy support) */
.panel-container {
  padding: 0 8px;
}

/* Glyphicon to Bootstrap Icons mapping */
.glyphicon-chevron-down::before {
  content: "\F282";
  font-family: "bootstrap-icons";
}

.glyphicon-chevron-up::before {
  content: "\F286";
  font-family: "bootstrap-icons";
}

.glyphicon-print::before {
  content: "\F469";
  font-family: "bootstrap-icons";
}

.glyphicon {
  font-family: "bootstrap-icons";
  font-style: normal;
  font-weight: normal;
}

/* ========================================
   GLOBAL TABLE STYLES - Unified for all tables
   ======================================== */

/* Base table styling */
.table {
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 13px;
}

/* Table wrapper with rounded border */
.table-wrapper,
#table_export,
.table-responsive {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  overflow: hidden;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  margin-bottom: 1rem;
}

/* Report header wrapper - same style as tables */
.report-header-wrapper {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}

.report-header-wrapper .report-date {
  color: #666;
  font-size: 0.9rem;
  margin-bottom: 0.75rem;
}

/* Form styles inside report header */
.report-header-wrapper .form-label {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  color: #666;
  margin-bottom: 0.25rem;
}

.report-header-wrapper .form-control {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 0.875rem;
  border: 1.5px solid #d0d0d0;
  border-radius: 5px;
  padding: 0.35rem 0.5rem;
}

.report-header-wrapper .form-control:focus {
  border-color: #0070BA;
  box-shadow: 0 0 0 0.15rem rgba(0, 112, 186, 0.15);
}


/* Report navigation links - modern style */
.report-nav {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.report-nav .report-nav-item,
.report-nav a.report-nav-item,
.report-nav a.report-nav-item:link,
.report-nav a.report-nav-item:visited,
.report-nav a.report-nav-item:hover,
.report-nav a.report-nav-item:active,
.report-header-wrapper .report-nav .report-nav-item,
.report-header-wrapper .report-nav a.report-nav-item {
  text-decoration: none !important;
  border-bottom: none !important;
  background-color: #ffffff !important;
  border: 1.5px solid #d0d0d0 !important;
  border-radius: 5px !important;
  padding: 0.35rem 0.85rem !important;
  color: #0070BA !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  display: inline-block !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}

.report-nav a.report-nav-item:hover,
.report-header-wrapper .report-nav a.report-nav-item:hover {
  background-color: #f8f9fa !important;
  border-color: #0070BA !important;
  color: #005a94 !important;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15) !important;
}

.report-nav .report-nav-item.active,
.report-header-wrapper .report-nav .report-nav-item.active {
  background-color: #f0f8ff !important;
  color: #0070BA !important;
  border: 1.5px solid #0070BA !important;
  font-weight: 500 !important;
  cursor: default !important;
}

.report-nav-separator {
  color: #ccc;
  font-weight: 300;
}

.table-wrapper .table,
#table_export .table,
.table-responsive .table {
  margin-bottom: 0;
}

/* Remove top border from first row when inside wrapper */
.table-wrapper .table > tbody > tr:first-child > td,
.table-wrapper .table > tbody > tr:first-child > th,
#table_export .table > tbody > tr:first-child > td,
#table_export .table > tbody > tr:first-child > th {
  border-top: none;
}

/* All table headers */
.table thead th {
  font-weight: 600;
  color: #3d3d3d;
  border-bottom: var(--table-header-border) !important;
  padding: 0.5rem 0.75rem !important;
  white-space: nowrap;
  vertical-align: bottom;
}

/* All table cells */
.table tbody td {
  padding: 0.4rem 0.75rem !important;
  vertical-align: middle;
  border-bottom: 1px solid #dee2e6;
}

/* Table rows hover */
.table-hover tbody tr:hover {
  background-color: rgba(0, 112, 186, 0.05) !important;
}

/* Total/Footer rows - bold */
.table tfoot td,
.table tfoot th,
.table tbody tr.total-row td {
  font-weight: 600;
  color: #3d3d3d;
  border-top: var(--table-header-border) !important;
  border-bottom: none !important;
}

/* Link styling in tables */
.table a {
  color: #085E9C;
  text-decoration: none;
}

.table a:hover {
  color: #0070BA;
  text-decoration: underline;
}

/* ========================================
   NUMERIC COLUMN ALIGNMENT - Right align
   ======================================== */

/* Explicit alignment classes */
.text-end {
  text-align: right !important;
}

.text-start {
  text-align: left !important;
}

/* Report tables - specific styling */
.table-report {
  font-size: 13px;
}

.table-report thead th {
  background-color: #fff;
  position: sticky;
  top: 0;
  z-index: 10;
}

.table-report tbody tr:nth-child(odd) {
  background-color: rgba(0, 0, 0, 0.02);
}

/* Compact table variant */
.table-sm td,
.table-sm th {
  padding: 0.3rem 0.5rem !important;
  font-size: 12px;
}

/* Striped rows */
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(0, 0, 0, 0.02);
}

/* Red negative numbers */
.negative,
.font-red {
  color: #dc3545 !important;
}

/* Green positive numbers */
.positive,
.font-green {
  color: #198754 !important;
}

/* Gray secondary text */
.font-grey,
.text-muted {
  color: #6c757d !important;
}

/* ========================================
   Business Entity / Address Book Styles
   ======================================== */

/* Country Header */
.country-header {
  border-bottom: 2px solid var(--primary-color);
  padding-bottom: 0.5rem;
  margin-bottom: 0.75rem;
}

.country-name {
  color: #3d3d3d;
  font-size: 1.1rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

/* Business Entity Card */
.business-entity-card {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  background-color: #fff;
  margin-bottom: 0.75rem !important;
}

.business-entity-card .card-body {
  padding: 0.6rem 1rem !important;
}

/* Company Info */
.business-entity-info {
  padding-right: 0.75rem;
}

.company-details {
  display: flex;
  flex-direction: column;
}

.company-name {
  color: #085E9C;
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0.15rem;
  display: block;
}

.company-address {
  color: #666666;
  font-size: 0.8rem;
  line-height: 1.35;
  display: block;
}

.company-actions {
  display: flex;
  flex-direction: row;
  gap: 0.35rem;
  align-items: center;
}

/* Icon Actions */
.icon-action {
  color: #999;
  font-size: 1rem;
  padding: 0.2rem;
  transition: color 0.2s ease;
  text-decoration: none;
}

.icon-action:hover {
  color: #085E9C;
  text-decoration: none;
}

.icon-action.icon-add {
  color: #00a4a4;
  font-size: 1.25rem;
}

.icon-action.icon-add:hover {
  color: #008080;
}

.icon-action.icon-edit:hover {
  color: #085E9C;
}

.icon-action.icon-delete:hover {
  color: #dc3545;
}

/* Contacts Grid */
.contacts-grid {
  margin: 0;
}

/* Contact Card */
.contact-card {
  background-color: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 4px;
  padding: 0.5rem;
  margin-bottom: 0;
  transition: box-shadow 0.2s ease;
}

.contact-card:hover {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  background-color: #fff;
}

.contact-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0.15rem;
}

.contact-name {
  color: #00a4a4;
  font-size: 0.9rem;
  font-weight: 500;
}

.contact-actions {
  display: flex;
  gap: 0.2rem;
}

.contact-actions .icon-action {
  font-size: 0.85rem;
  padding: 0.1rem;
}

.contact-details {
  display: flex;
  flex-direction: column;
  font-size: 0.8rem;
}

.contact-role {
  color: #666;
  margin-bottom: 0.15rem;
}

.contact-phone,
.contact-email {
  color: #085E9C;
  word-break: break-all;
  font-size: 0.8rem;
}

/* Modal Styles for Business Entity */
#modal-container .modal-header {
  flex-direction: column;
  align-items: flex-start;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #dee2e6;
}

#modal-container .modal-header .btn-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
}

#modal-container .company-name {
  font-size: 1.1rem;
}

#modal-container .company-address {
  font-size: 0.85rem;
}

#modal-container .contact-name {
  color: #00a4a4;
  font-size: 1rem;
  font-weight: 500;
}

#modal-container .contact-role {
  color: #666;
  font-size: 0.85rem;
}

/* Phone/Email Row Styling */
.phone-number-row,
.email-address-row {
  padding: 0.5rem;
  background-color: #f8f9fa;
  border-radius: 4px;
}

/* ========================================
   Modal Button Styles - Modern Design
   ======================================== */

/* Base modal button styling - Same as btn-print */
.modal-footer .btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.9rem;
  font-weight: 400;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  border-radius: 5px;
  border: 1.5px solid #d0d0d0;
  background-color: #ffffff;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 80px;
  justify-content: center;
}

/* Modal Submit/Save Button - GREEN */
.modal-footer .btn-success,
.modal-footer .btn-primary {
  color: #198754;
}

.modal-footer .btn-success:hover,
.modal-footer .btn-primary:hover {
  background-color: #f8f9fa;
  border-color: #198754;
  color: #146c43;
  box-shadow: 0 1px 3px rgba(25, 135, 84, 0.15);
}

.modal-footer .btn-success:focus,
.modal-footer .btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(25, 135, 84, 0.25);
}

/* Modal Cancel Button - BLUE (like Print/Export) */
.modal-footer .btn-secondary {
  color: #0070BA;
}

.modal-footer .btn-secondary:hover {
  background-color: #f8f9fa;
  border-color: #0070BA;
  color: #005a94;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15);
}

.modal-footer .btn-secondary:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 112, 186, 0.25);
}

/* Modal Delete Button - RED */
.modal-footer .btn-danger {
  color: #dc3545;
}

.modal-footer .btn-danger:hover {
  background-color: #f8f9fa;
  border-color: #dc3545;
  color: #bb2d3b;
  box-shadow: 0 1px 3px rgba(220, 53, 69, 0.15);
}

.modal-footer .btn-danger:focus {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

/* Modal Info Button - BLUE (like Print/Export) */
.modal-footer .btn-info {
  color: #0070BA;
}

.modal-footer .btn-info:hover {
  background-color: #f8f9fa;
  border-color: #0070BA;
  color: #005a94;
  box-shadow: 0 1px 3px rgba(0, 112, 186, 0.15);
}

.modal-footer .btn-info:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 112, 186, 0.25);
}

/* Button icon spacing */
.modal-footer .btn i {
  margin-right: 0.35rem;
}

/* Modal footer layout */
.modal-footer {
  padding: 0.75rem 1rem;
  border-top: 1px solid #dee2e6;
  gap: 0.5rem;
}

/* Align Add button to the left */
.modal-footer .btn-info {
  margin-right: auto;
}

/* Modal Title Styling */
#modal-container .modal-title {
  color: #085E9C;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

#modal-container .modal-title.text-danger {
  color: #dc3545 !important;
}

/* Modal Form Labels */
#modal-container .col-form-label {
  color: #085E9C;
  font-size: 0.9rem;
  font-weight: 400;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
}

/* Modal Form Controls */
#modal-container .form-control {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 0.9rem;
  border: 1.5px solid #d0d0d0;
  border-radius: 5px;
  padding: 0.4rem 0.75rem;
  max-width: 100%;
}

#modal-container .form-control:focus {
  border-color: #0070BA;
  box-shadow: 0 0 0 0.15rem rgba(0, 112, 186, 0.15);
}

#modal-container .form-control::placeholder {
  color: #999;
  font-style: italic;
}

#modal-container .form-control-plaintext {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 0.9rem;
  color: #333;
}

/* Modal Select Controls */
#modal-container .form-select {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  font-size: 0.9rem;
  border: 1.5px solid #d0d0d0;
  border-radius: 5px;
  padding: 0.4rem 0.75rem;
}

#modal-container .form-select:focus {
  border-color: #0070BA;
  box-shadow: 0 0 0 0.15rem rgba(0, 112, 186, 0.15);
}

/* Modal Alert Styling */
#modal-container .alert-warning {
  background-color: #fff8e6;
  border-color: #ffd866;
  color: #856404;
  font-size: 0.9rem;
  border-radius: 5px;
}

#modal-container .alert-warning i {
  color: #e6a800;
  margin-right: 0.5rem;
}

/* Modal Body Padding */
#modal-container .modal-body {
  padding: 1rem 1.25rem;
}

/* Modal Header Styling */
#modal-container .modal-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  padding: 1rem 1.25rem;
}

/* Responsive adjustments */
@media (max-width: 575.98px) {
  .business-entity-info {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
  }
  
  .company-actions {
    flex-direction: row;
    margin-top: 0.5rem;
  }
  
  .contact-card {
    margin-top: 0.5rem;
  }
}

/* ========================================
   Chart Wrapper Styles
   ======================================== */
.chart-wrapper {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  padding: 1rem;
  margin-bottom: 1rem;
}

.chart-wrapper .labelChart {
  font-weight: 500;
  color: #333;
}

.chart-wrapper canvas {
  margin-top: 0.5rem;
}