/* FPPTI Jabar v1.9.9 — global Select2 + jQuery Validate frontend layer. */

/* ===== Select2 sizing and theme integration ===== */
html body .select2-container{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:100% !important;
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size:13px !important;
  line-height:1.4 !important;
}

html body .select2-container .select2-selection--single,
html body .select2-container .select2-selection--multiple{
  box-sizing:border-box !important;
  min-height:42px !important;
  border:1px solid #CBD5E1 !important;
  border-radius:10px !important;
  background:#FFFFFF !important;
  color:#0F172A !important;
  box-shadow:0 1px 2px rgba(15,23,42,.03) !important;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}

html body .select2-container .select2-selection--single{
  height:42px !important;
}

html body .select2-container .select2-selection--single .select2-selection__rendered{
  height:40px !important;
  padding:0 38px 0 12px !important;
  color:#0F172A !important;
  line-height:40px !important;
}

html body .select2-container .select2-selection--single .select2-selection__placeholder{
  color:#64748B !important;
}

html body .select2-container .select2-selection--single .select2-selection__arrow{
  width:36px !important;
  height:40px !important;
  top:0 !important;
  right:2px !important;
}

html body .select2-container .select2-selection--single .select2-selection__arrow b{
  border-color:#64748B transparent transparent transparent !important;
  border-width:5px 4px 0 4px !important;
}

html body .select2-container--open .select2-selection--single .select2-selection__arrow b{
  border-color:transparent transparent #64748B transparent !important;
  border-width:0 4px 5px 4px !important;
}

html body .select2-container .select2-selection--multiple{
  display:flex !important;
  align-items:center !important;
  padding:4px 8px !important;
}

html body .select2-container .select2-selection--multiple .select2-selection__rendered{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:5px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}

html body .select2-container .select2-selection--multiple .select2-selection__choice{
  display:inline-flex !important;
  align-items:center !important;
  min-height:28px !important;
  margin:0 !important;
  padding:3px 8px 3px 28px !important;
  border:1px solid #BFDBFE !important;
  border-radius:8px !important;
  background:#EFF6FF !important;
  color:#003F94 !important;
  font-size:12px !important;
  font-weight:650 !important;
}

html body .select2-container .select2-selection--multiple .select2-selection__choice__remove{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:24px !important;
  height:100% !important;
  border:0 !important;
  border-right:1px solid #BFDBFE !important;
  background:transparent !important;
  color:#003F94 !important;
  font-size:16px !important;
}

html body .select2-container .select2-search--inline .select2-search__field{
  min-width:90px !important;
  height:28px !important;
  margin:0 !important;
  padding:2px 4px !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#0F172A !important;
  box-shadow:none !important;
  font:inherit !important;
}

html body .select2-container--default.select2-container--focus .select2-selection--multiple,
html body .select2-container--default.select2-container--open .select2-selection--single,
html body .select2-container--default.select2-container--open .select2-selection--multiple,
html body .select2-container .select2-selection:focus{
  border-color:#2563EB !important;
  outline:0 !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.12) !important;
}

html body .select2-dropdown{
  z-index:10050 !important;
  overflow:hidden !important;
  margin-top:4px !important;
  border:1px solid #CBD5E1 !important;
  border-radius:10px !important;
  background:#FFFFFF !important;
  box-shadow:0 14px 35px rgba(15,23,42,.14) !important;
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size:13px !important;
}

html body .select2-search--dropdown{
  padding:9px !important;
  border-bottom:1px solid #E2E8F0 !important;
  background:#F8FAFC !important;
}

html body .select2-search--dropdown .select2-search__field{
  box-sizing:border-box !important;
  width:100% !important;
  height:38px !important;
  padding:7px 10px !important;
  border:1px solid #CBD5E1 !important;
  border-radius:8px !important;
  outline:0 !important;
  background:#FFFFFF !important;
  color:#0F172A !important;
  box-shadow:none !important;
  font:inherit !important;
}

html body .select2-search--dropdown .select2-search__field:focus{
  border-color:#2563EB !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.10) !important;
}

html body .select2-results__options{
  max-height:280px !important;
  padding:5px !important;
}

html body .select2-results__option{
  margin:0 !important;
  padding:9px 10px !important;
  border-radius:7px !important;
  color:#334155 !important;
  line-height:1.45 !important;
  transition:background .12s ease, color .12s ease !important;
}

html body .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
  background:#EFF6FF !important;
  color:#004AAC !important;
}

html body .select2-container--default .select2-results__option--selected{
  background:linear-gradient(135deg,#004AAC 0%,#2F80ED 100%) !important;
  color:#FFFFFF !important;
  font-weight:700 !important;
}

html body .select2-container--default .select2-results__option[aria-disabled="true"]{
  background:transparent !important;
  color:#94A3B8 !important;
}

html body .select2-container--default.select2-container--disabled .select2-selection--single,
html body .select2-container--default.select2-container--disabled .select2-selection--multiple{
  cursor:not-allowed !important;
  border-color:#E2E8F0 !important;
  background:#F1F5F9 !important;
  color:#94A3B8 !important;
}

html body .select2-container .select2-selection__clear{
  margin-right:8px !important;
  color:#64748B !important;
  font-weight:700 !important;
}

/* ===== Global jQuery Validate feedback ===== */
html body form .openlib_validation_error{
  display:block !important;
  box-sizing:border-box !important;
  width:100% !important;
  margin:6px 0 0 !important;
  padding:0 !important;
  color:#B42318 !important;
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size:11.5px !important;
  font-weight:650 !important;
  line-height:1.45 !important;
}

html body form input.openlib_invalid:not([type="checkbox"]):not([type="radio"]),
html body form textarea.openlib_invalid,
html body form select.openlib_invalid:not(.select2-hidden-accessible){
  border-color:#DC2626 !important;
  background:#FFFDFD !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.08) !important;
}

html body form .select2-container.openlib_select2_invalid .select2-selection{
  border-color:#DC2626 !important;
  background:#FFFDFD !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.08) !important;
}

html body form .openlib_has_error{
  border-color:#FCA5A5 !important;
}

html body form input.openlib_valid:not([type="checkbox"]):not([type="radio"]),
html body form textarea.openlib_valid,
html body form select.openlib_valid:not(.select2-hidden-accessible){
  border-color:#CBD5E1 !important;
}

html body form .select2-container.openlib_select2_valid .select2-selection{
  border-color:#CBD5E1 !important;
}

/* Ensure error text follows Select2, not the hidden original select. */
html body form .select2-container + .openlib_validation_error{
  margin-top:6px !important;
}

/* ===== Dark mode ===== */
html[data-openlib-color-mode="dark"] body .select2-container .select2-selection--single,
html[data-openlib-color-mode="dark"] body .select2-container .select2-selection--multiple{
  border-color:#334155 !important;
  background:#111827 !important;
  color:#E2E8F0 !important;
  box-shadow:none !important;
}

html[data-openlib-color-mode="dark"] body .select2-container .select2-selection--single .select2-selection__rendered,
html[data-openlib-color-mode="dark"] body .select2-container .select2-search--inline .select2-search__field{
  color:#E2E8F0 !important;
}

html[data-openlib-color-mode="dark"] body .select2-container .select2-selection--single .select2-selection__placeholder{
  color:#94A3B8 !important;
}

html[data-openlib-color-mode="dark"] body .select2-container .select2-selection--multiple .select2-selection__choice{
  border-color:#1D4ED8 !important;
  background:#172554 !important;
  color:#BFDBFE !important;
}

html[data-openlib-color-mode="dark"] body .select2-container .select2-selection--multiple .select2-selection__choice__remove{
  border-right-color:#1D4ED8 !important;
  color:#93C5FD !important;
}

html[data-openlib-color-mode="dark"] body .select2-dropdown{
  border-color:#334155 !important;
  background:#111827 !important;
  box-shadow:0 18px 40px rgba(0,0,0,.32) !important;
}

html[data-openlib-color-mode="dark"] body .select2-search--dropdown{
  border-bottom-color:#334155 !important;
  background:#0F172A !important;
}

html[data-openlib-color-mode="dark"] body .select2-search--dropdown .select2-search__field{
  border-color:#475569 !important;
  background:#0F172A !important;
  color:#E2E8F0 !important;
}

html[data-openlib-color-mode="dark"] body .select2-results__option{
  color:#CBD5E1 !important;
}

html[data-openlib-color-mode="dark"] body .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
  background:#172554 !important;
  color:#BFDBFE !important;
}

html[data-openlib-color-mode="dark"] body .select2-container--default .select2-results__option--selected{
  background:linear-gradient(135deg,#1D4ED8 0%,#2563EB 100%) !important;
  color:#FFFFFF !important;
}

html[data-openlib-color-mode="dark"] body form .openlib_validation_error{
  color:#FCA5A5 !important;
}

html[data-openlib-color-mode="dark"] body form input.openlib_invalid:not([type="checkbox"]):not([type="radio"]),
html[data-openlib-color-mode="dark"] body form textarea.openlib_invalid,
html[data-openlib-color-mode="dark"] body form select.openlib_invalid:not(.select2-hidden-accessible),
html[data-openlib-color-mode="dark"] body form .select2-container.openlib_select2_invalid .select2-selection{
  border-color:#EF4444 !important;
  background:#171717 !important;
  box-shadow:0 0 0 3px rgba(239,68,68,.12) !important;
}

html[data-openlib-color-mode="dark"] body form input.openlib_valid:not([type="checkbox"]):not([type="radio"]),
html[data-openlib-color-mode="dark"] body form textarea.openlib_valid,
html[data-openlib-color-mode="dark"] body form select.openlib_valid:not(.select2-hidden-accessible),
html[data-openlib-color-mode="dark"] body form .select2-container.openlib_select2_valid .select2-selection{
  border-color:#334155 !important;
}

/* Small screens: keep the enhanced select inside its form column. */
@media (max-width:767px){
  html body .select2-container,
  html body .select2-dropdown{
    font-size:12.5px !important;
  }
  html body .select2-container .select2-selection--single,
  html body .select2-container .select2-selection--multiple{
    min-height:44px !important;
  }
  html body .select2-container .select2-selection--single{
    height:44px !important;
  }
  html body .select2-container .select2-selection--single .select2-selection__rendered{
    height:42px !important;
    line-height:42px !important;
  }
  html body .select2-container .select2-selection--single .select2-selection__arrow{
    height:42px !important;
  }
}