/**======================================================================
 * SIPRA — Sistem Informasi Profil Prajurit
 * Yonif TP 825/GYS Beteleme
 * File: sipra-military.css
 * Deskripsi: Override tema hijau militer untuk Gradient Able Template
 * Palet: Olive Green / Forest Military Green
 *======================================================================*/

/* ========================================
   ROOT VARIABLES — Military Green Palette
   ======================================== */
:root {
  --sipra-primary: #2D5016;
  --sipra-primary-light: #4A7C2E;
  --sipra-primary-lighter: #E8F0E0;
  --sipra-primary-dark: #1B3409;
  --sipra-secondary: #5B8C3E;
  --sipra-accent: #3D6B24;
  --sipra-warning: #B8860B;
  --sipra-danger: #8B0000;
  --sipra-info: #2E6B4F;
  --sipra-success: #4A7C2E;
  --sipra-dark: #1A2E0A;
  --sipra-body-bg: #F2F5EC;
  --sipra-sidebar-bg: #1B3409;
  --sipra-sidebar-text: #C8D8B8;
  --sipra-sidebar-hover: #2D5016;
  --sipra-sidebar-active: #4A7C2E;
  --sipra-header-gradient: linear-gradient(135deg, #2D5016 0%, #4A7C2E 50%, #3D6B24 100%);
  --sipra-card-shadow: 0 2px 8px rgba(27, 52, 9, 0.12);
  --sipra-border-color: #C8D8B8;
}

/* ========================================
   PRESET OVERRIDE — Military
   ======================================== */
[data-pc-preset=preset-1],
[data-pc-preset=preset-military] {
  --pc-sidebar-active-color: #4A7C2E;
  --bs-blue: #2D5016;
  --bs-primary: #2D5016;
  --bs-primary-rgb: 45, 80, 22;
  --bs-primary-light: #E8F0E0;
  --bs-link-color: #2D5016;
  --bs-link-color-rgb: 45, 80, 22;
  --bs-link-hover-color: #1B3409;
  --bs-link-hover-color-rgb: 27, 52, 9;
  --dt-row-selected: 45, 80, 22;
  --bs-success: #4A7C2E;
  --bs-success-rgb: 74, 124, 46;
  --bs-info: #2E6B4F;
  --bs-info-rgb: 46, 107, 79;
  --bs-warning: #B8860B;
  --bs-warning-rgb: 184, 134, 11;
  --bs-danger: #8B0000;
  --bs-danger-rgb: 139, 0, 0;
}

/* ========================================
   BODY
   ======================================== */
body {
  --bs-body-bg: #F2F5EC !important;
  --bs-body-bg-rgb: 242, 245, 236 !important;
  background-color: var(--sipra-body-bg) !important;
}

/* ========================================
   SIDEBAR — Dark Military
   ======================================== */
.pc-sidebar {
  background: var(--sipra-sidebar-bg) !important;
  box-shadow: 2px 0 12px rgba(27, 52, 9, 0.3) !important;
}

.pc-sidebar .navbar-wrapper {
  background: var(--sipra-sidebar-bg) !important;
}

.pc-sidebar .navbar-content {
  background: transparent !important;
}

.pc-sidebar .m-header {
  background: rgba(0, 0, 0, 0.15) !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(200, 216, 184, 0.1) !important;
}

.pc-sidebar .m-header .b-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pc-sidebar .pc-navbar > .pc-item > .pc-link {
  color: var(--sipra-sidebar-text) !important;
  border-radius: 8px !important;
  margin: 2px 12px !important;
  padding: 10px 14px !important;
  transition: all 0.3s ease !important;
}

.pc-sidebar .pc-navbar > .pc-item > .pc-link:hover {
  background: var(--sipra-sidebar-hover) !important;
  color: #ffffff !important;
}

.pc-sidebar .pc-navbar > .pc-item.active > .pc-link,
.pc-sidebar .pc-navbar > .pc-item > .pc-link.active {
  background: var(--sipra-sidebar-active) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(74, 124, 46, 0.4) !important;
}

.pc-sidebar .pc-navbar > .pc-item > .pc-link .pc-micon i {
  color: var(--sipra-sidebar-text) !important;
  font-size: 18px !important;
}

.pc-sidebar .pc-navbar > .pc-item.active > .pc-link .pc-micon i,
.pc-sidebar .pc-navbar > .pc-item > .pc-link:hover .pc-micon i {
  color: #ffffff !important;
}

.pc-sidebar .pc-caption {
  color: rgba(200, 216, 184, 0.5) !important;
}

.pc-sidebar .pc-caption label {
  color: rgba(200, 216, 184, 0.5) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  font-weight: 600 !important;
}

.pc-sidebar .pc-caption i {
  color: rgba(200, 216, 184, 0.3) !important;
}

/* Submenu */
.pc-sidebar .pc-submenu {
  background: rgba(0, 0, 0, 0.1) !important;
}

.pc-sidebar .pc-submenu .pc-link {
  color: rgba(200, 216, 184, 0.7) !important;
  padding-left: 50px !important;
}

.pc-sidebar .pc-submenu .pc-link:hover {
  color: #ffffff !important;
}

/* Sidebar promo card override */
.pc-sidebar .nav-action-card {
  background: linear-gradient(135deg, #2D5016, #4A7C2E) !important;
  border: 1px solid rgba(200, 216, 184, 0.2) !important;
  margin: 12px !important;
  border-radius: 12px !important;
}

/* Scrollbar sidebar */
.pc-sidebar .navbar-content::-webkit-scrollbar {
  width: 4px;
}

.pc-sidebar .navbar-content::-webkit-scrollbar-thumb {
  background: rgba(200, 216, 184, 0.3);
  border-radius: 4px;
}

/* ========================================
   HEADER — Military Gradient
   ======================================== */
.pc-header {
  background: var(--sipra-header-gradient) !important;
  box-shadow: 0 2px 12px rgba(27, 52, 9, 0.2) !important;
}

.pc-header .pc-head-link {
  color: rgba(255, 255, 255, 0.85) !important;
}

.pc-header .pc-head-link:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.15) !important;
}

.pc-header .dropdown-menu {
  border: 1px solid var(--sipra-border-color) !important;
  box-shadow: 0 4px 16px rgba(27, 52, 9, 0.15) !important;
}

.pc-header .m-header .b-brand {
  color: #ffffff !important;
}

/* ========================================
   BUTTONS — Military Theme
   ======================================== */
.btn-primary,
[data-pc-preset=preset-1] .btn-primary {
  --bs-btn-color: #ffffff !important;
  --bs-btn-bg: #2D5016 !important;
  --bs-btn-border-color: #2D5016 !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: #1B3409 !important;
  --bs-btn-hover-border-color: #1B3409 !important;
  --bs-btn-focus-shadow-rgb: 45, 80, 22 !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: #1A2E0A !important;
  --bs-btn-active-border-color: #1A2E0A !important;
  --bs-btn-disabled-bg: #2D5016 !important;
  --bs-btn-disabled-border-color: #2D5016 !important;
  background: linear-gradient(135deg, #2D5016, #3D6B24) !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(45, 80, 22, 0.3) !important;
  transition: all 0.3s ease !important;
}

.btn-primary:hover {
  background: linear-gradient(135deg, #1B3409, #2D5016) !important;
  box-shadow: 0 4px 12px rgba(45, 80, 22, 0.5) !important;
  transform: translateY(-1px) !important;
}

.btn-outline-primary {
  --bs-btn-color: #2D5016 !important;
  --bs-btn-border-color: #2D5016 !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: #2D5016 !important;
  --bs-btn-hover-border-color: #2D5016 !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: #1B3409 !important;
}

.btn-success {
  --bs-btn-bg: #4A7C2E !important;
  --bs-btn-border-color: #4A7C2E !important;
  --bs-btn-hover-bg: #3D6B24 !important;
  --bs-btn-hover-border-color: #3D6B24 !important;
}

.btn-info {
  --bs-btn-bg: #2E6B4F !important;
  --bs-btn-border-color: #2E6B4F !important;
  --bs-btn-hover-bg: #245640 !important;
  --bs-btn-hover-border-color: #245640 !important;
  --bs-btn-color: #ffffff !important;
  --bs-btn-hover-color: #ffffff !important;
}

.btn-warning {
  --bs-btn-bg: #B8860B !important;
  --bs-btn-border-color: #B8860B !important;
  --bs-btn-hover-bg: #9A7209 !important;
  --bs-btn-hover-border-color: #9A7209 !important;
}

.btn-danger {
  --bs-btn-bg: #8B0000 !important;
  --bs-btn-border-color: #8B0000 !important;
  --bs-btn-hover-bg: #700000 !important;
  --bs-btn-hover-border-color: #700000 !important;
}

.btn-link,
[data-pc-preset=preset-1] .btn-link {
  --bs-btn-color: #2D5016 !important;
  --bs-btn-hover-color: #1B3409 !important;
}

/* ========================================
   CARDS
   ======================================== */
.card {
  border: none !important;
  border-radius: 12px !important;
  box-shadow: var(--sipra-card-shadow) !important;
  transition: all 0.3s ease !important;
}

.card:hover {
  box-shadow: 0 4px 16px rgba(27, 52, 9, 0.18) !important;
}

.card-header {
  background: transparent !important;
  border-bottom: 1px solid rgba(200, 216, 184, 0.3) !important;
}

.card-header h5 {
  color: var(--sipra-dark) !important;
  font-weight: 600 !important;
}

/* Gradient Cards */
.bg-grd-primary,
[data-pc-preset=preset-1] .bg-grd-primary {
  background: linear-gradient(135deg, #2D5016, #4A7C2E) !important;
}

.bg-grd-success {
  background: linear-gradient(135deg, #4A7C2E, #5B8C3E) !important;
}

.bg-grd-warning {
  background: linear-gradient(135deg, #B8860B, #D4A017) !important;
}

.bg-grd-danger {
  background: linear-gradient(135deg, #8B0000, #B22222) !important;
}

.bg-grd-info {
  background: linear-gradient(135deg, #2E6B4F, #3D8B6A) !important;
}

/* Stat Cards — Military Order Card */
.order-card.bg-grd-primary {
  background: linear-gradient(135deg, #2D5016, #3D6B24) !important;
}

.order-card.bg-grd-success {
  background: linear-gradient(135deg, #2E6B4F, #3D8B6A) !important;
}

.order-card.bg-grd-warning {
  background: linear-gradient(135deg, #B8860B, #D4A017) !important;
}

.order-card.bg-grd-danger {
  background: linear-gradient(135deg, #8B0000, #B22222) !important;
}

/* Light Backgrounds */
.bg-light-primary,
[data-pc-preset=preset-1] .bg-light-primary {
  background: #E8F0E0 !important;
  color: #2D5016 !important;
}

.bg-light-success {
  background: #E8F0E0 !important;
  color: #4A7C2E !important;
}

.bg-light-warning {
  background: #FDF5E0 !important;
  color: #B8860B !important;
}

.bg-light-danger {
  background: #FDE8E8 !important;
  color: #8B0000 !important;
}

.bg-light-info {
  background: #E0F0EB !important;
  color: #2E6B4F !important;
}

/* Brand Color Override */
.bg-brand-color-1 {
  background: linear-gradient(135deg, #2D5016, #4A7C2E) !important;
}

.bg-brand-color-3 {
  background: linear-gradient(135deg, #5B8C3E, #7AAF5E) !important;
}

/* ========================================
   BADGES
   ======================================== */
.badge.bg-primary {
  background-color: #2D5016 !important;
}

.badge.bg-success {
  background-color: #4A7C2E !important;
}

.badge.bg-info {
  background-color: #2E6B4F !important;
}

.badge.bg-warning {
  background-color: #B8860B !important;
}

.badge.bg-danger {
  background-color: #8B0000 !important;
}

.badge.bg-light-primary {
  background-color: #E8F0E0 !important;
  color: #2D5016 !important;
}

.badge.bg-light-success {
  background-color: #E8F0E0 !important;
  color: #4A7C2E !important;
}

/* ========================================
   PROGRESS BARS
   ======================================== */
.progress-bar.bg-brand-color-1 {
  background: linear-gradient(90deg, #2D5016, #4A7C2E) !important;
}

.progress-bar.bg-brand-color-3 {
  background: linear-gradient(90deg, #5B8C3E, #7AAF5E) !important;
}

.progress-bar.bg-primary {
  background-color: #2D5016 !important;
}

/* ========================================
   TABLES
   ======================================== */
.table thead th {
  background: #E8F0E0 !important;
  color: var(--sipra-dark) !important;
  font-weight: 600 !important;
  border-bottom: 2px solid var(--sipra-primary) !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.table-hover tbody tr:hover {
  background-color: rgba(232, 240, 224, 0.5) !important;
}

.table-card .table {
  margin-bottom: 0;
}

/* DataTables Override */
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--sipra-primary) !important;
  color: #ffffff !important;
  border-color: var(--sipra-primary) !important;
  border-radius: 6px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--sipra-primary-light) !important;
  color: #ffffff !important;
  border-color: var(--sipra-primary-light) !important;
}

/* ========================================
   FORMS
   ======================================== */
.form-control:focus {
  border-color: var(--sipra-primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(45, 80, 22, 0.15) !important;
}

.form-check-input:checked {
  background-color: var(--sipra-primary) !important;
  border-color: var(--sipra-primary) !important;
}

.form-select:focus {
  border-color: var(--sipra-primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(45, 80, 22, 0.15) !important;
}

.input-primary:checked {
  background-color: var(--sipra-primary) !important;
  border-color: var(--sipra-primary) !important;
}

/* ========================================
   AUTH/LOGIN PAGE
   ======================================== */
.auth-main.bg-grd-primary {
  background: linear-gradient(135deg, #1B3409 0%, #2D5016 40%, #3D6B24 70%, #4A7C2E 100%) !important;
  min-height: 100vh;
}

.auth-main .card {
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(27, 52, 9, 0.25) !important;
  backdrop-filter: blur(10px);
}

.auth-main .btn-primary {
  padding: 12px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  border-radius: 10px !important;
}

.auth-main .link-primary {
  color: #2D5016 !important;
}

.auth-main .link-primary:hover {
  color: #1B3409 !important;
}

/* ========================================
   FOOTER
   ======================================== */
.pc-footer {
  background: #ffffff !important;
  border-top: 1px solid rgba(200, 216, 184, 0.3) !important;
}

.pc-footer p,
.pc-footer a {
  color: #666 !important;
}

.pc-footer a:hover {
  color: var(--sipra-primary) !important;
}

/* ========================================
   STATISTICS CARDS
   ======================================== */
.statistics-card-1 {
  overflow: hidden;
}

.statistics-card-1.bg-brand-color-1 {
  background: linear-gradient(135deg, #2D5016, #4A7C2E) !important;
}

/* ========================================
   SCROLLBAR — Global
   ======================================== */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: #F2F5EC;
}

::-webkit-scrollbar-thumb {
  background: rgba(45, 80, 22, 0.3);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(45, 80, 22, 0.5);
}

/* ========================================
   LOADER
   ======================================== */
.loader-fill {
  background: linear-gradient(135deg, #2D5016, #4A7C2E) !important;
}

/* ========================================
   LINKS
   ======================================== */
a {
  color: var(--sipra-primary);
}

a:hover {
  color: var(--sipra-primary-dark);
}

.link-primary,
[data-pc-preset=preset-1] .link-primary {
  color: #2D5016 !important;
}

.link-primary:hover,
.link-primary:focus,
[data-pc-preset=preset-1] .link-primary:hover,
[data-pc-preset=preset-1] .link-primary:focus {
  color: #1B3409 !important;
}

/* ========================================
   AVATAR
   ======================================== */
.avtar.bg-grd-primary {
  background: linear-gradient(135deg, #2D5016, #4A7C2E) !important;
}

.avtar.bg-grd-success {
  background: linear-gradient(135deg, #4A7C2E, #5B8C3E) !important;
}

.avtar.bg-light-primary {
  background: #E8F0E0 !important;
  color: #2D5016 !important;
}

/* ========================================
   BREADCRUMB
   ======================================== */
.breadcrumb-item a {
  color: var(--sipra-primary) !important;
}

.breadcrumb-item.active {
  color: #666 !important;
}

/* ========================================
   ACCORDION
   ======================================== */
[data-pc-preset=preset-1] .accordion,
.accordion {
  --bs-accordion-btn-focus-border-color: #2D5016 !important;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem rgba(45, 80, 22, 0.25) !important;
  --bs-accordion-active-color: #2D5016 !important;
  --bs-accordion-active-bg: #E8F0E0 !important;
}

/* ========================================
   PAGINATION
   ======================================== */
.page-item.active .page-link {
  background-color: var(--sipra-primary) !important;
  border-color: var(--sipra-primary) !important;
}

.page-link {
  color: var(--sipra-primary) !important;
}

.page-link:hover {
  color: var(--sipra-primary-dark) !important;
  background-color: #E8F0E0 !important;
}

/* ========================================
   NAV TABS & PILLS
   ======================================== */
.nav-pills .nav-link.active {
  background-color: var(--sipra-primary) !important;
}

.nav-tabs .nav-link.active {
  border-bottom-color: var(--sipra-primary) !important;
  color: var(--sipra-primary) !important;
}

/* ========================================
   SIPRA CUSTOM COMPONENTS
   ======================================== */

/* Military Status Indicators */
.status-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-right: 6px;
}

.status-dot.aktif { background: #4A7C2E; }
.status-dot.cuti { background: #B8860B; }
.status-dot.sakit { background: #D4A017; }
.status-dot.operasi { background: #2E6B4F; }
.status-dot.pensiun { background: #666; }
.status-dot.gugur { background: #8B0000; }

/* Dashboard Stat Card */
.sipra-stat-card {
  border-radius: 16px !important;
  overflow: hidden;
  position: relative;
}

.sipra-stat-card::before {
  content: '';
  position: absolute;
  top: -20px;
  right: -20px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
}

.sipra-stat-card::after {
  content: '';
  position: absolute;
  bottom: -30px;
  right: 20px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
}

.sipra-stat-card .stat-icon {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  font-size: 24px;
}

.sipra-stat-card .stat-value {
  font-size: 28px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.sipra-stat-card .stat-label {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 4px;
}

/* Quick Action Buttons */
.sipra-quick-action {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(200, 216, 184, 0.3);
  transition: all 0.3s ease;
  text-decoration: none;
  color: var(--sipra-dark);
}

.sipra-quick-action:hover {
  border-color: var(--sipra-primary);
  box-shadow: 0 4px 12px rgba(45, 80, 22, 0.15);
  transform: translateY(-2px);
  color: var(--sipra-primary);
}

.sipra-quick-action .action-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: #E8F0E0;
  color: var(--sipra-primary);
  font-size: 18px;
  flex-shrink: 0;
}

/* Notification Badge */
.sipra-notification-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  background: #8B0000;
  color: #ffffff;
  border-radius: 50%;
  border: 2px solid #ffffff;
}

/* Military rank display */
.rank-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  background: #E8F0E0;
  color: var(--sipra-dark);
  border: 1px solid rgba(200, 216, 184, 0.5);
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 1024px) {
  .pc-sidebar {
    box-shadow: 4px 0 20px rgba(27, 52, 9, 0.4) !important;
  }
}

@media (max-width: 768px) {
  .sipra-stat-card .stat-value {
    font-size: 22px;
  }
  
  .auth-main .card {
    margin: 15px !important;
    border-radius: 12px !important;
  }
}

/* ========================================
   PRINT STYLES
   ======================================== */
@media print {
  .pc-sidebar,
  .pc-header,
  .pc-footer,
  .btn,
  .no-print {
    display: none !important;
  }
  
  .pc-container {
    margin-left: 0 !important;
  }
  
  .card {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
  }
  
  body {
    background: #ffffff !important;
  }
}