:root{
  --bg: #f4f7fb;
  --panel-bg:#ffffff;
  --text:#111827;
  --muted:#6b7280;
  --border:#dfe5ee;
  --primary:#2563eb;
  --primary-600:#1d4ed8;
  --success:#16a34a;
  --warning:#f59e0b;
  --danger:#dc2626;
  --shadow: 0 8px 24px rgba(31,48,78,.07);
  --radius: 8px;
  --ring: 0 0 0 3px rgba(37,99,235,.15);
}

body{
  background: var(--bg);
  color: var(--text);
  font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
  font-size: 14px;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.45;
}

/* Application shell */
.app-shell{border-collapse:separate !important;border-spacing:0;background:var(--bg);}
.app-shell>tbody>tr>td:first-child{width:180px !important;vertical-align:top;background:#f3f8ff;border-right:1px solid #dbe7f5;}
.app-shell>tbody>tr>td.app-gutter{width:1px !important;background:var(--border);}
.app-shell>tbody>tr>td:last-child{vertical-align:top;background:var(--bg);min-width:0;width:auto;}
.app-content{box-sizing:border-box;width:100%;min-height:calc(100vh - 74px);padding:16px 16px 30px;background:var(--bg);overflow-x:auto;}
.app-sidebar{width:170px !important;margin:0 !important;padding:12px 8px 20px;}
.app-sidebar .list-group{margin:0;}
.sub-page-wrapper{max-width:1480px;margin:0;}
.app-content>.sub-page-wrapper{max-width:none;margin:0;}

/* Top navigation */
.bs-example{background:#eef6ff;border-bottom:1px solid #d5e5f5;box-shadow:0 2px 10px rgba(31,48,78,.04);padding:8px 22px;}
.bs-example .nav{margin:0;display:flex;align-items:center;min-height:48px;}
.bs-example .nav>li>a{color:var(--text);font-weight:600;padding:6px 10px;border-radius:7px;}
.bs-example .nav>li:first-child>a{display:flex;align-items:center;gap:10px;color:var(--text);font-size:15px;}
.bs-example .nav>li:first-child img{width:92px !important;height:auto;}
.bs-example .nav>li>a:hover,.bs-example .nav>li>a:focus{background:#f3f6fb;color:var(--primary);}
.bs-example .dropdown-menu{margin-top:8px;min-width:170px;}

/* Footer */
.footer-wrapper{width:100%;max-width:none;margin:0;}
.inc-bottom{box-sizing:border-box;width:100%;min-height:44px;height:auto;padding:12px 22px;background:#eef6ff;border-top:1px solid #d5e5f5;color:#718096;font-size:12px;line-height:1.4;text-align:center;display:flex;align-items:center;justify-content:center;}

/* Sidebar navigation */
ul.nav-menu-list-style .nav-header{border:0;border-radius:6px;color:#334155;background:transparent;line-height:38px;padding:0 9px;font-weight:600;}
ul.nav-menu-list-style .nav-header:hover{background:#eef3fb;color:var(--primary);}
ul.nav-menu-list-style .nav-header .menu-collapsible-icon{top:13px;right:10px;color:#94a3b8;}
ul.nav-menu-list-style ul.tree{padding:4px 0 10px 10px;}
ul.nav-menu-list-style>li a{display:block;border:0;border-radius:6px;color:#506176;line-height:32px;padding:0 10px;font-size:13px;}
ul.nav-menu-list-style>li a:hover,ul.nav-menu-list-style>li.active>a{background:#eaf1ff;color:var(--primary);text-decoration:none;}
ul.nav-menu-list-style>li.active>a{font-weight:600;box-shadow:inset 3px 0 0 var(--primary);}

/* Shared page surfaces */
.panel{margin-bottom:20px;}
.panel-heading{padding:16px 18px;}
.panel-body{padding:18px;}
.panel-title{font-size:18px;}
.panel-heading .text-muted,.panel-heading>.text-muted{font-size:12px;}
.row{margin-left:-8px;margin-right:-8px;}
[class*="col-"]{padding-left:8px;padding-right:8px;}

/* Shared controls */
.form-control,.form-select,select,input[type="date"],input[type="text"],input[type="number"],textarea{min-height:34px;color:var(--text);background:#fff;}
.form-control::placeholder{color:#9aa6b5;}
.input-group .form-control{z-index:1;}
.btn{box-shadow:none;transition:background-color .15s ease,border-color .15s ease,color .15s ease;}
.btn-default:focus,.btn-default:hover{color:var(--text);}
.btn-link{font-weight:600;}

/* Shared data views */
.table-responsive{border:1px solid var(--border);background:#fff;}
.table{margin-bottom:0;}
.table>thead>tr>th{padding:10px 12px;font-size:12px;white-space:nowrap;}
.table>tbody>tr>td{padding:10px 12px;vertical-align:middle;}
.table-striped>tbody>tr:nth-of-type(odd){background:#fbfcfe;}
.table-hover>tbody>tr:hover{background:#f3f7fd;}
.pagination>li>a,.pagination>li>span{color:var(--primary);border-color:var(--border);}
.pagination>.active>a,.pagination>.active>span{background:var(--primary);border-color:var(--primary);}

/* Shared feedback */
.alert{border-radius:7px;border:1px solid transparent;box-shadow:none;}
.alert-info{background:#eef6ff;border-color:#cfe2fb;color:#285d94;}
.alert-success{background:#edf9f3;border-color:#c9ead9;color:#216a4b;}
.alert-warning{background:#fff8e9;border-color:#f5dfad;color:#855d16;}
.alert-danger{background:#fff1f1;border-color:#f1cccc;color:#9b3d3d;}
.label,.badge{font-weight:600;}

/* Links */
a{ color: var(--primary); }
a:hover{ color: var(--primary-600); text-decoration: none; }

/* Navbar / top bar */
.navbar, .navbar-default{
  background:#fff;
  border-color: var(--border);
}
.navbar-default .navbar-brand{ font-weight: 900; color: var(--text); }
.navbar-default .navbar-nav>li>a{ color: var(--text); font-weight: 700; }
.navbar-default .navbar-nav>li>a:hover{ color: var(--primary); }

/* Panels */
.panel{
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.panel-heading{
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
  background: #fbfcfe;
  border-bottom: 1px solid var(--border);
}
.panel-title{
  font-weight: 600;
  letter-spacing: .01em;
}
.panel-body{
  background: var(--panel-bg);
  border-bottom-left-radius: var(--radius);
  border-bottom-right-radius: var(--radius);
}

/* Buttons */
.btn{
  border-radius: 7px;
  font-weight: 600;
}
.btn-primary{
  background: var(--primary);
  border-color: var(--primary);
}
.btn-primary:hover, .btn-primary:focus{
  background: var(--primary-600);
  border-color: var(--primary-600);
}
.btn-primary:focus{ box-shadow: var(--ring); }
.btn-success{
  background: var(--success);
  border-color: var(--success);
}
.btn-default{
  background: #fff;
  border-color: var(--border);
  color: #111827;
}
.btn-default:hover{
  background:#f9fafb;
  border-color:#d1d5db;
}
.btn:focus, .btn:active:focus{ outline: none; }
.download-btn{display:inline-flex;align-items:center;gap:6px;min-height:34px;white-space:nowrap}
.download-btn .glyphicon{font-size:12px}
.download-btn.btn-sm{min-height:30px}
.download-btn.btn-xs{min-height:26px}

/* Inputs */
.form-control, select, input[type="text"], input[type="number"]{
  border-radius: 7px;
  border: 1px solid #d1d5db;
  box-shadow: none;
}
.form-control:focus{
  border-color: rgba(37,99,235,.55);
  box-shadow: var(--ring);
}

/* Tables */
.table{
  background: #fff;
}
.table>thead>tr>th{
  background:#f7f9fc;
  border-bottom: 1px solid var(--border);
  color:#374151;
  font-weight:600;
}
.table>tbody>tr>td{
  border-top: 1px solid var(--border);
}
.table-bordered{
  border: 1px solid var(--border);
}
.table-bordered>thead>tr>th,
.table-bordered>tbody>tr>td{
  border: 1px solid var(--border);
}

/* Tabs */
.nav-tabs{
  border-bottom: 1px solid var(--border);
}
.nav-tabs>li>a{
  border-radius: 10px 10px 0 0;
  font-weight: 800;
  color: var(--text);
}
.nav-tabs>li>a:hover{
  background: rgba(37,99,235,.06);
  border-color: transparent;
}
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus{
  color: var(--primary);
  background: #fff;
  border: 1px solid var(--border);
  border-bottom-color: #fff;
}

/* Dropdown menus */
.dropdown-menu{
  border-radius: 10px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}

/* Left menu
   Reverted to legacy styling in `css/app.css` because mobile click/tap
   interactions were inconsistent for some roles when modern overrides applied. */

/* Small utility */
.text-muted{ color: var(--muted) !important; }
.muted{ color: var(--muted) !important; }

/* Ensure Angular UI Bootstrap typeahead popup is visible above tables/cards */
.uib-typeahead-popup.dropdown-menu{
  z-index: 3000;
}