/* ==========================================================================
   E-Klinik Admin — Compatibility stylesheet (Modern-SIMRS)
   --------------------------------------------------------------------------
   File ini mempertahankan utility & binding layout yang dipakai oleh
   view-plugin dan skrip global (kontrak class lama). Gaya utama modern
   berada di themes/modern-simrs/assets/css/modern-simrs.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Spacing utilities (kontrak plugin: pakai m-*, p-*, margin-*, dsb.)
   -------------------------------------------------------------------------- */
.m-xs { margin: 5px !important; }        .m-sm { margin: 10px !important; }
.m-md { margin: 20px !important; }       .m-lg { margin: 40px !important; }
.m-xl { margin: 60px !important; }

.m-t-xs { margin-top: 5px !important; }  .m-t-sm { margin-top: 10px !important; }
.m-t-md { margin-top: 20px !important; } .m-t-lg { margin-top: 40px !important; }
.m-t-xl { margin-top: 60px !important; }
.m-b-xs { margin-bottom: 5px !important;} .m-b-sm { margin-bottom: 10px !important; }
.m-b-md { margin-bottom: 20px !important;} .m-b-lg { margin-bottom: 40px !important; }
.m-b-xl { margin-bottom: 60px !important; }
.m-l-xs { margin-left: 5px !important; } .m-l-sm { margin-left: 10px !important; }
.m-l-md { margin-left: 20px !important; } .m-l-lg { margin-left: 40px !important; }
.m-l-xl { margin-left: 60px !important; }
.m-r-xs { margin-right: 5px !important;} .m-r-sm { margin-right: 10px !important; }
.m-r-md { margin-right: 20px !important;} .m-r-lg { margin-right: 40px !important; }
.m-r-xl { margin-right: 60px !important; }

.m-x-xs { margin-left: 5px !important; margin-right: 5px !important; }
.m-x-sm { margin-left: 10px !important; margin-right: 10px !important; }
.m-x-md { margin-left: 20px !important; margin-right: 20px !important; }
.m-x-lg { margin-left: 40px !important; margin-right: 40px !important; }
.m-x-xl { margin-left: 60px !important; margin-right: 60px !important; }
.m-y-xs { margin-top: 5px !important; margin-bottom: 5px !important; }
.m-y-sm { margin-top: 10px !important; margin-bottom: 10px !important; }
.m-y-md { margin-top: 20px !important; margin-bottom: 20px !important; }
.m-y-lg { margin-top: 40px !important; margin-bottom: 40px !important; }
.m-y-xl { margin-top: 60px !important; margin-bottom: 60px !important; }

.p-xs { padding: 5px !important; }        .p-sm { padding: 10px !important; }
.p-md { padding: 20px !important; }       .p-lg { padding: 40px !important; }
.p-xl { padding: 60px !important; }

.p-t-xs { padding-top: 5px !important; }  .p-t-sm { padding-top: 10px !important; }
.p-t-md { padding-top: 20px !important; } .p-t-lg { padding-top: 40px !important; }
.p-t-xl { padding-top: 60px !important; }
.p-b-xs { padding-bottom: 5px !important;} .p-b-sm { padding-bottom: 10px !important; }
.p-b-md { padding-bottom: 20px !important;} .p-b-lg { padding-bottom: 40px !important; }
.p-b-xl { padding-bottom: 60px !important; }
.p-l-xs { padding-left: 5px !important; } .p-l-sm { padding-left: 10px !important; }
.p-l-md { padding-left: 20px !important; } .p-l-lg { padding-left: 40px !important; }
.p-l-xl { padding-left: 60px !important; }
.p-r-xs { padding-right: 5px !important;} .p-r-sm { padding-right: 10px !important; }
.p-r-md { padding-right: 20px !important;} .p-r-lg { padding-right: 40px !important; }
.p-r-xl { padding-right: 60px !important; }

.p-x-xs { padding-left: 5px !important; padding-right: 5px !important; }
.p-x-sm { padding-left: 10px !important; padding-right: 10px !important; }
.p-x-md { padding-left: 20px !important; padding-right: 20px !important; }
.p-x-lg { padding-left: 40px !important; padding-right: 40px !important; }
.p-x-xl { padding-left: 60px !important; padding-right: 60px !important; }
.p-y-xs { padding-top: 5px !important; padding-bottom: 5px !important; }
.p-y-sm { padding-top: 10px !important; padding-bottom: 10px !important; }
.p-y-md { padding-top: 20px !important; padding-bottom: 20px !important; }
.p-y-lg { padding-top: 40px !important; padding-bottom: 40px !important; }
.p-y-xl { padding-top: 60px !important; padding-bottom: 60px !important; }

.margin-tiny { margin: 2px !important; }   .margin-small { margin: 6px !important; }
.margin-medium { margin: 12px !important; } .margin-large { margin: 24px !important; }

.no-margin { margin: 0 !important; }
.no-padding { padding: 0 !important; }
.no-top-margin { margin-top: 0 !important; }
.no-bottom-margin { margin-bottom: 0 !important; }

/* --------------------------------------------------------------------------
   Modal sizing (kontrak: menuModal fullscreen, modal-xl, modal-full)
   -------------------------------------------------------------------------- */
.modal-fullscreen .modal-dialog { width: 96%; margin: 10px auto; }
@media (min-width: 1200px) { .modal-fullscreen .modal-dialog { width: 80%; } }
.modal-full .modal-dialog, .modal-xl .modal-dialog { width: 90%; margin: 24px auto; }
@media (min-width: 992px) { .modal-full .modal-dialog, .modal-xl .modal-dialog { width: 80%; } }

/* --------------------------------------------------------------------------
   Badge error (kontrak plugin)
   -------------------------------------------------------------------------- */
.badge-error { background: #dc2626; color: #fff; border-radius: 12px; padding: 3px 8px; font-weight: 600; }

/* --------------------------------------------------------------------------
   Binding layout lama yang masih dipakai sebagian view plugin
   -------------------------------------------------------------------------- */
.hidden_navbar_brand { display: none !important; }
.options-hidden, .disable_search, .multiple { }

/* Icon-bar & navbar icon top (dipakai beberapa view plugin) */
.icon-bar {
  position: fixed;
  right: 0; bottom: 0; left: 0;
  z-index: 900;
  display: flex;
  justify-content: space-around;
  background: #0f172a;
  border-top: 1px solid rgba(255,255,255,.1);
}
.icon-bar a {
  padding: 12px 18px;
  color: #cbd5e1;
  font-size: 18px;
  text-align: center;
}
.icon-bar a:hover { color: #14b8a6; background: rgba(255,255,255,.06); }

.navbar-icon-top .navbar-nav>li>a>.fa,
.navbar-icon-top .navbar-nav>li>a>.glyphicon { display: block; position: relative; width: 36px; font-size: 22px; margin: 0 auto 2px; }
.navbar-icon-top .navbar-nav>li>a>.fa>.badge,
.navbar-icon-top .navbar-nav>li>a>.glyphicon>.badge { position: absolute; right: 0; top: -8px; }
@media (min-width: 768px) {
  .navbar-icon-top .navbar-brand { padding: 22px 15px; }
  .navbar-icon-top .navbar-nav>li>a { text-align: center; display: table-cell; height: 66px; vertical-align: middle; padding: 12px 16px; }
}

.menu-top .navbar-nav>li>a { font-size: 13px; }
.mobile-fixed-top { position: fixed; top: 0; left: 0; right: 0; }

/* --------------------------------------------------------------------------
   Tiny compatibility (TL UI lama, biar tak ada regresi)
   -------------------------------------------------------------------------- */
.content-title a { text-decoration: none; }
.content-title small { font-weight: 400; }

#clock { font-variant-numeric: tabular-nums; }

/* Selectator fallback bila theme lain dipakai */
.selectator_element { overflow: hidden; }