/* =========================================
   MODAL
   ========================================= */

.modal-dialog {
  max-width: 95vw !important;
  width: 95vw !important;

}

.modal-content {
  width: 100% !important;
  padding-top: 0px !important;
}



.modal-body {
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.modal-body .entity-form,
.modal-body .tab-content,
.modal-body .form-table {
  width: 100% !important;
  max-width: 100% !important;
}

.modal-header .modal-title {
  font-size: 14px !important;
  font-weight: 600;
  margin-top: 2px;
  line-height: 1.3;
  color: #111827;
}

.modal-header {
  padding: 6px 12px !important;
  min-height: unset !important;
  background-color: #f59e0b;
  border-bottom: 0px;
}

.crmEntityFormView,
.entitylist,
.modal-content,
.popover-content {
  background-color: #ffffff;
  color: #000000;
  border: 0px solid #f2f2f2 !important;
}

.crmEntityFormView,
.modal-content,
.popover-content {
  background-color: #ffffff !important;
  color: #000000;
  border: 0px solid #f2f2f2 !important;
}

.crmEntityFormView .form-control.readonly,
.crmEntityFormView .form-control[readonly][disabled],
.form-readonly .form-control {
  padding-left: 5px;
  background: #FaFaFa !important;
  border-radius: 5px;
}

@media (max-width: 767px) {

  .crmEntityFormView .tab .tab-column:last-child,
  .crmEntityFormView .tab fieldset:last-child,
  .crmEntityFormView .tab:last-child {
    margin-bottom: 0;
    padding: 10px;
  }
}

/* =========================================
   HEADER & FOOTER DAN CONTENCT
   ========================================= */


#content-container,
.wrapper-body {
  padding: 0px !important;
  margin: 0px !important;
  max-width: 100% !important;
  width: 100% !important;
}

.page-content {
  margin-top: 24px;
  padding: 24px;
}

.navbar>.container,
.navbar .custom-container {
  max-width: 100% !important;
}

@media (min-width: 1200px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {
    max-width: 100%;
  }
}


/* ===============================
   ENTITY FORM VIEW
   =============================== */

.crmEntityFormView .tab {
  margin-bottom: 20px;
  width: 100%;
  margin-top: 20px;
}

.crmEntityFormView .actions {
  border-top: 1px solid #e5e5e5;
  padding: 20px 20px 20px 0px;
  margin-left: 20px;
}


/* ===============================
   ENTITY
   =============================== */

.entity-form th,
.entity-form label {
  font-size: 12.5px !important;
  font-weight: 600;
}

.entity-form input,
.entity-form select,
.entity-form textarea {
  font-size: 13px !important;
}

.entity-form td span,
.entity-form td div {
  font-size: 11px !important;
}

.entitylist table,
.crmEntityFormView table {
  font-size: 10px !important;
}

.entitylist table thead th,
.crmEntityFormView table thead th {
  font-size: 16px !important;
  font-weight: 700;
}

.entitylist table thead th,
.entitylist table thead th a {
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: none;
}

.entitylist table tbody td,
.crmEntityFormView table tbody td {
  font-size: 11px !important;
  line-height: 1.4;
}

/* HOMEPAGE */

.welcome-block h2 {
  margin-bottom: 8px;
}

.welcome-block h3 {
  margin-top: 0;
  margin-bottom: 12px;
}

.welcome-block .button1 {
  margin-top: 0;
}

/* ===============================
   ENTITY LIST FILTER – CLEAN UI
   =============================== */

.entitylist-filter {
  background: #fafafa;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  /* padding: 12px 12px 12px; */
}

.entitylist-filter .card {
  border: none;
  box-shadow: none;
}

.entitylist-filter-option-group-label.h4 {
  font-size: 12px !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #444;
  margin-bottom: 6px;
}

.entitylist-filter-option-group ul {
  margin: 0;
  padding-left: 0;
  padding-right: 0;
}

.entitylist-filter-option-group li {
  margin-bottom: 0px;
}

.entitylist-filter-option-group label {
  font-size: 11px;
  font-weight: 400;
  color: #333;
  cursor: pointer;
}

.entitylist-filter-option-group input[type="checkbox"] {
  transform: scale(0.9);
  margin-right: 6px;
}

.entitylist-filter-option-group label {
  display: inline-block !important;
  line-height: 1 !important;
}

.entitylist-filter button,
.entitylist-filter .btn {
  width: 100%;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 8px;
}

.entitylist-filter,
.entitylist-filter * {
  scrollbar-gutter: stable both-edges;
}

.entitylist-filter-option-group {
  position: relative;
}

.entitylist-filter-option-group::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 16px;
  height: 100%;
  pointer-events: none;
}

.entitylist-filter-option-group ul,
.entitylist-filter-option-group li,
.entitylist-filter-option-group label {
  padding-right: 16px !important;
  box-sizing: border-box;
}

/* ===============================
   FINAL FIX – SCROLLBAR KE KANAN
   =============================== */

/* Container filter – beri ruang kanan */
.entitylist-filter-option-group {
  padding-right: 20px;
}

/* Area yang benar-benar scroll */
.entitylist-filter-option-group ul {
  margin-right: -20px;
  /* tarik area scroll ke kanan */
  padding-right: 20px;
  /* jarak aman teks */
  box-sizing: border-box;
}

/* Pastikan teks & checkbox aman */
.entitylist-filter-option-group li,
.entitylist-filter-option-group label {
  white-space: wrap;
}


/* ===================================== */
/* Samakan tinggi tombol search icon dengan search input */
/* ===================================== */
.entitylist-search button {
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===============================
   PROFESSIONAL ENTITY LIST UI
   =============================== */

.entitylist table thead th {
  background: #F4F6F8;
  font-size: 12px;
  font-weight: 700;
  color: #374151;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid #e5e7eb;
  padding-top: 20px;
  padding-right: 5px;
  padding-bottom: 20px;
  padding-left: 5px;
}

.entitylist table tbody td {
  font-size: 8px;
  color: #000000;
  padding: 5px 5px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: top;
  margin-bottom: 20px;
}

/* .entitylist table thead th a {
  color: #ffffff !important;
} */

.entitylist table tbody tr:hover {
  background: #f9fafb;
}

.entitylist table td:first-child {
  font-weight: 600;
  color: #111827;
}

.entitylist table td .dropdown-toggle {
  border: 1px solid #f59e0b;
  border-radius: 8px;
  padding: 6px 10px;
  background: #fff;
}

.entitylist table td .dropdown-toggle:hover {
  background: #fef3c7;
}

/* ===== SEARCH BOX ===== */
.entitylist-search input[type="text"] {
  border-radius: 10px;
  border: 1px solid #d97706;
  padding: 8px 12px;
  font-size: 10px;
  color: #888;

}

/* Search button */
.entitylist-search button {
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid #d97706;
}

.entitylist-search button:hover {
  background: none;
  border: 1px solid #d97706;
}

/* ===============================
   POWER PAGES SEARCH – FINAL FIX
   =============================== */

/* 1️⃣ MATIKAN FIELDSET BAWAAN */
.entitylist-search fieldset,
.entitylist-search legend {
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 2️⃣ BORDER DI CONTAINER UTAMA */
.entitylist-search {
  border: 2px solid #f59e0b !important;
  border-radius: 10px;
  padding: 2px;
  background: #fff;
}

/* 3️⃣ HILANGKAN BORDER INTERNAL */
.entitylist-search input,
.entitylist-search button,
.entitylist-search .input-group,
.entitylist-search .form-control {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent;
}

/* 4️⃣ INPUT */
.entitylist-search input[type="text"] {
  padding: 10px 14px;
  font-size: 10px;
  color: #888;

}

/* 5️⃣ BUTTON */
.entitylist-search button {
  padding: 10px 16px;
  height: 25px;
}

/* 6️⃣ FOCUS STATE */
.entitylist-search:focus-within {
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.2);
}

.entitylist-search,
.entitylist-search input,
.entitylist-search button {
  height: 25px !important;
  margin-right: 5px;
}

/* ================================================= */
/* Menyembunyikan tombol Apply secara global */
/* ================================================ */
.btn-entitylist-filter-submit {
  display: none !important;
}


/* =========================================
   FORCE ENTITY LIST & FILTER SYNC LAYOUT
   ========================================= */

/* Jadikan row sebagai flex NO-WRAP */
.entitylist .row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-start;
}

/* ================= FILTER COLUMN ================= */

.col-lg-3.filter-vertical {
  flex: 0 0 280px !important;
  max-width: 280px !important;
  width: 280px !important;
}

/* ================= ENTITY LIST COLUMN ================= */

.col-lg-9 {
  flex: 1 1 auto !important;
  max-width: unset !important;
  width: auto !important;
  min-width: 0 !important;
}

/* =================================================
   FORCE SCROLLBAR NEMPEL KE TEPI FILTER (FINAL)
   ================================================= */

.col-lg-3.filter-vertical,
.col-lg-3.filter-vertical .entitylist-filter,
.col-lg-3.filter-vertical .card-body {
  box-sizing: border-box !important;
}

#entitylist-filters {
  width: 100% !important;
  box-sizing: border-box !important;
  padding-right: 0 !important;
  margin-right: 0 !important;
  overflow-y: auto !important;
  max-height: calc(100vh - 260px);
}

#entitylist-filters>li {
  width: auto !important;
  padding: 0px !important
}

.entitylist-filter,
.entitylist-filter * {
  scrollbar-gutter: auto !important;
}

/* =================================================
   FINAL FIX: KILL INNER SCROLL (MAC SAFE)
   ================================================= */

.col-lg-3.filter-vertical .entitylist-filter,
.col-lg-3.filter-vertical .card-body {
  overflow-y: auto !important;
  max-height: auto !important;
}

.entitylist-filter-option-group-box-overflow,
.entitylist-filter-option-group,
#entitylist-filters,
#entitylist-filters * {
  overflow: visible !important;
  max-height: none !important;
}

.entitylist-filter,
.entitylist-filter * {
  scrollbar-gutter: auto !important;
}

/* =====================================
   ENTITY LIST LINK FONT SIZE
   ===================================== */

.entitylist a,
.entitylist table a,
.view-grid table a,
.details-link,
.details-link.has-tooltip.launch-modal {
  font-size: 11px !important;
}

.entitylist table a {
  line-height: 1.3;
}

/* =====================================
   ENTITY LIST LINK FONT SIZE = 12px
   (HEADER + BODY)
   ===================================== */

.entitylist table tbody a,
.view-grid table tbody a,
.details-link,
.details-link.has-tooltip.launch-modal {
  font-size: 12px !important;
  line-height: 1.3;
}

.entitylist table thead th a,
.view-grid table thead th a,
.entitylist th a[role="button"] {
  font-size: 12px !important;
  line-height: 1.2;
  font-weight: 600;
}


/* =====================================
   ENTITY LIST SEARCH INPUT STYLE
   ===================================== */

.entitylist-search input.query.form-control,
.view-search input.query.form-control {
  font-size: 12px !important;
  color: #666 !important;
}

.entitylist-search input.query.form-control::placeholder,
.view-search input.query.form-control::placeholder {
  font-size: 12px !important;
  color: #999 !important;
  opacity: 1;
}

.entitylist-search input.query.form-control::-webkit-input-placeholder {
  font-size: 12px !important;
  color: #999 !important;
}



/* =================================================
   PAGINATION – HARD OVERRIDE (NO BLUE AT ALL)
   ================================================= */

.entitylist .pagination {
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
}

.entitylist .pagination .page-link {
  min-width: 34px;
  height: 34px;
  line-height: 34px;
  padding: 0;

  font-size: 13px;
  font-weight: 500;

  color: #374151 !important;
  background-color: #ffffff !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px;

  box-shadow: none !important;
  outline: none !important;

  transition: all 0.15s ease;
}

.entitylist .pagination .page-link:hover {
  background-color: #f3f4f6 !important;
  color: #111827 !important;
}

.entitylist .pagination .page-item.active .page-link,
.entitylist .pagination .page-item.active .page-link:hover,
.entitylist .pagination .page-item.active .page-link:focus {
  background-color: #374151 !important;
  color: #ffffff !important;
  border-color: #374151 !important;
  box-shadow: none !important;
}

.entitylist .pagination .page-link:focus,
.entitylist .pagination .page-link:active {
  background-color: #e5e7eb !important;
  color: #111827 !important;
  border-color: #9ca3af !important;
  box-shadow: none !important;
  outline: none !important;
}

.entitylist .pagination .page-item.disabled .page-link {
  background-color: #f9fafb !important;
  color: #9ca3af !important;
  border-color: #e5e7eb !important;
  cursor: not-allowed;
}

/* ===============================
   TEXTAREA AUTO HEIGHT – MODAL FORM
   =============================== */

.crmEntityFormView textarea.form-control {
  min-height: 100px;
  height: auto !important;
  overflow-y: auto;
  resize: vertical;
  line-height: 1.4;
}

/* =================================================
   ENTITY LIST – FINAL GLOBAL (STABLE & CLEAN)
   ================================================= */

.entitylist {
  overflow-x: auto !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch;
}

.entitylist table {
  width: max-content !important;
  min-width: unset !important;
  table-layout: fixed !important;
}

.entitylist thead th {
  white-space: nowrap !important;
  min-width: 100px;
}

.entitylist thead td {
  width: 100px;
  min-width: 100px;
  vertical-align: top;
}

.entitylist .table-responsive,
.entitylist .table-responsive table {
  overflow: visible !important;
}

/* =====================================
   ENTITY LIST FIX HEIGHT 1000px
   ===================================== */

.entitylist {
  max-height: 1000px;
  overflow-y: auto !important;
  overflow-x: auto !important;
}

.entitylist thead th {
  position: sticky;
  top: 0;
  background: #F4F6F8;
  z-index: 5;
}

.entitylist table th:first-child,
.entitylist table td:first-child {
  position: sticky;
  left: 0;
  white-space: nowrap !important;
  background: #F4F6F8;
  z-index: 5;
}

.entitylist table th:first-child {
  z-index: 6;
}


/* =====================================================
   FINAL FIX — POWER PAGES MODAL (MOBILE SAFE)
   Portrait + Landscape
   ===================================================== */

/* 1️⃣ MODAL HARUS RELATIF KE VIEWPORT (BUKAN KE LIST) */
.modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
}

/* 2️⃣ MOBILE ONLY — PUTUS SEMUA CONTAINING BLOCK */
@media (max-width: 768px) {

  /* Lepaskan modal dari layout entity list */
  .entitylist,
  .entitylist .row,
  .col-lg-3.filter-vertical,
  .col-lg-9,
  .view-grid {
    position: static !important;
    overflow: visible !important;
    transform: none !important;
  }

  /* 3️⃣ MODAL FULLSCREEN */
  .modal-dialog {
    margin: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    max-width: 100vw !important;
  }

  .modal-content {
    height: 100dvh !important;
    border-radius: 0 !important;
  }

  /* 4️⃣ HEADER & FOOTER TETAP TERLIHAT */
  .modal-header,
  .modal-footer {
    flex-shrink: 0;
  }

  /* 5️⃣ SATU-SATUNYA AREA SCROLL = MODAL BODY */
  .modal-body {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* 6️⃣ MATIKAN INTERAKSI BACKGROUND */
  body.modal-open .entitylist,
  body.modal-open .filter-vertical,
  body.modal-open .page-content,
  body.modal-open header,
  body.modal-open footer {
    pointer-events: none;
  }
}


/* =================================================
   MOBILE LAYOUT FIX – ENTITY LIST + FILTER
   ================================================= */

@media (max-width: 768px) {

  .entitylist {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .entitylist .row {
    flex-direction: column !important;
  }

  .col-lg-3.filter-vertical {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 12px;
  }

  .col-lg-9 {
    width: 100% !important;
    max-width: 100% !important;
  }

  .view-grid,
  .table-responsive {
    overflow-x: auto !important;
  }

  .entitylist-search,
  .entitylist-actions {
    flex-direction: column !important;
    gap: 8px;
  }

  .entitylist-actions button,
  .entitylist-actions a {
    width: 100% !important;
  }

  .entitylist table th a,
  .entitylist table td {
    font-size: 12px !important;
  }

  /* DEFAULT: entity list boleh scroll */
  .entitylist {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* SAAT MODAL OPEN → MATIKAN */
  body.modal-open .entitylist {
    overflow: visible !important;
  }

  /* Table tetap patuh layar */
  .entitylist table {
    width: 100%;
    table-layout: auto;
  }

  .entitylist th {
    white-space: nowrap;
    font-size: 12px;
  }

  .entitylist td {
    white-space: normal;
    word-break: break-word;
    font-size: 12px;
  }
}


/* =====================================
   SAMAKAN STYLE TOMBOL ACTION ENTITYLIST
   (Download, Buat Baru, Daftar Persetujuan)
   ===================================== */

.view-toolbar .btn,
.view-toolbar a.btn {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;

  height: 36px;
  padding: 6px 14px;

  font-size: 13px !important;
  font-weight: 500;

  border-radius: 6px;
  line-height: 1;
}

/* Warna primary konsisten */
.view-toolbar .btn-primary {
  background-color: #31708F;
  /* samakan dengan Download */
  border-color: #31708F;
  color: #fff;
}

.view-toolbar .btn-primary:hover {
  background-color: #09494f;
  border-color: #09494f;
  color: #fff;
}

/* Hilangkan efek beda tinggi */
.view-toolbar .btn i,
.view-toolbar .btn span {
  line-height: 1;
}

.view-toolbar .btn-create-action::before {
  content: "＋";
  font-weight: bold;
}


/* SUBGRID MODAL */

/* HANYA modal form insert (layer ke-2 / subgrid) */
.modal.modal-form.modal-form-insert.show .modal-header {
  position: relative;
}

.modal.modal-form.modal-form-insert.show .modal-header .form-close {
  position: absolute !important;
  top: 35% !important;
  right: 16px !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
}

/* ===== FIX CLOSE BUTTON LOOKUP MODAL (LAYER 2) ===== */

/* Pastikan modal lookup di atas segalanya */
.modal[aria-modal="true"] {
  z-index: 1055 !important;
}

/* Header modal lookup */
.modal[aria-modal="true"] .modal-header {
  position: relative;
  z-index: 1056 !important;
}

/* Tombol close (X) */
.modal[aria-modal="true"] .form-close {
  position: absolute !important;
  top: 3px !important;
  right: 15px !important;
  z-index: 1060 !important;
  pointer-events: auto !important;
}


html[dir=ltr] .crmEntityFormView .cell .field-label {
  float: left;
  padding-bottom: 5px;
  background: none !important;
}




/* =====================================
   BUTTON UNTUK LINK DOKUMEN
   ===================================== */

/* ============================= */
/* ENTITY LIST */
/* ============================= */

.entity-grid td[data-attribute="crc59_linkdokumen"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
}

.entity-grid td[data-attribute="crc59_linkdokumen"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 600;
  display: inline-block;
  line-height: 1.2;
  width: 100%;
  text-align: center !important;
}

.entity-grid td[data-attribute="crc59_linkdokumen"] a:hover::before {
  background-color: #157347;
}

.entity-grid td[data-attribute^="crc59_link"] a {
  display: inline-block;
  max-width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

.entity-grid td[data-attribute="crc59_page"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
}

.entity-grid td[data-attribute="crc59_page"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 600;
  display: inline-block;
  line-height: 1.2;
  width: 100%;
  text-align: center !important;
}

.entity-grid td[data-attribute="crc59_page"] a:hover::before {
  background-color: #157347;
}

.entity-grid td[data-attribute="crc59_page"] a {
  display: inline-block;
  max-width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}


.entity-grid td[data-attribute="crc59_fpalinkdokumen"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
}

.entity-grid td[data-attribute="crc59_fpalinkdokumen"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 600;
  display: inline-block;
  line-height: 1.2;
  width: 100%;
  text-align: center !important;
}

.entity-grid td[data-attribute="crc59_fpalinkdokumen"] a:hover::before {
  background-color: #157347;
}


.entity-grid td[data-attribute="crc59_fpalinkdokumen"] a {
  display: inline-block;
  max-width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

.entity-grid td[data-attribute="new_linkdokumen"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
}

.entity-grid td[data-attribute="new_linkdokumen"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 600;
  display: inline-block;
  line-height: 1.2;
  width: 100%;
  text-align: center !important;
}

.entity-grid td[data-attribute="new_linkdokumen"] a:hover::before {
  background-color: #157347;
}

.entity-grid td[data-attribute="new_linkdokumen"] a {
  display: inline-block;
  max-width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}


.entity-grid td[data-attribute="crc59_linkupload"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
}

.entity-grid td[data-attribute="crc59_linkupload"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 600;
  display: inline-block;
  line-height: 1.2;
  width: 100%;
  text-align: center !important;
}

.entity-grid td[data-attribute="crc59_linkupload"] a:hover::before {
  background-color: #157347;
}

.entity-grid td[data-attribute^="crc59_linkupload"] a {
  display: inline-block;
  max-width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}





/* ============================= */
/* LINK DOKUMEN – ENTITY FORM / MODAL */
/* ============================= */


.entity-form .control a.text-primary:not(:first-of-type),
.modal .control a.text-primary:not(:first-of-type) {
  display: none !important;
}

.entity-form .control a.text-primary:first-of-type,
.modal .control a.text-primary:first-of-type {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
  display: inline-block;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.entity-form .control a.text-primary:first-of-type::before,
.modal .control a.text-primary:first-of-type::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 10px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 600;
  line-height: 1.5;
  display: inline-block;
  width: 100%;
}

.entity-form .control a.text-primary:first-of-type:hover::before,
.modal .control a.text-primary:first-of-type:hover::before {
  background-color: #157347;
}

/* ============================================= */
/* SUBGRID – LINK DOKUMEN JADI TOMBOL */
/* ============================================= */

.entity-form td[data-attribute="crc59_fpalinkdokumen"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.entity-form td[data-attribute="crc59_fpalinkdokumen"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  display: inline-block;
}

.entity-form td[data-attribute="crc59_fpalinkdokumen"] a:hover::before {
  background-color: #157347;
}

/* .entity-grid td[data-attribute="crc59_fpalinkdokumen"] a {
  position: relative;
  color: transparent !important;
  text-decoration: none !important;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.entity-grid td[data-attribute="crc59_fpalinkdokumen"] a::before {
  content: "Lihat";
  color: #fff;
  background-color: #198754;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  display: inline-block;
} */


/* ============================= */
/* BUTTON FLOAT & PADDING
/* ============================= */


.float-end {
  float: left !important;
}

html[dir=ltr] .grid-actions a.btn.action {
  margin-left: 0px !important;
  margin-right: 5px !important;
}

.view-toolbar .btn,
.view-toolbar a.btn {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 6px 14px;
  font-size: 11px !important;
  font-weight: 500;
  border-radius: 6px;
  line-height: 1;
}

/* ===========================
   MOBILE (< 768px)
   =========================== */

@media (max-width: 767px) {

  .view-toolbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px;
  }

  .view-toolbar .entitylist-search {
    width: 100% !important;
  }

  .view-toolbar .entitylist-search input.form-control {
    width: 100% !important;
    font-size: 12px !important;
  }

  .view-toolbar .btn,
  .view-toolbar a.btn {
    width: 100% !important;
    justify-content: center;
  }

  .view-toolbar .entitylist-search {
    order: 1;
  }

  .view-toolbar .btn-create {
    order: 2;
  }

  .view-toolbar .btn-approval {
    order: 3;
  }

  .view-toolbar .btn-download {
    order: 4;
  }
}

.crmEntityFormView .cell {
  padding: 5px 20px 5px;
}

.sectionBlockLayout .columnBlockLayout img {
  border-radius: 10px !important;
  display: block;
}

@media (max-width: 768px) {

  .columnBlockLayout {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding: 16px;
  }

}

.crmEntityFormView .section-title {
  border-bottom-width: 0;
  margin-bottom: 10px;
  background: #d3d3d3;
  border-radius: 5px;
  padding-top: 0px;
  padding-bottom: 0px;
}

/* h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 20px;
}

h3, .h3, .page_section h3, .color-inverse h3, .sidebar-home h3 {
    font-family: Arial;
    font-weight: 600;
    font-size: 12px;
    color: #2A2C2E;
} */

fieldset legend.section-title {
  background-color: #dae2e9 !important;
  padding: 6px 12px !important;
  margin-bottom: 6px !important;
}

fieldset legend.section-title h3 {
  font-size: 13px !important;
  margin: 0 !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  padding-left: 8px;
}

iframe[src*="kobotoolbox.org"] {
  width: 100%;
  min-height: 1800px;
  height: 1800px;
  border: none;
}

.crmEntityFormView .tab-title {
  border-bottom: 0px solid #eee;
  -ms-text-rendering: optimizelegibility;
  text-rendering: optimizelegibility;
  font-size: 13px;
  color: #302ce1;
  font-weight: 700;
  padding-left: 20px;
  display: none;
}

html[dir=ltr] .crmEntityFormView .cell.boolean-radio-cell input[type=radio] {
  margin: 2px 10px 5px 20px;
}

.boolean-radio input[type="radio"] {
  transform: scale(1.5);
  margin-right: 8px;
}


.crmEntityFormView label {
  background-color: transparent !important;
  color: #000000;
}

#crc59_laporansudahbelum[readonly],
#crc59_pjumstatus[readonly] #crc59_laporansudahbelum[readonly],
#crc59_pjumstatus[readonly] {
  display: inline-block;
  padding: 6px 10px 6px;
  border-radius: 5px;
  font-size: 0.7rem !important;
  font-weight: 600;
  line-height: 1.5;
  border: none !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none;
}


#crc59_laporansudahbelum[readonly][value="Sudah"],
#crc59_pjumstatus[readonly][value="Sudah"] {
  background-color: #E7F4EC !important;
  color: #1E7F3E;
}

#crc59_laporansudahbelum[readonly][value="Belum"],
#crc59_pjumstatus[readonly][value="Belum"] {
  background-color: #FDECEC !important;
  color: #B42318;
}

/* =====================================================
   BADGE KHUSUS JENIS USULAN (SELECT DISABLED)
   ===================================================== */
#crc59_jenisusulan[disabled] {
  display: inline-block !important;
  width: 100% !important;

  padding: 6px 10px !important;
  border-radius: 5px !important;

  font-size: 0.7rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;

  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;

  background-image: none !important;
  background-clip: padding-box !important;

  -webkit-appearance: none !important;
  appearance: none !important;

  pointer-events: none;

  /* warna netral */
  background-color: #EEF2FF !important;
  color: #3c368d !important;
}

/* rapikan jarak di control */
.control>#crc59_jenisusulan[disabled] {
  margin-top: 2px;
}

/* =========================================
   BASE STYLE (badge look)
========================================= */
#crc59_appr {
  display: inline-flex;
  align-items: center;
  width: 100% !important;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 0.7rem !important;
  font-weight: 600;
  line-height: 1.5;
  border: none !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none;
}

/* =========================================
   APPROVED
========================================= */
#crc59_appr:has(option[value="303930000"]:checked) {
  background-color: #E7F4EC !important;
  color: #1E7F3E !important;
}

/* =========================================
   REJECTED
========================================= */
#crc59_appr:has(option[value="303930001"]:checked) {
  background-color: #FDECEC !important;
  color: #B42318 !important;
}

/* =========================================
   NEED CLAR / REV
========================================= */
#crc59_appr:has(option[value="303930009"]:checked) {
  background-color: #FFF4E5 !important;
  color: #B26A00 !important;
}

/* =========================================
   ALL PENDING
========================================= */
#crc59_appr:has(option[value="303930002"]:checked),
#crc59_appr:has(option[value="303930003"]:checked),
#crc59_appr:has(option[value="303930004"]:checked),
#crc59_appr:has(option[value="303930005"]:checked),
#crc59_appr:has(option[value="303930006"]:checked),
#crc59_appr:has(option[value="303930007"]:checked),
#crc59_appr:has(option[value="303930008"]:checked),
#crc59_appr:has(option[value="303930011"]:checked) {
  background-color: #FFF4E5 !important;
  color: #B26A00 !important;
}

/* =========================================
   NEW
========================================= */
#crc59_appr:has(option[value="303930010"]:checked) {
  background-color: #F3E8FF !important;
  color: #7C3AED !important;
}


.entitylist .view-grid {
  overflow-x: auto;
  cursor: grab;
}

.entitylist .view-grid.dragging {
  cursor: grabbing;
  user-select: none;
}

.entitylist .table-responsive {
  overflow-x: auto;
  cursor: grab;
}

.entitylist .table-responsive.dragging {
  cursor: grabbing;
}


td[data-attribute="crc59_statusappr"] {
  font-weight: 600;
  font-size: 0.7rem !important;
  border-radius: 5px;
  padding: 4px 8px;
  display: table-cell;
}


td[data-attribute="crc59_statusappr"][aria-label="Approve"] {
  color: #198754 !important;
  background-color: #d1e7dd;
}

td[data-attribute="crc59_statusappr"][aria-label="Reject"] {
  color: #dc3545 !important;
  background-color: #f8d7da;
}

td[data-attribute="crc59_statusappr"][aria-label="Need Clar/Rev"],
td[data-attribute="crc59_statusappr"][aria-label="Need Revision"],
td[data-attribute="crc59_statusappr"][aria-label="Need Clarification"] {
  color: #fd7e14 !important;
  background-color: #fff3cd;
}

.crmEntityFormView div.description.below {
  margin-bottom: 10px;
  color: rgb(64, 100, 199);
  font-style: italic;
}

html[dir=ltr] .crmEntityFormView .cell .picklist input[type=radio] {
  margin: 2px 5px 5px 0px !important;
}

.crmEntityFormView .cell .picklist label {
  float: none;
  font-weight: 600 !important;
}

.picklist.horizontal label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 16px;
  cursor: pointer;
}

.picklist.horizontal input[type="radio"] {
  margin: 0;
  vertical-align: middle;
}

.entitylist td[data-attribute="crc59_alamat"],
.entitylist th[data-attribute="crc59_alamat"],
.entitylist td[data-attribute="crc59_alamat2"],
.entitylist th[data-attribute="crc59_alamat2"],
.entitylist td[data-attribute="crc59_fpacatatan"],
.entitylist th[data-attribute="crc59_fpacatatan"],
.entitylist td[data-attribute="crc59_namakegiatan"],
.entitylist th[data-attribute="crc59_namakegiatan"],
.entitylist td[data-attribute="crc59_kegiatanutama"],
.entitylist th[data-attribute="crc59_kegiatanutama"],
.entitylist td[data-attribute="crc59_suratperihal"],
.entitylist th[data-attribute="crc59_suratperihal"],
.entitylist td[data-attribute="crc59_deskripsi"],
.entitylist th[data-attribute="crc59_deskripsi"] {
  min-width: 300px !important;
  max-width: 300px;
}

.entitylist td[data-attribute="crc59_jenisusulan"],
.entitylist th[data-attribute="crc59_jenisusulan"],
.entitylist td[data-attribute="createdon"],
.entitylist th[data-attribute="createdon"] {
  min-width: 120px !important;
  max-width: 120px;
}

.entitylist td[data-attribute="crc59_pjumdeadline"],
.entitylist th[data-attribute="crc59_pjumdeadline"] {
  min-width: 80px !important;
  max-width: 80px;
}


.entitylist td[data-attribute="crc59_catatan"],
.entitylist th[data-attribute="crc59_catatan"] {
  min-width: 250px !important;
  max-width: 250px;
}

.entitylist th:has(a[aria-label="Tahun"]),
.entitylist td[data-attribute="crc59_program_tahunpelaksanaan"] {
  width: 50px !important;
  min-width: 50px !important;
  max-width: 50px !important;
}

.entitylist th:has(a[aria-label="Output"]),
.entitylist td[data-attribute="crc59_program_outputprogram"] {
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
}

.entitylist th:has(a[aria-label="No Keg."]),
.entitylist td[data-attribute="crc59_program_nokegiatan"] {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
}


/* =====================================================
   CATATAN & DESKRIPSI – WRAP TEXT UNIVERSAL
   Berlaku di Entity List, Subgrid, dan Lookup
===================================================== */


.entitylist td[data-attribute="crc59_catatan"],
.entitylist td[data-attribute="crc59_deskripsi"],
.subgrid td[data-attribute="crc59_catatan"],
.subgrid td[data-attribute="crc59_deskripsi"],
.modal td[data-attribute="crc59_catatan"],
.modal td[data-attribute="crc59_deskripsi"] {
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  line-height: 1.4 !important;
}


/* .entitylist td[data-attribute="crc59_filtermonth"],
.entitylist th[data-attribute="crc59_filtermonth"],
.entitylist td[data-attribute="crc59_filteryear"],
.entitylist th[data-attribute="crc59_filteryear"] {
  min-width: 50px !important;
  max-width: 50px;
} */


.entitylist th:has(a[aria-label="Bulan"]),
.entitylist td[data-attribute="crc59_filtermonth"] {
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
}

.entitylist th:has(a[aria-label="Tahun"]),
.entitylist td[data-attribute="crc59_filteryear"] {
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
}

.entitylist th:has(a[aria-label="Bulan"]),
.entitylist td[data-attribute="crc59_bulan"] {
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
}

.entitylist th:has(a[aria-label="Tahun"]),
.entitylist td[data-attribute="crc59_tahun"] {
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
}

/* =========================================
   FORCE RESET KHUSUS MAILTO (LEVEL TERTINGGI)
========================================= */

.crmEntityFormView .control a.text-primary[href^="mailto:"],
.modal .control a.text-primary[href^="mailto:"] {
  all: unset !important;
  color: #000 !important;
  font-size: 13px !important;
  display: inline !important;
}

/* Matikan tombol hijau */
.crmEntityFormView .control a.text-primary[href^="mailto:"]::before,
.modal .control a.text-primary[href^="mailto:"]::before {
  content: none !important;
  display: none !important;
}

h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 0px !important;
    margin-bottom: 10.5px !important;
}

.entitylist th:has(a[aria-label="Durasi"]),
.entitylist td[data-attribute="crc59_durasi"] {
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
}

.entitylist th:has(a[aria-label="Sisa Waktu"]),
.entitylist td[data-attribute="crc59_sisawaktu"] {
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
}