/* Modern admin UI refresh - keeps Bootstrap 3 and existing admin actions intact. */
:root {
  --admin-green: #2f6b3f;
  --admin-green-dark: #173e27;
  --admin-green-soft: #eaf4ec;
  --admin-bg: #f4f7f4;
  --admin-surface: #ffffff;
  --admin-line: #e0e8e2;
  --admin-ink: #1b3024;
  --admin-muted: #728078;
  --admin-accent: #e69a2d;
  --admin-radius: 16px;
  --admin-shadow: 0 12px 32px rgba(23,62,39,.08);
}
body { background: var(--admin-bg); color: var(--admin-ink); font-family: Arial, sans-serif; }
.simple-normal .top-bar { background: #fff; border-bottom: 1px solid var(--admin-line); box-shadow: 0 2px 12px rgba(23,62,39,.05); }
.simple-normal .top-bar .logo { background: var(--admin-green-dark); }
.simple-normal .top-bar .logo a { color: #fff; font-weight: 700; font-size: 14px; }
.simple-normal .top-bar .logo img { max-height: 31px; margin-right: 8px; }
.simple-normal .side-menu-sec { background: var(--admin-green-dark); }
.side-menus > span { color: rgba(255,255,255,.48); letter-spacing: .12em; font-size: 10px; }
.side-menus nav > ul > li > a { color: rgba(255,255,255,.78); border-radius: 10px; margin: 3px 10px; padding-left: 14px; }
.side-menus nav > ul > li.active > a, .side-menus nav > ul > li > a:hover { background: rgba(255,255,255,.11); color: #fff; }
.side-menus nav > ul > li > a i { color: #a9d2b2; }
.side-menus nav > ul > li ul { background: rgba(0,0,0,.10); margin: 2px 10px 7px; border-radius: 10px; overflow: hidden; }
.side-menus nav > ul > li ul li a { color: rgba(255,255,255,.68); }
.side-menus nav > ul > li ul li a:hover { color: #fff; }
.footer-line { color: rgba(255,255,255,.45) !important; }
.top-bar-quick-sec > a span, .top-bar-quick-sec > span { color: var(--admin-green-dark); }
.main-content { background: var(--admin-bg); min-height: 100vh; }
.panel-content { background: transparent; }
.main-title-sec { background: transparent; padding-bottom: 4px; }
.heading-profile h2 { color: var(--admin-green-dark); font-weight: 800; font-size: 26px; }
.heading-profile span { color: var(--admin-muted); }
.breadcrumbs { background: transparent; border: 0; margin-bottom: 18px; }
.breadcrumbs li a { color: var(--admin-muted); }
.widget { border: 1px solid var(--admin-line); border-radius: var(--admin-radius); box-shadow: var(--admin-shadow); overflow: hidden; background: #fff; }
.quick-report-widget { min-height: 150px; padding: 22px; position: relative; }
.quick-report-widget > span { text-transform: none; color: var(--admin-muted); font-size: 12px; font-weight: 700; }
.quick-report-widget h4 { color: var(--admin-green-dark); font-size: 32px; font-weight: 800; margin-top: 6px; }
.quick-report-widget h5 { color: var(--admin-muted); font-weight: 400; line-height: 1.5; }
.quick-report-widget > i { width: 48px; height: 48px; line-height: 48px; border-radius: 14px; background: var(--admin-green-soft) !important; color: var(--admin-green) !important; top: 22px; right: 22px; }
.panel, .panel-default { border: 1px solid var(--admin-line); border-radius: var(--admin-radius); box-shadow: var(--admin-shadow); overflow: hidden; }
.panel-heading { background: #fff !important; border-bottom: 1px solid var(--admin-line) !important; }
.panel-heading h3, .panel-title { color: var(--admin-green-dark); font-weight: 800; }
.table-responsive { border: 0; }
.table > thead > tr > th { background: #f7faf7; color: var(--admin-green-dark); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--admin-line); }
.table > tbody > tr > td { vertical-align: middle; border-top-color: var(--admin-line); }
.table-striped > tbody > tr:nth-of-type(odd) { background-color: #fbfcfb; }
.form-control { border: 1px solid #d8e1da; border-radius: 10px; box-shadow: none; min-height: 42px; }
.form-control:focus { border-color: rgba(47,107,63,.55); box-shadow: 0 0 0 3px rgba(47,107,63,.08); }
.modal-content { border: 0; border-radius: 16px; box-shadow: 0 24px 60px rgba(16,43,28,.18); overflow: hidden; }
.modal-header { border-bottom: 1px solid var(--admin-line); background: #f8faf8; }
.modal-title { color: var(--admin-green-dark); font-weight: 800; }
.modal-footer { border-top: 1px solid var(--admin-line); }
.c-btn { border-radius: 9px !important; box-shadow: none !important; font-weight: 700; }
.c-btn.blue-bg, .c-btn.green-bg { background: var(--admin-green) !important; border-color: var(--admin-green) !important; }
.c-btn.red-bg { background: #c64b4b !important; border-color: #c64b4b !important; }
.c-btn:hover { filter: brightness(.95); transform: translateY(-1px); }
.alert { border: 0; border-radius: 12px; box-shadow: 0 5px 18px rgba(23,62,39,.08); }
.alert.green-bg { background: #e4f3e7 !important; color: #23552f !important; }
.alert.red-bg { background: #fbe9e9 !important; color: #8f3232 !important; }
.alert.blue-bg { background: #eaf1fb !important; color: #315b8c !important; }
.dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select { border: 1px solid var(--admin-line); border-radius: 8px; padding: 6px 8px; }
.pagination > li > a, .pagination > li > span { color: var(--admin-green); border-color: var(--admin-line); }
.pagination > .active > a, .pagination > .active > a:hover { background: var(--admin-green); border-color: var(--admin-green); }

/* Login */
body.agrica-admin-login { min-height: 100vh; background: radial-gradient(circle at 15% 10%, #eef7ef 0, #f5f8f5 38%, #edf2ee 100%); }
.agrica-login-shell { min-height: 100vh; display: flex; align-items: center; padding: 34px 15px; }
.agrica-login-card { max-width: 980px; margin: 0 auto; background: #fff; border: 1px solid var(--admin-line); border-radius: 24px; overflow: hidden; box-shadow: 0 24px 65px rgba(23,62,39,.13); }
.agrica-login-side { min-height: 530px; padding: 54px 46px; background: linear-gradient(145deg, #173e27 0%, #2f6b3f 100%); color: #fff; position: relative; overflow: hidden; }
.agrica-login-side:after { content:""; position:absolute; width:280px; height:280px; border-radius:50%; border:56px solid rgba(255,255,255,.06); right:-100px; bottom:-115px; }
.agrica-login-brand { display: flex; align-items: center; gap: 14px; position: relative; z-index: 1; }
.agrica-login-brand img { width: 68px; height: 56px; object-fit: contain; background: rgba(255,255,255,.92); padding: 5px; border-radius: 14px; }
.agrica-login-brand strong { font-size: 19px; line-height: 1.25; }
.agrica-login-copy { margin-top: 92px; position: relative; z-index: 1; }
.agrica-login-copy h1 { color: #fff; font-size: 34px; line-height: 1.18; margin-bottom: 15px; font-weight: 800; }
.agrica-login-copy p { color: rgba(255,255,255,.78); font-size: 14px; line-height: 1.8; }
.agrica-login-form { min-height: 530px; padding: 54px 52px; display: flex; flex-direction: column; justify-content: center; }
.agrica-login-form h2 { color: var(--admin-green-dark); font-weight: 800; font-size: 27px; margin: 0 0 6px; }
.agrica-login-form .subtitle { color: var(--admin-muted); margin-bottom: 26px; }
.agrica-field { margin-bottom: 16px; }
.agrica-field label { color: var(--admin-ink); font-size: 12px; font-weight: 700; margin-bottom: 7px; }
.agrica-field .input-wrap { position: relative; }
.agrica-field .input-wrap i { position: absolute; left: 14px; top: 14px; color: #8c9a91; }
.agrica-field input { width: 100%; height: 46px; border: 1px solid #d6e0d8; border-radius: 11px; padding: 10px 12px 10px 39px; outline: none; }
.agrica-field input:focus { border-color: rgba(47,107,63,.55); box-shadow: 0 0 0 3px rgba(47,107,63,.08); }
.agrica-login-button { width: 100%; height: 46px; border: 0; border-radius: 11px; background: var(--admin-green); color: #fff; font-weight: 800; margin-top: 5px; }
.agrica-login-button:hover { background: #275b35; }
.agrica-login-note { color: var(--admin-muted); font-size: 11px; margin: 18px 0 0; text-align: center; }
.agrica-login-alert { margin-bottom: 18px; }

@media (max-width: 767px) {
  .agrica-login-shell { padding: 18px 10px; }
  .agrica-login-card { border-radius: 18px; }
  .agrica-login-side { min-height: auto; padding: 28px 24px; }
  .agrica-login-copy { margin-top: 28px; }
  .agrica-login-copy h1 { font-size: 25px; }
  .agrica-login-form { min-height: auto; padding: 32px 24px; }
  .quick-report-widget { min-height: 135px; }
}

/* =========================================================
   Admin layout polish v2 - 2026-08-28
   Fixes the visible double divider/gap between sidebar,
   top bar and page content around common 1366px laptops.
   ========================================================= */

/* Keep desktop navigation geometry consistent. */
@media (min-width: 1201px) {
  .simple-normal .side-menu-sec {
    width: 266px !important;
  }

  .simple-normal .top-bar .logo {
    width: 266px;
    min-width: 266px;
    margin-right: 0;
    padding: 18px 18px;
    box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
  }

  .simple-normal .top-bar .logo a {
    display: flex;
    align-items: center;
    min-width: 0;
  }

  .simple-normal .top-bar .logo a img {
    flex: 0 0 auto;
  }

  .simple-normal .menu-options {
    margin-left: 0;
  }

  /* 20px breathing room after the fixed sidebar instead of
     the old 30-40px strip that looked like a second divider. */
  .main-content {
    padding: 28px 30px 30px 286px !important;
  }
}

@media (min-width: 1367px) {
  .main-content {
    padding: 34px 36px 36px 286px !important;
  }
}

/* A single, subtle header separator is cleaner than border + heavy shadow. */
.simple-normal .top-bar {
  border-bottom: 1px solid var(--admin-line);
  box-shadow: 0 1px 5px rgba(23,62,39,.035);
}

/* Remove accidental visual seams at the edge of the fixed sidebar. */
.simple-normal .side-menu-sec {
  border-right: 0 !important;
  box-shadow: none !important;
}

/* Slightly tighter page rhythm. */
.panel-content {
  margin-bottom: 28px;
}

.main-title-sec {
  margin-bottom: 2px;
}

.breadcrumbs {
  margin-top: 8px;
  margin-bottom: 14px;
  padding-left: 0;
}

/* Dashboard cards line up more cleanly. */
.main-content-area > .row {
  display: flex;
  flex-wrap: wrap;
}

.main-content-area > .row > [class*="col-"] {
  display: flex;
}

.main-content-area > .row > [class*="col-"] > .widget {
  width: 100%;
}

.quick-report-widget {
  height: 100%;
}

/* Do not force flex layout on small screens where Bootstrap's
   natural stacking is more predictable. */
@media (max-width: 767px) {
  .main-content-area > .row,
  .main-content-area > .row > [class*="col-"] {
    display: block;
  }

  .main-content {
    padding-top: 22px !important;
  }
}
