/* ===========================================
   NMS STOCK CONTROL
   Professional Admin Theme
=========================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;
    background:#f4f6f9;
    color:#333;
}

/* Layout */

.wrapper{
    display:flex;
    min-height:100vh;
}

/* Sidebar */

.sidebar{
    width:260px;
    background:#0d2b52;
    color:#fff;
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    overflow-y:auto;
}

.logo{
    padding:25px;
    text-align:center;
    border-bottom:1px solid rgba(255,255,255,.1);
}

.logo h2{
    color:white;
    margin-bottom:4px;
    font-weight:700;
}

.logo small{
    color:#d0d8e5;
}

.sidebar ul{
    list-style:none;
    margin:0;
    padding:20px 0;
}

.sidebar li{
    margin:2px 0;
}

.sidebar a{
    display:block;
    color:#d8e3f0;
    text-decoration:none;
    padding:12px 25px;
    transition:.3s;
}

.sidebar a i{
    width:25px;
}

.sidebar a:hover{
    background:#1b4b8a;
    color:#fff;
}

.sidebar .menu-title{
    color:#8fb3df;
    font-size:.8rem;
    text-transform:uppercase;
    padding:20px 25px 8px;
    font-weight:bold;
}

/* Content */

.content{
    margin-left:260px;
    width:calc(100% - 260px);
    padding:30px;
}

/* Cards */

.card{
    border:none;
    border-radius:12px;
    box-shadow:0 2px 12px rgba(0,0,0,.08);
}

.card-header{
    background:white;
    font-weight:600;
}

/* Buttons */

.btn-primary{
    background:#0d6efd;
    border:none;
}

.btn-primary:hover{
    background:#0b5ed7;
}

/* Tables */

.table{
    margin-bottom:0;
}

.table thead{
    background:#0d2b52;
    color:white;
}

.table thead th{
    border:none;
    padding:14px;
}

.table td{
    vertical-align:middle;
}

/* Forms */

.form-control,
.form-select{
    border-radius:8px;
}

.form-control:focus,
.form-select:focus{
    box-shadow:none;
    border-color:#0d6efd;
}

/* Dashboard Cards */

.dashboard-card{
    border-radius:15px;
    color:white;
    padding:25px;
}

.dashboard-card h2{
    font-size:2rem;
}

.dashboard-card p{
    margin-bottom:0;
}

.bg-blue{
    background:#0d6efd;
}

.bg-green{
    background:#198754;
}

.bg-orange{
    background:#fd7e14;
}

.bg-red{
    background:#dc3545;
}

/* Alerts */

.alert{
    border:none;
    border-radius:8px;
}

/* Search Box */

.search-box{
    max-width:350px;
}

/* Responsive */

@media(max-width:991px){

.sidebar{
    position:relative;
    width:100%;
    height:auto;
}

.content{
    margin-left:0;
    width:100%;
}

.wrapper{
    flex-direction:column;
}

}

/* ================================
   TOP BAR
   ================================ */

.topbar {
    min-height: 64px;
    background: #ffffff;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 24px;
    margin-bottom: 20px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.topbar-left {
    display: flex;
    align-items: center;
}

.home-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border-radius: 8px;
    text-decoration: none;
    background: #0d6efd;
    color: #ffffff;
    font-weight: 600;
}

.home-button:hover {
    background: #0b5ed7;
    color: #ffffff;
}

.topbar-user {
    display: flex;
    align-items: center;
    gap: 18px;
}

.user-info {
    text-align: right;
    line-height: 1.2;
}

.user-name {
    font-weight: 600;
    color: #212529;
}

.user-role {
    font-size: 12px;
    color: #6c757d;
    margin-top: 3px;
}

.logout-button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 13px;
    border: 1px solid #dc3545;
    border-radius: 7px;
    text-decoration: none;
    color: #dc3545;
    font-weight: 600;
}

.logout-button:hover {
    background: #dc3545;
    color: #ffffff;
}

/* Always make Home easy to find in sidebar */
.home-nav a {
    font-weight: 700;
}

/* =========================================================
   Mobile / tablet navigation and stock-count usability
========================================================= */
.mobile-menu-button{
    display:none;
    border:0;
    background:#0d2b52;
    color:#fff;
    border-radius:8px;
    width:42px;
    height:42px;
    margin-right:10px;
}
.topbar{
    position:sticky;
    top:0;
    z-index:1000;
}
@media(max-width:991px){
    .wrapper{display:block;}
    .sidebar{
        position:fixed;
        z-index:2000;
        left:-280px;
        top:0;
        width:260px;
        height:100vh;
        transition:left .2s ease;
        box-shadow:4px 0 16px rgba(0,0,0,.2);
    }
    .sidebar.mobile-open{left:0;}
    .content{
        margin-left:0;
        width:100%;
        padding:12px;
    }
    .mobile-menu-button{display:inline-flex;align-items:center;justify-content:center;}
    .home-button{padding:9px 13px;}
    .home-button span{display:inline;}
    .topbar{margin-bottom:12px;padding:8px 10px;}
    .table-responsive{font-size:.9rem;}
    .table td,.table th{white-space:nowrap;padding:9px 8px;}
    .form-control,.form-select{min-height:44px;}
    .btn{min-height:42px;}
}
@media(max-width:575px){
    .home-button span{display:none;}
    .content{padding:8px;}
    h1,h2{font-size:1.45rem;}
    .card-body{padding:12px;}
    .stock-count-mobile-hide{display:none;}
}

/* NMS compact navigation / readability */
.sidebar{width:225px}.content{margin-left:225px;width:calc(100% - 225px);padding:20px}.sidebar a{padding:9px 18px;font-size:.88rem}.sidebar .menu-title{padding:13px 18px 6px;font-size:.72rem}.sidebar ul{padding:10px 0}.logo{padding:16px}.nms-logo{max-width:150px;max-height:58px;object-fit:contain;display:block;margin:0 auto 5px}.table{font-size:.9rem}.table thead th{padding:9px 10px}.table td{padding:8px 10px}@media(max-width:991px){.sidebar{width:260px}.content{margin-left:0;width:100%;padding:10px}}

/* Final compact/mobile usability patch */
@media (min-width: 992px){
  .sidebar{width:210px}
  .content{margin-left:210px;width:calc(100% - 210px);padding:16px}
  .sidebar a{font-size:.82rem;padding:8px 15px}
  .sidebar .menu-title{font-size:.68rem;padding:10px 15px 5px}
  .sidebar ul{padding:7px 0}
  .logo{padding:12px}
  .table{font-size:.86rem}
  .table thead th,.table td{padding:7px 8px}
  .topbar{min-height:54px;padding:7px 14px}
  .home-button{padding:7px 12px;font-size:.88rem}
}
@media (max-width: 991px){
  .content{padding:8px}
  .topbar{padding:7px 8px}
  .card{border-radius:9px}
  .table{font-size:.84rem}
  .table thead th,.table td{padding:7px 6px}
  .btn{font-size:.88rem}
}
.nms-logo{max-width:150px;max-height:58px;object-fit:contain}
.branch-logo-preview{max-width:100px;max-height:50px;object-fit:contain;border:1px solid #dee2e6;border-radius:6px;padding:3px;background:#fff}