/* ====== Modernization layer for PHPRunner + Bootstrap 3.4 ====== */
/* 1) Theme tokens (tweak just these to rebrand fast) */
:root{
  --brand-50:#eef2ff; --brand-500:#2563eb; --brand-600:#1d4ed8; --brand-700:#1e40af;
  --accent-500:#22c55e;
  --text-1:#0f172a; --text-2:#334155; --muted:#64748b;
  --bg:#ffffff; --bg-elev:#f8fafc; --border:#e2e8f0;
  --radius-sm:8px; --radius:12px; --radius-lg:16px;
  --shadow:0 6px 20px rgba(15,23,42,.06);
}

/* 2) Base + type */
html{font-size:16px}
body{color:var(--text-1); background:var(--bg); -webkit-font-smoothing:antialiased}
h1,h2,h3{font-weight:600; color:var(--text-1)}
p,.help-block{color:var(--text-2)}
a{color:var(--brand-600)} a:hover{color:var(--brand-700)}

/* 3) Navbar (top) */
.navbar{border:none; box-shadow:var(--shadow)}
.navbar-default{background:#fff}
.navbar-default .navbar-nav>li>a{padding:12px 14px}
.breadcrumb{margin:10px 0 0}

/* 4) Left rail menu */
.r-left{background:#fff; border-right:1px solid var(--border)}
.r-left .r-menu .r-menu-link{display:block; padding:10px 12px; border-radius:8px; color:var(--text-1)}
.r-left .r-menu li a:hover .r-menu-link,
.r-left .r-menu li.active > a .r-menu-link{background:var(--brand-50)}
.r-menu-expand-icon,.r-menu-mobile-expand-icon{opacity:.6}

/* 5) Buttons */
.btn{border-radius:var(--radius-sm); border:1px solid transparent; box-shadow:0 1px 0 rgba(0,0,0,.04);
     transition:transform .06s ease, background-color .2s ease, border-color .2s ease}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--brand-600); border-color:var(--brand-600)}
.btn-primary:hover{background:var(--brand-700); border-color:var(--brand-700)}
.btn-default{background:#fff; border-color:var(--border)}
.btn-default:hover{background:#f7f9fc}

/* Optional outline button */
.btn-outline{background:transparent; color:var(--brand-600); border-color:var(--brand-600)}
.btn-outline:hover{background:var(--brand-50)}

/* 6) Forms */
.form-control{border:1px solid var(--border); border-radius:var(--radius-sm); box-shadow:none}
.form-control:focus{border-color:var(--brand-500); box-shadow:0 0 0 3px rgba(37,99,235,.15)}

/* 7) Panels -> “cards” (keeps .panel markup) */
.panel{border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow)}
.panel-heading{background:var(--bg-elev); border-color:var(--border); font-weight:600;
               border-top-left-radius:var(--radius); border-top-right-radius:var(--radius)}
.panel-footer{background:var(--bg-elev); border-color:var(--border);
              border-bottom-left-radius:var(--radius); border-bottom-right-radius:var(--radius)}

/* 8) Tabs (your .nav-tabs.bsgrid_tabs) */
.nav-tabs.bsgrid_tabs{border-bottom:1px solid var(--border); margin-bottom:12px}
.nav-tabs.bsgrid_tabs>li>a{border:0; padding:10px 14px; border-radius:10px 10px 0 0; color:var(--text-2)}
.nav-tabs.bsgrid_tabs>li.active>a,
.nav-tabs.bsgrid_tabs>li>a:hover{background:var(--brand-50); color:var(--text-1)}

/* 9) Tables */
.table{background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden}
.table>thead>tr>th{background:var(--bg-elev); border-bottom:1px solid var(--border); color:var(--text-1); font-weight:600}
.table>tbody>tr:nth-child(even){background:#fcfdff}
.table-hover>tbody>tr:hover{background:#f1f5ff}

/* 10) Badges on detail links */
.badge{border-radius:999px; font-weight:600; padding:.2em .6em}

/* 11) Search / controls strip (above-grid) */
#form_above-grid_1 .btn{margin-right:6px}
#form_above-grid_1 .form-control{max-width:140px}

/* 12) Micro-utilities */
.mb-0{margin-bottom:0!important} .mb-2{margin-bottom:.5rem!important} .mb-4{margin-bottom:1rem!important}
.p-4{padding:1rem!important} .py-2{padding-top:.5rem!important; padding-bottom:.5rem!important}

/* 13) Responsive tweaks */
@media (max-width: 991px){
  .r-left{border-right:none; box-shadow:var(--shadow); margin-bottom:12px}
  .navbar .navbar-form{margin-left:0}
}