/* Chang PM modern system theme — screen only, keeps all print/PDF layouts unchanged. */
@media screen {
  :root {
    --pm-navy: #13233c;
    --pm-navy-2: #1d3151;
    --pm-blue: #2563eb;
    --pm-blue-soft: #eff6ff;
    --pm-green: #059669;
    --pm-amber: #f59e0b;
    --pm-red: #e11d48;
    --pm-bg: #f3f6fa;
    --pm-surface: #ffffff;
    --pm-text: #172033;
    --pm-muted: #64748b;
    --pm-line: #e5eaf1;
    --pm-radius: 16px;
    --pm-shadow: 0 8px 28px rgba(15, 35, 65, .07);
  }

  html { background: var(--pm-bg); }
  body {
    color: var(--pm-text);
    background: radial-gradient(circle at 92% 0, #eaf2ff 0, transparent 24rem), var(--pm-bg) !important;
    font-family: 'Sarabun', system-ui, sans-serif !important;
  }
  body > .container-fluid { max-width: 100%; }
  .container-fluid > .row { min-height: 100vh; }
  .col-md-10.p-3, .col-md-10.p-md-4 { padding: 24px !important; }

  .bg-white.rounded-4.shadow-sm,
  .content-card,
  .table-card,
  .chart-card,
  .card:not(.card-stat) {
    border: 1px solid rgba(226, 232, 240, .85) !important;
    border-radius: var(--pm-radius) !important;
    box-shadow: var(--pm-shadow) !important;
    background: rgba(255,255,255,.96) !important;
  }
  .bg-white.rounded-4.shadow-sm { padding: 18px 22px !important; }
  .card-header {
    border-bottom: 1px solid var(--pm-line) !important;
    border-radius: var(--pm-radius) var(--pm-radius) 0 0 !important;
    background: transparent !important;
  }
  .card-header h4, .card-header h5, .card-header h6 { letter-spacing: -.015em; }

  .card-stat {
    position: relative;
    overflow: hidden;
    min-height: 138px;
    border: 0 !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 30px rgba(15,35,65,.12) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
  }
  .card-stat::after {
    content: '';
    position: absolute;
    width: 130px;
    height: 130px;
    right: -35px;
    top: -45px;
    border-radius: 50%;
    background: rgba(255,255,255,.14);
  }
  .card-stat:hover { transform: translateY(-3px) !important; box-shadow: 0 16px 36px rgba(15,35,65,.16) !important; }
  .card-stat.bg-primary { background: linear-gradient(135deg,#2563eb,#4f8cff) !important; }
  .card-stat.bg-warning { background: linear-gradient(135deg,#f59e0b,#fbbf24) !important; }
  .card-stat.bg-danger { background: linear-gradient(135deg,#e11d48,#fb7185) !important; }

  .chart-card .card-body { position: relative; min-height: 300px; padding: 16px 20px 22px; }
  .chart-card canvas { max-height: 330px !important; }
  .chart-card { min-height: 410px; }

  .table { --bs-table-bg: transparent; margin-bottom: 0; }
  .table > :not(caption) > * > * { padding: .82rem .75rem; border-bottom-color: var(--pm-line); }
  .table thead th {
    color: #41516b;
    background: #f8fafc !important;
    border-bottom: 1px solid #dce3ec;
    font-size: .88rem;
    font-weight: 600;
    vertical-align: middle;
    white-space: nowrap;
  }
  .table tbody tr { transition: background-color .16s ease; }
  .table tbody tr:hover { background: #f8fbff !important; }

  .btn {
    min-height: 38px;
    border-radius: 10px !important;
    font-weight: 600;
    box-shadow: none !important;
    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
  }
  .btn:hover { transform: translateY(-1px); }
  .btn-primary { background: var(--pm-blue); border-color: var(--pm-blue); }
  .btn-success { background: var(--pm-green); border-color: var(--pm-green); }
  .btn-danger { background: var(--pm-red); border-color: var(--pm-red); }
  .btn-group > .btn { border-radius: 0 !important; }
  .btn-group > .btn:first-child { border-radius: 9px 0 0 9px !important; }
  .btn-group > .btn:last-child { border-radius: 0 9px 9px 0 !important; }

  .form-control, .form-select, .input-group-text {
    min-height: 40px;
    border-color: #d9e1eb;
    border-radius: 10px;
    background-color: #fff;
  }
  .form-control:focus, .form-select:focus {
    border-color: #7aa7f8;
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
  }
  .form-label { color: #34445e; font-weight: 600; }
  .badge { padding: .42em .65em; border-radius: 7px; font-weight: 600; }
  .alert { border: 0; border-radius: 12px; box-shadow: 0 4px 16px rgba(15,35,65,.05); }
  .modal-content { border: 0; border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.22); }
  .modal-header, .modal-footer { border-color: var(--pm-line); }
  .pagination .page-link { margin: 0 3px; border: 0; border-radius: 9px !important; color: var(--pm-blue); }

  .desktop-sidebar {
    background: linear-gradient(180deg,var(--pm-navy),#17263e 70%,#111d31) !important;
    box-shadow: 7px 0 25px rgba(15,23,42,.08);
  }
  .desktop-sidebar .sidebar-links a { border: 1px solid transparent; }
  .desktop-sidebar .sidebar-links a:hover { background: rgba(255,255,255,.07); color: #fff; }
  .desktop-sidebar .sidebar-links a.active {
    color: #fff;
    background: linear-gradient(90deg,rgba(37,99,235,.36),rgba(37,99,235,.16));
    border-color: rgba(96,165,250,.2);
  }

  @media (max-width: 767.98px) {
    .col-md-10.p-3, .col-md-10.p-md-4 { padding: 14px !important; }
    .bg-white.rounded-4.shadow-sm { padding: 14px 16px !important; }
    .card-stat { min-height: 110px; }
    .chart-card { min-height: 360px; }
    .chart-card .card-body { min-height: 260px; }
    .table > :not(caption) > * > * { padding: .7rem .6rem; }
  }
}

/* MODERN_BUTTON_CENTER_V1 */
@media screen {
  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    line-height: 1.2;
    text-align: center;
  }
}
