:root{
  --sidebar-w: 250px;
  --primary: #2f7d5f;
  --primary-dark: #235c46;
  --bg: #f4f6f8;
}
*{box-sizing:border-box;}
body{background:var(--bg); font-family: 'Segoe UI', Roboto, Arial, sans-serif; color:#2c3338;}
.app-wrapper{display:flex; min-height:100vh;}
.sidebar{width:var(--sidebar-w); background:linear-gradient(180deg,var(--primary-dark),var(--primary)); color:#fff; flex-shrink:0; position:fixed; top:0; bottom:0; left:0; overflow-y:auto; z-index:1000; transition: left .2s;}
.sidebar-brand{padding:20px 18px; font-size:1.25rem; font-weight:700; border-bottom:1px solid rgba(255,255,255,.15);}
.sidebar-brand i{margin-right:8px;}
.sidebar-menu{list-style:none; margin:0; padding:10px 0;}
.sidebar-menu li a{display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.85); text-decoration:none; padding:11px 18px; font-size:.92rem;}
.sidebar-menu li a:hover, .sidebar-menu li.active a{background:rgba(255,255,255,.14); color:#fff; border-left:3px solid #fff;}
.main-content{margin-left:var(--sidebar-w); flex:1; display:flex; flex-direction:column; min-width:0; min-height:100vh; width:calc(100% - var(--sidebar-w)); overflow-x:hidden;}
.topbar{background:#fff; padding:14px 22px; display:flex; align-items:center; gap:14px; box-shadow:0 1px 4px rgba(0,0,0,.06); position:sticky; top:0; z-index:900;}
.topbar-title{flex:1;}
.page-content{padding:22px; flex:1; min-width:0; overflow-x:hidden;}
.page-footer{padding:14px 22px; text-align:center; color:#8a8f98; font-size:.82rem; background:#fff; border-top:1px solid #eee;}
.card{border:none; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.06); margin-bottom:20px;}
.card-header{background:#fff; border-bottom:1px solid #eee; font-weight:600; border-radius:10px 10px 0 0 !important;}
.kpi-card{border-radius:12px; padding:18px 20px; color:#fff;}
.kpi-card h3{font-size:1.7rem; margin:6px 0 0;}
.kpi-card .kpi-label{font-size:.82rem; opacity:.9; text-transform:uppercase; letter-spacing:.4px;}
.kpi-green{background:linear-gradient(135deg,#2f7d5f,#3fa37c);}
.kpi-blue{background:linear-gradient(135deg,#2563a5,#3d8bd6);}
.kpi-orange{background:linear-gradient(135deg,#c9691a,#e2903f);}
.kpi-purple{background:linear-gradient(135deg,#6a3fa0,#9166c4);}
.kpi-red{background:linear-gradient(135deg,#b03a3a,#d15f5f);}
.kpi-teal{background:linear-gradient(135deg,#127a7a,#1fa3a3);}
.table thead th{background:#f0f3f5; font-size:.8rem; text-transform:uppercase; letter-spacing:.3px; color:#5b636b; border-bottom:0;}
.table td, .table th{vertical-align:middle; font-size:.9rem;}
.badge-status-Active,.badge-status-Paid,.badge-status-Milking{background:#2f7d5f;}
.badge-status-Inactive,.badge-status-Due,.badge-status-Dry{background:#b0364a;}
.badge-status-Partial,.badge-status-Pregnant{background:#c9691a;}
.form-label{font-weight:600; font-size:.85rem;}
.section-title{font-weight:700; font-size:1rem; color:var(--primary-dark); margin:20px 0 10px; padding-bottom:6px; border-bottom:2px solid var(--primary);}
.stat-mini{background:#fff; border-radius:10px; padding:14px; text-align:center; box-shadow:0 1px 6px rgba(0,0,0,.06);}
.stat-mini .num{font-size:1.4rem; font-weight:700; color:var(--primary-dark);}
.stat-mini .lbl{font-size:.75rem; color:#8a8f98; text-transform:uppercase;}
.login-wrapper{min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#1f5c46,#2f7d5f);}
.login-card{background:#fff; border-radius:14px; padding:40px; width:100%; max-width:400px; box-shadow:0 10px 40px rgba(0,0,0,.2);}
.login-card h3{color:var(--primary-dark); font-weight:700;}
@media (max-width: 991.98px){
  .sidebar{left:-260px;}
  .sidebar.show{left:0;}
  .main-content{margin-left:0; width:100%;}
}

/* Mobile: prevent double horizontal spacing around page views. */
@media (max-width: 767.98px){
  .page-content{
    width:100%;
    max-width:100%;
    padding:12px 0 90px;
    overflow-x:hidden;
  }
}
